extends layout

block stylesheets
	link(rel="stylesheet", href="/stylesheets/login.css")

block content
	.container#login
		.row
			.col.s12.m10.offset-m1.l8.offset-l2.xl6.offset-xl3
				.card#form
					form(@submit.prevent="submit")
						.input-field
							input#email.validate(type="email", ref="userEmail", v-model="user.email", required)
							label(for="email") Email
						.input-field(v-show="stage=='register'")
							input#name.validate(type="text", v-model="user.name", :required="stage=='register'")
							label(for="name") Name
						#submit.center-align
							button#submit.waves-effect.waves-light.btn(@click.prevent="submit")
								span {{ messages[stage] }}
								i.material-icons.right send
						#toggle.center-align
							span(v-show="stage!='login'", @click="toggleStage('login')") Login
							span(v-show="stage!='register'", @click="toggleStage('register')") Register
				.card#dialog.hide

block javascripts
	script(src="/javascripts/utils/dialog.js")
	script(src="/javascripts/utils/validation.js")
	script(src="/javascripts/login.js")