Merge branch 'Analyser-Tweaks'

Author: GaryKeeble

index.html

@@ -292,8 +292,18 @@ <h4>Log sync</h4>
                 <canvas width="0" height="0" id="craftCanvas"></canvas>
                 <div class="analyser">
                 	<canvas width="0" height="0" id="analyserCanvas"></canvas>
-                	<input id="analyserZoomX" type="range" name="analyserZoomX" value="100" min="100" max="500" step="100" title=""/>
-					<input id="analyserZoomY" type="range" name="analyserZoomY" value="100" min="10" max="1000" step="10"/>
+                	<input id="analyserZoomX" type="range" name="analyserZoomX" value="100" min="100" max="500" step="10" title="" list="analyserZoomXTicks"/>
+					<input id="analyserZoomY" type="range" name="analyserZoomY" value="100" min="10" max="1000" step="10" list="analyserZoomYTicks"/>
+                    <datalist id="analyserZoomXTicks">
+                        <option>100</option>
+                        <option>200</option>
+                        <option>300</option>
+                        <option>400</option>
+                        <option>500</option>
+                    </datalist>
+                    <datalist id="analyserZoomYTicks">
+                        <option>100</option>
+                    </datalist>
 				</div>
                 <canvas width="0" height="0" id="analyserStickCanvas"></canvas>
                 <span class="log-open-legend-dialog glyphicon glyphicon-cog" data-toggle="tooltip" title="Show the legend"></span>
@@ -1314,7 +1324,10 @@ <h4 class="modal-title">Advanced User Settings</h4>
 									<div class="spacer_box_title">Analyser Settings</div>
 								</div>
 								<div class="spacer_box">
-									<table>
+                                    <div>
+                                        <label class="option">Hanning<input class="analyser-hanning ios-switch" type="checkbox"/><div><div></div></div><span>Use Hanning Window for Analyser</span></label>
+                                    </div>
+                                    <table>
 										<tr>
 											<td>
 												<label>Position</label>

js/graph_spectrum.js

@@ -138,15 +138,22 @@ try {
 		var samples = new Float64Array(MAX_ANALYSER_LENGTH/1000);
 
         // Loop through all the samples in the chunks and assign them to a sample array ready to pass to the FFT.
-        var sampleIndex = 0;
+        fftData.samples	= 0;
 		for (var chunkIndex = 0; chunkIndex < allChunks.length; chunkIndex++) {
 			var chunk = allChunks[chunkIndex];
 			for (var frameIndex = 0; frameIndex < chunk.frames.length; frameIndex++) {
-				samples[sampleIndex++] = (dataBuffer.curve.lookupRaw(chunk.frames[frameIndex][dataBuffer.fieldIndex]));
+				samples[fftData.samples++] = (dataBuffer.curve.lookupRaw(chunk.frames[frameIndex][dataBuffer.fieldIndex]));
 			}
 		}
 
-		//calculate fft
+        if(userSettings.analyserHanning) {
+            // apply hanning window function
+            for(var i=0; i<fftData.samples; i++) {
+                samples[i] *= 0.5 * (1-Math.cos((2*Math.PI*i)/(fftData.samples - 1)));
+            }
+        }
+
+        //calculate fft
 		var fftLength = samples.length;
 		var fftOutput = new Float64Array(fftLength * 2);
 		var fft = new FFT.complex(fftLength, false);
@@ -212,10 +219,10 @@ try {
 		var x = 0;
 
 		var barGradient = canvasCtx.createLinearGradient(0,HEIGHT,0,0);
-			barGradient.addColorStop(0,   'rgba(0,255,0,0.2)');
-			barGradient.addColorStop(0.15, 'rgba(128,255,0,0.2)');
-			barGradient.addColorStop(0.45, 'rgba(255,0,0,0.5)');
-			barGradient.addColorStop(1,   'rgba(255,128,128,1.0)');
+            barGradient.addColorStop(constrain(0/analyserZoomY,0,1),      'rgba(0,255,0,0.2)');
+            barGradient.addColorStop(constrain(0.15/analyserZoomY,0,1),   'rgba(128,255,0,0.2)');
+            barGradient.addColorStop(constrain(0.45/analyserZoomY,0,1),   'rgba(255,0,0,0.5)');
+            barGradient.addColorStop(constrain(1/analyserZoomY, 0, 1),    'rgba(255,128,128,1.0)');
         canvasCtx.fillStyle = barGradient; //'rgba(0,255,0,0.3)'; //green
 
         var fftScale = HEIGHT / (analyserZoomY*100);

js/user_settings_dialog.js

@@ -55,9 +55,8 @@ function UserSettingsDialog(dialog, onLoad, onSave) {
 		graphSmoothOverride : false, 			// Ability to toggle smoothing off=normal/ on=force 0%
         graphExpoOverride   : false, 			// Ability to toggle Expo off=normal/ on=force 100%
         graphGridOverride   : false, 			// Ability to toggle Expo off=normal/ on=force 100%
-        
-
 		analyserSampleRate	: 2000/*Hz*/,  		// the loop time for the log
+		analyserHanning	    : false,  			// use a hanning window on the analyser sample data
 		eraseBackground		: true,           	// Set to false if you want the graph to draw on top of an existing canvas image
 		craft				: {
 									left  : '15%',	// position from left (as a percentage of width)
@@ -288,6 +287,10 @@ function UserSettingsDialog(dialog, onLoad, onSave) {
 		currentSettings.stickInvertYaw = $(this).is(":checked");
 	});
 
+	$(".analyser-hanning").click(function() {
+		currentSettings.analyserHanning = $(this).is(":checked");
+	});
+
     // Load Custom Logo
     function readURL(input) {
         if (input.files && input.files[0]) {
@@ -348,6 +351,11 @@ function UserSettingsDialog(dialog, onLoad, onSave) {
 				$(".invert-yaw").prop('checked', currentSettings.stickInvertYaw);
 			}
 
+			if(currentSettings.analyserHanning!=null) {
+				// set the toggle switch
+				$(".analyser-hanning").prop('checked', currentSettings.analyserHanning);
+			}
+
 		mixerListSelection(currentSettings.mixerConfiguration); // select current mixer configuration
     		stickModeSelection(currentSettings.stickMode);