modal == bien
This commit is contained in:
Philippe PITTOLI
parent
00bd4894bd
commit
65084c3247
5
Makefile
5
Makefile
@ -37,7 +37,7 @@ main.js: main.bundle.js
|
||||
$(Q)npx babel --minified main.bundle.js -o main.js
|
||||
|
||||
|
||||
main.bundle.js: client/index.ls client/authd.ls client/bulma.ls client/project.ls client/task.ls client/todowebsocket.ls
|
||||
main.bundle.js: client/index.ls client/authd.ls client/bulma.ls client/modal.ls client/project.ls client/task.ls client/todowebsocket.ls
|
||||
@echo '[01;32m BUN > [01;37mmain.bundle.js[00m'
|
||||
$(Q)npx browserify -t browserify-livescript client/index.ls -o main.bundle.js
|
||||
|
||||
@ -118,6 +118,7 @@ $(PACKAGE)-$(VERSION).tar.gz: distdir
|
||||
$(PACKAGE)-$(VERSION)/client/style.sass \
|
||||
$(PACKAGE)-$(VERSION)/client/authd.ls \
|
||||
$(PACKAGE)-$(VERSION)/client/bulma.ls \
|
||||
$(PACKAGE)-$(VERSION)/client/modal.ls \
|
||||
$(PACKAGE)-$(VERSION)/client/project.ls \
|
||||
$(PACKAGE)-$(VERSION)/client/task.ls \
|
||||
$(PACKAGE)-$(VERSION)/client/todowebsocket.ls
|
||||
@ -131,6 +132,7 @@ $(PACKAGE)-$(VERSION).tar.xz: distdir
|
||||
$(PACKAGE)-$(VERSION)/client/style.sass \
|
||||
$(PACKAGE)-$(VERSION)/client/authd.ls \
|
||||
$(PACKAGE)-$(VERSION)/client/bulma.ls \
|
||||
$(PACKAGE)-$(VERSION)/client/modal.ls \
|
||||
$(PACKAGE)-$(VERSION)/client/project.ls \
|
||||
$(PACKAGE)-$(VERSION)/client/task.ls \
|
||||
$(PACKAGE)-$(VERSION)/client/todowebsocket.ls
|
||||
@ -144,6 +146,7 @@ $(PACKAGE)-$(VERSION).tar.bz2: distdir
|
||||
$(PACKAGE)-$(VERSION)/client/style.sass \
|
||||
$(PACKAGE)-$(VERSION)/client/authd.ls \
|
||||
$(PACKAGE)-$(VERSION)/client/bulma.ls \
|
||||
$(PACKAGE)-$(VERSION)/client/modal.ls \
|
||||
$(PACKAGE)-$(VERSION)/client/project.ls \
|
||||
$(PACKAGE)-$(VERSION)/client/task.ls \
|
||||
$(PACKAGE)-$(VERSION)/client/todowebsocket.ls
|
||||
|
||||
@ -29,46 +29,5 @@ module.exports = {
|
||||
action: url
|
||||
method: method
|
||||
}, content
|
||||
|
||||
asking-modal: (model, args, content) ->
|
||||
console.log "Rendering a modal: ", args, content
|
||||
is-active = (if model.current-modal == true then \.is-active else "")
|
||||
h \div.modal + is-active, args, [
|
||||
h \div.modal-background (args.background || [])
|
||||
|
||||
h \div.modal-content {} [
|
||||
content
|
||||
|
||||
h \hr []
|
||||
|
||||
h \div.columns {} [
|
||||
h \div.column {} [
|
||||
h \button.button.is-success.is-fullwidth {
|
||||
onclick: ->
|
||||
model.current-modal := false
|
||||
} [
|
||||
h \span.icon.has-text-success [ h \i.fas.fa-check-square [] ]
|
||||
]
|
||||
]
|
||||
h \div.column {} [
|
||||
# h \button.button.is-warning.is-fullwidth {
|
||||
# onclick: ->
|
||||
# model.current-modal := false
|
||||
# } [
|
||||
# h \span.icon.has-text-danger [ h \i.fas.fa-ban [] ]
|
||||
# ]
|
||||
h \span.icon.has-text-danger {
|
||||
onclick: ->
|
||||
model.current-modal := false
|
||||
} [ h \i.fas.fa-ban [] ]
|
||||
]
|
||||
]
|
||||
h \button.button.modal-close {
|
||||
aria-label: "close"
|
||||
onclick: ->
|
||||
model.current-modal := false
|
||||
} []
|
||||
]
|
||||
]
|
||||
}
|
||||
|
||||
|
||||
@ -40,6 +40,7 @@ todows = require "./todowebsocket.ls"
|
||||
bulma = require "./bulma.ls"
|
||||
Task = require "./task.ls"
|
||||
Project = require "./project.ls"
|
||||
Modal = require "./modal.ls"
|
||||
|
||||
{create-projector, h} = maquette
|
||||
projector = create-projector!
|
||||
@ -79,6 +80,9 @@ model = {
|
||||
jwt: undefined
|
||||
}
|
||||
|
||||
# TODO XXX FIXME
|
||||
model.modal = Modal {+visible}
|
||||
|
||||
model.authd-url =
|
||||
(if location.protocol == 'https' then 'wss' else 'ws') +
|
||||
'://' + location.hostname + \: +
|
||||
@ -266,7 +270,8 @@ render-body = ->
|
||||
|
||||
console.log "rendering a modal"
|
||||
# bulma.asking-modal model, {}, [ (h \button.button {} [ "rendering a modal" ]) ]
|
||||
bulma.asking-modal model, {}, [ "rendering a modal !!" ]
|
||||
if model.modal
|
||||
model.modal.render!
|
||||
|
||||
render-new-project-button!
|
||||
]
|
||||
|
||||
62
client/modal.ls
Normal file
62
client/modal.ls
Normal file
@ -0,0 +1,62 @@
|
||||
|
||||
h = require 'maquette' .h
|
||||
|
||||
# formulaire création de listes
|
||||
# formulaire création de tâches
|
||||
# confirmation de suppression de listes, de tâches, de colonnes
|
||||
|
||||
Modal = (args) ->
|
||||
self = {}
|
||||
|
||||
self.modal-args = args.modal-args || {}
|
||||
self.visible = args.visible || false
|
||||
self.content = args.content || []
|
||||
self.background-args = args.background-args || []
|
||||
self.on-validation = args.on-validation || ->
|
||||
self.on-cancellation = args.on-cancellation || ->
|
||||
self.validation-label = args.validation-label || "Ok"
|
||||
self.cancellation-label = args.cancellation-label || "Cancel"
|
||||
|
||||
self.render = ->
|
||||
console.log "Rendering a modal: ", self, self.content
|
||||
|
||||
is-active = (if self.visible == true then \.is-active else "")
|
||||
h \div.modal + is-active, self.modal-args, [
|
||||
h \div.modal-background self.background-args
|
||||
|
||||
h \div.modal-content {} [
|
||||
h \div.box [
|
||||
self.content
|
||||
|
||||
h \hr []
|
||||
|
||||
h \div.columns {} [
|
||||
h \div.column {} [
|
||||
h \button.button.is-fullwidth {
|
||||
onclick: ->
|
||||
self.visible := false
|
||||
self.on-validation self
|
||||
} [ self.validation-label ]
|
||||
]
|
||||
h \div.column {} [
|
||||
h \button.button.is-fullwidth {
|
||||
onclick: ->
|
||||
self.visible := false
|
||||
self.on-cancellation self
|
||||
} [ self.cancellation-label ]
|
||||
]
|
||||
]
|
||||
]
|
||||
|
||||
h \button.button.modal-close {
|
||||
aria-label: "close"
|
||||
onclick: ->
|
||||
self.visible := false
|
||||
self.on-cancellation self
|
||||
} []
|
||||
]
|
||||
]
|
||||
|
||||
self
|
||||
|
||||
module.exports = Modal
|
||||
@ -7,7 +7,7 @@
|
||||
|
||||
@import "../node_modules/bulmaswatch/superhero/_overrides.scss"
|
||||
|
||||
.columns
|
||||
.project>.columns
|
||||
overflow-x: scroll
|
||||
|
||||
.avatar
|
||||
|
||||
Loading…
Reference in New Issue
Block a user