more reliable JS + fixed broken second marks

html_src/js-src/lib/chibi.js

@@ -628,6 +628,8 @@
 				query = null;
 			}
 
+			// FIXME the XHR sometimes seemingly silently fails
+
 			xhr = new XMLHttpRequest(); // we dont support IE < 9
 
 			if (xhr) {

html_src/js-src/notif.js

@@ -2,19 +2,25 @@ var notify = (function () {
 	var nt = {};
 	var sel = '#notif';
 
+	var hideTmeo1;
+	var hideTmeo2;
+
 	nt.show = function (message, timeout) {
 		$(sel).html(message);
 		modal.show(sel);
 
+		clearTimeout(hideTmeo1);
+		clearTimeout(hideTmeo2);
+
 		if (!_.isUndefined(timeout)) {
-			setTimeout(nt.hide, timeout);
+			hideTmeo1 = setTimeout(nt.hide, timeout);
 		}
 	};
 
 	nt.hide = function () {
 		var $m = $(sel);
 		$m.removeClass('visible');
-		setTimeout(function () {
+		hideTmeo2 = setTimeout(function () {
 			$m.addClass('hidden');
 		}, 250); // transition time
 	};

html_src/js-src/page_spectrogram.js

@@ -82,10 +82,11 @@ var page_spectrogram = (function () {
 	}
 
 	function shiftSg() {
-		var imageData = ctx.getImageData(plot.x+plot.dx, plot.y, plot.w-plot.dx, plot.h+6);
+		var imageData = ctx.getImageData(plot.x+plot.dx, plot.y, plot.w-plot.dx, plot.h+10);
 
 		ctx.fillStyle = 'black';
 		ctx.fillRect(plot.x, plot.y, plot.w, plot.h);
+		ctx.clearRect(plot.x, plot.y+plot.h+1, plot.w, 10); // clear the second marks box
 
 		ctx.putImageData(imageData, plot.x, plot.y);
 	}
@@ -123,7 +124,7 @@ var page_spectrogram = (function () {
 		}
 
 		// mark every 10 s
-		console.log('remain',msElapsed(lastMarkMs));
+		//console.log('remain',msElapsed(lastMarkMs));
 		if (msElapsed(lastMarkMs) >= 950) {
 			lastMarkMs = msNow();
 
@@ -138,8 +139,6 @@ var page_spectrogram = (function () {
 			ctx.moveTo(plot.x+plot.w-.5, plot.y+plot.h+1);
 			ctx.lineTo(plot.x+plot.w-.5, plot.y+plot.h+1+(long?6:2));
 			ctx.stroke();
-		} else {
-			ctx.clearRect(plot.x+plot.w-1, plot.y+plot.h+1,2,10);
 		}
 	}
 
@@ -231,29 +230,25 @@ var page_spectrogram = (function () {
 		var totalBins = (plot.h / plot.dy);
 		var totalHz = totalBins*perBin;
 
-		console.log("perbin=",perBin,"totalBins=",totalBins,"totalHz=",totalHz);
+		//console.log("perbin=",perBin,"totalBins=",totalBins,"totalHz=",totalHz);
 
 		var step;
 
-		var steps = [
-			[200, 10],
-			[1000, 50],
-			[3000, 250],
-			[5000, 500],
-			[10000, 1000],
-			[25000, 2500],
-			[50000, 5000],
-			[100000, 10000],
-			[500000, 50000],
-			[1000000, 100000],
-			[1/0, 250000],
-		];
-		for(var i = 0; i <= steps.length; i++) {
-			if (totalHz <= steps[i][0]) {
-				step = steps[i][1];
-				break;
+		// get the best step size
+		var steps = [10, 25, 50];
+		var multiplier = 1;
+		var suc = false;
+		do {
+			for (var i = 0; i < steps.length; i++) {
+				if ((totalHz / (steps[i] * multiplier)) <= 21) {
+					step = (steps[i] * multiplier);
+					suc = true;
+					break;
+				}
 			}
-		}
+			if (suc) break;
+			multiplier *= 10;
+		} while (true);
 
 		step = step/perBin;
 
@@ -263,8 +258,6 @@ var page_spectrogram = (function () {
 		ctx.strokeStyle = 'white';
 		ctx.textAlign = 'left';
 
-		var kilos = totalHz >= 10000;
-
 		// labels and dashes
 		for(var i = 0; i <= totalBins+step; i+= step) {
 			if (i >= totalBins) {
@@ -332,13 +325,13 @@ var page_spectrogram = (function () {
 			var count = +$('#count').val();
 			var tile = Math.max(1, plot.h/(count/2));
 
-			$('#tile-x').val(tile);
+			$('#tile-x').val(Math.max(4, tile)); // use width 4 for smaller by default (rolls more nicely)
 			$('#tile-y').val(tile);
 		});
 
 		// chain Y with X
 		$('#tile-y').on('change', function() {
-			$('#tile-x').val($(this).val());
+			$('#tile-x').val(Math.max(4,$(this).val()));
 		});
 
 		$('#go-btn').on('click', function() {

html_src/js-src/page_waveform.js

@@ -13,6 +13,8 @@ var page_waveform = (function () {
 
 	var zoomSavedX, zoomSavedY;
 
+	var readXhr; // read xhr
+
 	var opts = {
 		count: 0, // sample count
 		freq: 0 // sampling freq
@@ -145,26 +147,17 @@ var page_waveform = (function () {
 
 		if (status != 200) {
 			errorMsg("Request failed.", 1000);
-
-			if (autoReload)
-				toggleAutoReload(); // turn it off.
-
 		} else {
 			var j = JSON.parse(resp);
 			if (!j.success) {
 				errorMsg("Sampling failed.", 1000);
-
-				if (autoReload)
-					toggleAutoReload(); // turn it off.
-
-				return;
+			} else {
+				buildChart(j);
 			}
-
-			buildChart(j);
-
-			if (autoReload)
-				arTimeout = setTimeout(requestReload, Math.max(0, autoReloadTime - msElapsed(lastLoadMs)));
 		}
+
+		if (autoReload)
+			arTimeout = setTimeout(requestReload, Math.max(0, autoReloadTime - msElapsed(lastLoadMs)));
 	}
 
 	function readInputs() {
@@ -173,7 +166,10 @@ var page_waveform = (function () {
 	}
 
 	function requestReload() {
-		if (readoutPending) return false;
+		if (readoutPending) {
+			errorMsg("Request already pending - aborting.");
+			readXhr.abort();
+		}
 
 		readoutPending = true;
 		lastLoadMs = msNow();
@@ -181,7 +177,7 @@ var page_waveform = (function () {
 		var n = opts.count;
 		var fs = opts.freq;
 		var url = _root+'/measure/'+dataFormat+'?n='+n+'&fs='+fs;
-		$().get(url, onRxData, estimateLoadTime(fs,n));
+		readXhr = $().get(url, onRxData, estimateLoadTime(fs,n));
 
 		return true;
 	}