]> _ Git - fluidbook-toolbox-quiz.git/commitdiff
wait #6370 @0.75
authorVincent Vanwaelscappel <vincent@cubedesigners.com>
Mon, 16 Oct 2023 08:12:10 +0000 (10:12 +0200)
committerVincent Vanwaelscappel <vincent@cubedesigners.com>
Mon, 16 Oct 2023 08:12:10 +0000 (10:12 +0200)
js/quiz.score.js
js/quiz.screen.outro.js
style/105-outro.sass

index 650ad69ebab301b6143d24158cb555870447c7ba..05b45debfef9770e204a912d4fa235acec32c108 100644 (file)
@@ -195,6 +195,10 @@ QuizScore.prototype = {
         this.quiz.data.questions.length;
     },
 
+    hasScore: function () {
+        return this.getQuestionsCount(true) > 0;
+    },
+
     getCurrentState: function () {
         return {
             q: this.lastAnsweredQuestion, a: this.answers
index 936d1d8c643637cfcc7bad48f58c980139c1f195..d0cd031d7b7eaf79860e9b8aaf277f9220c960cb 100644 (file)
@@ -86,33 +86,42 @@ QuizScreenOutro.prototype = {
             text: this.quiz.l10n.__("Unfortunately, you did not get enough correct answers (:score out of :maxScore).", {
                 'score': score,
                 'maxScore': maxScore
-            }) + " " + this.quiz.l10n.__("Please go back and review the content before retaking the quiz.")
-        }
+            }) + " " + this.quiz.l10n.__("Please go back and review the content before retaking the quiz."),
+            showCircle: true,
+            confetti: 'CONFETTI_LOSE',
+            status: 'nok',
+        };
         let ok = {
             title: this.quiz.l10n.__("Congratulation!"),
             text: this.quiz.l10n.__("You have completed the quiz with :score correct answers out of :maxScore", {
                 'score': score,
                 'maxScore': maxScore
-            })
+            }),
+            showCircle: true,
+            confetti: 'CONFETTI_WIN',
+            status: 'ok',
+        };
+        let neutral = {
+            title: this.quiz.l10n.__('Thank you for your answers!'),
+            text: '',
+            showCircle: false,
+            confetti: false,
+            status: 'neutral',
         }
-        let counter = $("#container-score")
         let percent = (score / maxScore) * 100
-        let animConfetti = '';
 
-        if (quiz.score.isPassed() === false) {
-            animConfetti = 'CONFETTI_LOSE';
-            this.displayResultContent(nok, "nok", counter)
+        let content;
+        if (!quiz.score.hasScore()) {
+            content = neutral;
+        } else if (quiz.score.isPassed() === false) {
+            content = nok;
         } else {
-            animConfetti = 'CONFETTI_WIN';
-            this.displayResultContent(ok, "ok", counter)
+            content = ok;
         }
 
-        //
-        setTimeout(function () {
-            return $this.animeConfetti(animConfetti);
-        }, 2500);
+        this.displayResultContent(content);
 
-        $("[id^=score-]").text(score)
+        $("[id^=score-]").text(score);
         $("[id^=maxScore-]").text(maxScore);
 
         this.quiz.score.runEndAction();
@@ -142,10 +151,23 @@ QuizScreenOutro.prototype = {
         }
     },
 
-    displayResultContent: function (result, status, counter) {
+    displayResultContent: function (result) {
+        const $this = this;
         $(".score-text h1").text(result.title)
         $(".score-text p").text(result.text)
-        counter.addClass(status)
+        $("#container-score").addClass(result.status);
+        $("#container-score").parent().addClass(result.status);
+        $("#container-score").parent().parent().addClass(result.status);
+
+        if (result.confetti) {
+            setTimeout(function () {
+                return $this.animeConfetti(result.confetti);
+            }, 2500);
+        }
+
+        if (!result.showCircle) {
+
+        }
     },
 
     displayReviewList: function () {
index 414d7691b8423626de221b56ab7bd5f4e2f6769e..0e3d9da7b228a3e994174933b2f12ba2b911ea34 100644 (file)
@@ -8,6 +8,7 @@
     .subtitle
         +opacity(.8, color, $texts-color)
 
+
     h1,
     .score-text .subtitle .word,
     .restart-sentence-mobile,
         position: relative
         z-index: 1
 
+        &.neutral
+            .restart, .toggle-answers-review, .restart-sentence, .restart-sentence-mobile
+                display: none !important
+
         &.full
             .score-content-wrapper
                 max-width: 60%
         top: var(--space-21-66)
         margin-left: 75px
 
+        &.neutral
+            .score-text
+                width: 100%
+
+                h1
+                    text-align: center
+
     &-counter
         height: 0
         padding-bottom: 31%
@@ -65,6 +77,9 @@
                 fill: $ok-color
                 stroke: $ok-color
 
+        &.neutral
+            display: none
+
         #progress-counter
             width: 100%
             height: 100%
     .area-title
         display: grid
         grid-template-columns: 2fr 2fr
+
         p
             width: 50%