Skip to content

Commit 44e3119

Browse files
author
Gary Keeble
committed
Add Status Bar
New Status bar shows log header information, sample rate, loop time, flight mode and bookmarks.
1 parent 2755e99 commit 44e3119

File tree

3 files changed

+210
-17
lines changed

3 files changed

+210
-17
lines changed

‎css/main.css‎

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -470,3 +470,67 @@ progress {
470470
.navbar-inverse .navbar-brand {
471471
color: #EAEAEA;
472472
}
473+
474+
#status-bar {
475+
position: fixed;
476+
bottom: 0px;
477+
width: 88%;
478+
height: 20px;
479+
line-height: 20px;
480+
padding: 0 10px 0 10px;
481+
border-top: 1px solid #7d7d79;
482+
background-color: #bfbeb5;
483+
}
484+
485+
#status-bar div {
486+
float: left;
487+
padding-right: 10px;
488+
margin-right: 10px;
489+
border-right: 1px solid #7d7d79;
490+
}
491+
492+
#status-bar .version {
493+
float: right;
494+
margin: 0;
495+
padding: 0;
496+
border: 0;
497+
}
498+
499+
#status-bar .bookmark-1,
500+
#status-bar .bookmark-2,
501+
#status-bar .bookmark-3,
502+
#status-bar .bookmark-4,
503+
#status-bar .bookmark-5,
504+
#status-bar .bookmark-6,
505+
#status-bar .bookmark-7,
506+
#status-bar .bookmark-8,
507+
#status-bar .bookmark-9 {
508+
background-color: red;
509+
color : white;
510+
padding-left: 0;
511+
padding-right: 0;
512+
width: 30px;
513+
margin-right: 0px;
514+
margin-left: 0px;
515+
text-align: center;
516+
visibility: hidden;
517+
cursor: pointer;
518+
}
519+
520+
#status-bar .marker-offset {
521+
visibility: hidden;
522+
cursor: pointer;
523+
}
524+
525+
#status-bar .bookmark-clear {
526+
background-color: blue;
527+
color : white;
528+
padding-left: 0;
529+
padding-right: 0;
530+
width: 60px;
531+
margin-right: 0px;
532+
margin-left: 0px;
533+
text-align: center;
534+
visibility: hidden;
535+
cursor: pointer;
536+
}

‎index.html‎

Lines changed: 52 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -146,12 +146,6 @@ <h3 class="log-filename"></h3>
146146
<p class="log-device-uid form-control-static"></p>
147147
</div>
148148
</div>
149-
<div class="form-group">
150-
<label class="col-sm-3 control-label">Battery</label>
151-
<div class="col-sm-9">
152-
<p class="log-cells form-control-static"></p>
153-
</div>
154-
</div>
155149
</div>
156150
</div>
157151

@@ -239,9 +233,6 @@ <h4>Time</h4>
239233
<div class="form-group">
240234
<input type="text" class="form-control graph-time" value="1.0" size="8">
241235
</div>
242-
<div class="form-group graph-time-marker-group">
243-
<input type="text" class="form-control graph-time-marker" value="0" size="8">
244-
</div>
245236
</div>
246237
</li>
247238
<li class="log-sync-panel">
@@ -299,6 +290,58 @@ <h4>Field values</h4>
299290
</tr>
300291
</table>
301292
</div>
293+
294+
<div id="status-bar">
295+
<div>
296+
<span class="version">-</span>
297+
</div>
298+
<div>
299+
<span class="log-cells">-</span>
300+
</div>
301+
<div>
302+
<span class="looptime">-</span>
303+
</div>
304+
<div>
305+
<span class="lograte">-</span>
306+
</div>
307+
<div>
308+
<span class="flight-mode">-</span>
309+
</div>
310+
<div>
311+
<span class="marker-offset">00:00.000</span>
312+
</div>
313+
<div class="bookmark-1">
314+
<span>1</span>
315+
</div>
316+
<div class="bookmark-2">
317+
<span>2</span>
318+
</div>
319+
<div class="bookmark-3">
320+
<span>3</span>
321+
</div>
322+
<div class="bookmark-4">
323+
<span>4</span>
324+
</div>
325+
<div class="bookmark-5">
326+
<span>5</span>
327+
</div>
328+
<div class="bookmark-6">
329+
<span>6</span>
330+
</div>
331+
<div class="bookmark-7">
332+
<span>7</span>
333+
</div>
334+
<div class="bookmark-8">
335+
<span>8</span>
336+
</div>
337+
<div class="bookmark-9">
338+
<span>9</span>
339+
</div>
340+
<div class="bookmark-clear">
341+
<span>Clear All</span>
342+
</div>
343+
</div>
344+
302345
</div>
303346
<!-- /container -->
304347

