From 755861eccccf8958577c77ac8ee3c4017d8057c8 Mon Sep 17 00:00:00 2001 From: Philippe PITTOLI Date: Mon, 9 Dec 2019 03:09:06 +0100 Subject: [PATCH 1/8] colors --- client/task-creation-modal.ls | 43 +++++++++++++++++++++++++++++++++-- client/task.ls | 8 ++++++- 2 files changed, 48 insertions(+), 3 deletions(-) diff --git a/client/task-creation-modal.ls b/client/task-creation-modal.ls index 30f93cf..b83dcf0 100644 --- a/client/task-creation-modal.ls +++ b/client/task-creation-modal.ls @@ -2,6 +2,27 @@ h = require 'maquette' .h Modal = require './modal.ls' +colors = [ + "white" + "black" + "light" + "dark" + "primary" + "info" + "link" + "success" + "warning" + "danger" + "black-bis" + "black-ter" + "grey-darker" + "grey-dark" + "grey" + "grey-light" + "grey-lighter" + "white-ter" + "white-bis" +] column-form-selection = (self, column) -> h \option { @@ -9,6 +30,11 @@ column-form-selection = (self, column) -> selected: self.extra_properties && self.extra_properties.column == column.id } [ column.title ] +color-to-form-selection = (self, color) -> + h \option { + value: color + selected: self.extra_properties && self.extra_properties.color == color + } [ color ] TaskCreationModal = (project, todod-ws, task) -> task ||= {} @@ -19,11 +45,16 @@ TaskCreationModal = (project, todod-ws, task) -> description: task.description || "" extra_properties: { column: "" + color: "" } } - if task.extra_properties && task.extra_properties.column - self.extra_properties.column = task.extra_properties.column + # copy extra properties + # currently: column + color + assignee + expected duration time + for k,v of task.extra_properties + console.log "extra_propertie: " + k + ", value: " + v + self.extra_properties[k] = v + modal = Modal { +visible @@ -51,6 +82,14 @@ TaskCreationModal = (project, todod-ws, task) -> } project.extra_properties.columns.map (column) -> column-form-selection self, column ] + h \p [ "Choose the color" ] + + h \div.select [ + h \select { + onchange: (e) -> + self.extra_properties.color := e.target.value + } colors.map (color) -> color-to-form-selection self, color + ] ] on-validation: -> diff --git a/client/task.ls b/client/task.ls index 73535b3..169544e 100644 --- a/client/task.ls +++ b/client/task.ls @@ -36,7 +36,13 @@ Task = (self, project, todod-ws) -> modal = void self.render = -> - h \div.card { key: self.id } [ + color = "grey" + if self.extra_properties && self.extra_properties.color + color = self.extra_properties.color + + h "div.card.has-background-#{color}" { + key: self.id + } [ h \div.card-content [ h \div.media [ h \div.media-left [ From 64a26976c4289ac8afced7629edd25a2cae3f443 Mon Sep 17 00:00:00 2001 From: Philippe PITTOLI Date: Mon, 9 Dec 2019 03:31:11 +0100 Subject: [PATCH 2/8] background color --- client/task-creation-modal.ls | 14 +++++++------- client/task.ls | 21 +++++++++++---------- 2 files changed, 18 insertions(+), 17 deletions(-) diff --git a/client/task-creation-modal.ls b/client/task-creation-modal.ls index b83dcf0..d04f3d9 100644 --- a/client/task-creation-modal.ls +++ b/client/task-creation-modal.ls @@ -30,10 +30,10 @@ column-form-selection = (self, column) -> selected: self.extra_properties && self.extra_properties.column == column.id } [ column.title ] -color-to-form-selection = (self, color) -> +color-to-form-selection = (self, color, current-color) -> h \option { value: color - selected: self.extra_properties && self.extra_properties.color == color + selected: current-color && current-color == color } [ color ] TaskCreationModal = (project, todod-ws, task) -> @@ -45,12 +45,12 @@ TaskCreationModal = (project, todod-ws, task) -> description: task.description || "" extra_properties: { column: "" - color: "" + background-color: "" } } # copy extra properties - # currently: column + color + assignee + expected duration time + # currently: column + background-color + assignee + expected duration time for k,v of task.extra_properties console.log "extra_propertie: " + k + ", value: " + v self.extra_properties[k] = v @@ -82,13 +82,13 @@ TaskCreationModal = (project, todod-ws, task) -> } project.extra_properties.columns.map (column) -> column-form-selection self, column ] - h \p [ "Choose the color" ] + h \p [ "Choose the background color" ] h \div.select [ h \select { onchange: (e) -> - self.extra_properties.color := e.target.value - } colors.map (color) -> color-to-form-selection self, color + self.extra_properties.background-color := e.target.value + } colors.map (color) -> color-to-form-selection self, color, self.extra_properties.background-color ] ] diff --git a/client/task.ls b/client/task.ls index 169544e..e9306fb 100644 --- a/client/task.ls +++ b/client/task.ls @@ -36,33 +36,34 @@ Task = (self, project, todod-ws) -> modal = void self.render = -> - color = "grey" - if self.extra_properties && self.extra_properties.color - color = self.extra_properties.color + background-color = "grey" + if self.extra_properties && self.extra_properties.background-color + background-color = self.extra_properties.background-color - h "div.card.has-background-#{color}" { + h "div.card.has-background-#{background-color}" { key: self.id } [ h \div.card-content [ h \div.media [ h \div.media-left [ + # FIXME: assignee card image "LEFT" + h \p [ "@coucou" ] ] - h \div.media-content [ - self.title - ] + + h \div.media-content [ self.title ] + h \div.button { onclick: -> modal := TaskCreationModal project, todod-ws, self } [ "Edit" ] + h \div.button { onclick: -> modal := TaskRemovalModal project.id, todod-ws, self } [ "X" ] ] - h \div.content [ - self.description - ] + h \div.content [ self.description ] ] if modal modal.render! From b470ff2a37804616ae6359606dd0eb2a330f832b Mon Sep 17 00:00:00 2001 From: Philippe PITTOLI Date: Mon, 9 Dec 2019 03:40:00 +0100 Subject: [PATCH 3/8] Tasks: display markdown --- client/task.ls | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/client/task.ls b/client/task.ls index e9306fb..574740a 100644 --- a/client/task.ls +++ b/client/task.ls @@ -63,7 +63,12 @@ Task = (self, project, todod-ws) -> modal := TaskRemovalModal project.id, todod-ws, self } [ "X" ] ] - h \div.content [ self.description ] + + h \div.content { + key: "task-description-#{self.id}" + after-create: (dom) -> + dom.innerHTML = nmd self.description + } [ ] ] if modal modal.render! From a9e28065bfbcb000bcd204ed99fbd16df5ad7042 Mon Sep 17 00:00:00 2001 From: Philippe PITTOLI Date: Tue, 10 Dec 2019 03:34:08 +0100 Subject: [PATCH 4/8] hardcoded users and permissions, but still --- client/project-creation-modal.ls | 94 ++++++++++++++++++++++++-------- client/task-creation-modal.ls | 2 + client/task.ls | 2 +- 3 files changed, 73 insertions(+), 25 deletions(-) diff --git a/client/project-creation-modal.ls b/client/project-creation-modal.ls index da13103..09936bf 100644 --- a/client/project-creation-modal.ls +++ b/client/project-creation-modal.ls @@ -24,16 +24,28 @@ col-to-lines = (column, self) -> } [ "DELETE" ] ] -#
-#

