]> _ Git - fluidbook-toolbox.git/commitdiff
fix #3949 @0.5
authorVincent Vanwaelscappel <vincent@cubedesigners.com>
Tue, 13 Oct 2020 17:48:15 +0000 (19:48 +0200)
committerVincent Vanwaelscappel <vincent@cubedesigners.com>
Tue, 13 Oct 2020 17:48:15 +0000 (19:48 +0200)
app/Models/Quiz.php
app/Models/QuizTranslation.php
resources/quiz/js/main.js
resources/quiz/style/030-quiz.less
resources/quiz/style/style.css

index 571a2164601b9819425dcdd2a1d99756da2f62a3..77947992ea88530b2abad32b85b762f59a4670d7 100644 (file)
@@ -146,6 +146,13 @@ class Quiz extends CubistMagicAbstractModel
             'default' => true,
             'tab' => 'Settings']);
 
+        $this->addField(['name' => 'restart_button',
+            'label' => 'Add a restart button when quiz is failed',
+            'type' => 'Checkbox',
+            'default' => false,
+            'tab' => 'Settings',
+        ]);
+
         $this->addField(['name' => 'logattempts',
             'label' => 'Enable logging of users attempts',
             'hint' => 'All users attempts will be sent to the toolbox server',
@@ -219,6 +226,7 @@ class Quiz extends CubistMagicAbstractModel
         $xml->addChild('id', $data->get('id'));
         $xml->addChild('title', $data->get('title'));
         $xml->addChild('threshold', $data->get('threshold', '0') ?: '0');
+        $xml->addChild('restart_button', $data->get('restart_button', '0') ? '1' : '0');
         $xml->addChild('instantReview', $data->get('instantReview', true) ? '1' : '0');
         $xml->addChild('review', $data->get('review', true) ? '1' : '0');
         $xml->addChild('logattempts', $data->get('logattempts', false) ? '1' : '0');
index 557812ca5098132a1d19237596dd06efc360d727..b5001a64a1facd46f5f76eb39853e98cdc4acb2a 100644 (file)
@@ -17,7 +17,8 @@ class QuizTranslation extends CubistMagicAbstractModel
         'reviewAnswer' => 'Review answers',
         'question' => 'Question %d:',
         'totalQuestions' => 'Total questions:',
-        'correctAnswers' => 'Correct answers:'];
+        'correctAnswers' => 'Correct answers:',
+        'restartQuiz' => 'Restart the quiz'];
 
     public function setFields()
     {
index f1960d4a21d8716236fa2e0e630b88b542bb616a..ab3b592d9cee710758101481451a0808a6dec365 100644 (file)
                 question += '<div class="answers">';
                 question += '</div>';
                 if (multiple) {
-                    question += '<a href="#" class="validatemulti">' + getTranslation('validateAnswer') + '</a>';
+                    question += '<a href="#" class="button validatemulti">' + getTranslation('validateAnswer') + '</a>';
                 } else if (type !== 'multiple') {
-                    question += '<a href="#" class="validatemulti">' + getTranslation('validateAnswerSingular') + '</a>';
+                    question += '<a href="#" class="button validatemulti">' + getTranslation('validateAnswerSingular') + '</a>';
                 }
                 question += '</section>';
 
                 '<h2 class="defaultMessage">' + defaultMessage + '</h2>' +
                 '<h2 class="passedMessage">' + passedMessage + '</h2>' +
                 '<h2 class="failedMessage">' + failedMessage + '</h2>' +
-                '<div class="content">' + getTranslation('totalQuestions') + ' <span id="totalquestions">' + countQuestions + '</span><br />' + getTranslation('correctAnswers') + ' <span id="correctanswers"></span></div></div></section>');
+                '<div class="content">' + getTranslation('totalQuestions') + ' <span id="totalquestions">' + countQuestions + '</span><br />' + getTranslation('correctAnswers') + ' <span id="correctanswers"></span></div></div>' +
+                '<a href=""  id="restart" class="button">' + getTranslation('restartQuiz') + '</a>' +
+                '</section>');
             $(results).append(correction);
 
             $("main").append(results);
 
             $(document).on('quizinit', function (event, state) {
-                init(state)
+                init(state);
             });
             initScormEvents();
             resizeContainer();
             var normalizedScore = score / countQuestions;
             $('#results > h2').hide();
             var passed;
+            $('#restart').hide();
             if (threshold === 0) {
                 $('.defaultMessage').show();
                 passed = true;
                 $('.failedMessage').show();
                 execAction(failedAction);
                 passed = false;
+                if ($(data).find('restart_button').text() === "1") {
+                    $('#restart').show();
+                }
             }
             return passed;
         }
                             a.push($(this).data('a'))
                         }
                     });
