Home Explore Help
Sign In
sangfroid
/
countdown-javascript
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

Fonctionnel

François Drouhard 1 year ago
parent
04c8595277
commit
3a1418d220
4 changed files with 35 additions and 17 deletions
Split View Show Diff Stats
  1. 6 6
      counter.js
  2. 1 0
      fetch.js
  3. 1 1
      index.html
  4. 27 10
      main.js

+ 6 - 6
counter.js
View File 

@@ -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));
 
       }
 
   }

+ 1 - 0
fetch.js
View File 

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

+ 1 - 1
index.html
View File 

@@ -9,7 +9,7 @@
 
   <body>
 
     <div id="app">
 
       <h1></h1>
 
-      <div class="countdown-timer" data-id="8"></div>
 
+      <div class="countdown-timer" data-id="4"></div>
 
       <div class="message"></div>
 
     </div>
 
     <script type="module" src="/main.js"></script>

+ 27 - 10
main.js
View File 

@@ -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));
 
 };
 
 
@@ -58,12 +56,31 @@ const hideMessage = () => {
 
 };
 
 
 const complete = () => {
 
-  console.log("Fonction complete() du main")
 
   showMessage();
 
+  console.log("Ne doit pas se voir avant fin de compteur")
 
+  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)
 
+}