‎js/main.js‎

Lines changed: 94 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -134,12 +134,13 @@ function BlackboxLogViewer() {
134134

135135
if (frame) {
136136

137+
var currentFlightMode = frame[flightLog.getMainFieldIndexByName("flightModeFlags")];
138+
137139
if(hasTable) { // Only redraw the table if it is enabled
138140

139141
var
140142
rows = [],
141-
rowCount = Math.ceil(fieldNames.length / 2),
142-
currentFlightMode = frame[flightLog.getMainFieldIndexByName("flightModeFlags")];
143+
rowCount = Math.ceil(fieldNames.length / 2);
143144

144145
for (i = 0; i < rowCount; i++) {
145146
var
@@ -164,14 +165,21 @@ function BlackboxLogViewer() {
164165
}
165166

166167
table.append(rows.join(""));
168+
167169
}
168-
169-
// update time field on toolbar
170+
171+
// Update flight mode flags on status bar
172+
$("#status-bar .flight-mode").text(
173+
fieldPresenter.decodeFieldToFriendly(null, 'flightModeFlags', currentFlightMode, null)
174+
);
175+
176+
// update time field on status bar
170177
$(".graph-time").val(formatTime((currentBlackboxTime-flightLog.getMinTime())/1000, true));
171178
if(hasMarker) {
172-
$(".graph-time-marker").val(formatTime((currentBlackboxTime-markerTime)/1000, true));
179+
$("#status-bar .marker-offset").text('Marker Offset ' + formatTime((currentBlackboxTime-markerTime)/1000, true) + 'ms');
173180
}
174181

182+
175183
// Update the Legend Values
176184
if(graphLegend) graphLegend.updateValues(flightLog, frame);
177185
}
@@ -313,7 +321,7 @@ function BlackboxLogViewer() {
313321
*/
314322
function renderSelectedLogInfo() {
315323
$(".log-index").val(flightLog.getLogIndex());
316-
324+
317325
if (flightLog.getNumCellsEstimate()) {
318326
$(".log-cells").text(flightLog.getNumCellsEstimate() + "S (" + Number(flightLog.getReferenceVoltageMillivolts() / 1000).toFixed(2) + "V)");
319327
$(".log-cells-header,.log-cells").css('display', 'block');
@@ -328,6 +336,12 @@ function BlackboxLogViewer() {
328336
$(".log-device-uid-header,.log-device-uid").css('display', 'none');
329337
}
330338

339+
// Add log version information to status bar
340+
var sysConfig = flightLog.getSysConfig();
341+
$('#status-bar .version').text( ((sysConfig['Firmware revision']!=null)?(sysConfig['Firmware revision']):''));
342+
$('#status-bar .looptime').text( ((sysConfig['loopTime']!=null)?(sysConfig['loopTime'] +'us (' + (1000000/sysConfig['loopTime']).toFixed(0) + 'Hz)'):''));
343+
$('#status-bar .lograte').text( ((sysConfig['frameIntervalPDenom']!=null && sysConfig['frameIntervalPNum']!=null)?( 'Logging Sample Rate : ' + sysConfig['frameIntervalPNum'] +'/' + sysConfig['frameIntervalPDenom']):''));
344+
331345
seekBar.setTimeRange(flightLog.getMinTime(), flightLog.getMaxTime(), currentBlackboxTime);
332346
seekBar.setActivityRange(flightLog.getSysConfig().minthrottle, flightLog.getSysConfig().maxthrottle);
333347

@@ -954,6 +968,65 @@ function BlackboxLogViewer() {
954968

955969
keysDialog.show();
956970
});
971+
972+
$("#status-bar .marker-offset").click(function(e) {
973+
setCurrentBlackboxTime(markerTime);
974+
invalidateGraph();
975+
});
976+
977+
$('#status-bar .bookmark-1').click(function(e) {
978+
setCurrentBlackboxTime(bookmarkTimes[1]);
979+
invalidateGraph();
980+
});
981+
982+
$('#status-bar .bookmark-2').click(function(e) {
983+
setCurrentBlackboxTime(bookmarkTimes[2]);
984+
invalidateGraph();
985+
});
986+
987+
$('#status-bar .bookmark-3').click(function(e) {
988+
setCurrentBlackboxTime(bookmarkTimes[3]);
989+
invalidateGraph();
990+
});
991+
992+
$('#status-bar .bookmark-4').click(function(e) {
993+
setCurrentBlackboxTime(bookmarkTimes[4]);
994+
invalidateGraph();
995+
});
996+
997+
$('#status-bar .bookmark-5').click(function(e) {
998+
setCurrentBlackboxTime(bookmarkTimes[5]);
999+
invalidateGraph();
1000+
});
1001+
1002+
$('#status-bar .bookmark-6').click(function(e) {
1003+
setCurrentBlackboxTime(bookmarkTimes[6]);
1004+
invalidateGraph();
1005+
});
1006+
1007+
$('#status-bar .bookmark-7').click(function(e) {
1008+
setCurrentBlackboxTime(bookmarkTimes[7]);
1009+
invalidateGraph();
1010+
});
1011+
1012+
$('#status-bar .bookmark-8').click(function(e) {
1013+
setCurrentBlackboxTime(bookmarkTimes[8]);
1014+
invalidateGraph();
1015+
});
1016+
1017+
$('#status-bar .bookmark-9').click(function(e) {
1018+
setCurrentBlackboxTime(bookmarkTimes[9]);
1019+
invalidateGraph();
1020+
});
1021+
1022+
$('#status-bar .bookmark-clear').click(function(e) {
1023+
bookmarkTimes = null;
1024+
for(var i=1; i<=9; i++) {
1025+
$('#status-bar .bookmark-'+ i).css('visibility', 'hidden' );
1026+
}
1027+
$('#status-bar .bookmark-clear').css('visibility', 'hidden' );
1028+
invalidateGraph();
1029+
});
9571030

9581031
if (FlightLogVideoRenderer.isSupported()) {
9591032
$(".btn-video-export").click(function(e) {
@@ -1038,15 +1111,17 @@ function BlackboxLogViewer() {
10381111
case "M".charCodeAt(0):
10391112
if (e.altKey && hasMarker && hasVideo && hasLog) { // adjust the video sync offset and remove marker
10401113
try{
1041-
setVideoOffset(videoOffset + (stringTimetoMsec($(".graph-time-marker").val()) / 1000000), true);
1114+
setVideoOffset(videoOffset + (stringTimetoMsec($("#status-bar .marker-offset").text()) / 1000000), true);
10421115
} catch(e) {
10431116
console.log('Failed to set video offset');
10441117
}
10451118
} else { // Add a marker to graph window
10461119
markerTime = currentBlackboxTime;
1047-
$(".graph-time-marker").val(formatTime(0));
1120+
$("#status-bar .marker-offset").text('Marker Offset ' + formatTime(0) + 'ms');
1121+
10481122
}
10491123
setMarker(!hasMarker);
1124+
$("#status-bar .marker-offset").css('visibility', (hasMarker)?'visible':'hidden');
10501125
invalidateGraph();
10511126
e.preventDefault();
10521127
break;
@@ -1084,13 +1159,24 @@ function BlackboxLogViewer() {
10841159
// Special Case : Shift Alt 0 clears all bookmarks
10851160
if(e.which==48) {
10861161
bookmarkTimes = null;
1162+
for(var i=1; i<=9; i++) {
1163+
$('#status-bar .bookmark-'+ i).css('visibility', 'hidden' );
1164+
}
1165+
$('#status-bar .bookmark-clear').css('visibility', 'hidden' );
10871166
} else {
10881167
if(bookmarkTimes==null) bookmarkTimes = new Array();
10891168
if (bookmarkTimes[e.which-48] == null) {
10901169
bookmarkTimes[e.which-48] = currentBlackboxTime; // Save current time to bookmark
10911170
} else {
10921171
bookmarkTimes[e.which-48] = null; // clear the bookmark
10931172
}
1173+
$('#status-bar .bookmark-'+(e.which-48)).css('visibility', ((bookmarkTimes[e.which-48]!=null)?('visible'):('hidden')) );
1174+
var countBookmarks = 0;
1175+
for(var i=0; i<=9; i++) {
1176+
countBookmarks += (bookmarkTimes[i]!=null)?1:0;
1177+
}
1178+
$('#status-bar .bookmark-clear').css('visibility', ((countBookmarks>0)?('visible'):('hidden')) );
1179+
10941180
}
10951181
invalidateGraph();
10961182
}

0 commit comments

Comments
 (0)