time wasting clock can be started, stopped and reset

2 files changed, 43 insertions, 4 deletions

diff --git a/index.html b/index.html
index 84a880c..b01f038 100644
--- a/index.html
+++ b/index.html
@@ -51,10 +51,10 @@
           <div class="time-wasting-clock"></div>
           <br />
           
-          <button type="button" class="btn btn-primary btn-lg
-          btn-block">Start timer (Hotkey: j)</button>
-          <button type="button" class="btn btn-default btn-lg
-          btn-block">Reset timer (end of class)</button>
+          <a id="timeWastingClockGo" class="btn btn-primary btn-lg
+          btn-block">Start timer (Hotkey: j)</a>
+          <a id="timeWastingClockReset" class="btn btn-default btn-lg
+          btn-block">Reset timer (end of class)</a>
         </div>
         <div class="col-md-6">
           <h1>Activity time</h1><br />
diff --git a/js/main.js b/js/main.js
index 0a10a79..14ae473 100644
--- a/js/main.js
+++ b/js/main.js
@@ -2,7 +2,46 @@ var timeWastingClock = new FlipClock($('.time-wasting-clock'), {
     autoStart:false
 });
 
+var $timeWastingClockRunning = false;
+
 var activityClock = new FlipClock($('.activity-countdown'), {
     autoStart:false,
     countdown:true
 });
+
+$(document).ready(function(){
+    $('#timeWastingClockGo').button();
+    $('#timeWastingClockGo').click(function() {
+        if ($timeWastingClockRunning)
+        {
+            $(this).html('Start timer (Hotkey: j)');
+            timeWastingClock.stop();
+            $timeWastingClockRunning = false;
+        }
+        else
+        {
+            $(this).html('Stop timer (Hotkey: j)');
+            timeWastingClock.start();
+            $timeWastingClockRunning = true;
+        }
+    });
+
+    $('#timeWastingClockReset').button();
+    $('#timeWastingClockReset').click(function() {
+        if (timeWastingClock.getTime() != 0)
+        {
+            var $timeWastingClockResetConfirm = confirm("Are you sure?");
+            if ($timeWastingClockResetConfirm)
+            {
+                if ($timeWastingClockRunning)
+                {
+                    $('#timeWastingClockGo').html('Start timer (Hotkey: j)');
+                    timeWastingClock.stop();
+                    $timeWastingClockRunning = false;
+                }
+                timeWastingClock.setTime(0);
+            }
+        }
+    });
+});
+