h = require 'maquette' .h bulma = require "./bulma.ls" Task = require "./task.ls" Modal = require './modal.ls' TaskCreationModal = require './task-creation-modal.ls' ProjectCreationModal = require './project-creation-modal.ls' ColumnEditModal = require './column-edit-modal.ls' {icon} = require './font-awesome.ls' deep-copy = (object) -> JSON.parse JSON.stringify object is-right-column = (task, column-id) -> task.extra_properties && task.extra_properties.column && task.extra_properties.column == column-id # configured column, but inexistant (maybe removed since) inexistant-column = (task, columns) -> ! columns.find((.id == task.extra_properties.column)) orphan-tasks = (tasks, columns) -> tasks.filter (task) -> (! task.extra_properties?.column) || inexistant-column task, columns Project = (self, todod-ws, users-cache) -> console.log "CREATING PROJECT", users-cache self.todod-ws = todod-ws self.tasks = [] self.selected-tasks = [] modal = void self.remove-column = (column) -> extra_properties = deep-copy(self.extra_properties) extra_properties.columns = extra_properties.columns.filter((.id != column.id)) todod-ws.edit-list self.id, { extra_properties: extra_properties } self.edit-column = (column) -> extra_properties = deep-copy self.extra_properties extra_properties.columns = extra_properties.columns.map (old-column) -> if old-column.id == column.id column else old-column todod-ws.edit-list self.id, { extra_properties: extra_properties } self.render-column = (column, first) -> tasks-to-display = self.tasks.filter (task) -> is-right-column task, column.id if first tasks-to-display ++= orphan-tasks self.tasks, self.extra_properties.columns # # COLUMNS # h \div.column.cards-list { key: column.id } [ h \p.title.is-4 [ column.title h \div.is-pulled-right.visible-on-hover [ if tasks-to-display.length == 0 h \a.icon.has-text-danger { key: \remove onclick: -> modal := Modal { +visible validation-label: "Delete" validation-classes: {+"is-danger", +"is-outlined"} content: [ "Are you sure you want to remove this column?" ] on-validation: -> modal.visible := false self.remove-column column } } [ icon \skull-crossbones ] h \a.icon.has-text-grey { key: \edit onclick: -> modal := ColumnEditModal self, column, { on-validation: (column) -> console.log "column update:", column modal.visible := false self.edit-column column } } [ icon \cog ] ] ] tasks-to-display.map (task) -> task.render { is-selected: self.selected-tasks.includes task.id onclick: -> if self.selected-tasks.includes task.id self.selected-tasks := self.selected-tasks.filter (!= task.id) else self.selected-tasks.push task.id } h \div.button.is-outlined.is-success.visible-on-hover.is-large.is-fullwidth { onclick: -> modal := TaskCreationModal self, self.todod-ws, { extra_properties: { column: column.id } }, users-cache } [ "+" ] ] self.inner-nav-render = -> h \div.navbar-item [ h \a.subtitle.is-3 [ self.title ] ] self.right-nav-render = -> [ h \a.navbar-item.has-text-success { key: "navbar-new-task" onclick: -> modal := TaskCreationModal self, self.todod-ws, {}, users-cache } [ h \span [ "New task" ] icon \plus ] h \a.navbar-item { key: "navbar-edit-project" onclick: -> modal := ProjectCreationModal { project: self on-validation: (project) -> console.log "Requesting edit for", project self.todod-ws.edit-list project.id, project users-cache: users-cache } } [ icon \cog # "Edit this project" ] h \a.navbar-item.has-text-danger { key: "navbar-delete-project" onclick: -> modal := Modal { +visible validation-label: "Delete" validation-classes: {+"is-danger", +"is-outlined"} content: h \p [ "Are you sure you want to remove board #{self.title}?" ] on-validation: -> self.todod-ws.remove-list self.id } } [ icon \skull-crossbones # "Delete this project" ] ] self.render = -> h \div.project {} [ h \div.columns [ if columns = self.extra_properties.columns [ for column in columns is-last = column == columns[columns.length-1] if is-last self.render-column column, is-last else [ self.render-column column, is-last h \div.is-divider-vertical {key: column.id + ".divider"} ] h \div.is-divider-vertical { key: "final.divider" } h \div.column.is-narrow [ h \div.button.is-outlined.is-large { onclick: -> modal := ColumnEditModal self, void, { on-validation: (column) -> console.log "column creation:", column modal.visible := false extra_properties = deep-copy(self.extra_properties) extra_properties.columns.push column todod-ws.edit-list self.id, { extra_properties: extra_properties } } } [ "+" ] ] ] ] if modal modal.render! ] self module.exports = Project