Edit color and add sound

Sound do not play because there is a security on Chrome. User need to interact with the page.
2026-05-13 17:22:04 +00:00 · 2021-07-04 16:37:21 +02:00
parent d29d8e649b
commit f8fd5d167b
3 changed files with 6 additions and 1 deletions
@@ -8,6 +8,7 @@
 </head>
 <body>
    <p id="timer"></p>
+    <audio id="ding" src="./sounds/ding.mp3"></audio>
    <script src="./js/url.js"></script>
    <script src="./js/timer.js"></script>
    <script src="./js/main.js"></script>
@@ -1,5 +1,7 @@
 /* HTML contents */
+var body = document.body;
 var timerHTML = document.getElementById("timer");
+var ding = document.getElementById("ding");

 /* GET url variable */
 const queryString = window.location.search;
@@ -14,6 +16,8 @@ let localTimer = setInterval(() => {
    timer.decrement();
    if(timer.getTime() < 0) {
        clearInterval(localTimer);
-        timerHTML.style.color = "red";
+        body.style.backgroundColor = "red";
+        timerHTML.style.color = "white";
+        ding.play();
    }
 }, 1000);