34bf4623c6ed5b671f29bd3f164aaf1aefdf3f6a
[qomet.git] / views / course.pug
1 extends withQuestions
2
3 block append stylesheets
4 link(rel="stylesheet" href="/stylesheets/statements.css")
5 link(rel="stylesheet" href="/stylesheets/course.css")
6
7 block content
8 .container#course
9 if teacher
10 #newAssessment.modal
11 .modal-content
12 form(@submit.prevent="addAssessment")
13 .input-field
14 input#assessmentName(type="text" v-model="newAssessment.name" required)
15 label(for="assessmentName") Name
16 .modal-footer
17 .center-align
18 a.waves-effect.waves-light.btn(href="#!" @click="addAssessment()")
19 span Submit
20 i.material-icons.right send
21 .row(v-show="mode=='view'")
22
23
24
25
26
27
28
29
30 #assessmentEdit
31 form
32 p
33 input#active(type="checkbox" v-model="assessment.active")
34 label(for="active") Assessment is active
35 div
36 h4 Questions mode:
37 span(title="Exam mode, secured (class only): students cannot lose focus or exit fullscreen")
38 input#secure(name="status" type="radio" value="secure" v-model="assessment.mode")
39 label(for="secure") secure
40 span(title="Exam mode, watched (class only): teachers are notified when students lose focus or resize window")
41 input#watch(name="status" type="radio" value="watch" v-model="assessment.mode")
42 label(for="watch") watch
43 span(title="Exam mode, unwatched: students can browse the web freely")
44 input#exam(name="status" type="radio" value="exam" v-model="assessment.mode")
45 label(for="exam") exam
46 span(title="Questions list open to the world (useful mode after an exam, or for a 'questions bank'")
47 input#open(name="status" type="radio" value="open" v-model="assessment.mode")
48 label(for="open") open
49 p
50 input#fixed(type="checkbox" v-model="assessment.fixed")
51 label(for="fixed") Fixed questions order
52 div
53 h4 Display type:
54 span(title="Show only one question at a time (with potential sub-questions)")
55 input#displayOne(name="display" type="radio" value="one" v-model="assessment.display")
56 label(for="displayOne") one
57 span(title="Always show all questions (with an optional navigator)")
58 input#displayAll(name="display" type="radio" value="all" v-model="assessment.display")
59 label(for="displayAll") all
60 .input-field
61 input#time(type="number" v-model.number="assessment.time")
62 label(for="time") Time (minutes)
63 .input-field
64 textarea#introduction.materialize-textarea(v-model="assessment.introduction")
65 label(for="introduction") Introduction
66 .input-field
67 textarea#assessmentEdition.materialize-textarea(v-model="assessmentText")
68 label(for="assessmentEdition") Assessment in text format
69
70
71
72
73
74
75
76 .col.s12.m10.offset-m1
77 if teacher
78 h4.title(@click="toggleDisplay('students')") Students
79 .card(v-show="display=='students'")
80 .center-align
81 input.hide#upload(type="file" @change="upload")
82 button.on-left.waves-effect.waves-light.btn(@click="uploadTrigger()") Import
83 table
84 thead
85 tr
86 th Number
87 th Name
88 th Group
89 tbody
90 tr.student(v-for="student in studentList(0)")
91 td {{ student.number }}
92 td {{ student.name }}
93 td {{ student.group }}
94 h4.title(@click="toggleDisplay('assessments')") Assessments
95 .card(v-show="display=='assessments'")
96 if teacher
97 .center-align
98 a.on-left.waves-effect.waves-light.btn.modal-trigger(href="#newAssessment") New assessment
99 input#password(type="password" v-model="monitorPwd" @keyup.enter="setPassword"
100 placeholder="Password" title="Monitoring password")
101 table
102 thead
103 tr
104 th Name
105 th Mode
106 th #Questions
107 th Time
108 tbody
109 tr.assessment(v-for="(assessment,i) in assessmentArray" :class="{idle:!assessment.active}"
110 @click.left="actionAssessment(i)" @contextmenu.prevent="deleteAssessment(assessment)")
111 td {{ assessment.name }}
112 td {{ assessment.mode }}
113 td {{ assessment.questions.reduce( (a,b) => { return b.active ? a+1 : a; }, 0) }}
114 td {{ assessment.time }}
115 if teacher
116 .row(v-show="mode=='edit'")
117 .col.s12.m10.offset-m1
118
119
120
121
122 // TODO: always edit mode, with a modal preview
123
124
125
126 h4 {{ assessment.name }}
127 .card
128 .center-align
129 button.waves-effect.waves-light.btn.on-left(@click="materialOpenModal('assessmentSettings')") Settings
130 button.waves-effect.waves-light.btn.on-left(@click="materialOpenModal('assessmentEdit')") Content
131 button.waves-effect.waves-light.btn(@click="redirect(assessment.name)") View
132 #questionList
133 .introduction(v-html="assessment.introduction")
134 .question(v-for="(question,i) in assessment.questions" :class="{questionInactive:!question.active}")
135 .wording(v-html="question.wording")
136 .option(v-for="(option,j) in question.options" :class="{choiceCorrect:question.answer.includes(j)}" v-html="option")
137 p
138 input(:id="checkboxFixedId(i)" type="checkbox" v-model="question.fixed")
139 label.on-left(:for="checkboxFixedId(i)") Fixed
140 input(:id="checkboxActiveId(i)" type="checkbox" v-model="question.active")
141 label(:for="checkboxActiveId(i)") Active
142 input(time default 0 = untimed)
143 label Time for the question
144 .center-align
145 button.waves-effect.waves-light.btn.on-left(@click="mode='view'") Cancel
146 button.waves-effect.waves-light.btn(@click="updateAssessment") Send
147
148 block append javascripts
149 script(src="//cdnjs.cloudflare.com/ajax/libs/PapaParse/4.3.6/papaparse.min.js")
150 script.
151 let assessmentArray = !{JSON.stringify(assessmentArray)};
152 const course = !{JSON.stringify(course)};
153 const initials = "#{initials}";
154 const admin = #{teacher};
155 script(src="/javascripts/utils/sha1.js")
156 script(src="/javascripts/utils/validation.js")
157 script(src="/javascripts/course.js")