Prepare monitoring using Statements component (early draft stage)

[qomet.git] / public / javascripts / monitor.js

diff --git a/public/javascripts/monitor.js b/public/javascripts/monitor.js
index 1d32d0c..9f43ce0 100644 (file)
--- a/public/javascripts/monitor.js
+++ b/public/javascripts/monitor.js
@@ -1,5 +1,3 @@
-// UNIMPLEMENTED
-
 // TODO: onglets pour chaque groupe + section déroulante questionnaire (chargé avec réponses)
 //   NOM Prenom (par grp, puis alphabétique)
 //   réponse : vert si OK (+ choix), rouge si faux, gris si texte (clic pour voir)
@@ -10,19 +8,8 @@
 
 // Also buttons "start exam", "end exam" for logged in teacher
 
-// TODO: réutiliser le component... trouver un moyen
-
 let socket = null; //monitor answers in real time
 
-function libsRefresh()
-{
-       // Run Prism + MathJax on questions text
-       $("#statements").find("code[class^=language-]").each( (i,elem) => {
-               Prism.highlightElement(elem);
-       });
-       MathJax.Hub.Queue(["Typeset",MathJax.Hub,"statements"]);
-}
-
 new Vue({
        el: "#monitor",
        data: {
@@ -32,145 +19,6 @@ new Vue({
                //       1: authenticated (password hash validated), start monitoring
                stage: 0,
        },
-       components: {
-               "statements": {
-                       props: ['assessment','inputs','student','stage'],
-                       // TODO: general render function for nested exercises
-                       // There should be a questions navigator below, or next (visible if display=='all')
-                       // Full questions tree is rendered, but some parts hidden depending on display settings
-                       render(h) {
-                               let self = this;
-                               let questions = (assessment.questions || [ ]).map( (q,i) => {
-                                       let questionContent = [ ];
-                                       questionContent.push(
-                                               h(
-                                                       "div",
-                                                       {
-                                                               "class": {
-                                                                       wording: true,
-                                                               },
-                                                               domProps: {
-                                                                       innerHTML: q.wording,
-                                                               },
-                                                       }
-                                               )
-                                       );
-                                       let optionsOrder = _.range(q.options.length);
-                                       if (!q.fixed)
-                                               optionsOrder = _.shuffle(optionsOrder);
-                                       let optionList = [ ];
-                                       optionsOrder.forEach( idx => {
-                                               let option = [ ];
-                                               option.push(
-                                                       h(
-                                                               "input",
-                                                               {
-                                                                       domProps: {
-                                                                               checked: this.inputs.length > 0 && this.inputs[i][idx],
-                                                                       },
-                                                                       attrs: {
-                                                                               id: this.inputId(i,idx),
-                                                                               type: "checkbox",
-                                                                       },
-                                                                       on: {
-                                                                               change: e => { this.inputs[i][idx] = e.target.checked; },
-                                                                       },
-                                                               },
-                                                       )
-                                               );
-                                               option.push(
-                                                       h(
-                                                               "label",
-                                                               {
-                                                                       domProps: {
-                                                                               innerHTML: q.options[idx],
-                                                                       },
-                                                                       attrs: {
-                                                                               "for": this.inputId(i,idx),
-                                                                       },
-                                                               }
-                                                       )
-                                               );
-                                               optionList.push(
-                                                       h(
-                                                               "div",
-                                                               {
-                                                                       "class": {
-                                                                               option: true,
-                                                                               choiceCorrect: this.stage == 4 && assessment.questions[i].answer.includes(idx),
-                                                                               choiceWrong: this.stage == 4 && this.inputs[i][idx] && !assessment.questions[i].answer.includes(idx),
-                                                                       },
-                                                               },
-                                                               option
-                                                       )
-                                               );
-                                       });
-                                       questionContent.push(
-                                               h(
-                                                       "div",
-                                                       {
-                                                               "class": {
-                                                                       optionList: true,
-                                                               },
-                                                       },
-                                                       optionList
-                                               )
-                                       );
-                                       return h(
-                                               "div",
-                                               {
-                                                       "class": {
-                                                               "question": true,
-                                                               "hide": this.stage == 2 && assessment.display == 'one' && assessment.indices[assessment.index] != i,
-                                                       },
-                                               },
-                                               questionContent
-                                       );
-                               });
-                               if (this.stage == 2)
-                               {
-                                       questions.unshift(
-                                               h(
-                                                       "button",
-                                                       {
-                                                               "class": {
-                                                                       "waves-effect": true,
-                                                                       "waves-light": true,
-                                                                       "btn": true,
-                                                               },
-                                                               style: {
-                                                                       "display": "block",
-                                                                       "margin-left": "auto",
-                                                                       "margin-right": "auto",
-                                                               },
-                                                               on: {
-                                                                       click: () => this.sendAnswer(assessment.indices[assessment.index]),
-                                                               },
-                                                       },
-                                                       "Send"
-                                               )
-                                       );
-                               }
-                               return h(
-                                       "div",
-                                       {
-                                               attrs: {
-                                                       id: "statements",
-                                               },
-                                       },
-                                       questions
-                               );
-                       },
-                       mounted: function() {
-                               libsRefresh();
-                       },
-                       methods: {
-                               inputId: function(i,j) {
-                                       return "q" + i + "_" + "input" + j;
-                               },
-                       },
-               },
-       },
        methods: {
                // stage 0 --> 1
                startMonitoring: function() {