todo-webclient/client/project-creation-modal.ls

204 lines
4.1 KiB
Plaintext

h = require 'maquette' .h
UUID = require "uuid/v4"
Column = require './column.ls'
Modal = require './modal.ls'
bulma = require "./bulma.ls"
{field, control, label, button, tag, input, select} = bulma
{icon} = require "./font-awesome.ls"
deep-copy = (object) ->
JSON.parse JSON.stringify object
const PERMISSION_LEVELS = ["admin", "edit", "read"]
remove-permission = (project, uid) ->
for key, value of project.permissions
project.permissions[key] := value.filter (!= uid)
add-permission = (project, uid, perm) ->
if perm == "none"
return remove-permission project, uid
project.permissions[perm].push uid
UserInput = (users-cache) ->
self = {}
self.input = ""
self.timer = void
timeout-handler = ->
self.user = users-cache.get-user self.input
self.reset = ->
self.input = ""
window.clear-timeout self.timer
self.user = void
self.timer = void
self.render = ->
control \.is-expanded.has-icons-right [
# FIXME: Replace by a “user search input” as soon
# as one is available.
input {
classes: {
"is-danger": self.input.length > 0 && ! self.user
}
value: self.input
oninput: (e) ->
self.input := e.target.value
login = e.target.value
uid = parse-int e.target.value
user = users-cache.get-user login, false
if user
self.user = user
else
self.user = void
if timer = self.timer
window.clear-timeout timer
self.timer := window.set-timeout timeout-handler, 200
}
if self.user
icon \.is-right, \check
]
self
ProjectCreationModal = (args) ->
self = {
project: if args.project
deep-copy args.project
else
{}
visible: args.visible || true
on-validation: args.on-validation || (project) ->
input : {
# Used when giving permissions to users not currently in the
# list of permissions.
new-user: ""
new-user-permission: \read
}
users-cache: args.users-cache
}
user-input = UserInput args.users-cache
self.project.tasks := void
unless self.project.extra_properties
self.project.extra_properties = {
columns: [
Column "Unassigned" {color: "red"}
Column "Work in Progress"
Column "To be Checked"
Column "Being Checked"
Column "Done" {color: "green"}
]
}
self.modal = Modal {
on-validation: ->
if true # FIXME: Validate project
self.visible := false
args.on-validation self.project
on-cancellation: ->
self.visible := false
validation-label: if self.project.id then "Edit Project" else "Add Project"
validation-classes: {+"is-success", +"is-outlined"}
content-render: -> [
field {key: \title} [
label "Title"
input {
value: self.project.title
oninput: (e) ->
console.log "oninput => ", e.target.value
self.project.title := e.target.value
}
]
if self.project.permissions
field {key: \permissions} [
label "Permissions"
h \table.table.is-fullwidth [
h \thead [
h \th [ "User" ]
h \th [ "Permission" ]
]
h \tbody [
for permission in PERMISSION_LEVELS
[
for uid in self.project.permissions[permission]
h \tr {key: uid} [
h \td [
self.users-cache.render-user uid
]
h \td [ permission ]
]
]
]
]
]
if self.project.permissions
field \.has-addons [
user-input.render!
control [
select {
onchange: (e) ->
self.input.new-user-permission := e.target.value
} (PERMISSION_LEVELS ++ ["none"]).map (perm) ->
h \option {
selected: perm == \read
} [ perm ]
]
control [
h \div.button.is-success.is-outlined {
onclick: ->
uid = user-input.user?.uid
perm = self.input.new-user-permission
user-input.reset!
console.log "Adding new perm? :/", uid, perm
remove-permission self.project, uid
add-permission self.project, uid, perm
console.log self.project.permissions
} [
"+"
]
]
]
]
}
self.render = ->
self.modal.visible = self.visible
self.modal.render!
self
module.exports = ProjectCreationModal