124 lines
2.6 KiB
Plaintext
124 lines
2.6 KiB
Plaintext
|
|
||
|
h = require 'maquette' .h
|
||
|
bulma = require "./bulma.ls"
|
||
|
Task = require "./task.ls"
|
||
|
|
||
|
module.exports = {
|
||
|
|
||
|
new: (self, model, socket) ->
|
||
|
self.tasks = self.tasks.map (e) -> Task.new e, self, model, socket
|
||
|
|
||
|
self.render-column = (column) ->
|
||
|
h \div.column.is-3 {
|
||
|
key: column.id
|
||
|
} [
|
||
|
h \div.card.is-column-header {
|
||
|
key: column.id
|
||
|
} [
|
||
|
h \div.card-header [
|
||
|
if model.editing == column.id + ".title"
|
||
|
h \input.input {
|
||
|
type: "text",
|
||
|
value: column.name
|
||
|
onchange: (e) ->
|
||
|
console.log "onchange??"
|
||
|
model.editing := undefined
|
||
|
|
||
|
socket.edit-column self.id, column.id, {
|
||
|
name: e.target.value
|
||
|
}
|
||
|
}
|
||
|
else
|
||
|
h \div.card-header-title [
|
||
|
bulma.title 3 column.name
|
||
|
]
|
||
|
|
||
|
h \a.card-header-icon {
|
||
|
key: "edit"
|
||
|
onclick: ->
|
||
|
if model.editing == column.id + ".title"
|
||
|
model.editing := undefined
|
||
|
else
|
||
|
model.editing := column.id + ".title"
|
||
|
} [
|
||
|
"Edit"
|
||
|
]
|
||
|
|
||
|
if self.tasks.filter((.column == column.id)).length == 0
|
||
|
h \a.card-header-icon {
|
||
|
key: "delete"
|
||
|
onclick: ->
|
||
|
model.editing := column.id + ".delete"
|
||
|
} [
|
||
|
"Delete"
|
||
|
]
|
||
|
]
|
||
|
if model.editing == column.id + ".delete"
|
||
|
h \div.card-content [
|
||
|
h \div.button.is-fullwidth.is-danger {
|
||
|
onclick: ->
|
||
|
socket.delete-column self.id, column.id
|
||
|
} [ "Delete me!"]
|
||
|
]
|
||
|
]
|
||
|
|
||
|
for task in self.tasks
|
||
|
continue if task.column != column.id
|
||
|
|
||
|
task.render!
|
||
|
|
||
|
h \div.button.is-fullwidth {
|
||
|
onclick: ->
|
||
|
socket.new-task self.id, column.id, {
|
||
|
title: "General Kenobi…"
|
||
|
description: ""
|
||
|
}
|
||
|
} [ "New task" ]
|
||
|
]
|
||
|
|
||
|
self.render = ->
|
||
|
h \div.project {
|
||
|
key: self.id
|
||
|
} [
|
||
|
h \div.hero.is-dark { key: "title" } [
|
||
|
h \div.hero-body [
|
||
|
# FIXME: Consider using a .level for this.
|
||
|
h \div.is-pulled-right {
|
||
|
onclick: ->
|
||
|
model.editing := self.id + ".name"
|
||
|
} [
|
||
|
"Edit"
|
||
|
]
|
||
|
|
||
|
if model.editing == self.id + ".name"
|
||
|
h \input.input {
|
||
|
onchange: (e) ->
|
||
|
model.editing := undefined
|
||
|
socket.edit-project self.id, {
|
||
|
name: e.target.value
|
||
|
}
|
||
|
value: self.name
|
||
|
}
|
||
|
else
|
||
|
h \div.title [ self.name ]
|
||
|
]
|
||
|
]
|
||
|
|
||
|
h \div.columns [
|
||
|
for dom in self.columns.map((column) -> self.render-column(column))
|
||
|
dom
|
||
|
|
||
|
h \div.column.is-2 {
|
||
|
key: "new-column"
|
||
|
} [
|
||
|
h \div.button.is-fullwidth {
|
||
|
onclick: ->
|
||
|
socket.new-column self.id, "Hello, there!"
|
||
|
} [ "New Column" ]
|
||
|
]
|
||
|
]
|
||
|
]
|
||
|
|
||
|
self
|
||
|
}
|