-                    console.log(this_score, min_score);
                     ok = this_score >= min_score;
                     answers.push(a);
                     log.anwser = a;
index 807199382a697de88febadbd96de633c198f33f2..f433b3fd54e54cc13fc36d549d664890c23f4814 100644 (file)
 // main: ../style/style.less
 
 main {
-  width: 100%;
-  max-width: 800px;
-  margin: 0 auto -50px;
-  position: relative;
+    width: 100%;
+    max-width: 800px;
+    margin: 0 auto -50px;
+    position: relative;
 }
 
 section {
-  display: none;
-  position: absolute;
-  width: 100%;
-  top: 0;
-  padding: 0 40px 0 40px;
-
-  @media @m640{
-    padding: 0 30px 0 30px;
-  }
-
-  @media @m480{
-    padding: 0 20px 0 20px;
-  }
-}
-
-.question {
+    display: none;
+    position: absolute;
+    width: 100%;
+    top: 0;
+    padding: 0 40px 0 40px;
 
-  .label {
-    font-size: 20px;
     @media @m640 {
-      font-size: 16px;
-      line-height: 1.4em;
+        padding: 0 30px 0 30px;
     }
 
-    h3 {
-      font-family: @font-condensed;
-      font-size: 100%;
-      font-weight: 700;
-      margin-bottom: 10px;
-      display: inline;
-      @media @m640 {
-        font-size: 21px;
-      }
-
-      @media @m320 {
-        font-size: 21px;
-      }
+    @media @m480 {
+        padding: 0 20px 0 20px;
     }
-  }
+}
 
-  .validatemulti {
+.button {
     color: var(--main-color);
     text-decoration: none;
     font-weight: 700;
     font-size: 22px;
     float: right;
     margin-top: 15px;
-  }
-
-  .answers {
-    margin-top: 30px;
-
-      input[type="text"],input[type="email"],textarea{
-          border:0px;
-          .border-radius(5px);
-          padding: 15px;
-          width: 100%;
-          height: 100%;
-          font-size: 16px;
-          line-height: 1.2em;
-          background-color: @color-answer-back;
-          color: @color-answer-text;
-      }
-
-      textarea{
-          height: 100px;
-      }
-
-    .answer-holder {
-      width: 50%;
-      height: 91px;
-      display: inline-block;
-      vertical-align: top;
-
-      &:nth-child(odd) {
-        padding: 5px 5px 5px 0;
-      }
-
-      &:nth-child(even) {
-        padding: 5px 0 5px 5px;
-      }
-
-      @media @m640 {
-        width: 100%;
-        padding: 5px 0px !important;
-      }
+}
+
+.question {
+
+    .label {
+        font-size: 20px;
+        @media @m640 {
+            font-size: 16px;
+            line-height: 1.4em;
+        }
+
+        h3 {
+            font-family: @font-condensed;
+            font-size: 100%;
+            font-weight: 700;
+            margin-bottom: 10px;
+            display: inline;
+            @media @m640 {
+                font-size: 21px;
+            }
+
+            @media @m320 {
+                font-size: 21px;
+            }
+        }
     }
 
-    .answer {
-      display: flex; /* contexte sur le parent */
-      flex-direction: column; /* direction d'affichage verticale */
-      justify-content: center; /* alignement vertical */
-      padding: 15px;
-      cursor: pointer;
-      width: 100%;
-      height: 100%;
-      font-size: 16px;
-      line-height: 1.2em;
-      background-color: @color-answer-back;
-      color: @color-answer-text;
-      .border-radius(5px);
-      .transition(~"background-color 150ms");
-
-
-      &:hover {
-        background-color: @color-answer-hover;
-      }
-
-      &.active {
-        background-color: var(--main-color) !important;
-      }
-
-      &.inactive {
-        background-color: @color-answer-back !important;
-      }
+    .answers {
+        margin-top: 30px;
+
+        input[type="text"], input[type="email"], textarea {
+            border: 0px;
+            .border-radius(5px);
+            padding: 15px;
+            width: 100%;
+            height: 100%;
+            font-size: 16px;
+            line-height: 1.2em;
+            background-color: @color-answer-back;
+            color: @color-answer-text;
+        }
+
+        textarea {
+            height: 100px;
+        }
+
+        .answer-holder {
+            width: 50%;
+            height: 91px;
+            display: inline-block;
+            vertical-align: top;
+
+            &:nth-child(odd) {
+                padding: 5px 5px 5px 0;
+            }
+
+            &:nth-child(even) {
+                padding: 5px 0 5px 5px;
+            }
+
+            @media @m640 {
+                width: 100%;
+                padding: 5px 0px !important;
+            }
+        }
+
+        .answer {
+            display: flex; /* contexte sur le parent */
+            flex-direction: column; /* direction d'affichage verticale */
+            justify-content: center; /* alignement vertical */
+            padding: 15px;
+            cursor: pointer;
+            width: 100%;
+            height: 100%;
+            font-size: 16px;
+            line-height: 1.2em;
+            background-color: @color-answer-back;
+            color: @color-answer-text;
+            .border-radius(5px);
+            .transition(~"background-color 150ms");
+
+
+            &:hover {
+                background-color: @color-answer-hover;
+            }
+
+            &.active {
+                background-color: var(--main-color) !important;
+            }
+
+            &.inactive {
+                background-color: @color-answer-back !important;
+            }
+        }
     }
-  }
 }
 
 #badge {
-  .badge(220, 4px);
-  display: none;
+    .badge(220, 4px);
+    display: none;
 }
 
 #resultsscreen {
-  font-size: 20px;
-  line-height: 1.3em;
-
-  > div {
-    padding: 60px;
-    background-color: var(--main-color);
-    color: @color-result-text;
-    .border-radius(5px);
-    margin-top: 10px;
-
-    &#correction{
-      @media @m640{
-        padding: 30px 30px 30px 60px;
-      }
-    }
-  }
-
-  #results {
-    text-align: center;
-
-    h2 {
-      font-size: 26px;
-      font-weight: 700;
-      margin: 0px 0 30px;
-      display: none;
+    font-size: 20px;
+    line-height: 1.3em;
+
+    > div {
+        padding: 60px;
+        background-color: var(--main-color);
+        color: @color-result-text;
+        .border-radius(5px);
+        margin-top: 10px;
+
+        &#correction {
+            @media @m640 {
+                padding: 30px 30px 30px 60px;
+            }
+        }
     }
 
-  }
+    #results {
+        text-align: center;
 
