Add toggle for wireframes

Cogito · Feb 23, 2012 · 2230da4 · 2230da4
1 parent 291ade6
commit 2230da4
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 4 deletions.
diff --git a/bezier.html b/bezier.html
@@ -8,7 +8,8 @@
   </style>
 </head>
 <body>
-<div id="toggle">Toggle! <span id="toggleStatus"></span></div>
+<div id="growth-toggle">Toggle growth! <span id="growth-status"></span></div>
+<div id="wireframes-toggle"> Toggle wireframes! <span id="wireframes-status"></span></div>
 <canvas id="straight" class="button" width="28px" height="28px"></canvas>
 <canvas id="left" class="button" width="28px" height="28px"></canvas>
 <canvas id="right" class="button" width="28px" height="28px"></canvas>

diff --git a/bezier.js b/bezier.js
@@ -262,7 +262,8 @@ var utilities = (function(){
     var $straight = $("#straight");
     var $left = $("#left");
     var $right = $("#right");
-    $('#toggleStatus')[0].textContent = ticksEnabled?"ON":"OFF";
+    $('#growth-status')[0].textContent = ticksEnabled?"ON":"OFF";
+    $('#wireframes-status')[0].textContent = options.wireFrames?"ON":"OFF";
     draw($canvas[0], start, vectors);
     draw($straight[0], Start(Point(14,23), -Math.PI/2), Tangle(Vector(9,0), Vector(9,0)));
     draw($left[0], Start(Point(20,23), -Math.PI/2), Tangle(Vector(15,0), Vector(15,-Math.PI/2)));
@@ -300,9 +301,14 @@ var utilities = (function(){
       vectors.add(Tangle(Vector(15,0), Vector(15,Math.PI/2)));
       draw($canvas[0], start, vectors);
     });
-    $("#toggle").click(function() {
+    $("#growth-toggle").click(function() {
       ticksEnabled = !ticksEnabled;
-      $('#toggleStatus')[0].textContent = ticksEnabled?"ON":"OFF";
+      $('#growth-status')[0].textContent = ticksEnabled?"ON":"OFF";
+    });
+    $("#wireframes-toggle").click(function() {
+      options.wireFrames = !options.wireFrames;
+      $('#wireframes-status')[0].textContent = options.wireFrames?"ON":"OFF";
+      draw($canvas[0], start, vectors);
     });
   });
 })(jQuery, utilities, {drawVectors: false, ticksEnabled: false, frameRate: 5, wireFrames: true});