fix started classes

client/Answer.jsx

@@ -4,76 +4,77 @@ import Markdown from './Markdown';
 const seed = Math.floor(Math.random() * 100000);
 
 function shuffled(a) {
-    a = a.slice();
-    for (let i = a.length - 1; i > 0; i--) {
-        const j = (seed * i * 13) % (i + 1);
-        [a[i], a[j]] = [a[j], a[i]];
-    }
-    return a;
+  a = a.slice();
+  for (let i = a.length - 1; i > 0; i--) {
+    const j = (seed * i * 13) % (i + 1);
+    [a[i], a[j]] = [a[j], a[i]];
+  }
+  return a;
 }
 
 
-export default ({type, value, slideId}) =>  (state, actions) => {
+export default ({ type, value, slideId }) => (state, actions) => {
   let currentAnswer = (state.free ? state.userAnswers[slideId] : state.answer) || '';
   if (state.kind == 'OFFLINE') {
     currentAnswer = state.offlineAnswers[slideId] || '';
   }
-  switch(type) {
+  switch (type) {
     case 'choice':
-    {
-      let answers = {};
-      currentAnswer
-        .split(' & ')
-        .filter(a => a)
-        .forEach(a => answers[a] = true);
-        
-      return <div>{shuffled(value).map((v, i) => <div class="custom-control custom-radio" key={i}>
-            <input 
-             disabled={state.free || state.finished}
-             class="custom-control-input" id={'check-'+i} name={slideId} type='radio' checked={answers[v]?'checked':''}
-              onclick={(e) => {
-                if(e.target.checked)
-                  actions.setAnswer(v)
-                }
-              } />
+      {
+        let answers = {};
+        currentAnswer
+          .split(' & ')
+          .filter(a => a)
+          .forEach(a => answers[a] = true);
+
+        return <div>{shuffled(value).map((v, i) => <div class="custom-control custom-radio" key={i}>
+          <input
+            disabled={state.kind != 'OFFLINE' && (state.free || state.finished)}
+            class="custom-control-input" id={'check-' + i} name={slideId} type='radio' checked={answers[v] ? 'checked' : ''}
+            onclick={(e) => {
+              if (e.target.checked)
+                actions.setAnswer(v)
+            }
+            } />
 
-          <label for={'check-'+i}  class="custom-control-label">
+          <label for={'check-' + i} class="custom-control-label">
             <Markdown value={v} />
           </label>
         </div>
-      )}</div>
-    }
+        )}</div>
+      }
     case 'choices':
       let answers = {};
       currentAnswer
         .split(' & ')
         .filter(a => a)
         .forEach(a => answers[a] = true);
-        
+
       return <div>{shuffled(value).map((v, i) => <div class="custom-control custom-checkbox" key={i}>
-          <input  class="custom-control-input" id={'check-'+i} type='checkbox'
-            checked={answers[v]?'checked':''}
-            disabled={state.free || state.finished}
-            onclick={(e) => {
-              if(e.target.checked) {
-                answers[v] = true;
-              } else {
-                delete answers[v];
-              }
-              actions.setAnswer(
-                Object.keys(answers).sort().join(' & ')
-              )}
-            } />
-          <label for={'check-'+i}  class="custom-control-label">
-            <Markdown value={v} />
-          </label>
-        </div>
+        <input class="custom-control-input" id={'check-' + i} type='checkbox'
+          checked={answers[v] ? 'checked' : ''}
+          disabled={state.kind != 'OFFLINE' && (state.free || state.finished)}
+          onclick={(e) => {
+            if (e.target.checked) {
+              answers[v] = true;
+            } else {
+              delete answers[v];
+            }
+            actions.setAnswer(
+              Object.keys(answers).sort().join(' & ')
+            )
+          }
+          } />
+        <label for={'check-' + i} class="custom-control-label">
+          <Markdown value={v} />
+        </label>
+      </div>
       )}</div>
     case 'input':
       return <div class="form-group">
         <label for='input'>Réponse</label>
         <input
-          disabled={state.free || state.finished}
+          disabled={state.kind != 'OFFLINE' && (state.free || state.finished)}
           id='input'
           type="text"
           class="form-control"

client/Question.jsx

@@ -6,53 +6,55 @@ import Markdown from './Markdown';
 
 
 
-export const Progress = ({start, end}) => {
-  return <div class="progress" style={{height:'3px'}}>
-    <div class="progress-bar bg-success" 
-      role="progressbar" 
+export const Progress = ({ start, end }) => {
+  return <div class="progress" style={{ height: '3px' }}>
+    <div class="progress-bar bg-success"
+      role="progressbar"
       id='progress-bar'
-      oncreate={(e) => {e.myInterval = setInterval(() => {
-        const start = e.getAttribute('data-start');
-        const end = e.getAttribute('data-end');
-        const per = Date.now() > end ? '0%' : ((end - Date.now()) / (end - start) * 100)+'%';
-        e.style.width = per
-      }, 200) }}
-      ondestroy={(e) => {clearInterval(e.myInterval); }}
+      oncreate={(e) => {
+        e.myInterval = setInterval(() => {
+          const start = e.getAttribute('data-start');
+          const end = e.getAttribute('data-end');
+          const per = Date.now() > end ? '0%' : ((end - Date.now()) / (end - start) * 100) + '%';
+          e.style.width = per
+        }, 200)
+      }}
+      ondestroy={(e) => { clearInterval(e.myInterval); }}
       data-start={start}
       data-end={end}
-      style={{width: Date.now() > end ? '0%' : ((end - Date.now()) / (end - start) * 100)+'%'}}>
+      style={{ width: Date.now() > end ? '0%' : ((end - Date.now()) / (end - start) * 100) + '%' }}>
     </div>
   </div>
 }
 
 
-export default ({slide, slideId, confirmed, confirming}) => (state,actions) => {
-    
-  if(!slide) {
-      return <div><h3>En attente du slide</h3></div>;
+export default ({ slide, slideId, confirmed, confirming }) => (state, actions) => {
+
+  if (!slide) {
+    return <div><h3>En attente du slide</h3></div>;
   }
-  
-  if(!slide.type) {
+
+  if (!slide.type) {
     return <Markdown value={slide.question} />
   }
-  
-  let btnClass = 'btn '+(confirmed || state.finished?'btn-primary':'btn-warning');
+
+  let btnClass = 'btn ' + (confirmed || state.finished ? 'btn-primary' : 'btn-warning');
   return <div>
     {!!state.questionEndsAt && <Progress start={state.questionStartsAt} end={state.questionEndsAt} />
     }
     <Markdown value={slide.question} />
     <form onsubmit={e => {
-      e.preventDefault(); 
-      actions.confirmAnswer({slideId, answer: state.answer}); 
-    } }>
+      e.preventDefault();
+      actions.confirmAnswer({ slideId, answer: state.answer });
+    }}>
       <Answer slideId={slideId} type={slide.type} value={slide.value} />
       <div class="form-group">
-        <button disabled={state.finished || state.free || confirming?'disabled':''} 
-          type="submit" 
+        <button disabled={(state.kind != 'OFFLINE' && (state.finished || state.free)) || confirming ? 'disabled' : ''}
+          type="submit"
           class={btnClass}>
-          {confirming ? 'Confirmation...' : (confirmed?'Confirmé':'Confirmer')}
+          {confirming ? 'Confirmation...' : (confirmed ? 'Confirmé' : 'Confirmer')}
         </button>
       </div>
     </form>
   </div>
-}
\ No newline at end of file
+}

server/class.js

@@ -429,7 +429,7 @@ X no\n';
           socket.emit('error', 'The qcm is over');
           return;
         }
-      } else if (self.info.finished || !self.info.started) {
+      } else if (self.info.kind == 'LIVE' && (self.info.finished || !self.info.started)) {
         socket.emit('error', 'The qcm has not started yet or is finished');
         LOG.error(socket, 'answer sent before starting the qcm or after it is finished');
         return; // ignore answers when the questions are over or not started