Add countdown timer to vote page

app/modules/vote/templates/vote/public/view.j2

@@ -44,6 +44,10 @@
                 <th scope="row">Eindigt</th>
                 <td>{{ ballot.end_at }}</td>
             </tr>
+            <tr>
+                <th scope="row">Te gaan</th>
+                <td class="countdown" date="{{ ballot.end_at }}"><span class="hours">00</span>:<span class="minutes">00</span>:<span class="seconds">00</span></td>
+            </tr>
             <tr>
                 <th scope="row">Aangemaakt door</th>
                 <td>{{ ballot.user.name }}</td>

app/modules/vote/templates/vote/view.j2

@@ -21,6 +21,10 @@
 		<th scope="row">End</th>
 		<td>{{ ballot.end_at }}</td>
 	</tr>
+    <tr>
+        <th scope="row">Te gaan</th>
+        <td class="countdown" date="{{ ballot.end_at }}"><span class="hours">00</span>:<span class="minutes">00</span>:<span class="seconds">00</span></td>
+    </tr>
 	<tr>
 		<th scope="row">User</th>
 		<td>{{ ballot.user.name }}</td>

app/static/js/index.js

@@ -9,4 +9,48 @@ import '../css/index.css'
 import SimpleMDE from 'simplemde'
 import 'simplemde/dist/simplemde.min.css'
 
-new SimpleMDE()
+if (document.querySelector('textarea') > 0) {
+  new SimpleMDE()
+}
+
+// Javascript
+function countdown() {
+  let element = document.querySelector(".countdown")
+  let date = element.getAttribute('date');
+  let days, hours, minutes, seconds;
+  
+  let endDate = new Date(date).getTime();
+  if (isNaN(endDate)) {
+    return;
+  }
+
+  calculate()
+  setInterval(calculate, 1000);
+  
+  function calculate() {
+    let startDate = new Date();
+    startDate = startDate.getTime();
+    
+    let timeRemaining = parseInt((endDate - startDate) / 1000);
+    
+    if (timeRemaining >= 0) {
+      hours = parseInt(timeRemaining / 3600);
+      timeRemaining = (timeRemaining % 3600);
+      
+      minutes = parseInt(timeRemaining / 60);
+      timeRemaining = (timeRemaining % 60);
+      
+      seconds = parseInt(timeRemaining);
+      
+      document.querySelector(".countdown .hours").innerHTML = ("0" + hours).slice(-2);
+      document.querySelector(".countdown .minutes").innerHTML = ("0" + minutes).slice(-2);
+      document.querySelector(".countdown .seconds").innerHTML = ("0" + seconds).slice(-2);
+    } else {
+      return;
+    }
+  }
+}
+
+window.onload = function () {
+  countdown();
+}