From af6c184dcac89a5fee907aed0b5866a89a2eb109 Mon Sep 17 00:00:00 2001 From: cronzon Date: Wed, 27 Jul 2016 21:16:33 +0000 Subject: [PATCH] Adds range bars to scale OSC and DFT Signed-off-by: cronzon --- embedded8266/web/page/index.html | 7 +++++-- embedded8266/web/page/main.js | 10 +++++++--- 2 files changed, 12 insertions(+), 5 deletions(-) diff --git a/embedded8266/web/page/index.html b/embedded8266/web/page/index.html index 57a621e..8432b8e 100644 --- a/embedded8266/web/page/index.html +++ b/embedded8266/web/page/index.html @@ -14,6 +14,9 @@ td { vertical-align: top; } .inbutton { background-color:blue; } #SystemMessage { position: fixed; top: 5px; background-color: DarkSlateBlue; color: #ffffff; left: 5px; display:none; } .dragandrophandler { border:2px dotted #0B85A1; color:#92AAB0;vertical-align:middle;padding:10px 10px 10 10px;margin-bottom:10px;font-size:200%;} +input[type="range"] {position: relative;margin-left: 1em;} +input[type="range"]:after, input[type="range"]:before {position: absolute;top: 1em;color: #aaa;} +input[type="range"]:before {left:0em; content: attr(min);}input[type="range"]:after {right: 0em;content: attr(max);} @@ -38,7 +41,7 @@ td { vertical-align: top; }
-
+ @@ -47,7 +50,7 @@ td { vertical-align: top; }
-
+
diff --git a/embedded8266/web/page/main.js b/embedded8266/web/page/main.js index b4d473f..42d16d5 100644 --- a/embedded8266/web/page/main.js +++ b/embedded8266/web/page/main.js @@ -102,6 +102,8 @@ function ToggleOScopePause() function GotOScope(req,data) { + var mult = Number(document.getElementById('OSCMultIn').value); + document.getElementById('OSCMultOut').innerHTML = mult; var canvas = document.getElementById('OScopeCanvas'); var ctx = canvas.getContext('2d'); var h = canvas.height; @@ -122,12 +124,12 @@ function GotOScope(req,data) { var x2 = (i+1) * canvas.clientWidth / samps; var samp = parseInt( data.substr(i*2+2,2),16 ); - var y2 = ( 1.-samp / 255 ) * canvas.clientHeight; + var y2 = ( 1.-mult*samp / 255 ) * canvas.clientHeight; if( i == 0 ) { var x1 = i * canvas.clientWidth / samps; - var y1 = ( 1.-lastsamp / 255 ) * canvas.clientHeight; + var y1 = ( 1.-mult*lastsamp / 255 ) * canvas.clientHeight; ctx.moveTo( x1, y1 ); } @@ -184,6 +186,8 @@ function ToggleDFTPause() function GotDFT(req,data) { + var mult = Number(document.getElementById('DFTMultIn').value); + document.getElementById('DFTMultOut').innerHTML = mult; var canvas = document.getElementById('DFTCanvas'); var ctx = canvas.getContext('2d'); var h = canvas.height; @@ -205,7 +209,7 @@ function GotDFT(req,data) { var x2 = i * canvas.clientWidth / samps; var samp = parseInt( data.substr(i*4,4),16 ); - var y2 = ( 1.-samp / 2047 ) * canvas.clientHeight; + var y2 = ( 1.-mult*samp / 2047 ) * canvas.clientHeight; ctx.fillStyle = CCColor( i % globalParams["rFIXBPERO"] ); ctx.fillRect( x2, y2, canvas.clientWidth / samps, canvas.clientHeight-y2 );