Start thinking about generalization format + parametrization
[qomet.git] / public / javascripts / assessment.js
CommitLineData
e99c53fb
BA
1let socket = null; //monitor answers in real time
2
cc7c0f5e
BA
3if (assessment.mode == "secure" && !checkWindowSize())
4 document.location.href= "/fullscreen";
e99c53fb 5
cc7c0f5e 6function checkWindowSize()
e99c53fb 7{
cc7c0f5e
BA
8 // NOTE: temporarily accept smartphone (security hole: pretend being a smartphone on desktop browser...)
9 if (navigator.userAgent.match(/(iPhone|iPod|iPad|Android|BlackBerry)/))
10 return true;
f03a2ad9
BA
11 // 3 is arbitrary, but a small tolerance is required (e.g. in Firefox)
12 return window.innerWidth >= screen.width-3 && window.innerHeight >= screen.height-3;
e99c53fb
BA
13};
14
8a2b3260 15new Vue({
e99c53fb
BA
16 el: "#assessment",
17 data: {
18 assessment: assessment,
8a51dbf7
BA
19 answers: { }, //filled later with answering parameters
20 student: { }, //filled later (name, password)
e99c53fb
BA
21 // Stage 0: unauthenticated (number),
22 // 1: authenticated (got a name, unvalidated)
23 // 2: locked: password set, exam started
24 // 3: completed
25 // 4: show answers
26 stage: assessment.mode != "open" ? 0 : 1,
27 remainingTime: 0, //global, in seconds
f03a2ad9 28 warnMsg: "",
e99c53fb 29 },
e99c53fb
BA
30 computed: {
31 countdown: function() {
32 let seconds = this.remainingTime % 60;
33 let minutes = Math.floor(this.remainingTime / 60);
34 return this.padWithZero(minutes) + ":" + this.padWithZero(seconds);
35 },
8a51dbf7
BA
36 showAnswers: function() {
37 return this.stage == 4;
38 },
e99c53fb 39 },
f03a2ad9
BA
40 mounted: function() {
41 $(".modal").modal();
2bada710
BA
42 if (assessment.mode != "open")
43 {
44 window.addEventListener("keydown", e => {
45 // Ignore F12 (avoid accidental window resize due to devtools)
46 // NOTE: in Chromium at least, fullscreen mode exit with F11 cannot be prevented.
47 // Workaround: disable key at higher level. Possible xbindkey config:
48 // "false"
49 // m:0x10 + c:95
50 // Mod2 + F11
51 if (e.keyCode == 123)
52 e.preventDefault();
53 }, false);
54 }
435371c7 55 window.addEventListener("blur", () => {
2bada710
BA
56 if (!socket)
57 return;
58 if (assessment.mode == "secure")
59 {
60 this.trySendCurrentAnswer();
61 document.location.href= "/noblur";
62 }
63 else if (assessment.mode == "exam")
64 socket.emit(message.studentBlur, {number:this.student.number});
435371c7 65 }, false);
2bada710
BA
66 if (assessment.mode == "exam")
67 {
68 window.addEventListener("focus", () => {
69 if (!socket)
70 return;
71 socket.emit(message.studentFocus, {number:this.student.number});
72 }, false);
73 }
435371c7 74 window.addEventListener("resize", e => {
2bada710
BA
75 if (!socket)
76 return;
77 if (assessment.mode == "secure")
78 {
79 this.trySendCurrentAnswer();
80 document.location.href= "/fullscreen";
81 }
82 else if (assessment.mode == "exam")
83 {
84 if (checkWindowSize())
85 socket.emit(message.studentFullscreen, {number:this.student.number});
86 else
87 socket.emit(message.studentResize, {number:this.student.number});
88 }
435371c7 89 }, false);
f03a2ad9 90 },
e99c53fb 91 methods: {
f03a2ad9 92 // In case of AJAX errors
71d1ca9c 93 showWarning: function(message) {
f03a2ad9
BA
94 this.warnMsg = message;
95 $("#warning").modal("open");
96 },
e99c53fb
BA
97 padWithZero: function(x) {
98 if (x < 10)
99 return "0" + x;
100 return x;
101 },
8a51dbf7
BA
102 trySendCurrentAnswer: function() {
103 if (this.stage == 2)
71d1ca9c 104 this.sendAnswer();
8a51dbf7 105 },
e99c53fb
BA
106 // stage 0 --> 1
107 getStudent: function(cb) {
108 $.ajax("/get/student", {
109 method: "GET",
110 data: {
111 number: this.student.number,
112 cid: assessment.cid,
113 },
114 dataType: "json",
115 success: s => {
116 if (!!s.errmsg)
71d1ca9c 117 return this.showWarning(s.errmsg);
e99c53fb
BA
118 this.stage = 1;
119 this.student = s.student;
120 Vue.nextTick( () => { Materialize.updateTextFields(); });
121 if (!!cb)
122 cb();
123 },
124 });
125 },
126 // stage 1 --> 0
127 cancelStudent: function() {
128 this.stage = 0;
129 },
130 // stage 1 --> 2 (get all questions, set password)
131 startAssessment: function() {
f03a2ad9 132 let initializeStage2 = (questions,paper) => {
e99c53fb
BA
133 $("#leftButton, #rightButton").hide();
134 if (assessment.time > 0)
135 {
85cf9f89
BA
136 const deltaTime = !!paper ? Date.now() - paper.startTime : 0;
137 this.remainingTime = assessment.time * 60 - Math.round(deltaTime / 1000);
e99c53fb
BA
138 this.runTimer();
139 }
140 // Initialize structured answer(s) based on questions type and nesting (TODO: more general)
141 if (!!questions)
142 assessment.questions = questions;
8a51dbf7 143 this.answers.inputs = [ ];
e99c53fb 144 for (let q of assessment.questions)
71d1ca9c 145 this.answers.inputs.push( _(q.options.length).times( _.constant(false) ) );
f03a2ad9
BA
146 if (!paper)
147 {
8a51dbf7 148 this.answers.indices = assessment.fixed
f03a2ad9
BA
149 ? _.range(assessment.questions.length)
150 : _.shuffle( _.range(assessment.questions.length) );
151 }
152 else
153 {
154 // Resuming
155 let indices = paper.inputs.map( input => { return input.index; });
6bf4a38e 156 let remainingIndices = _.difference( _.range(assessment.questions.length).map(String), indices );
8a51dbf7 157 this.answers.indices = indices.concat( _.shuffle(remainingIndices) );
f03a2ad9 158 }
8a51dbf7 159 this.answers.index = !!paper ? paper.inputs.length : 0;
3b8117c5
BA
160 this.answers.displayAll = assessment.display == "all";
161 this.answers.showSolution = false;
e99c53fb 162 this.stage = 2;
e99c53fb
BA
163 };
164 if (assessment.mode == "open")
165 return initializeStage2();
166 $.ajax("/start/assessment", {
167 method: "GET",
168 data: {
169 number: this.student.number,
170 aid: assessment._id
171 },
172 dataType: "json",
173 success: s => {
174 if (!!s.errmsg)
71d1ca9c 175 return this.showWarning(s.errmsg);
f03a2ad9
BA
176 if (!!s.paper)
177 {
178 // Resuming: receive stored answers + startTime
179 this.student.password = s.paper.password;
8a51dbf7 180 this.answers.inputs = s.paper.inputs.map( inp => { return inp.input; });
f03a2ad9
BA
181 }
182 else
183 {
184 this.student.password = s.password;
185 // Got password: students answers locked to this page until potential teacher
186 // action (power failure, computer down, ...)
187 }
29c8b391 188 socket = io.connect("/", {
71d1ca9c 189 query: "aid=" + assessment._id + "&number=" + this.student.number + "&password=" + this.student.password
e5ec7dea
BA
190 });
191 socket.on(message.allAnswers, this.setAnswers);
f03a2ad9 192 initializeStage2(s.questions, s.paper);
e99c53fb
BA
193 },
194 });
195 },
196 // stage 2
197 runTimer: function() {
198 if (assessment.time <= 0)
199 return;
200 let self = this;
201 setInterval( function() {
202 self.remainingTime--;
71d1ca9c
BA
203 if (self.remainingTime <= 0)
204 {
205 if (self.stage == 2)
206 self.endAssessment();
e99c53fb 207 clearInterval(this);
71d1ca9c 208 }
e99c53fb
BA
209 }, 1000);
210 },
435371c7 211 // stage 2
9f4f3259 212 sendOneAnswer: function() {
71d1ca9c 213 const realIndex = this.answers.indices[this.answers.index];
435371c7 214 let gotoNext = () => {
71d1ca9c 215 if (this.answers.index == assessment.questions.length - 1)
8a51dbf7 216 this.endAssessment();
435371c7 217 else
71d1ca9c
BA
218 this.answers.index++;
219 this.$children[0].$forceUpdate(); //TODO: bad HACK, and shouldn't be required...
435371c7
BA
220 };
221 if (assessment.mode == "open")
222 return gotoNext(); //only local
223 let answerData = {
224 aid: assessment._id,
225 answer: JSON.stringify({
71d1ca9c
BA
226 index: realIndex.toString(),
227 input: this.answers.inputs[realIndex]
435371c7
BA
228 .map( (tf,i) => { return {val:tf,idx:i}; } )
229 .filter( item => { return item.val; })
230 .map( item => { return item.idx; })
231 }),
232 number: this.student.number,
233 password: this.student.password,
234 };
235 $.ajax("/send/answer", {
236 method: "GET",
237 data: answerData,
238 dataType: "json",
239 success: ret => {
240 if (!!ret.errmsg)
71d1ca9c
BA
241 return this.showWarning(ret.errmsg);
242 gotoNext();
435371c7
BA
243 socket.emit(message.newAnswer, answerData);
244 },
245 });
246 },
9f4f3259
BA
247 // TODO: I don't like that + sending should not be definitive in exam mode with display = all
248 sendAnswer: function() {
249 if (assessment.display == "one")
4a4a6497 250 this.sendOneAnswer();
9f4f3259 251 else
4a4a6497 252 assessment.questions.forEach(this.sendOneAnswer);
9f4f3259 253 },
e99c53fb 254 // stage 2 --> 3 (or 4)
cc7c0f5e 255 // from a message by statements component, or time over
e99c53fb 256 endAssessment: function() {
cc7c0f5e 257 // Set endTime, destroy password
e99c53fb 258 $("#leftButton, #rightButton").show();
cc7c0f5e 259 if (assessment.mode == "open")
e99c53fb 260 {
e99c53fb 261 this.stage = 4;
3b8117c5 262 this.answers.showSolution = true;
29c8b391 263 this.answers.displayAll = true;
cc7c0f5e
BA
264 return;
265 }
266 $.ajax("/end/assessment", {
267 method: "GET",
268 data: {
269 aid: assessment._id,
270 number: this.student.number,
271 password: this.student.password,
272 },
273 dataType: "json",
274 success: ret => {
275 if (!!ret.errmsg)
71d1ca9c 276 return this.showWarning(ret.errmsg);
cc7c0f5e
BA
277 assessment.conclusion = ret.conclusion;
278 this.stage = 3;
279 delete this.student["password"]; //unable to send new answers now
cc7c0f5e
BA
280 },
281 });
e99c53fb
BA
282 },
283 // stage 3 --> 4 (on socket message "feedback")
71d1ca9c 284 setAnswers: function(m) {
29c8b391
BA
285 const answers = JSON.parse(m.answers);
286 for (let i=0; i<answers.length; i++)
287 assessment.questions[i].answer = answers[i];
3b8117c5 288 this.answers.showSolution = true;
29c8b391 289 this.answers.displayAll = true;
e99c53fb 290 this.stage = 4;
29c8b391
BA
291 socket.disconnect();
292 socket = null;
e99c53fb
BA
293 },
294 },
295});