bulma = require "./bulma.ls"
h = require 'maquette' .h


module.exports = {

	login-widget: (model, socket) ->
		h \div.container [
			h \div.box [
				if model.login-error
					h \div.notification.is-danger [
						model.login-error
					]
				h \form [
					bulma.field [
						bulma.label "Login"
						bulma.input {
							oninput: (e) ->
								model.login = e.target.value
							name: \login
							id: \login-input
						}
					]
					bulma.field [
						bulma.label "Password"
						bulma.input {
							oninput: (e) ->
								model.password = e.target.value
							name: \password
							type: \password
							id: \password-input
						}
					]

					h \button.button.is-primary {
						onclick: (e) ->
							e.prevent-default!

							model.login-error = undefined
							socket.login model.login, model.password
					} [ "Connexion" ]
				]
			]
		]

	login-page: (model, socket) ->
		h \div.container [
			h \div.box [
				if model.login-error
					h \div.notification.is-danger [
						model.login-error
					]
				h \form [
					bulma.field [
						bulma.label "Login"
						bulma.input {
							oninput: (e) ->
								model.login = e.target.value
							name: \login
							id: \login-input
						}
					]
					bulma.field [
						bulma.label "Password"
						bulma.input {
							oninput: (e) ->
								model.password = e.target.value
							name: \password
							type: \password
							id: \password-input
						}
					]

					h \button.button.is-fullwidth.is-primary {
						onclick: (e) ->
							e.prevent-default!

							model.login-error = undefined
							socket.login model.login, model.password
					} [ "Connexion" ]
				]
			]
		]
}