wip #6182 @2:30

diff --git a/app/Elearning/QuizCompiler.php b/app/Elearning/QuizCompiler.php
index 042a45e490bce179ebb7965d7eefc21fae661f64..ce5e43fa02e29fe57e3c8678ccf44f3f7aa2f8d2 100644 (file)
--- a/app/Elearning/QuizCompiler.php
+++ b/app/Elearning/QuizCompiler.php
@@ -114,9 +114,11 @@ class QuizCompiler extends Base
         $this->sassVariables['font'] = $this->_font($this->theme->font);
         // Colors
         $this->sassVariables['neutral-color'] = $this->theme->neutralColor;
+        $this->sassVariables['ok-color'] = $this->theme->okColor;
+        $this->sassVariables['nok-color'] = $this->theme->nokColor;
         // Breakpoints
         $this->sassVariables['breakpoints'] = "(sm: (min: '576px',max: '575.98px') , md: (min: '768px',max: '767.98px'), lg: (min: '1024px',max: '1023.98px' ), xl: (min: '1200px', max: '1199.98px'))";
-        // Fonts size
+        // Fonts size:Line Height
         $this->sassVariables['fonts-size'] = "(14: 20px, 16: 22px, 20: 28px, 24: 35px)";
 
         $this->writeSass();

diff --git a/resources/quizv2/js/quiz.js b/resources/quizv2/js/quiz.js
index 55532693221ca547663986e20dd15d76f4d3ad57..397076b7cb8b53058830d36b715905b95747e1ce 100644 (file)
--- a/resources/quizv2/js/quiz.js
+++ b/resources/quizv2/js/quiz.js
@@ -74,6 +74,7 @@ Quiz.prototype = {
         })
 
         // Préparer les réponses du joueur dans l'objet this.responses
+        // à chaque fois que le formulaire change de valeur
         $(document).on("change", ".active-screen form", function(e) {
             $this.responses = []
             $(this).find("input:checked").each(function() {
@@ -167,7 +168,7 @@ Quiz.prototype = {
                 }else {
                     this.animationValidation("NOK")
                 }
-                return false
+                this.displayResult(validated.status[position].answers)
             }
             return false
         }
@@ -181,6 +182,21 @@ Quiz.prototype = {
             selector.removeClass("active")
             selector.empty()
         }, 10000)
+    },
+
+    displayResult: function(datas) {
+        for(let k in datas) {
+            let n = (parseInt(k) + 1)
+            let icon = getSpriteIcon("quiz-ok")
+            let $el = $(".active-screen .question-multiple .list-item:nth-of-type("+n+")")
+            $el.addClass(datas[k])
+            if(datas[k] !== "ok") {
+                icon = getSpriteIcon("quiz-wrong")
+            }
+            if(datas[k] !== "neutral") {
+                $el.find(".access").addClass(datas[k]).html(icon)
+            }
+        }
     }
 }
 

diff --git a/resources/quizv2/style/100-global.sass b/resources/quizv2/style/100-global.sass
index 445e7dc3544c5d7edd9bf0cdb6c96090006b3ae1..4949f7cc5f2a5157250dd17c180f3531e77a1a30 100644 (file)
--- a/resources/quizv2/style/100-global.sass
+++ b/resources/quizv2/style/100-global.sass
@@ -43,12 +43,28 @@ body
         max-width: 177px
 
 .access
+    width: 100%
+    max-width: 34px
+    height: 34px
     border-radius: 4px
-    padding: 6px 12px
     +font-size(16)
     +opacity(.16)
     text-transform: uppercase
     margin-left: 16px
+    +flex-config(center,false,false,center)
+    &.space
+        max-width: 70px
+    &.infos
+        max-width: 40px
+    &.ok
+        +opacity(.24, background-color, $ok-color)
+    &.nok
+        +opacity(.24, background-color, $nok-color)
+    &.ok,
+    &.nok
+        svg
+            width: 15px
+            height: 15px
 
 .screen
     position: relative

diff --git a/resources/quizv2/style/103-question-multiple.sass b/resources/quizv2/style/103-question-multiple.sass
index 073676504ef9c92b697b5d2817bb7269a580ae52..866041139f287b1396fed5e884a8d45cb57d5608 100644 (file)
--- a/resources/quizv2/style/103-question-multiple.sass
+++ b/resources/quizv2/style/103-question-multiple.sass
@@ -16,6 +16,14 @@
                 border: 2px solid rgba($texts-color, .24)
                 position: relative
                 overflow: hidden
+                &.ok
+                    //
+                &.nok
+                    //
+                &.neutral
+                    //
+                &.missed
+                    //
                 *
                     z-index: 1
 

diff --git a/resources/views/quizv2/footer.blade.php b/resources/views/quizv2/footer.blade.php
index 24a2f540d60a38ad0874990babae5e88d264250c..5f8ab494c6c18d189cf2f50e3620a15533aa5ed2 100644 (file)
--- a/resources/views/quizv2/footer.blade.php
+++ b/resources/views/quizv2/footer.blade.php
@@ -3,11 +3,11 @@
         <a class="btn secondary reset">
             Reset
             <span class="access">R</span>
-        </>
+        </a>
     @endisset
     <a class="btn primary action">
         {{$text}}
-        <span class="access">space</span>
+        <span class="access space">space</span>
         @isset($time)
             <span data-icon="running-man"></span>
         @endisset
@@ -15,7 +15,7 @@
     @isset($info)
         <a class="btn secondary">
             More infos
-            <span class="access">F1</span>
+            <span class="access infos">F1</span>
         </a>
     @endisset
 </footer>