builtin timer in presenter view

TODO.txt

@@ -3,21 +3,16 @@ TODO
 
 ==
 
-- test suite
-- static, heroku, github, pdf, presenter, normal all working
 - pdf with notes
-- clean up js
-- clean up ruby
 - presenter view
   - timer (time left, percent done, percent time done)
-  - menu / goto
-  - settings (footer, debug?)
-  - madden? 
-- track file each slide is from
 - editing slides
 - webpage
-- message on startup
-- fix heroku gem shit
+
+--
+
+- clean up js
+- clean up ruby
 
 
 ==

public/css/presenter.css

@@ -10,12 +10,17 @@ div.zoomed {
   font-size: 1.5em;
 }
 
+#timerSection {
+  padding: 15px 10px;
+  border-top: 1px solid #555;
+  border-bottom: 1px solid #555;
+}
 #progress {
   padding: 10px;
 }
 #slideSource {
   padding: 10px;
-  background: #9d9;
+  background: #ccc;
 }
 
 #preview {
@@ -64,3 +69,8 @@ div.zoomed {
   padding: 10px;
   background: #eee;
 }
+
+.tBlue   { background: #79d; }
+.tGreen  { background: #9d9; }
+.tRed    { background: #d99; }
+.tYellow { background: #dd9; }

public/js/presenter.js

@@ -17,6 +17,9 @@ $(function(){
 			return false
 		}).next().hide()
 	})
+  $("#minStop").hide()
+  $("#startTimer").click(function() { toggleTimer() })
+  $("#stopTimer").click(function() { toggleTimer() })
 });
 
 function presPrevStep()
@@ -127,3 +130,64 @@ function keyDown(event)
 	}
 	return true
 }
+
+//* TIMER *//
+
+var timerSetUp = false;
+var timerRunning = false;
+var intervalRunning = false;
+var seconds = 0;
+var totalMinutes = 35;
+
+function toggleTimer()
+{
+  if (!timerRunning) {
+    timerRunning = true
+    totalMinutes = parseInt($("#timerMinutes").attr('value'))
+    $("#minStart").hide()
+    $("#minStop").show()
+    $("#timerInfo").text(timerStatus(0));
+    seconds = 0
+    if (!intervalRunning) {
+      intervalRunning = true
+      setInterval(function() {
+        if (!timerRunning) { return; }
+        seconds++;
+        $("#timerInfo").text(timerStatus(seconds));
+      }, 1000);  // fire every minute
+    }
+  } else {
+    seconds = 0
+    timerRunning = false
+    totalMinutes = 0
+    $("#timerInfo").text('')
+    $("#minStart").show()
+    $("#minStop").hide()
+  }
+}
+
+function timerStatus(seconds) {
+  var minutes = Math.round(seconds / 60);
+  var left = (totalMinutes - minutes);
+  var percent = Math.round((minutes / totalMinutes) * 100);
+  var progress = getSlidePercent() - percent;
+  setProgressColor(progress);
+  return minutes + '/' + left + ' - ' + percent + '%';
+}
+
+function setProgressColor(progress) {
+  ts = $('#timerSection')
+  ts.removeClass('tBlue')
+  ts.removeClass('tGreen')
+  ts.removeClass('tYellow')
+  ts.removeClass('tRed')
+  if(progress > 10) {
+    ts.addClass('tBlue')
+  } else if (progress > 0) {
+    ts.addClass('tGreen')
+  } else if (progress > -10) {
+    ts.addClass('tYellow')
+  } else {
+    ts.addClass('tRed')
+  }
+}

views/presenter.erb

@@ -36,11 +36,17 @@
   </div>
   <div class="clear"></div>
   <div id="sidebar" class="grid_4">
+    <div id="slideSource">
+      Source: <span id="slideFile"></span>
+    </div>
     <div id="progress">
       Slide: <span id="slideInfo"></span>
     </div>
-    <div id="slideSource">
-      Source: <span id="slideFile"></span>
+    <div id="timerSection">
+      Timer: 
+      <span id="minStart"><input type="text" size="2" id="timerMinutes"/> min <input type="button" id="startTimer" value="Start"></span>
+      <span id="timerInfo"></span>
+      <span id="minStop"><input type="button" id="stopTimer" value="Stop"></span>
     </div>
     <div id="debugInfo"></div>
     <div id="slidemenu">