'update'
[qomet.git] / public / javascripts / components / statements.js
index 64057f9..5373e89 100644 (file)
@@ -6,15 +6,19 @@ NOTE: questions can contain parameterized exercises (how ?
 --> write javascript script (OK, users trusted ? ==> safe mode possible if public website)
 Imaginary example: (using math.js)
        <params> (avant l'exo)
-       x: math.random()
-       y: math.random()
-       M: math.matrix([[7, x], [y, -3]]);
-       res: math.det(M)
+       const x = math.random();
+       const y = math.random();
        </params>
+       <result>
+       let M = math.matrix([[7, x], [y, -3]]);
+       return math.det(M);
+       </result>
        <div>Calculer le déterminant de 
-       $$\begin{matrix}7 & x\\y & -3\end{matrix}$$</div>
+       $$\begin{matrix}7 & £x£\\£y£ & -3\end{matrix}$$</div>
        * ...
 
++ fixed + question time (syntax ?)
+
 --> input of type text (number, or vector, or matrix e.g. in R syntax)
 --> parameter stored in question.param (TODO)
 
@@ -24,12 +28,13 @@ Vue.component("statements", {
        // 'inputs': object with key = question index and value = text or boolean array
        // display: 'all', 'one', 'solution'
        // iidx: current level-0 integer index (can match a group of questions / inputs)
-       props: ['questions','inputs','display','iidx'],
+       props: ['questions','inputs','answers','display','iidx'],
        data: function() {
                return {
                        displayStyle: "compact", //or "all": all on same page
+                       parameters: 0, //TODO: DO NOT re-draw parameters for already answered questions
                };
-       }
+       },
        // Full questions tree is rendered, but some parts hidden depending on display settings
        render(h) {
                // Prepare questions groups, ordered
@@ -38,7 +43,9 @@ Vue.component("statements", {
                        const dotPos = q.index.indexOf(".");
                        return dotPos === -1 ? q.index : q.index.substring(0,dotPos);
                });
-               let domTree = questionGroups.map( (qg,i) => {
+               let domTree = Object.keys(questionGroups).map( idx => {
+                       let qg = questionGroups[idx];
+                       const i = parseInt(idx);
                        // Re-order questions 1.1.1 then 1.1.2 then...
                        const orderedQg = qg.sort( (a,b) => {
                                let aParts = a.split('.').map(Number);
@@ -91,8 +98,8 @@ Vue.component("statements", {
                                                                "input",
                                                                {
                                                                        domProps: {
-                                                                               checked: this.inputs[q.index][idx],
-                                                                               disabled: monitoring,
+                                                                               checked: !!this.inputs && this.inputs[q.index][idx],
+                                                                               disabled: monitoring || this.display == "solution",
                                                                        },
                                                                        attrs: {
                                                                                id: this.inputId(q.index,idx),
@@ -118,14 +125,15 @@ Vue.component("statements", {
                                                                }
                                                        )
                                                );
+                                               const aIdx = (this.answers || [ ]).findIndex( item => { return item.index == q.index; });
                                                optionList.push(
                                                        h(
                                                                "div",
                                                                {
                                                                        "class": {
                                                                                option: true,
-                                                                               choiceCorrect: this.display == "solution" && q.answer.includes(idx),
-                                                                               choiceWrong: this.display == "solution" && this.inputs[q.index][idx] && !q.answer.includes(idx),
+                                                                               choiceCorrect: this.display == "solution" && this.answers[aIdx].includes(idx),
+                                                                               choiceWrong: this.display == "solution" && !!this.inputs && this.inputs[q.index][idx] && !this.answers[aIdx].includes(idx),
                                                                        },
                                                                },
                                                                option
@@ -144,13 +152,17 @@ Vue.component("statements", {
                                                )
                                        );
                                }
+                               else
+                               {
+                                       // Open question, or parameterized: TODO
+                               }
                                const depth = (q.index.match(/\./g) || []).length;
                                return h(
                                        "div",
                                        {
                                                "class": {
                                                        "question": true,
-                                                       "depth" + depth: true,
+                                                       ["depth" + depth]: true,
                                                },
                                        },
                                        questionContent
@@ -163,7 +175,7 @@ Vue.component("statements", {
                                                "questionGroup": true,
                                                "hide": this.display == "one" && this.iidx != i,
                                        },
-                               }
+                               },
                                qgDom
                        );
                });