Minor tweaks to appearance and mousewheel

Mouse wheel scrolls page when not over the chart.

Author: Gary Keeble

css/header_dialog.css

@@ -188,10 +188,6 @@ input[type="number"]::-webkit-inner-spin-button {
     border-top-right-radius: 3px;
 }
 
-.header-dialog .parameter {
-    margin-bottom: 10px;
-}
-
 .header-dialog input[type="number"]::-webkit-inner-spin-button {
     border: 0;
 }
@@ -255,7 +251,7 @@ input[type="number"]::-webkit-inner-spin-button {
 
 .header-dialog table input {
     display: block;
-    width: calc(100% - 0px);
+    width: calc(100% - 4px);
     height: 20px;
     line-height: 20px;
     text-align: right;
@@ -346,7 +342,7 @@ input[type="number"]::-webkit-inner-spin-button {
 .header-dialog .parameter {
     float: right;
     width: calc(100% - 2px);
-    margin-bottom: 10px;
+    margin-top: 10px;
 }
 
 html:not(.isCF) .cf-only,
@@ -477,23 +473,10 @@ html:not(.isBF) .bf-only {
     border: 0px solid #ccc;
 }
 
-.header-dialog .features input[type=checkbox],
-.header-dialog .static-features input[type=checkbox] {
-    width: 50px;
-    padding-left: 3px;
-    height: 20px;
-    line-height: 20px;
-    text-align: left;
-    border: 0px solid silver;
-    border-radius: 3px;
-    margin-right: 11px;
-    font-weight: normal;
-}
-
 .header-dialog .features label,
 .header-dialog .static-features label{
     /* width: 70px; */
-    padding-left: 3px;
+    /* padding-left: 3px; */
     height: 20px;
     line-height: 20px;
     text-align: left;
@@ -587,4 +570,4 @@ html:not(.isBF) .bf-only {
 
 .header-dialog .topspacer {
     margin-top:15px;
-}
+}

index.html

@@ -616,6 +616,19 @@ <h5 class="modal-title-date"></h5>
 									</table>
 								</div>
 							</div>
+							<div class="gui_box grey topspacer unknown">
+								<div class="gui_box_titlebar">
+									<div class="spacer_box_title">Unknown Header Fields</div>
+								</div>
+								<div class="spacer_box">
+									<table class="parameter cf">
+											<tr>
+												<td>Name</td>
+												<td>Value</td>
+											</tr>
+									</table>
+								</div>
+							</div>
 						</div>
 						<div class="cf_column half right">
 							<div class="spacer_left">

js/flightlog.js

@@ -115,7 +115,12 @@ function FlightLog(logData) {
     this.getSysConfig = function() {
         return parser.sysConfig;
     };
-    
+
+    this.setSysConfig = function(newSysConfig) {
+        parser.sysConfig = newSysConfig;
+    };
+
+
     /**
      * Get the index of the currently selected log.
      */

js/flightlog_parser.js

@@ -232,7 +232,8 @@ var FlightLogParser = function(logData) {
             gyro_cal_on_first_arm:null,     // Gyro Calibrate on first arm
             vbat_pid_compensation:null,     // VBAT PID compensation
             rc_smoothing:null,              // RC Control Smoothing 
-            features:null                   // Activated features (e.g. MOTORSTOP etc) 
+            features:null,                  // Activated features (e.g. MOTORSTOP etc)
+            unknownHeaders : []             // Unknown Extra Headers
         },
 
         frameTypes,
@@ -609,6 +610,8 @@ var FlightLogParser = function(logData) {
                     }
                 } else {
                     console.log("Ignoring unsupported header \"" + fieldName + "\"");
+                    if(that.sysConfig.unknownHeaders==null) that.sysConfig.unknownHeaders = new Array();
+                    that.sysConfig.unknownHeaders.push({ name: fieldName, value: fieldValue });// Save the unknown headers
                 }
             break;
         }

js/graph_config_dialog.js

@@ -53,7 +53,7 @@ function GraphConfigurationDialog(dialog, onSave) {
                 + '</li>'
             ),
             select = $('select', elem),
-            selectedFieldName = field ? field.name : false,
+            selectedFieldName = field ?field.name : false,
             i;
 
         for (i = 0; i < offeredFieldNames.length; i++) {

js/grapher.js

@@ -992,7 +992,7 @@ function FlightLogGrapher(flightLog, graphConfig, canvas, craftCanvas, options)
 	analyser = new FlightLogAnalyser(flightLog, graphConfig, canvas, craftCanvas, options);
 
     //Handle dragging events
-    $(canvas).on("mousedown", onMouseDown);
+    $(canvas).on("mousedown",onMouseDown);
 
     graphConfig.addListener(refreshGraphConfig);
     refreshGraphConfig();

js/header_dialog.js

@@ -150,7 +150,7 @@ function HeaderDialog(dialog, onSave) {
             var feature_tip_html = '';
 
             if (features[i].mode === 'group') {
-                row_e = $('<tr><td style="width: 15px;"><input style="width: 13px;" class="feature" id="feature-'
+                row_e = $('<tr><td><input class="feature" id="feature-'
                         + i
                         + '" value="'
                         + features[i].bit
@@ -210,6 +210,29 @@ function HeaderDialog(dialog, onSave) {
 
 	}
 
+	function renderUnknownHeaders(unknownHeaders) {
+		// Build a table of unknown header entries
+		try {
+			if(unknownHeaders!=0) {
+				var table = $('.unknown table');
+				var elem = '';
+				$("tr:not(:first)", table).remove(); // clear the entries (not the first row which has the title bar)
+
+				for(var i=0; i<unknownHeaders.length; i++) {
+					elem += '<tr><td>' + unknownHeaders[i].name + '</td>' +
+								'<td>' + unknownHeaders[i].value + '</td></tr>';						
+				}
+
+				table.append(elem);						
+				$('.unknown').show();
+			} else {
+				$('.unknown').hide();
+			}
+		} catch(e) {
+			$('.unknown').hide();
+		}
+	}
+
     function renderSysConfig(sysConfig) { 
 
     	// Update the log header
@@ -311,20 +334,24 @@ function HeaderDialog(dialog, onSave) {
         setParameter('acc_cut_hz'				,sysConfig.acc_cut_hz,2);
 	    renderSelect('superExpoYawMode'		    ,sysConfig.superExpoYawMode, SUPER_EXPO_YAW);
 
-/* Packed Flags */
+		/* Packed Flags */
 
         builtFeaturesList(sysConfig.features);
 
-/* Hardware selections */
+		/* Hardware selections */
 
     	renderSelect('acc_hardware'		    	,sysConfig.acc_hardware, ACC_HARDWARE);
     	renderSelect('baro_hardware'		    ,sysConfig.baro_hardware, BARO_HARDWARE);
     	renderSelect('mag_hardware'		    	,sysConfig.mag_hardware, MAG_HARDWARE);
 
-/* Booleans */
+		/* Booleans */
         setCheckbox('gyro_cal_on_first_arm'		,sysConfig.gyro_cal_on_first_arm);
         setCheckbox('vbat_pid_compensation'		,sysConfig.vbat_pid_compensation);
         setCheckbox('rc_smoothing'				,sysConfig.rc_smoothing);
+
+        /* Show Unknown Fields */
+        renderUnknownHeaders(sysConfig.unknownHeaders);
+
     }
 
     function convertUIToSysConfig() {
@@ -396,6 +423,7 @@ function HeaderDialog(dialog, onSave) {
     this.show = function(sysConfig) { 
             dialog.modal('show');
             renderSysConfig(sysConfig);
+
     }
 
  	// Buttons

js/main.js

@@ -830,9 +830,10 @@ function BlackboxLogViewer() {
                 newGraphConfig(newConfig);   
             }),
 
-            headerDialog = new HeaderDialog($("#dlgHeaderDialog"), function(newSettings) {
-                if(newSettings!=null) {
-                    prefs.set('lastHeaderData', newSettings);
+            headerDialog = new HeaderDialog($("#dlgHeaderDialog"), function(newSysConfig) {
+                if(newSysConfig!=null) {
+                    prefs.set('lastHeaderData', newSysConfig);
+                    //flightLog.setSysConfig(newSysConfig);
 
                     // Save Current Position then re-calculate all the log information
                     var activePosition = (hasVideo)?video.currentTime:currentBlackboxTime;
@@ -894,7 +895,7 @@ function BlackboxLogViewer() {
         $(window).resize(updateCanvasSize);
 
         $(document).on("mousewheel", function(e) {
-        if (graph && $(e.target).parents('.modal').length == 0) {
+        if (graph && $(e.target).parents('.modal').length == 0 && $(e.target).attr('id') == 'graphCanvas') {
                 var delta = Math.max(-1, Math.min(1, (e.originalEvent.wheelDelta)));
                 if(delta<0) { // scroll down (or left)
                     if (e.altKey || e.shiftKey) {