From 0e7fdb9ecf14286670248ddc1fd9c9afafb9cc85 Mon Sep 17 00:00:00 2001 From: Philippe PITTOLI Date: Fri, 6 Dec 2019 04:10:00 +0100 Subject: [PATCH] task modals --- Makefile | 8 +++---- client/card.ls | 41 +++++++++++++++++++++++++++++++ client/project.ls | 2 +- client/task-creation-modal.ls | 45 +++++++++++++++++++++++++++++++++++ client/task-removal-modal.ls | 28 ++++++++++++++++++++++ client/task.ls | 2 +- client/validation-modal.ls | 16 +++++++++++++ 7 files changed, 136 insertions(+), 6 deletions(-) create mode 100644 client/card.ls create mode 100644 client/task-creation-modal.ls create mode 100644 client/task-removal-modal.ls create mode 100644 client/validation-modal.ls diff --git a/Makefile b/Makefile index 37c5b3b..765c348 100644 --- a/Makefile +++ b/Makefile @@ -37,7 +37,7 @@ main.js: main.bundle.js $(Q)npx babel --minified main.bundle.js -o main.js -main.bundle.js: client/index.ls client/authd.ls client/bulma.ls client/card.ls client/modal.ls client/project.ls client/TaskCreationModal.ls client/task.ls client/task-removal-modal.ls client/todowebsocket.ls client/validation-modal.ls +main.bundle.js: client/index.ls client/authd.ls client/bulma.ls client/card.ls client/modal.ls client/project.ls client/task-creation-modal.ls client/task.ls client/task-removal-modal.ls client/todowebsocket.ls client/validation-modal.ls @echo ' BUN > main.bundle.js' $(Q)npx browserify -t browserify-livescript client/index.ls -o main.bundle.js @@ -121,7 +121,7 @@ $(PACKAGE)-$(VERSION).tar.gz: distdir $(PACKAGE)-$(VERSION)/client/card.ls \ $(PACKAGE)-$(VERSION)/client/modal.ls \ $(PACKAGE)-$(VERSION)/client/project.ls \ - $(PACKAGE)-$(VERSION)/client/TaskCreationModal.ls \ + $(PACKAGE)-$(VERSION)/client/task-creation-modal.ls \ $(PACKAGE)-$(VERSION)/client/task.ls \ $(PACKAGE)-$(VERSION)/client/task-removal-modal.ls \ $(PACKAGE)-$(VERSION)/client/todowebsocket.ls \ @@ -139,7 +139,7 @@ $(PACKAGE)-$(VERSION).tar.xz: distdir $(PACKAGE)-$(VERSION)/client/card.ls \ $(PACKAGE)-$(VERSION)/client/modal.ls \ $(PACKAGE)-$(VERSION)/client/project.ls \ - $(PACKAGE)-$(VERSION)/client/TaskCreationModal.ls \ + $(PACKAGE)-$(VERSION)/client/task-creation-modal.ls \ $(PACKAGE)-$(VERSION)/client/task.ls \ $(PACKAGE)-$(VERSION)/client/task-removal-modal.ls \ $(PACKAGE)-$(VERSION)/client/todowebsocket.ls \ @@ -157,7 +157,7 @@ $(PACKAGE)-$(VERSION).tar.bz2: distdir $(PACKAGE)-$(VERSION)/client/card.ls \ $(PACKAGE)-$(VERSION)/client/modal.ls \ $(PACKAGE)-$(VERSION)/client/project.ls \ - $(PACKAGE)-$(VERSION)/client/TaskCreationModal.ls \ + $(PACKAGE)-$(VERSION)/client/task-creation-modal.ls \ $(PACKAGE)-$(VERSION)/client/task.ls \ $(PACKAGE)-$(VERSION)/client/task-removal-modal.ls \ $(PACKAGE)-$(VERSION)/client/todowebsocket.ls \ diff --git a/client/card.ls b/client/card.ls new file mode 100644 index 0000000..c254e82 --- /dev/null +++ b/client/card.ls @@ -0,0 +1,41 @@ + +h = require 'maquette' .h + +TaskCard = (key, head-left, head-content, content, on-click) -> + self = { + key: key + head-left: head-left + head-content: head-content + content: content + modal: void + } + + self.render = -> + h \div.card { key: self.key } [ + h \div.card-content [ + h \div.media [ + h \div.media-left [ + self.head-left + ] + h \div.media-content [ + self.head-content + ] + ] + + h \div.content [ + self.title + h \div.button { + onclick: -> on-click! + modal := TaskCreationModal project.id, todod-ws, self + } [ "Edit" ] + + if self.modal + self.modal.render! + ] + ] + ] + + self + + +module.exports = Card diff --git a/client/project.ls b/client/project.ls index d864294..c69bb26 100644 --- a/client/project.ls +++ b/client/project.ls @@ -3,7 +3,7 @@ h = require 'maquette' .h bulma = require "./bulma.ls" Task = require "./task.ls" Modal = require './modal.ls' -TaskCreationModal = require './TaskCreationModal.ls' +TaskCreationModal = require './task-creation-modal.ls' Project = (self, todod-ws) -> self.todod-ws = todod-ws diff --git a/client/task-creation-modal.ls b/client/task-creation-modal.ls new file mode 100644 index 0000000..40d2d36 --- /dev/null +++ b/client/task-creation-modal.ls @@ -0,0 +1,45 @@ + +h = require 'maquette' .h +Modal = require './modal.ls' + +TaskCreationModal = (project-id, todod-ws, task) -> + task ||= {} + + self = { + title: task.title || "" + description: task.description || "" + } + + modal = Modal { + +visible + content: h \div.form [ + h \input.input { + value: self.title + oninput: (e) -> + self.title := e.target.value + } + + h \textarea { + value: self.description + oninput: (e) -> + self.description := e.target.value + } + ] + on-validation: -> + if task.id + todod-ws.edit-task task.id, { + title: self.title + description: self.description + } + else + todod-ws.add-task project-id, self.title, { + description: self.description + } + } + + self.render = -> + modal.render! + + self + +module.exports = TaskCreationModal diff --git a/client/task-removal-modal.ls b/client/task-removal-modal.ls new file mode 100644 index 0000000..4964a1b --- /dev/null +++ b/client/task-removal-modal.ls @@ -0,0 +1,28 @@ + +h = require 'maquette' .h +Modal = require './modal.ls' + +TaskRemovalModal = (project-id, todod-ws, task) -> + task ||= {} + + self = { + title: task.title || "" + description: task.description || "" + } + + modal = Modal { + +visible + content: h \div.is-danger [ "Do you want to remove the task ?" ] + + on-validation: -> + if task.id + todod-ws.remove-task task.id + } + + self.render = -> + modal.render! + + self + + +module.exports = TaskRemovalModal diff --git a/client/task.ls b/client/task.ls index 7175fa7..977dce7 100644 --- a/client/task.ls +++ b/client/task.ls @@ -5,7 +5,7 @@ h = require 'maquette' .h bulma = require "./bulma.ls" nmd = require "nano-markdown" -TaskCreationModal = require './TaskCreationModal.ls' +TaskCreationModal = require './task-creation-modal.ls' TaskRemovalModal = require './task-removal-modal.ls' # diff --git a/client/validation-modal.ls b/client/validation-modal.ls new file mode 100644 index 0000000..68df480 --- /dev/null +++ b/client/validation-modal.ls @@ -0,0 +1,16 @@ + +h = require 'maquette' .h +Modal = require './modal.ls' + + +# ValidationModal = (args) -> +# m = Modal (args) +# m.result = void +# m.on-validation = -> +# m.result = true +# m.on-cancellation = -> +# m.result = false +# m + + +module.exports = ValidationModal