adding countdown!!!

5 files changed, 44 insertions, 1 deletions

diff --git a/README b/README
index 4ff2261..286ab2d 100644
--- a/README
+++ b/README
@@ -55,7 +55,7 @@ npm start
 
 Server will be running at http://localhost:5000/ aka http://lvh.me:5000/ (or whatever port you set in the .env)
 
-### Produciton
+### Production
 
 In production I use something to daemonize the node server, such as pm2 (provides nice dashboard with uptime, restarts, saves logs, etc).
 
diff --git a/public/assets/js/lib/views/index/countdown.js b/public/assets/js/lib/views/index/countdown.js
new file mode 100644
index 0000000..f2fd666
--- /dev/null
+++ b/public/assets/js/lib/views/index/countdown.js
@@ -0,0 +1,40 @@
+var Countdown = View.extend({
+  
+  el: ".countdown",
+  countdownTo: new Date(2019, 9, 5, 0, 0, 0),
+  
+  events: {
+  },
+  
+  initialize: function(){
+    this.__super__.initialize.call(this)
+    this.update()
+  },
+
+  update() {
+    var now = (this.countdownTo - new Date()) / 1000
+    if (now < 0) {
+      if (now > -86400) {
+        this.$el.html("<b><i><big>today's the day!</big></i></b>")
+      } else {
+        this.$el.html("<b><i><big>bucky says congrats!!!!</big></i></b>")
+      }
+      return
+    }
+    var seconds = Math.floor(now % 60)
+    now /= 60
+    var minutes = Math.floor(now % 60)
+    now /= 60
+    var hours = Math.floor(now % 24)
+    now /= 24
+    var days = Math.floor(now)
+    var date_string = [
+      "<big><b>", days, 'days</big></b>',
+      hours, 'hours,',
+      minutes, 'minutes,',
+      seconds, 'seconds',
+    ].join(' ')
+    this.$el.html( date_string + "<br><i style='display: block;margin-top: 4px;'>until the big day!</i>")
+    setTimeout(this.update.bind(this), 1000)
+  },
+})
\ No newline at end of file
diff --git a/public/assets/js/lib/views/index/index.js b/public/assets/js/lib/views/index/index.js
index 985f990..08da455 100644
--- a/public/assets/js/lib/views/index/index.js
+++ b/public/assets/js/lib/views/index/index.js
@@ -11,6 +11,7 @@ var IndexView = View.extend({
     this.hootbox = new HootBox ({ parent: this })
     this.threadbox = new ThreadBox ({ parent: this })
     this.lastlog = new LastLog ({ parent: this })
+    this.countdown = new Countdown ({ parent: this })
   },
 
   load: function(keyword){
diff --git a/views/pages/index.ejs b/views/pages/index.ejs
index 14d7412..e484fab 100644
--- a/views/pages/index.ejs
+++ b/views/pages/index.ejs
@@ -9,6 +9,7 @@
 <div id="sidebar">
   <% include ../partials/searchform %>
   <div class="bluebox alert"></div>
+  <div class="bluebox countdown"></div>
   <% include ../partials/lastlog %>
   <% include ../partials/hootbox %>
 </div>
diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs
index 7a8e8da..765594b 100644
--- a/views/partials/scripts.ejs
+++ b/views/partials/scripts.ejs
@@ -25,6 +25,7 @@
 <script src="/assets/js/lib/views/index/hootbox.js"></script>
 <script src="/assets/js/lib/views/index/threadbox.js"></script>
 <script src="/assets/js/lib/views/index/threadform.js"></script>
+<script src="/assets/js/lib/views/index/countdown.js"></script>
 
 <script src="/assets/js/lib/views/admin/adminz.js"></script>
 <script src="/assets/js/lib/views/admin/password.js"></script>