From: Benjamin Auder <benjamin.auder@somewhere>
Date: Tue, 13 Feb 2018 11:23:16 +0000 (+0100)
Subject: Fix monitoring presence (TODO: weird Vue syntax...)
X-Git-Url: https://git.auder.net/variants/current/css/doc/screen_pairings_new.png?a=commitdiff_plain;h=f87ac54a07e9cc63a28b8eae42fa6ab23ac626d0;p=qomet.git

Fix monitoring presence (TODO: weird Vue syntax...)
---

diff --git a/public/javascripts/monitor.js b/public/javascripts/monitor.js
index b5a0fe4..6ee6a41 100644
--- a/public/javascripts/monitor.js
+++ b/public/javascripts/monitor.js
@@ -42,15 +42,17 @@ new Vue({
 		groupId: function(group, prefix) {
 			return (prefix || "") + "group" + group;
 		},
-		togglePresence: function(s) {
-			s.present = !s.present;
+		togglePresence: function(student) {
+			const sIdx = this.students.findIndex( s => { return s.number == student.number; });
+			Vue.set( this.students, sIdx, Object.assign({},student,{present:!student.present}) );
+			//s.present = !s.present;
 		},
 		allFinished: function() {
 			for (s of this.students)
 			{
 				if (!s.present)
 					continue;
-				const paperIdx = this.assessment.papers.findIndex( item => { return item.number == number; });
+				const paperIdx = this.assessment.papers.findIndex( item => { return item.number == s.number; });
 				if (paperIdx === -1)
 					return false;
 				const paper = this.assessment.papers[paperIdx];
diff --git a/public/stylesheets/monitor.css b/public/stylesheets/monitor.css
index 20406b3..b22b317 100644
--- a/public/stylesheets/monitor.css
+++ b/public/stylesheets/monitor.css
@@ -52,3 +52,8 @@ table.in-question th, table.in-question td {
 /*table { border: none; border-collapse: collapse; }*/
 table.in-question td { border-left: 1px solid grey; }
 table.in-question td:first-child { border-left: none; }
+
+.absent {
+	opacity: 0.5;
+	background-color: lightgrey;
+}
diff --git a/views/monitor.pug b/views/monitor.pug
index 00bf476..b3da2d6 100644
--- a/views/monitor.pug
+++ b/views/monitor.pug
@@ -30,7 +30,7 @@ block content
 									th Name
 									th(v-for="(q,i) in assessment.questions") Q.{{ (i+1) }}
 							tbody
-								tr.assessment(v-for="s in studentList(group)")
+								tr.assessment(v-for="s in studentList(group)" :class="{absent:!s.present}")
 									td(:class="{blur:!!s.blur,resize:!!s.resize,disconnect:!!s.disco}" @click="togglePresence(s)") {{ s.name }}
 									td(v-for="(q,i) in assessment.questions" :style="{backgroundColor: getColor(s.number,i)}" @click="seeDetails(s.number,i)") &nbsp;
 					h4.title(@click="toggleDisplay('assessment')") Assessment