-  #correction {
-    background-color: var(--review-background);
-    color: @color-review-text;
+        h2 {
+            font-size: 26px;
+            font-weight: 700;
+            margin: 0px 0 30px;
+            display: none;
+        }
 
-    @media @m640{
-      font-size: 16px;
     }
 
-    .correction {
-      position: relative;
-      padding-left: 40px;
-
-      @media @m640 {
-        padding-left: 20px;
-      }
-
-      .badge {
-        position: absolute;
-        left: -20px;
-        top: 8px;
-        .badge(40, 0);
-        font-weight: 400;
+    #correction {
+        background-color: var(--review-background);
+        color: @color-review-text;
 
         @media @m640 {
-          left: -39px;
+            font-size: 16px;
         }
-      }
 
-      h4 {
-        font-weight: 600;
-        margin-top: 40px;
-        margin-bottom: 10px;
-        @media @m640 {
-          margin-top: 25px;
+        .correction {
+            position: relative;
+            padding-left: 40px;
+
+            @media @m640 {
+                padding-left: 20px;
+            }
+
+            .badge {
+                position: absolute;
+                left: -20px;
+                top: 8px;
+                .badge(40, 0);
+                font-weight: 400;
+
+                @media @m640 {
+                    left: -39px;
+                }
+            }
+
+            h4 {
+                font-weight: 600;
+                margin-top: 40px;
+                margin-bottom: 10px;
+                @media @m640 {
+                    margin-top: 25px;
+                }
+            }
+
         }
-      }
 
-    }
+        h2 {
+            font-size: 26px;
+            color: @color-result-text;
+            text-align: center;
+            font-weight: 700;
+            margin-bottom: 40px;
 
-    h2 {
-      font-size: 26px;
-      color: @color-result-text;
-      text-align: center;
-      font-weight: 700;
-      margin-bottom: 40px;
+            @media @m640 {
+                font-size: 20px;
+            }
+        }
 
-      @media @m640 {
-        font-size: 20px;
-      }
     }
 
-  }
-
 }
index 198b3478a80c452a5d80c8d7d0bc5e2db9cfe5b2..c3fc74203647c67e34ee474f71f9858fdec69535 100644 (file)
@@ -297,6 +297,14 @@ section {
     padding: 0 20px 0 20px;
   }
 }
+.button {
+  color: var(--main-color);
+  text-decoration: none;
+  font-weight: 700;
+  font-size: 22px;
+  float: right;
+  margin-top: 15px;
+}
 .question .label {
   font-size: 20px;
 }
@@ -323,14 +331,6 @@ section {
     font-size: 21px;
   }
 }
-.question .validatemulti {
-  color: var(--main-color);
-  text-decoration: none;
-  font-weight: 700;
-  font-size: 22px;
-  float: right;
-  margin-top: 15px;
-}
 .question .answers {
   margin-top: 30px;
 }