From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Wed, 11 Oct 2023 12:25:26 +0000 (+0200)
Subject: wip #6385 @0.25
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=658f9f9ac9f5746f7ff9cd6b55ba1ab000e4bbc3;p=fluidbook-toolbox-quiz.git

wip #6385 @0.25
---

diff --git a/js/quiz.screen.outro.js b/js/quiz.screen.outro.js
index 8978135..f1d7342 100644
--- a/js/quiz.screen.outro.js
+++ b/js/quiz.screen.outro.js
@@ -1,7 +1,6 @@
 import gsap from "gsap";
 import SimpleBar from 'simplebar'
 import 'simplebar/dist/simplebar.css'
-import Handlebars from "handlebars";
 import SplitType from 'split-type';
 import {DrawSVGPlugin} from "gsap/DrawSVGPlugin.js";
 
@@ -14,9 +13,13 @@ function QuizScreenOutro(screens) {
 
 QuizScreenOutro.prototype = {
     initEvents: function () {
+        const $this = this;
         $(document).on("click", ".toggle-answers-review", function () {
             $(".score-answers-review_container").toggleClass("active")
-        })
+        });
+        $(document).on('click', '.btn.restart', function () {
+            $this.quiz.restart();
+        });
     },
 
     animate: function (score, percent) {
@@ -141,7 +144,10 @@ QuizScreenOutro.prototype = {
     },
 
     displayReviewList: function () {
-        let $ul = $("#answers-list")
+        let $ul = $("#answers-list");
+        if ($ul.length === 0) {
+            return;
+        }
         let reviewList = this.quiz.question.getAll();
         let status = this.quiz.score.questionStatus
 
@@ -155,20 +161,18 @@ QuizScreenOutro.prototype = {
             }
         })
 
-        //
-        // HANDLEBARS TEMPLATING
-        //
-        // on applique une incrementation de +1
-        // utilisé pour la numérotation des questions
-        Handlebars.registerHelper("inc", (value) => {
-            return parseInt(value) + 1;
-        });
-
-        // on envoie le html avec les nouvelles données
-        const source = $("#template-answers-review").html();
-        const template = Handlebars.compile(source);
-        const html = template({reviewList: reviewList});
-        $ul.html(html)
+        let html = '';
+        for (var i in reviewList) {
+            let review = reviewList[i];
+            html += '<li class="item ' + review.status + '">';
+            html += '<p class="position">' + this.quiz.l10n.__('Question :index', {index: i + 1}) + '</p>';
+            html += '<p class="question">' + review.question + '</p>';
+            for (var j in review.answers) {
+                html += '<p class="answer">' + review.answers[j].answer + '</p>';
+            }
+            html += '</li>';
+        }
+        $ul.html(html);
 
         // mise en place de la scrollbar personnalisé
         // https://github.com/Grsmto/simplebar/tree/master/packages/simplebar
diff --git a/views/screens/outro.blade.php b/views/screens/outro.blade.php
index fa5ef9b..f21a3b7 100644
--- a/views/screens/outro.blade.php
+++ b/views/screens/outro.blade.php
@@ -26,7 +26,8 @@
                                 }
                             </style>
                             <circle id="circle" class="circle" cx="74" cy="74" r="70"/>
-                            <circle id="progress-circle" class="progress-circle" cx="74" cy="74" r="70" stroke="currentColor"/>
+                            <circle id="progress-circle" class="progress-circle" cx="74" cy="74" r="70"
+                                    stroke="currentColor"/>
                         </svg>
                     </div>
                     <div id="anime-result">
@@ -69,29 +70,15 @@
             </footer>
         </div>
         @if($data->review !== "never")
-        <div class="score-answers-review_container">
-            <div class="score-answers-review">
-                <h2>{{$__('Answers review')}}
-                    <span class="toggle-answers-review" id="close-answers" data-icon="wrong"></span>
-                </h2>
-                <p class="subtitle">{{$__('Review your answers before you go')}}</p>
-                <ul id="answers-list">
-                    @verbatim
-                        <script id="template-answers-review" type="text/x-handlebars-template">
-                            {{#each reviewList}}
-                            <li class="item {{this.status}}">
-                                <p class="position">Question {{inc @index}}</p>
-                                <p class="question">{{this.question}}</p>
-                                {{#each this.answers}}
-                                <p class="answer">{{this.answer}}</p>
-                                {{/each}}
-                            </li>
-                            {{/each}}
-                        </script>
-                    @endverbatim
-                </ul>
+            <div class="score-answers-review_container">
+                <div class="score-answers-review">
+                    <h2>{{$__('Answers review')}}
+                        <span class="toggle-answers-review" id="close-answers" data-icon="wrong"></span>
+                    </h2>
+                    <p class="subtitle">{{$__('Review your answers before you go')}}</p>
+                    <ul id="answers-list"></ul>
+                </div>
             </div>
-        </div>
         @endif
     </div>
 </div>