add toggle to hide sidebar

2 files changed, 5 insertions, 6 deletions

diff --git a/index.html b/index.html
index ad1d86a..8a1e68b 100644
--- a/index.html
+++ b/index.html
@@ -61,15 +61,15 @@ var toggleVisible = function(string)
 
 </script>
 
-
 <table align="center">
 <tbody><tr>
 
 <td valign="top">
 <canvas id="crtCanvas" width="584" height="584" style="z-index: 0;"></canvas>
 <div id="canvasFailure" style="position: relative; z-index: 1; font:25px arial; top:-40px; color:lightgreen;"></div>
+<a href="javascript:toggleVisible(&#39;sidebar&#39;);">toggle sidebar</a>
 </td>
-<td width="360" valign="top">
+<td id="sidebar" width="360" valign="top">
 
 <p style="font-size:5px;">&nbsp;</p>
 
diff --git a/oscilloscope.js b/oscilloscope.js
index 325c22e..746e8af 100644
--- a/oscilloscope.js
+++ b/oscilloscope.js
@@ -303,8 +303,6 @@ var Filter =
 
 var UI =
 {
-	sidebarWidth : 360,
-
 	init : function()
 	{
 		var kHzText = (AudioSystem.sampleRate/1000).toFixed(1)+"kHz";
@@ -314,7 +312,8 @@ var UI =
 		this.xInput = document.getElementById("xInput");
 		this.yInput = document.getElementById("yInput");
 		this.xInput.value = controls.xExpression;
-        this.yInput.value = controls.yExpression;
+    this.yInput.value = controls.yExpression;
+    this.sidebar = document.getElementById("sidebar");
 	},
 
 	compile : function() //doesn't compile anything anymore
@@ -466,7 +465,7 @@ var Render =
 	{
 		var windowWidth = Math.max(document.documentElement.clientWidth, window.innerWidth || 0)
 		var windowHeight = Math.max(document.documentElement.clientHeight, window.innerHeight || 0)
-		var canvasSize = Math.min(windowHeight-21, windowWidth-UI.sidebarWidth-70);
+		var canvasSize = Math.min(windowHeight-21, windowWidth - UI.sidebar.getBoundingClientRect().width - 70);
 		Render.canvas.width = canvasSize;
 		Render.canvas.height = canvasSize;
 		if (Render.lineTexture)