diff options
-rw-r--r-- | app_test.py | 5 | ||||
-rw-r--r-- | pysite/views/main/countdown.py | 10 | ||||
-rw-r--r-- | static/js/countdown.js | 50 | ||||
-rw-r--r-- | templates/main/countdown.html | 30 | ||||
-rw-r--r-- | templates/main/navigation.html | 6 |
5 files changed, 101 insertions, 0 deletions
diff --git a/app_test.py b/app_test.py index 2176fe08..651d7a96 100644 --- a/app_test.py +++ b/app_test.py @@ -32,6 +32,11 @@ class SiteTest(TestCase): class RootEndpoint(SiteTest): """ Test cases for the root endpoint and error handling """ + def test_countdown(self): + """ Check the countdown path responds with 200 OK """ + response = self.client.get('/countdown', "http://pytest.local") + self.assertEqual(response.status_code, 200) + def test_index(self): """ Check the root path reponds with 200 OK """ response = self.client.get('/', 'http://pytest.local') diff --git a/pysite/views/main/countdown.py b/pysite/views/main/countdown.py new file mode 100644 index 00000000..f43d628c --- /dev/null +++ b/pysite/views/main/countdown.py @@ -0,0 +1,10 @@ +# coding=utf-8 +from pysite.base_route import RouteView + + +class CountdownView(RouteView): + path = "/countdown" + name = "countdown" + + def get(self): + return self.render("main/countdown.html") diff --git a/static/js/countdown.js b/static/js/countdown.js new file mode 100644 index 00000000..0992a94e --- /dev/null +++ b/static/js/countdown.js @@ -0,0 +1,50 @@ +var heading = document.getElementById("countdown-title"); +var daysDisplay = document.getElementById("days"); +var hoursDisplay = document.getElementById("hours"); +var minutesDisplay = document.getElementById("minutes"); +var secondsDisplay = document.getElementById("seconds"); +var startjam = new Date(Date.UTC(2018, 2, 24)); +var endjam = new Date(Date.UTC(2018, 2, 26)); +var goal; +var now = Date.now(); +if (now+1000 >= endjam.getTime()) { + heading.innerHTML = "Code Jam has finished!"; +} else { + if (now > startjam.getTime()) { + heading.innerHTML = "Code Jam ends in..."; + goal = endjam.getTime(); + } else { + heading.innerHTML = "Next Code Jam starts in..."; + goal = startjam.getTime(); + } + var refreshCountdown = setInterval(function() { + var delta = goal - Date.now(); + if (delta <= 1000) { + clearInterval(refreshCountdown); + location.reload(); + } + var days = Math.floor(delta / (24*60*60*1000)); + delta -= days * (24*60*60*1000); + var hours = Math.floor(delta / (60*60*1000)); + delta -= hours * (60*60*1000); + var minutes = Math.floor(delta / (60*1000)); + delta -= minutes * (60*1000); + var seconds = Math.floor(delta / 1000); + if (days < 10) { + days = "0"+days; + } + if (hours < 10) { + hours = "0"+hours; + } + if (minutes < 10) { + minutes = "0"+minutes; + } + if (seconds < 10) { + seconds = "0"+seconds; + } + daysDisplay.innerHTML = days; + hoursDisplay.innerHTML = hours; + minutesDisplay.innerHTML = minutes; + secondsDisplay.innerHTML = seconds; + }, 100); +}
\ No newline at end of file diff --git a/templates/main/countdown.html b/templates/main/countdown.html new file mode 100644 index 00000000..846883d3 --- /dev/null +++ b/templates/main/countdown.html @@ -0,0 +1,30 @@ +{% extends "main/base.html" %} +{% block title %}Countdown{% endblock %} +{% block og_title %}Countdown{% endblock %} +{% block og_description %}Countdown for Code Jams.{% endblock %} +{% block content %} +<h1 id="countdown-title" class="uk-heading-primary uk-text-center">Code Jam Countdown</h1> +<div class="uk-section uk-section-muted"> + <div class="uk-container"> + <div class="uk-column-1 uk-column-1-2@s uk-column-1-4@m"> + <div class="uk-tile uk-padding-small"> + <h1 style="text-align: center">Days</h1> + <h1 id="days" class="uk-text-center" style="font-size: 200px">--</h1> + </div> + <div class="uk-tile uk-padding-small"> + <h1 style="text-align: center">Hours</h1> + <h1 id="hours" class="uk-text-center" style="font-size: 200px">--</h1> + </div> + <div class="uk-tile uk-padding-small"> + <h1 style="text-align: center">Minutes</h1> + <h1 id="minutes" class="uk-text-center" style="font-size: 200px">--</h1> + </div> + <div class="uk-tile uk-padding-small"> + <h1 style="text-align: center">Seconds</h1> + <h1 id="seconds" class="uk-text-center" style="font-size: 200px">--</h1> + </div> + </div> + </div> +</div> +<script src="/static/js/countdown.js"></script> +{% endblock %}
\ No newline at end of file diff --git a/templates/main/navigation.html b/templates/main/navigation.html index cabd0d87..385ad00d 100644 --- a/templates/main/navigation.html +++ b/templates/main/navigation.html @@ -29,6 +29,12 @@ <li class="uk-nav-item uk-hidden@m"><a href="/"><i class="uk-icon fas fa-home"></i> Home</a></li> <li class="uk-nav-item uk-hidden@m"><a href="/invite"><i class="uk-icon fab fa-discord"></i> Discord</a></li> <li class="uk-nav-divider uk-hidden@m"></li> + + {% if current_page.startswith("countdown") %} + <li class="uk-active"><a href="/countdown">Code Jam Countdown</a></li> + {% else %} + <li><a href="/countdown">Code Jam Countdown</a></li> + {% endif %} {% if current_page.startswith("info") %} <li class="uk-nav-header uk-active"><a href="/info">Information</a></li> |