wip #6248 @1

diff --git a/js/quiz.animations.js b/js/quiz.animations.js
index 88c6d04973195345959a7e8ff133c1d0248ca875..027672975754ef1de7b0fb5face98ebf536b4306 100644 (file)
--- a/js/quiz.animations.js
+++ b/js/quiz.animations.js
@@ -39,8 +39,11 @@ QuizAnimations.prototype = {
     },
 
     instantReviewAnimation: function (status) {
+        let ok = [this.quiz.l10n.__('Fantastic'), this.quiz.l10n.__('Impressive'), this.quiz.l10n.__('Perfect'), this.quiz.l10n.__('Well done'), this.quiz.l10n.__('Bravo'), this.quiz.l10n.__('Good job'), this.quiz.l10n.__('Excellent'), this.quiz.l10n.__('Impressive'), this.quiz.l10n.__('Great job'), this.quiz.l10n.__('Superb'), this.quiz.l10n.__('Terrific')];
+        let nok = [this.quiz.l10n.__('Almost'), this.quiz.l10n.__('Not quite'), this.quiz.l10n.__('Keep trying'), this.quiz.l10n.__('Nearly there'), this.quiz.l10n.__('Nice try')];
+
         let selector = $("#instantReviewAnimation")
-        let text = status === "NOK" ? "Not quite" : "Perfect"
+        let text = status === "NOK" ? nok[Math.floor(Math.random() * nok.length)] : ok[Math.floor(Math.random() * ok.length)];
         let $this = this
         this.quiz.animations.load(status, selector, {'\\$text': text});
         selector.addClass("active")
@@ -57,11 +60,11 @@ QuizAnimations.prototype = {
     fadeOut: function (el, remove, timeout = true) {
         $(el).addClass('animateOpacity disabled').css('opacity', 0);
         if (remove === true) {
-            if(timeout) {
+            if (timeout) {
                 setTimeout(function () {
                     $(el).remove();
                 }, 500);
-            }else {
+            } else {
                 $(el).remove();
             }
         }
@@ -72,29 +75,21 @@ QuizAnimations.prototype = {
         this.quiz.animations.load("RUNNINGMAN_BTN", ".active-screen .runningman", '', true);
     },
 
-    switchValidateContinueButton: function(activeScreen) {
+    switchValidateContinueButton: function (activeScreen) {
         const $this = this
         gsap.timeline().to(".active-screen .footer-question", {
-            opacity: 0,
-            duration: 1,
-            delay: .5,
-            ease: 'power4.easeIn',
-            onComplete: function() {
-                $(".active-screen .footer-question").css("z-index",3)
+            opacity: 0, duration: 1, delay: .5, ease: 'power4.easeIn', onComplete: function () {
+                $(".active-screen .footer-question").css("z-index", 3)
             }
         }).to(".active-screen .footer-question", {
-            y: "100%",
-            duration: 0,
-            onComplete: function() {
+            y: "100%", duration: 0, onComplete: function () {
                 $(activeScreen).find('.btn.continue').removeClass('none')
                 $(activeScreen).find('.btn.validate').addClass('none')
                 // Hide reset button
                 $this.quiz.animations.fadeOut($(activeScreen).find('.btn.reset'), true, false);
             }
         }).to(".active-screen .footer-question", {
-            y: 0,
-            duration: .5,
-            opacity: 1
+            y: 0, duration: .5, opacity: 1
         })
     }
 

diff --git a/js/quiz.js b/js/quiz.js
index b27f0c2e9f2df9ca0e56ec6491f233b630e2e6f7..8d8e52c63ee2478a4f498afbc0e7446d1c63df35 100644 (file)
--- a/js/quiz.js
+++ b/js/quiz.js
@@ -11,12 +11,14 @@ import QuizAccessibility from './quiz.accessibility';
 import QuizUtils from './quiz.utils';
 import QuizScreens from './quiz.screens';
 import QuizProgressbar from "./quiz.progressbar";
+import QuizL10n from "./quiz.l10n";
 
 window.cubeSCORM = new CubeSCORM();
 window.$ = window.jQuery = $;
 
 import ResizeObserver from 'resize-observer-polyfill';
 
+
 window.ResizeObserver = ResizeObserver;
 
 function Quiz() {
@@ -39,7 +41,8 @@ Quiz.prototype = {
         this.utils = new QuizUtils(this);
         this.accessibility = new QuizAccessibility(this);
         this.screens = new QuizScreens(this);
-        this.progressbar=new QuizProgressbar(this);
+        this.progressbar = new QuizProgressbar(this);
+        this.l10n = new QuizL10n(this);
 
         console.log(this.data);
         // ICI tout commence vraiment

diff --git a/js/quiz.l10n.js b/js/quiz.l10n.js
new file mode 100644 (file)
index 0000000..c56b7b4
--- /dev/null
+++ b/js/quiz.l10n.js
@@ -0,0 +1,17 @@
+import QuizAccessibility from "./quiz.accessibility";
+
+function QuizL10n(quiz) {
+    this.quiz = quiz;
+}
+
+QuizL10n.prototype = {
+    __: function (str) {
+        if (this.quiz.data.l10n[str] !== undefined) {
+            return this.quiz.data.l10n[str];
+        }
+        return str;
+    },
+}
+
+export default QuizL10n;
+

diff --git a/js/quiz.resize.js b/js/quiz.resize.js
index 6d5c755fe34cd15703d354c0edcd3c55ff4b6d12..7a42146c32d2a1839e85c36fc4c5acd3fad1ad04 100644 (file)
--- a/js/quiz.resize.js
+++ b/js/quiz.resize.js
@@ -13,8 +13,8 @@ QuizResize.prototype = {
             $('html').removeClass('m');
         }
 
-        const iconReset = getSpriteIcon("quiz-reset")
-        const textReset = "Reset"
+        const iconReset = getSpriteIcon("quiz-reset");
+        const textReset = this.quiz.l10n.__("Reset");
 
         // Exécuter ici toutes opérations qui doivent intervenir lorsque la fenêtre est redimensionnée par le système ou l'utilisateur
         //

diff --git a/views/footer.blade.php b/views/footer.blade.php
index 8be8fc4b290c7fbbc1c745c056600de88ccebebe..f0b1106fe9df144e68a7432e6561e04af8de70ae 100644 (file)
--- a/views/footer.blade.php
+++ b/views/footer.blade.php
@@ -1,14 +1,14 @@
 <footer class="footer-question footer">
     @isset($reset)
         <a class="btn secondary reset" aria-keyshortcuts="R">
-            <span class="text">{{__('Reset')}}</span>
+            <span class="text">{{$__('Reset')}}</span>
             <span class="access">R</span>
         </a>
     @endisset
     <a class="btn primary action validate {{$question['countdown_enable'] ? 'countdown' : ''}}"
        aria-keyshortcuts="Space">
-        <span class="text">{{__('Validate answer')}}</span>
-        <span class="access space">{{__('space')}}</span>
+        <span class="text">{{$__('Validate answer')}}</span>
+        <span class="access space">{{$__('space')}}</span>
         <span class="runningman"></span>
 
         @isset($time)
@@ -17,13 +17,13 @@
     </a>
     @if($data['instantReview'])
         <a class="btn primary action none continue" aria-keyshortcuts="Space">
-            <span class="text">{{__('Continue')}}</span>
-            <span class="access space">{{__('space')}}</span>
+            <span class="text">{{$__('Continue')}}</span>
+            <span class="access space">{{$__('space')}}</span>
         </a>
     @endif
     @isset($info)
         <a class="btn secondary none" aria-keyshortcuts="F1">
-            {{__('More infos')}}
+            {{$__('More infos')}}
             <span class="access infos">F1</span>
         </a>
     @endisset

diff --git a/views/header_question.blade.php b/views/header_question.blade.php
index 447bcd19d7b2f2f8d9282c05117d508f6d48d835..18feeebbb1855d503dd5187686764137276929ad 100644 (file)
--- a/views/header_question.blade.php
+++ b/views/header_question.blade.php
@@ -1,5 +1,5 @@
 <header class="header-question">
-    <p class="abovetitle">{{ __('Question').' '.($position+1).'/'.$max }} </p>
+    <p class="abovetitle">{{ $__('Question').' '.($position+1).'/'.$max }} </p>
     <div class="progress-container">
         @for($i = 0; $i < $max; $i++)
             <span class="progress-item {{$i===$position?'active':''}}"></span>
@@ -7,6 +7,6 @@
     </div>
     <h1 id="titleQuestion">{{$question['question']}}</h1>
     @if($data['type'] === "draganddrop")
-        <h2 class="subtitle">{{__('Use arrow keys to move the cards to the corresponding zone')}}</h2>
+        <h2 class="subtitle">{{$__('Use arrow keys to move the cards to the corresponding zone')}}</h2>
     @endif
 </header>

diff --git a/views/screens/intro.blade.php b/views/screens/intro.blade.php
index 89d88898bf61b05b3868b23727bf2df20e2eaa44..dd06ab4684d59e06e08c854b7cbaddf4ce39189b 100644 (file)
--- a/views/screens/intro.blade.php
+++ b/views/screens/intro.blade.php
@@ -4,16 +4,16 @@
 <div class="container-screen none" data-screen="welcome">
     @include('header_title', ['data', $data])
     <div class="screen" id="welcome">
-        <h2>{{$data->intro_title}}</h2>
+        <h2>{{$data->intro_title?:$__('Welcome')}}</h2>
         <p>{{$data->intro_text}}</p>
     </div>
     <div class="screen-image">
-        <img src="{{$data->theme->introImage}}" />
-        <img class="mobile" src="{{$data->theme->introImageMobile}}" />
+        <img src="{{$data->theme->introImage}}"/>
+        <img class="mobile" src="{{$data->theme->introImageMobile}}"/>
     </div>
     <footer class="footer">
         <a id="start" aria-keyshortcuts="Space" class="btn primary">
-            {{$data->intro_button}}<span class="access space">space</span>
+            {{$data->intro_button?:$__('Let\'s start')}}<span class="access space">{{$__('space')}}</span>
         </a>
     </footer>
 </div>

diff --git a/views/screens/outro.blade.php b/views/screens/outro.blade.php
index 1f62d8d025a1ccb40ffbc1c5a2c71e5391f97250..71664360aea0d9227fb66f3940dcc4cb0652832f 100644 (file)
--- a/views/screens/outro.blade.php
+++ b/views/screens/outro.blade.php
@@ -19,7 +19,7 @@
                     </div>
                 </div>
                 <div class="score-text">
-                    <h1>{{__('Congratulation!')}}</h1>
+                    <h1>{{$__('Congratulation!')}}</h1>
                     <div class="subtitle">
                         <p class="word">You have completed the quiz</p><br/>
                         <p class="word">with <span id="score-text"></span>
@@ -27,40 +27,40 @@
                         </p>
                     </div>
                     @if($data->restart_button)
-                        <div class="restart-sentence-mobile">{{__('Want to improve your score?')}}</div>
+                        <div class="restart-sentence-mobile">{{$__('Want to improve your score?')}}</div>
                         <a class="btn secondary restart restart-mobile">
                             <span data-icon="reset"></span>
-                            {{__('Restart')}}
+                            {{$__('Restart')}}
                         </a>
                     @endif
                 </div>
             </div>
             <footer>
                 @if($data->restart_button)
-                    <div class="restart-sentence">{{__('Want to improve your score?')}}</div>
+                    <div class="restart-sentence">{{$__('Want to improve your score?')}}</div>
                 @endif
                 <div class="controls">
                     @if($data->restart_button)
                         <a class="btn secondary restart" aria-keyshortcuts="r">
-                            {{__('Restart')}}
+                            {{$__('Restart')}}
                             <span class="access">R</span>
                         </a>
                     @endif
                     <a class="btn secondary toggle-answers-review">
                         <span data-icon=""></span>
-                        {{__('Review answers')}}
+                        {{$__('Review answers')}}
                     </a>
                     <a class="btn primary action">
-                        {{__('Leave')}}
-                        <span class="access space">{{__('space')}}</span>
+                        {{$__('Leave')}}
+                        <span class="access space">{{$__('space')}}</span>
                     </a>
                 </div>
             </footer>
         </div>
         <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>
+                <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">

diff --git a/views/screens/question_draganddrop.blade.php b/views/screens/question_draganddrop.blade.php
index 825731edf6d0414e1b66d744f79f649ef436920b..913627db2ffd1cc0bce72238bc21c4eaded0f665 100644 (file)
--- a/views/screens/question_draganddrop.blade.php
+++ b/views/screens/question_draganddrop.blade.php
@@ -17,7 +17,7 @@
     @include('header_question', ['data' => $data, 'max' => $max, 'position' => $position])
     <div class="screen question-draganddrop">
         <div class="controls left">
-            <p>{{__('Move left')}}</p>
+            <p>{{$__('Move left')}}</p>
             <button class="access"><span data-icon="arrow"></span></button>
         </div>
         <ul class="list">
@@ -28,7 +28,7 @@
             @endforeach
         </ul>
         <div class="controls right">
-            <p>{{__('Move right')}}</p>
+            <p>{{$__('Move right')}}</p>
             <button class="access"><span data-icon="arrow"></span></button>
         </div>
     </div>
@@ -46,5 +46,5 @@
             </form>
         </div>
     </div>
-    @include('footer', ['data' => $data, 'reset' => true, 'text' => __('Validate answer'), 'info' => true])
+    @include('footer', ['data' => $data, 'reset' => true, 'text' => $__('Validate answer'), 'info' => true])
 </div>