-# -#

-#

-# -# @gmail.com -# -#

-#
+# TODO FIXME XXX HARDCODE +users = [ + { login: "jean", id: "1003" } + { login: "martin", id: "1004" } + { login: "damien", id: "1005" } +] + +user-form-selection = (self, user) -> + h \option { + value: user.id + } [ user.login ] + +permission-groups = [ + "Admin" + "Write" + "Read" +] + +permission-to-form-selection = (self, permission) -> + h \option { + value: permission + } [ permission ] ProjectCreationModal = (project, todod-ws) -> @@ -49,7 +61,11 @@ ProjectCreationModal = (project, todod-ws) -> self = { title: project.title || "" permissions: project.permissions || [[]] - new-user: "New user" + # new-user: "New user" + new-user-permission: { + id: void + permission: void + } new-column-input: { title: "New column !" } @@ -73,19 +89,18 @@ ProjectCreationModal = (project, todod-ws) -> } ] - h \hr [] + # h \hr [] - bulma.field [ - bulma.label "Adding a user" - bulma.input { - value: self.new-user - oninput: (e) -> - self.new-user := e.target.value - - name: \new-user - id: \user-add - } - ] + # bulma.field [ + # bulma.label "Adding a user" + # bulma.input { + # value: self.new-user + # oninput: (e) -> + # self.new-user := e.target.value + # name: \new-user + # id: \user-add + # } + # ] h \hr [] @@ -103,6 +118,38 @@ ProjectCreationModal = (project, todod-ws) -> h \hr [] + h \p [ "Adding new user" ] + + # TODO: + # 1. select a permission groups + # 2. select an user + + h \div.field.has-addons { + key: "adding-user" + } [ + h \div.select.control [ + h \select { + onchange: (e) -> + self.new-user-permission.permission := e.target.value + } permission-groups.map (permission) -> permission-to-form-selection self, permission + ] + + h \div.select.control.is-expanded [ + h \select { + onchange: (e) -> + self.new-user-permission.id := e.target.value + } users.map (user) -> user-form-selection self, user + ] + + h \div.control.button.is-success.is-outlined { + onclick: -> + # TODO + console.log "right: #{self.new-user-permission.permission}, user #{self.new-user-permission.id}" + } [ "+" ] + ] + + h \hr [] + h \p [ "Choose the columns" ] for dom in (self.extra_properties.columns.map (column) -> col-to-lines column, self) @@ -131,7 +178,6 @@ ProjectCreationModal = (project, todod-ws) -> self.new-column-input.title := "New column !" } [ "+" ] ] - ] on-validation: -> diff --git a/client/task-creation-modal.ls b/client/task-creation-modal.ls index d04f3d9..9dbb91d 100644 --- a/client/task-creation-modal.ls +++ b/client/task-creation-modal.ls @@ -1,4 +1,6 @@ +# TODO: on modification, the description isn't updated on the client + h = require 'maquette' .h Modal = require './modal.ls' diff --git a/client/task.ls b/client/task.ls index 574740a..e60673c 100644 --- a/client/task.ls +++ b/client/task.ls @@ -58,7 +58,7 @@ Task = (self, project, todod-ws) -> modal := TaskCreationModal project, todod-ws, self } [ "Edit" ] - h \div.button { + h \div.button.is-danger { onclick: -> modal := TaskRemovalModal project.id, todod-ws, self } [ "X" ] From 6518f71787a7d9f5af625a01ab001f945e9adb8a Mon Sep 17 00:00:00 2001 From: Philippe PITTOLI Date: Tue, 10 Dec 2019 05:59:52 +0100 Subject: [PATCH 5/8] users management --- client/authd.ls | 22 +++++++++++ client/index.ls | 23 +++++++---- client/project-creation-modal.ls | 67 ++++++++++++++++---------------- client/project.ls | 7 ++-- 4 files changed, 75 insertions(+), 44 deletions(-) diff --git a/client/authd.ls b/client/authd.ls index 368353b..80d3adb 100644 --- a/client/authd.ls +++ b/client/authd.ls @@ -6,12 +6,22 @@ module.exports = { create-socket: (socket-url) -> self = {} + self.token = "" + request-types = { "get-token": 0 "add-user": 1 "get-user": 2 "get-user-by-credentials": 3 "mod-user": 4 + + # TODO: code these messages + "register": 5 + "get-extra": 6 + "set-extra": 7 + "update-password": 8 + + "list-users": 9 } response-types = { @@ -20,6 +30,9 @@ module.exports = { "user": 2 "user-added": 3 "user-edited": 4 + "extra": 5 + "extra-updated": 6 + "users-list": 7 } # TODO: naming convention @@ -92,6 +105,15 @@ module.exports = { uid: uid } + self.list-users = -> + self.send request-types[\list-users], JSON.stringify { + token: self.token + # FIXME: this will be removed once the authd program will accept + # any list-users requests from any user + # which is the only logical choice since any user can create projects and assign people to it + key: "nico-nico-nii" + } + # TODO: authd overhaul #self.add-user = (login, password) -> # self.send request-types[\add-user], JSON.stringify { diff --git a/client/index.ls b/client/index.ls index 664a2c7..6388ff5 100644 --- a/client/index.ls +++ b/client/index.ls @@ -56,9 +56,6 @@ model = { # current-view: "testing-modals" - # { uid => user data } - users: {} - # list of Project objects project-list: [] @@ -71,6 +68,9 @@ model = { previous-error: undefined error: undefined + + # { uid => user data } + users: {} } model.authd-url = @@ -124,20 +124,27 @@ model.authd-ws.user-on-socket-close ++= [ authd-on-websocket-close ] model.authd-ws.add-event-listener \token, (message) -> model.current-view := "project-list" + model.authd-ws.token := message.token model.todod-ws.token := message.token model.todod-ws.list-lists! + model.authd-ws.list-users! projector.schedule-render! model.authd-ws.add-event-listener \error, (message) -> - # console.log "authd error", message + console.log "authd error", message projector.schedule-render! model.authd-ws.add-event-listener \user, (message) -> model.users[message.user.uid] := message.user projector.schedule-render! -# TODO: user-added, user-edited +model.authd-ws.add-event-listener \users-list, (message) -> + console.log "Received users: ", message + message.users.map (user) -> + model.users[user.uid] := user + projector.schedule-render! +# TODO: user-added, user-edited # @@ -167,7 +174,7 @@ model.todod-ws.add-event-listener \lists-list, (message) -> model.project-list := message.lists.map (x) -> old-project = model.project-list.find((.id == x.id)) - new-project = Project x, model.todod-ws + new-project = Project x, model.todod-ws, model.users if old-project && new-project.id == old-project.id new-project.tasks = old-project.tasks @@ -179,13 +186,13 @@ model.todod-ws.add-event-listener \lists-list, (message) -> model.todod-ws.add-event-listener \new-list, (message) -> console.log "New project", message - model.project-list := model.project-list ++ [ (Project message.list, model.todod-ws) ] + model.project-list := model.project-list ++ [ (Project message.list, model.todod-ws, model.users) ] projector.schedule-render! model.todod-ws.add-event-listener \list-updated, (message) -> console.log "Project updated", message - new-project = Project message.list, model.todod-ws + new-project = Project message.list, model.todod-ws, model.users model.project-list := model.project-list.map (project) -> if project.id == message.list.id diff --git a/client/project-creation-modal.ls b/client/project-creation-modal.ls index 09936bf..cb8ffeb 100644 --- a/client/project-creation-modal.ls +++ b/client/project-creation-modal.ls @@ -24,30 +24,22 @@ col-to-lines = (column, self) -> } [ "DELETE" ] ] -# TODO FIXME XXX HARDCODE -users = [ - { login: "jean", id: "1003" } - { login: "martin", id: "1004" } - { login: "damien", id: "1005" } -] - user-form-selection = (self, user) -> h \option { - value: user.id + value: user.uid } [ user.login ] -permission-groups = [ - "Admin" - "Write" +permission-groups = "Read" -] + "Write" + "Admin" permission-to-form-selection = (self, permission) -> h \option { value: permission } [ permission ] -ProjectCreationModal = (project, todod-ws) -> +ProjectCreationModal = (project, todod-ws, users) -> # work on a copy of the columns # in case of cancelled modifications, only the copies are changed @@ -62,13 +54,14 @@ ProjectCreationModal = (project, todod-ws) -> title: project.title || "" permissions: project.permissions || [[]] # new-user: "New user" - new-user-permission: { - id: void - permission: void - } - new-column-input: { - title: "New column !" - } + + tmp: + new-user-permission: + id: void + permission: permission-groups[0] + new-column-input: + title: "New column !" + users: users || [] extra_properties: columns: columns-copy @@ -120,31 +113,37 @@ ProjectCreationModal = (project, todod-ws) -> h \p [ "Adding new user" ] - # TODO: - # 1. select a permission groups - # 2. select an user - h \div.field.has-addons { key: "adding-user" } [ h \div.select.control [ h \select { onchange: (e) -> - self.new-user-permission.permission := e.target.value + self.tmp.new-user-permission.permission := e.target.value } permission-groups.map (permission) -> permission-to-form-selection self, permission ] h \div.select.control.is-expanded [ h \select { onchange: (e) -> - self.new-user-permission.id := e.target.value - } users.map (user) -> user-form-selection self, user + self.tmp.new-user-permission.uid := e.target.value + } [ + user-form-selection self, { login: "Choose a user", uid: "-" } + for user-id, user of self.tmp.users + user-form-selection self, user + ] ] h \div.control.button.is-success.is-outlined { onclick: -> - # TODO - console.log "right: #{self.new-user-permission.permission}, user #{self.new-user-permission.id}" + if self.tmp.new-user-permission.uid == void || self.tmp.new-user-permission.uid == "-" + console.log "adding an user permission on the kanban: failed, no user selected" + else + # TODO: + # adding the permissions in self.permissions + # then editing the project in the db via todod-ws + # self.permissions + console.log "right: #{self.tmp.new-user-permission.permission}, user #{self.tmp.new-user-permission.uid}" } [ "+" ] ] @@ -162,9 +161,9 @@ ProjectCreationModal = (project, todod-ws) -> } [ h \p.control.is-expanded [ h \input.input { - value: self.new-column-input.title + value: self.tmp.new-column-input.title oninput: (e) -> - self.new-column-input.title := e.target.value + self.tmp.new-column-input.title := e.target.value } [ ] ] @@ -172,19 +171,21 @@ ProjectCreationModal = (project, todod-ws) -> onclick: -> new-col = { id: UUID! - title: self.new-column-input.title + title: self.tmp.new-column-input.title } self.extra_properties.columns ++= [ new-col ] - self.new-column-input.title := "New column !" + self.tmp.new-column-input.title := "New column !" } [ "+" ] ] ] on-validation: -> + tmp = delete self.tmp if project.id todod-ws.edit-list project.id, self else todod-ws.add-list self.title, self + self.tmp := tmp }, self self.render = -> diff --git a/client/project.ls b/client/project.ls index 8d87b00..335182b 100644 --- a/client/project.ls +++ b/client/project.ls @@ -4,7 +4,7 @@ bulma = require "./bulma.ls" Task = require "./task.ls" Modal = require './modal.ls' TaskCreationModal = require './task-creation-modal.ls' -ProjectCreationModal = require "./project-creation-modal.ls" +ProjectCreationModal = require './project-creation-modal.ls' is-right-column = (task, column-id) -> task.extra_properties && task.extra_properties.column && task.extra_properties.column == column-id @@ -20,9 +20,10 @@ orphan-tasks = (tasks, columns) -> tasks.filter (task) -> (! has-column) || inexistant-column task, columns -Project = (self, todod-ws) -> +Project = (self, todod-ws, users) -> self.todod-ws = todod-ws self.tasks = [] + self.users = users || [] modal = void @@ -62,7 +63,7 @@ Project = (self, todod-ws) -> h \div.navbar-item [ h \div.button.is-outlined { onclick: -> - modal := ProjectCreationModal self, self.todod-ws + modal := ProjectCreationModal self, self.todod-ws, self.users } [ "Edit this project" ] ] From 553a23956a93294ffed83fe9fdcb95fc029b8cb8 Mon Sep 17 00:00:00 2001 From: Philippe PITTOLI Date: Tue, 10 Dec 2019 14:24:58 +0100 Subject: [PATCH 6/8] project edition can manage user permissions --- client/project-creation-modal.ls | 25 ++++++++++++++++++++++--- 1 file changed, 22 insertions(+), 3 deletions(-) diff --git a/client/project-creation-modal.ls b/client/project-creation-modal.ls index cb8ffeb..f6cb40d 100644 --- a/client/project-creation-modal.ls +++ b/client/project-creation-modal.ls @@ -34,6 +34,24 @@ permission-groups = "Write" "Admin" +permissions-add = (self, permission, user-id) -> + perm-list = self.permissions.find (e) -> e[0] == permission + if perm-list + is-already-there = perm-list.find (e) -> (""+ e) == ("" + user-id) + if is-already-there + console.log "user #{user-id} already in #{perm-list}" + else + perm-list ++= [ user-id ] + self.permissions := self.permissions.map (e) -> + if e[0] == permission + perm-list + else + e + # console.log "adding user #{user-id} to #{perm-list[0]}: #{perm-list}" + else + console.log "Cannot find #{permission} permissions, creating it" + self.permissions ++= [ [ permission, user-id ]] + permission-to-form-selection = (self, permission) -> h \option { value: permission @@ -100,7 +118,9 @@ ProjectCreationModal = (project, todod-ws, users) -> h \aside.menu [ h \p.menu-label [ "Permissions" ] h \ul.menu-list self.permissions.map (permission) -> - h \li [ + h \li { + key: "permission" + permission[0] + } [ h \p permission.map (e, index) -> if index == 0 "Permissions '" + e + "': " @@ -142,8 +162,7 @@ ProjectCreationModal = (project, todod-ws, users) -> # TODO: # adding the permissions in self.permissions # then editing the project in the db via todod-ws - # self.permissions - console.log "right: #{self.tmp.new-user-permission.permission}, user #{self.tmp.new-user-permission.uid}" + permissions-add self, self.tmp.new-user-permission.permission, self.tmp.new-user-permission.uid } [ "+" ] ] From 73b76c08528fd726e8793228e11643b60fe8e93d Mon Sep 17 00:00:00 2001 From: Philippe PITTOLI Date: Wed, 11 Dec 2019 00:10:58 +0100 Subject: [PATCH 7/8] Changing user permissions works. --- client/authd.ls | 9 +++++++++ client/project-creation-modal.ls | 30 +++++++++++++----------------- client/todowebsocket.ls | 12 ++++++++++++ 3 files changed, 34 insertions(+), 17 deletions(-) diff --git a/client/authd.ls b/client/authd.ls index 80d3adb..b4afbc3 100644 --- a/client/authd.ls +++ b/client/authd.ls @@ -22,6 +22,7 @@ module.exports = { "update-password": 8 "list-users": 9 + "set-permissions": 10 } response-types = { @@ -114,6 +115,14 @@ module.exports = { key: "nico-nico-nii" } + self.set-permissions = (list-id, user-id, permission) -> + self.send request-types[\set-permissions], JSON.stringify { + token: self.token + list: list-id + uid: user-id + permission: permission + } + # TODO: authd overhaul #self.add-user = (login, password) -> # self.send request-types[\add-user], JSON.stringify { diff --git a/client/project-creation-modal.ls b/client/project-creation-modal.ls index f6cb40d..e21b28d 100644 --- a/client/project-creation-modal.ls +++ b/client/project-creation-modal.ls @@ -30,27 +30,24 @@ user-form-selection = (self, user) -> } [ user.login ] permission-groups = - "Read" - "Write" - "Admin" + "read" + "post" + "edit" + "admin" permissions-add = (self, permission, user-id) -> - perm-list = self.permissions.find (e) -> e[0] == permission + perm-list = self.permissions[permission] if perm-list is-already-there = perm-list.find (e) -> (""+ e) == ("" + user-id) if is-already-there console.log "user #{user-id} already in #{perm-list}" else - perm-list ++= [ user-id ] - self.permissions := self.permissions.map (e) -> - if e[0] == permission - perm-list - else - e + perm-list ++= [ parseInt(user-id) ] + self.permissions[permission] := perm-list # console.log "adding user #{user-id} to #{perm-list[0]}: #{perm-list}" else console.log "Cannot find #{permission} permissions, creating it" - self.permissions ++= [ [ permission, user-id ]] + self.permissions[permission] := user-id permission-to-form-selection = (self, permission) -> h \option { @@ -70,8 +67,7 @@ ProjectCreationModal = (project, todod-ws, users) -> self = { title: project.title || "" - permissions: project.permissions || [[]] - # new-user: "New user" + permissions: project.permissions || {admin: [], edit: [], post: [], read: []} tmp: new-user-permission: @@ -117,13 +113,13 @@ ProjectCreationModal = (project, todod-ws, users) -> h \aside.menu [ h \p.menu-label [ "Permissions" ] - h \ul.menu-list self.permissions.map (permission) -> + h \ul.menu-list Object.keys(self.permissions).map (permission) -> h \li { - key: "permission" + permission[0] + key: "permission" + permission } [ - h \p permission.map (e, index) -> + h \p self.permissions[permission].map (e, index) -> if index == 0 - "Permissions '" + e + "': " + "Permissions '" + permission + "': " + e + ", " else "" + e + ", " ] diff --git a/client/todowebsocket.ls b/client/todowebsocket.ls index 64e46f3..0e517b5 100644 --- a/client/todowebsocket.ls +++ b/client/todowebsocket.ls @@ -87,30 +87,35 @@ module.exports = { self.list-lists = -> self.send request-types[\list-lists], JSON.stringify { token: self.token + id: "list-lists" } self.get-list = (list-id) -> self.send request-types[\get-list], JSON.stringify { token: self.token list: list-id + id: "get-list" } self.get-tasks = (list-id) -> self.send request-types[\get-tasks], JSON.stringify { token: self.token list: list-id + id: "get-tasks" } self.get-task = (task-id) -> self.send request-types[\get-task], JSON.stringify { token: self.token task: task-id + id: "get-task" } self.remove-list = (list-id) -> self.send request-types[\remove-list], JSON.stringify { token: self.token list: list-id + id: "remove-list" } # TODO: extra properties @@ -118,6 +123,7 @@ module.exports = { payload = { token: self.token title: title + id: "add-list" } for key, value of opts @@ -129,6 +135,7 @@ module.exports = { payload = { token: self.token list: list-id + id: "edit-list" } for key, value of opts @@ -140,6 +147,7 @@ module.exports = { self.send request-types[\remove-task], JSON.stringify { token: self.token task: task-id + id: "remove-task" } # TODO: extra properties @@ -148,6 +156,7 @@ module.exports = { token: self.token list: list-id title: title + id: "add-task" } for key, value of opts @@ -159,6 +168,7 @@ module.exports = { payload = { token: self.token task: task-id + id: "edit-task" } for key, value of opts @@ -170,12 +180,14 @@ module.exports = { self.send request-types[\subscribe], JSON.stringify { token: self.token list: list-id + id: "subscribe" } self.unsubscribe = (list-id) -> self.send request-types[\unsubscribe], JSON.stringify { token: self.token list: list-id + id: "unsubscribe" } self From 97fa65be3d07d8292b4573dca6a797d0cd300d33 Mon Sep 17 00:00:00 2001 From: Philippe PITTOLI Date: Thu, 12 Dec 2019 01:25:36 +0100 Subject: [PATCH 8/8] new login form, user management --- client/index.ls | 75 +++++++++++++---------------------- client/project.ls | 18 +++++++-- client/style.sass | 6 +-- client/task-creation-modal.ls | 56 +++++++++++++++++++++++--- client/task.ls | 35 ++++------------ client/todowebsocket.ls | 8 ++-- 6 files changed, 107 insertions(+), 91 deletions(-) diff --git a/client/index.ls b/client/index.ls index 6388ff5..bbfcaea 100644 --- a/client/index.ls +++ b/client/index.ls @@ -1,41 +1,8 @@ -# first: -# connection to authd -# display the authd widget -# -# second: -# connection to todod -# rewrite the whole body component -# page 1: (TODO) list of lists (or todos) -# display: -# navbar -# -# "element 1" button -# "element 2" button -# ... -# "element x" button -# -# "new list" button -# widgets: -# navbar: [return to list button] [logout] -# element button: -# [project list name] -# or -# [project list name] [RIGTHS] [DELETE] -# -# page 2: -# display: -# (TODO) list of tasks (this client has a kanban display of tasks, with columns) -# (TODO) task widget -# widgets: -# task widget: -# TODO -# -# page 3: (TODO) pages about - maquette = require "maquette" nmd = require "nano-markdown" authd = require "./authd.ls" +LoginForm = require "../lib/authd/client/login-form.ls" todows = require "./todowebsocket.ls" bulma = require "./bulma.ls" Task = require "./task.ls" @@ -49,13 +16,10 @@ projector = create-projector! model = { # view: login, project-list, project, network-error (TODO: other views, such as rights) - # XXX FIXME TODO: TESTING THINGS current-view: "login" viewed-project: void - # current-view: "testing-modals" - # list of Project objects project-list: [] @@ -122,13 +86,14 @@ model.authd-ws.user-on-socket-close ++= [ authd-on-websocket-close ] # authd message handlers -model.authd-ws.add-event-listener \token, (message) -> - model.current-view := "project-list" - model.authd-ws.token := message.token - model.todod-ws.token := message.token - model.todod-ws.list-lists! - model.authd-ws.list-users! - projector.schedule-render! +# HANDLED with the "on-login" callback in the LoginForm component +# model.authd-ws.add-event-listener \token, (message) -> +# model.current-view := "project-list" +# model.authd-ws.token := message.token +# model.todod-ws.token := message.token +# model.todod-ws.list-lists! +# model.authd-ws.list-users! +# projector.schedule-render! model.authd-ws.add-event-listener \error, (message) -> console.log "authd error", message @@ -275,22 +240,24 @@ render-navbar = -> h \div.navbar-start [ h \a.navbar-item.is-size-2 { onclick: -> - model.todod-ws.unsubscribe model.viewed-project.id + if model.viewed-project + model.todod-ws.unsubscribe model.viewed-project.id model.todod-ws.list-lists! model.viewed-project := void model.current-view := "project-list" } [ "⌂" ] ] - if model.viewed-project + if model.current-view == "project" && model.viewed-project model.viewed-project.inner-nav-render! h \div.navbar-end [ - if model.viewed-project + if model.current-view == "project" && model.viewed-project model.viewed-project.right-nav-render! h \a.navbar-item { + key: "logout" onclick: -> model.current-view := "login" # TODO: remove anything related to the old session on the client @@ -343,11 +310,23 @@ render-project = (project) -> bulma.title 3 "Error, we did not get the project id " + project.id ] +model.login-form = LoginForm { + authws-url: model.authd-url + on-login: (user, token) -> + model.current-view := "project-list" + model.authd-ws.token := token + model.todod-ws.token := token + model.todod-ws.list-lists! + model.authd-ws.list-users! + projector.schedule-render! +} + render-body = -> h \div.section [ switch model.current-view when "login" - authd.login-page model + # authd.login-page model + model.login-form.render! when "project-list" h \div#project-list [ diff --git a/client/project.ls b/client/project.ls index 335182b..0ad731a 100644 --- a/client/project.ls +++ b/client/project.ls @@ -34,6 +34,10 @@ Project = (self, todod-ws, users) -> if first tasks-to-display ++= orphan-tasks self.tasks, self.extra_properties.columns + # + # COLUMNS + # + h \div.column { key: column.id } [ @@ -53,21 +57,27 @@ Project = (self, todod-ws, users) -> self.right-nav-render = -> [ - h \div.navbar-item [ + h \div.navbar-item { + key: "navbar-new-task" + } [ h \div.button.is-success.is-outlined { onclick: -> - modal := TaskCreationModal self, self.todod-ws + modal := TaskCreationModal self, self.todod-ws, void, self.users } [ "New task" ] ] - h \div.navbar-item [ + h \div.navbar-item { + key: "navbar-edit-project" + } [ h \div.button.is-outlined { onclick: -> modal := ProjectCreationModal self, self.todod-ws, self.users } [ "Edit this project" ] ] - h \div.navbar-item [ + h \div.navbar-item { + key: "navbar-delete-project" + } [ h \div.button.is-danger.is-outlined { onclick: -> modal := Modal { diff --git a/client/style.sass b/client/style.sass index 7183fa3..a61683f 100644 --- a/client/style.sass +++ b/client/style.sass @@ -1,14 +1,14 @@ @charset "utf-8" -@import "../node_modules/bulmaswatch/superhero/_variables.scss" +// @import "../node_modules/bulmaswatch/superhero/_variables.scss" // Import Bulma core @import "../node_modules/bulma/bulma" -@import "../node_modules/bulmaswatch/superhero/_overrides.scss" +// @import "../node_modules/bulmaswatch/superhero/_overrides.scss" .project>.columns - overflow-x: scroll + overflow-x: auto .avatar border-radius: 4px diff --git a/client/task-creation-modal.ls b/client/task-creation-modal.ls index 9dbb91d..6fcd757 100644 --- a/client/task-creation-modal.ls +++ b/client/task-creation-modal.ls @@ -38,36 +38,51 @@ color-to-form-selection = (self, color, current-color) -> selected: current-color && current-color == color } [ color ] -TaskCreationModal = (project, todod-ws, task) -> +user-form-selection = (self, user) -> + h \option { + value: user.uid + } [ user.login ] + +TaskCreationModal = (project, todod-ws, task, users) -> task ||= {} # copy not to override anything on cancel self = { title: task.title || "" description: task.description || "" - extra_properties: { + extra_properties: column: "" background-color: "" - } + assignee-id: task.assignee-id || void + tmp: + users: users || [] } # copy extra properties # currently: column + background-color + assignee + expected duration time for k,v of task.extra_properties - console.log "extra_propertie: " + k + ", value: " + v self.extra_properties[k] = v - modal = Modal { +visible content-render: (self) -> h \div.form [ + + # + # TITLE + # + h \input.input { value: self.title oninput: (e) -> self.title := e.target.value } + + # + # DESCRIPTION + # + h \textarea { value: self.description oninput: (e) -> @@ -84,6 +99,35 @@ TaskCreationModal = (project, todod-ws, task) -> } project.extra_properties.columns.map (column) -> column-form-selection self, column ] + + # + # USER MANAGEMENT + # + + h \hr [] + + h \p [ "Assign someone to the task" ] + + h \div.field.has-addons { + key: "assign-someone-to-task" + } [ + h \div.select.control [ + h \select { + onchange: (e) -> + self.extra_properties.assignee-id := e.target.value + } [ + user-form-selection self, { login: "Choose a user", uid: "-" } + for user-id, user of self.tmp.users + user-form-selection self, user + ] + ] + ] + + + # + # BACKGROUND COLOR + # + h \p [ "Choose the background color" ] h \div.select [ @@ -95,10 +139,12 @@ TaskCreationModal = (project, todod-ws, task) -> ] on-validation: -> + tmp = delete self.tmp if task.id todod-ws.edit-task task.id, self else todod-ws.add-task project.id, self.title, self + self.tmp = tmp }, self self.render = -> diff --git a/client/task.ls b/client/task.ls index e60673c..53df5b7 100644 --- a/client/task.ls +++ b/client/task.ls @@ -1,35 +1,14 @@ -# -# Tasks, previous version of todos -# - h = require 'maquette' .h bulma = require "./bulma.ls" nmd = require "nano-markdown" TaskCreationModal = require './task-creation-modal.ls' TaskRemovalModal = require './task-removal-modal.ls' -# -# generic functions -# - -get-previous = (collection, element) -> - var previous - - for item in collection - if item == element - return previous - - previous = item - -get-next = (collection, element) -> - var found-element - - for item in collection - if found-element - return item - - if item == element - found-element := true +display-login = (task, users) -> + if task.extra_properties && task.extra_properties.assignee-id && users && users[task.extra_properties.assignee-id] && users[task.extra_properties.assignee-id].login + h \p [ '@' + users[task.extra_properties.assignee-id].login ] + else + h \p [ '-' ] Task = (self, project, todod-ws) -> @@ -48,14 +27,14 @@ Task = (self, project, todod-ws) -> h \div.media-left [ # FIXME: assignee card image "LEFT" - h \p [ "@coucou" ] + display-login self, project.users ] h \div.media-content [ self.title ] h \div.button { onclick: -> - modal := TaskCreationModal project, todod-ws, self + modal := TaskCreationModal project, todod-ws, self, project.users } [ "Edit" ] h \div.button.is-danger { diff --git a/client/todowebsocket.ls b/client/todowebsocket.ls index 0e517b5..c4354a4 100644 --- a/client/todowebsocket.ls +++ b/client/todowebsocket.ls @@ -68,10 +68,11 @@ module.exports = { self.socket.onmessage = (event) -> message = JSON.parse(event.data) - console.log "todod message received: ", message + parsed-message = JSON.parse(message.payload) + console.log "todod message #{message.mtype} received: ", parsed-message for f in self.callbacks[message.mtype] - f JSON.parse(message.payload) + f parsed-message self.reopen = -> self.socket.close! @@ -80,7 +81,8 @@ module.exports = { self.open-socket! self.send = (type, opts) -> - console.log JSON.stringify { mtype: type, payload: opts } + console.log "sending message #{type} to todod: ", opts + # console.log JSON.stringify { mtype: type, payload: opts } self.socket.send JSON.stringify { mtype: type, payload: opts }