extends withQuestions

block append stylesheets
	link(rel="stylesheet" href="/stylesheets/statements.css")
	link(rel="stylesheet" href="/stylesheets/assessment.css")
	noscript
		meta(http-equiv="Refresh" content="0; URL=/enablejs")

block rightMenu
	a#rightButton.btn-floating.btn-large.grey(href=assessment.name + "/monitor")
		i.material-icons video_label

block content
	.container#assessment
		.row
			#warning.modal
				.modal-content {{ warnMsg }}
				.modal-footer
					.center-align
						a.modal-action.modal-close.waves-effect.waves-light.btn-flat(href="#!") Ok
		.row
			.col.s12.m10.offset-m1
				h4= assessment.name
				#stage0(v-show="stage==0")
					.card
						.input-field.inline.on-left
							label(for="number") Number
							input#number(type="text" v-model="student.number" @keyup.enter="getStudent()")
						button.waves-effect.waves-light.btn(@click="getStudent()") Send
				#stage1(v-show="stage==1")
					.card
						if assessment.mode != "open"
							.input-field.inline
								label(for="name") Name
								input#name(type="text" v-model="student.name" disabled)
						p.center-align
							if assessment.mode != "open"
								button.waves-effect.waves-light.btn.on-left(@click="cancelStudent") Cancel
							button.waves-effect.waves-light.btn(@click="startAssessment") Start!
				#stage0_1_4(v-show="[0,1,4].includes(stage)")
					.card
						.introduction(v-html="assessment.introduction")
				#stage2_4(v-if="[2,4].includes(stage)")
					if assessment.time > 0
						.card(v-show="stage==2")
							.timer.center {{ countdown }}
					.card
						button.sendAnswer.waves-effect.waves-light.btn(v-show="stage==2" @click="sendAnswer") Send
						statements(:questions="assessment.questions" :answers="answers")
						if assessment.display == "all"
							button.sendAnswer.waves-effect.waves-light.btn(v-show="stage==2" @click="sendAnswer") Send
				#stage3(v-show="stage==3")
					.card
						.finish Exam completed ☺ ...don't close the window!

block append javascripts
	script.
		let assessment = !{JSON.stringify(assessment)};
		const monitoring = false;
	script(src="//cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.4/socket.io.js")
	script(src="/javascripts/utils/libsRefresh.js")
	script(src="/javascripts/components/statements.js")
	script(src="/javascripts/assessment.js")