Added simple zoom controls

This will allow the presenter to zoom the slide preview in or out.
patmaddox · Jul 6, 2012 · fed98bc · fed98bc
1 parent 168d7b3
commit fed98bc
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 1 deletion.
diff --git a/public/css/presenter.css b/public/css/presenter.css
@@ -91,7 +91,8 @@ div.zoomed {
 
 /* I want this view to like, actually work on multiple screen sizes... */
 #main { height: 100%; }
-#sidebar, #preview { height: 75%; min-height: 430px; }
+#sidebar { height: 75%; min-height: 430px; }
+#preview { height: 75%; min-height: 430px; overflow: scroll; }
 
 #slideSource { height: 8%; padding: 0; }
 #progress { height: 5%; padding: 0; }
@@ -102,3 +103,13 @@ div.zoomed {
 #bottom { height: 10%; }
 #notes { height: 100%; min-height: 100%; max-height: 100%; font-size: 1em; }
 
+a.controls {
+  text-decoration: none;
+  padding: 0 0.25em 0.1em 0.25em;
+  background-color: #fff2ce;
+  border: 1px solid #ccc;
+  -moz-border-radius: 0.5em;
+  -webkit-border-radius: 0.5em;
+  -khtml-border-radius: 0.5em;
+  border-radius: 0.5em;
+}
diff --git a/public/js/presenter.js b/public/js/presenter.js
@@ -45,6 +45,12 @@ function openSlave()
     w.presenterView = window;
 }
 
+function zoom(val)
+{
+  var n = val ? val + parseFloat($(".zoomed").css("zoom")) : 0.5;
+  $(".zoomed").css("zoom", n);
+}
+
 function presPrevStep()
 {
     prevStep()

diff --git a/views/presenter.erb b/views/presenter.erb
@@ -32,6 +32,10 @@
 <div id="main" class="container_12">
   <div id="topbar" class="grid_12">
     <div id="links">
+      <a class="controls" href="javascript:zoom(-0.01);">-</a>
+      <a class="controls" href="javascript:zoom();">o</a>
+      <a class="controls" href="javascript:zoom(0.01);">+</a>
+      &nbsp; &nbsp;
       <a href="javascript:openSlave();">Open Slave Window</a>
       &nbsp; &nbsp;
       <a href="/pdf">Generate PDF</a>