todo-webclient/client/project.ls

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
									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
						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