Mise à jour du js

assets/js/counter.js

@@ -23,18 +23,18 @@ export class Countdown {
           this.onComplete();
       }
   }
-  getTime() {
+  static getTime(time) {
       return {
-          days: Math.floor(this.timeRemaining / 1000 / 60 / 60 / 24),
-          hours: Math.floor(this.timeRemaining / 1000 / 60 / 60) % 24,
-          minutes: Math.floor(this.timeRemaining / 1000 / 60) % 60,
-          seconds: Math.floor(this.timeRemaining / 1000) % 60
+          days: Math.floor(time / 1000 / 60 / 60 / 24),
+          hours: Math.floor(time / 1000 / 60 / 60) % 24,
+          minutes: Math.floor(time / 1000 / 60) % 60,
+          seconds: Math.floor(time / 1000) % 60
       };
   }
 
   update() {
       if (typeof this.onRender === 'function') {
-          this.onRender(this.getTime());
+          this.onRender(Countdown.getTime(this.timeRemaining));
       }
   }
 

assets/js/fetch.js

@@ -8,4 +8,5 @@ export class fetchObject{
         const counter = await response.json();
         return counter;
     }
+
 }

assets/js/main.js

@@ -1,4 +1,4 @@
-import '../styles/counter.css'
+//import './styles/counter.css'
 import { Countdown } from './counter.js'
 import { fetchObject } from './fetch.js';
 
@@ -8,12 +8,10 @@ const message = document.querySelector('.message');
 const heading = document.querySelector('h1');
 
 const api = new fetchObject("http://localhost:8000/counter", app.dataset.id);
-const counter = await api.getCounter();
-
-heading.innerText = counter.name;
+constcheckCounter();
 
 // Get the new year 
-const getEndTime = () => {
+const getEndTime = (counter) => {
   return new Date(Date.parse(counter.endTime));
 };
 
@@ -48,7 +46,8 @@ const render = (time) => {
 
 const showMessage = () => {
   message.innerHTML = "Le compteur est terminé";
-  app.innerHTML = '';
+  //app.innerHTML = '';
+  //heading.style.display = 'none';
 };
 
 const hideMessage = () => {
@@ -58,10 +57,29 @@ const hideMessage = () => {
 
 const complete = () => {
   showMessage();
+  constcheckCounter();
 };
 
-const countdownTimer = new Countdown(
-  getEndTime(),
-  render,
-  complete
-);
+
+function constcheckCounter () {
+  const intervalId = setInterval(async () => {
+    const counter = await api.getCounter();
+    heading.innerText = counter.name;
+    if (counter.state === 'ready') {
+      hideMessage();
+      const period = new Date(counter.minutes * 1000 * 60);
+      render(Countdown.getTime(period));
+    } else if (counter.state === 'completed') {
+      const zero = new Date(0);
+      showMessage();
+      render(Countdown.getTime(zero));
+    } else {
+      clearInterval(intervalId);
+      const countdownTimer = new Countdown(
+        getEndTime(counter),
+        render,
+        complete
+      )
+    }
+  }, 1000)
+}