extends withQuestions

block append stylesheets
	link(rel="stylesheet" href="/stylesheets/statements.css")
	link(rel="stylesheet" href="/stylesheets/course.css")

block content
	.container#course
		if teacher
			#newAssessment.modal
				.modal-content
					form(@submit.prevent="addAssessment")
						.input-field
							input#assessmentName(type="text" v-model="newAssessment.name" required)
							label(for="assessmentName") Name
				.modal-footer
					.center-align
						a.waves-effect.waves-light.btn(href="#!" @click="addAssessment()")
							span Submit
							i.material-icons.right send
		.row(v-show="mode=='view'")
			
			
			
			
			
			
			
			
			#assessmentEdit
				form
					p
						input#active(type="checkbox" v-model="assessment.active")
						label(for="active") Assessment is active
					div
						h4 Questions mode:
						span(title="Exam mode, secured (class only): students cannot lose focus or exit fullscreen")
							input#secure(name="status" type="radio" value="secure" v-model="assessment.mode")
							label(for="secure") secure
						span(title="Exam mode, watched (class only): teachers are notified when students lose focus or resize window")
							input#watch(name="status" type="radio" value="watch" v-model="assessment.mode")
							label(for="watch") watch
						span(title="Exam mode, unwatched: students can browse the web freely")
							input#exam(name="status" type="radio" value="exam" v-model="assessment.mode")
							label(for="exam") exam
						span(title="Questions list open to the world (useful mode after an exam, or for a 'questions bank'")
							input#open(name="status" type="radio" value="open" v-model="assessment.mode")
							label(for="open") open
					p
						input#fixed(type="checkbox" v-model="assessment.fixed")
						label(for="fixed") Fixed questions order
					div
						h4 Display type:
						span(title="Show only one question at a time (with potential sub-questions)")
							input#displayOne(name="display" type="radio" value="one" v-model="assessment.display")
							label(for="displayOne") one
						span(title="Always show all questions (with an optional navigator)")
							input#displayAll(name="display" type="radio" value="all" v-model="assessment.display")
							label(for="displayAll") all
					.input-field
						input#time(type="number" v-model.number="assessment.time")
						label(for="time") Time (minutes)
					.input-field
						textarea#introduction.materialize-textarea(v-model="assessment.introduction")
						label(for="introduction") Introduction
					.input-field
						textarea#assessmentEdition.materialize-textarea(v-model="assessmentText")
						label(for="assessmentEdition") Assessment in text format
			
			
			
			
			
			
			
			.col.s12.m10.offset-m1
				if teacher
					h4.title(@click="toggleDisplay('students')") Students
					.card(v-show="display=='students'")
						.center-align
							input.hide#upload(type="file" @change="upload")
							button.on-left.waves-effect.waves-light.btn(@click="uploadTrigger()") Import
						table
							thead
								tr
									th Number
									th Name
									th Group
							tbody
								tr.student(v-for="student in studentList(0)")
									td {{ student.number }}
									td {{ student.name }}
									td {{ student.group }}
				h4.title(@click="toggleDisplay('assessments')") Assessments
				.card(v-show="display=='assessments'")
					if teacher
						.center-align
							a.on-left.waves-effect.waves-light.btn.modal-trigger(href="#newAssessment") New assessment
							input#password(type="password" v-model="monitorPwd" @keyup.enter="setPassword"
									placeholder="Password" title="Monitoring password")
					table
						thead
							tr
								th Name
								th Mode
								th #Questions
								th Time
						tbody
							tr.assessment(v-for="(assessment,i) in assessmentArray" :class="{idle:!assessment.active}"
									@click.left="actionAssessment(i)" @contextmenu.prevent="deleteAssessment(assessment)")
								td {{ assessment.name }}
								td {{ assessment.mode }}
								td {{ assessment.questions.reduce( (a,b) => { return b.active ? a+1 : a; }, 0) }}
								td {{ assessment.time }}
		if teacher
			.row(v-show="mode=='edit'")
				.col.s12.m10.offset-m1




					// TODO: always edit mode, with a modal preview



					h4 {{ assessment.name }}
					.card
						.center-align
							button.waves-effect.waves-light.btn.on-left(@click="materialOpenModal('assessmentSettings')") Settings
							button.waves-effect.waves-light.btn.on-left(@click="materialOpenModal('assessmentEdit')") Content
							button.waves-effect.waves-light.btn(@click="redirect(assessment.name)") View
						#questionList
							.introduction(v-html="assessment.introduction")
							.question(v-for="(question,i) in assessment.questions" :class="{questionInactive:!question.active}")
								.wording(v-html="question.wording")
								.option(v-for="(option,j) in question.options" :class="{choiceCorrect:question.answer.includes(j)}" v-html="option")
								p
									input(:id="checkboxFixedId(i)" type="checkbox" v-model="question.fixed")
									label.on-left(:for="checkboxFixedId(i)") Fixed
									input(:id="checkboxActiveId(i)" type="checkbox" v-model="question.active")
									label(:for="checkboxActiveId(i)") Active
									input(time default 0 = untimed)
									label Time for the question
						.center-align
							button.waves-effect.waves-light.btn.on-left(@click="mode='view'") Cancel
							button.waves-effect.waves-light.btn(@click="updateAssessment") Send

block append javascripts
	script(src="//cdnjs.cloudflare.com/ajax/libs/PapaParse/4.3.6/papaparse.min.js")
	script.
		let assessmentArray = !{JSON.stringify(assessmentArray)};
		const course = !{JSON.stringify(course)};
		const initials = "#{initials}";
		const admin = #{teacher};
	script(src="/javascripts/utils/sha1.js")
	script(src="/javascripts/utils/validation.js")
	script(src="/javascripts/course.js")