add timer

diff --git a/public/index.html b/public/index.html
index 4811d72d2c06e54d84077b99f68c647807ba9db4..6b8cbfe2e74b4c341a31ed19ca50aca40fa6d450 100644 (file)
--- a/public/index.html
+++ b/public/index.html
@@ -67,6 +67,16 @@
         </div>
 
         <div id="panel">
+            <div id="timer" style="display:none">
+                <p>
+                    <span data-l10n="text-content">Turn timer:</span>
+                    <span id="timer-turn">0</span>
+                </p>
+                <p>
+                    <span data-l10n="text-content">Global timer:</span>
+                    <span id="timer-global">0</span>
+                </p>
+            </div>
             <div id="bag"></div>
             <p><span data-l10n="text-content">Number of tiles in the bag:</span><br /><span id="remaining-letters">102</span><br /><span id="help-bag" data-l10n="text-content">Click on it to take one.</span><a href="#" id="help-clear" style="display:none"></a></p>
             <table id="participants">

diff --git a/public/trivabble.css b/public/trivabble.css
index 8e11418213f26fc61ebff122f4e4e5a79b3cecf9..6514ccf40e9a3c64aa48f38288525ce7f8d4d021 100644 (file)
--- a/public/trivabble.css
+++ b/public/trivabble.css
@@ -507,3 +507,7 @@ td.blink {
     transform: scale(1.0);
     transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;
 }
+
+#timer {
+    text-align: center;
+}

diff --git a/public/trivabble.js b/public/trivabble.js
index cde5a492a66e44e326a93ae314932b17ec069ef1..460a5ce9246096309142f4d3f8c36047f08ad222 100644 (file)
--- a/public/trivabble.js
+++ b/public/trivabble.js
@@ -42,6 +42,8 @@
     setConf("ENABLE_EVENT_SOURCE",  true);
     setConf("MAX_WEBSOCKET_ERRORS", 1);
     setConf("APP_PATH",             "");
+    setConf("APP_PATH",             "");
+    setConf("ENABLE_TIMER",        true);
 
     const _ = (window.libD && libD.l10n) ? libD.l10n() : function (s) {
         return s;
@@ -49,8 +51,8 @@
 
     const trivabble = window.trivabble = {l10n: _};
 
-    function format(s, v1, v2) {
-        return s.replace("{0}", v1).replace("{1}", v2);
+    function format(s, v1, v2, v3, v4) {
+        return s.replace("{0}", v1).replace("{1}", v2).replace("{2}", v3).replace("{3}", v4);
     }
 
     let board;
@@ -1360,6 +1362,7 @@
         myConfirm(
             _("Are you sure you want to put all the tiles back in the bag (in order to play another game)?"),
             function () {
+                localStorage.timerGlobal = localStorage.timerTurn = 0;
                 sendCmds([{cmd: "resetGame"}]);
             }
         );
@@ -1515,6 +1518,48 @@
         }
     }
 
+    function timerString(delta) {
+        let d = Math.floor(delta / (60 * 60 * 24));
+        let h = Math.floor((delta % (60 * 60 * 24)) / (60 * 60));
+        let m = Math.floor((delta % (60 * 60)) / 60);
+        let s = Math.floor(delta % 60);
+        return format(_("{0}d {1}h {2}m {3}s"), d, h, m, s);
+    }
+
+    function initTimer() {
+        if (!Object.prototype.hasOwnProperty.call(localStorage, "timerTurn")) {
+            localStorage.timerTurn = 0;
+        }
+        if (!Object.prototype.hasOwnProperty.call(localStorage, "timerGlobal")) {
+            localStorage.timerGlobal = 0;
+        }
+        if (!Object.prototype.hasOwnProperty.call(localStorage, "timerEnable")) {
+            localStorage.timerEnable = Conf.ENABLE_TIMER;
+        }
+        if (localStorage.timerEnable) {
+            activateTimer();
+        } else {
+            desactivateTimer();
+        }
+    }
+
+    function activateTimer() {
+        document.getElementById("timer").style.display = "block";
+        localStorage.timer = setInterval(function() {
+            document.getElementById("timer-turn").innerHTML = timerString(++localStorage.timerTurn)
+            document.getElementById("timer-global").innerHTML = timerString(++localStorage.timerGlobal);
+        }, 1000);
+    }
+
+    function desactivateTimer() {
+        document.getElementById("timer").style.display = "none";
+        if (Object.prototype.hasOwnProperty.call(localStorage, "timer")) {
+            clearInterval(localStorage.timer);
+            delete(localStorage.timer);
+        }
+    }
+
+
     function repromptName(f) {
         if (localStorage.trivabblePlayerName && localStorage.trivabblePlayerName.trim()) {
             f();
@@ -1523,7 +1568,7 @@
                 _("It seems your did not give your name. You need to do it for the game to run properly."),
                 function (name) {
                     if (name && name.trim()) {
-                        localStorage.trivabblePlayerName = name.trim();
+                        localStorage.trivabblePlayerName = name1111111111111.trim();
                     }
 
                     repromptName(f);
@@ -1731,6 +1776,7 @@
         initChat();
         initGame();
         initSound();
+        initTimer();
     };
 
     trivabble.l10nError = trivabble.run;