Skip to content

Commit 91a22c2

Browse files
Gary KeebleGary Keeble
Gary Keeble
authored and
Gary Keeble
committed
Add Custom Transmitter Modes
For those that fly Mode 1, the stick display can now show different configuration. Use the user settings page to set
1 parent b296083 commit 91a22c2

File tree

9 files changed

+166
-59
lines changed

9 files changed

+166
-59
lines changed

‎css/user_settings_dialog.css

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,41 @@
1-
.user-settings-dialog img {
1+
.user-settings-dialog .custom_mixes_group img {
22
width: 125px;
33
max-height: 125px;
44
}
55

6+
.user-settings-dialog .stick_mode_group img {
7+
width: 200px;
8+
max-height: 125px;
9+
}
10+
611
.user-settings-dialog table {
712
width:calc(100% - 2px);
813
}
914

1015
.user-settings-dialog select {
1116
width:100px;
1217
margin-left:10px;
18+
margin-bottom:5px
1319
}
1420

1521
.user-settings-dialog label.option {
1622
width: 100%;
1723
}
1824

25+
.user-settings-dialog label + input[type=radio] {
26+
margin-left: 6px;
27+
margin-bottom:5px
28+
}
29+
30+
.user-settings-dialog input[type=radio] {
31+
margin-left: 85px;
32+
margin-bottom:5px
33+
}
1934

2035
.user-settings-dialog label {
2136
width: 75px;
37+
margin-bottom:0px;
38+
2239
}
2340

2441

‎images/stick_modes/Mode_1.png

10.8 KB
Loading

‎images/stick_modes/Mode_2.png

10.8 KB
Loading

‎images/stick_modes/Mode_3.png

10.8 KB
Loading

‎images/stick_modes/Mode_4.png

10.8 KB
Loading

‎index.html

Lines changed: 26 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@
1818
<script src="js/vendor/modernizr-2.6.2-respond-1.1.0.min.js"></script>
1919
</head>
2020
<body>
21+
<!-- Navigation Bar -->
2122
<nav class="navbar navbar-inverse navbar-static-top" role="navigation">
2223
<div class="container header-pane">
2324
<div class="navbar-header">
@@ -37,7 +38,7 @@
3738
<!--</div>-->
3839
</div>
3940
</nav>
40-
41+
<!-- Welcome Page -->
4142
<div class="welcome-pane">
4243
<div class="container">
4344
<div class="jumbotron">
@@ -140,8 +141,8 @@ <h1>Welcome to the Enhanced Blackbox Explorer!</h1>
140141
</div>
141142
</div>
142143
</div>
143-
144-
<div class="container main-pane">
144+
<!-- Main Page -->
145+
<div class="container-fluid main-pane">
145146
<div class="log-metadata">
146147
<div class="log-info form-horizontal">
147148
<div class="form-group">
@@ -308,8 +309,7 @@ <h2>Legend <span class="log-close-legend-dialog glyphicon glyphicon-remove"></sp
308309
</div>
309310

310311
</div>
311-
<!-- /container -->
312-
312+
<!-- Status Bar -->
313313
<div id="status-bar">
314314
<div>
315315
<span class="version">-</span>
@@ -363,8 +363,8 @@ <h2>Legend <span class="log-close-legend-dialog glyphicon glyphicon-remove"></sp
363363
<span class="configuration-file-name">-</span>
364364
</div>
365365
</div>
366-
367-
<div class="modal fade" id="dlgGraphConfiguration">
366+
<!-- Dialog Boxes and Popup Windows -->
367+
<div class="modal fade graph-configuration-dialog" id="dlgGraphConfiguration">
368368
<div class="modal-dialog">
369369
<div class="modal-content">
370370
<div class="modal-header">
@@ -391,7 +391,6 @@ <h4 class="modal-title">Configure graphs</h4>
391391
</div>
392392
</div>
393393
</div>
394-
395394
<div class="modal fade header-dialog" id="dlgHeaderDialog">
396395
<div class="modal-dialog">
397396
<div class="modal-content">
@@ -840,7 +839,6 @@ <h5 class="modal-title-date"></h5>
840839
</div>
841840
</div>
842841
</div>
843-
844842
<div class="modal fade keys-dialog" id="dlgKeysDialog">
845843
<div class="modal-dialog">
846844
<div class="modal-content">
@@ -931,8 +929,7 @@ <h4 class="modal-title">Shortcut Keys</h4>
931929
</div>
932930
</div>
933931
</div>
934-
935-
<div class="modal fade" id="dlgVideoExport">
932+
<div class="modal fade video-export-dialog" id="dlgVideoExport">
936933
<div class="modal-dialog">
937934
<div class="modal-content">
938935
<div class="modal-header">
@@ -1044,7 +1041,6 @@ <h4 class="modal-title">Export video</h4>
10441041
</div>
10451042
</div>
10461043
</div>
1047-
10481044
<div class="modal fade user-settings-dialog" id="dlgUserSettings">
10491045
<div class="modal-dialog">
10501046
<div class="modal-content">
@@ -1055,8 +1051,6 @@ <h4 class="modal-title">Advanced User Settings</h4>
10551051
<div class="pane-user-settings form-horizontal">
10561052
<div class="form-group">
10571053
<label class="col-sm-3 control-label">Mixer Settings</label>
1058-
</tr>
1059-
</table>
10601054
<div class="col-sm-9">
10611055
<label class="option">Custom<input class="custom_mixes ios-switch orange" type="checkbox"/><div><div></div></div></label>
10621056
</div>
@@ -1076,6 +1070,23 @@ <h4 class="modal-title">Advanced User Settings</h4>
10761070
</p>
10771071
</div>
10781072
</div>
1073+
<div class="form-group">
1074+
<label class="col-sm-3 control-label">Stick Settings</label>
1075+
<div class="stick_mode_group col-sm-9">
1076+
<table>
1077+
<tr>
1078+
<td>
1079+
<label>Mode</label>
1080+
<input type="radio" name="stick-mode" value="1">Mode 1</input><br>
1081+
<input type="radio" name="stick-mode" value="2">Mode 2</input><br>
1082+
<input type="radio" name="stick-mode" value="3">Mode 3</input><br>
1083+
<input type="radio" name="stick-mode" value="4">Mode 4</input><br>
1084+
</td>
1085+
<td class="modePreview"><img src="./images/stick_modes/mode_2.png"/></td>
1086+
</tr>
1087+
</table>
1088+
</div>
1089+
</div>
10791090
</div>
10801091
</div>
10811092
<div class="modal-footer">
@@ -1085,7 +1096,7 @@ <h4 class="modal-title">Advanced User Settings</h4>
10851096
</div>
10861097
</div>
10871098
</div>
1088-
1099+
<!-- Scripts -->
10891100
<script src="js/vendor/jquery-1.11.3.min.js"></script>
10901101
<script src="js/vendor/bootstrap.min.js"></script>
10911102
<script src="js/vendor/jquery.ba-throttle-debounce.js"></script>

‎js/grapher.js

Lines changed: 68 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,11 @@ function FlightLogGrapher(flightLog, graphConfig, canvas, craftCanvas, analyserC
55
PID_P = 0,
66
PID_I = 1,
77
PID_D = 2,
8+
9+
STICK_MODE_1 = 1,
10+
STICK_MODE_2 = 2,
11+
STICK_MODE_3 = 3,
12+
STICK_MODE_4 = 4,
813

914
WHITE = "white",
1015

@@ -55,7 +60,7 @@ function FlightLogGrapher(flightLog, graphConfig, canvas, craftCanvas, analyserC
5560
drawCraft:"3D", drawPidTable:true, drawSticks:true, drawTime:true,
5661
drawAnalyser:true, // add an analyser option
5762
analyserSampleRate:2000/*Hz*/, // the loop time for the log
58-
eraseBackground: true // Set to false if you want the graph to draw on top of an existing canvas image
63+
eraseBackground: true // Set to false if you want the graph to draw on top of an existing canvas image
5964
},
6065

6166
windowWidthMicros = WINDOW_WIDTH_MICROS_DEFAULT,
@@ -253,6 +258,9 @@ function FlightLogGrapher(flightLog, graphConfig, canvas, craftCanvas, analyserC
253258
}
254259

255260
function drawCommandSticks(frame) {
261+
262+
canvasContext.save();
263+
256264
var
257265
// The total width available to draw both sticks in:
258266
sticksDisplayWidth = canvas.width * 0.3,
@@ -279,11 +287,35 @@ function FlightLogGrapher(flightLog, graphConfig, canvas, craftCanvas, analyserC
279287
rcCommand[stickIndex] = frame[idents.rcCommandFields[stickIndex]];
280288
}
281289

290+
291+
// map the stick positions based upon selected stick mode (default is mode 2)
292+
282293
//Compute the position of the sticks in the range [-1..1] (left stick x, left stick y, right stick x, right stick y)
283-
stickPositions[0] = -rcCommand[2] / yawStickMax; //Yaw
284-
stickPositions[1] = (1500 - rcCommand[3]) / 500; //Throttle
285-
stickPositions[2] = pitchStickCurve.lookup(rcCommand[0]); //Roll
286-
stickPositions[3] = pitchStickCurve.lookup(-rcCommand[1]); //Pitch
294+
switch(options.stickMode) {
295+
case STICK_MODE_1:
296+
stickPositions[0] = -rcCommand[2] / yawStickMax; //Yaw
297+
stickPositions[1] = pitchStickCurve.lookup(-rcCommand[1]); //Pitch
298+
stickPositions[2] = pitchStickCurve.lookup(rcCommand[0]); //Roll
299+
stickPositions[3] = (1500 - rcCommand[3]) / 500; //Throttle
300+
break;
301+
case STICK_MODE_3:
302+
stickPositions[0] = pitchStickCurve.lookup(rcCommand[0]); //Roll
303+
stickPositions[1] = pitchStickCurve.lookup(-rcCommand[1]); //Pitch
304+
stickPositions[2] = -rcCommand[2] / yawStickMax; //Yaw
305+
stickPositions[3] = (1500 - rcCommand[3]) / 500; //Throttle
306+
break;
307+
case STICK_MODE_4:
308+
stickPositions[0] = pitchStickCurve.lookup(rcCommand[0]); //Roll
309+
stickPositions[1] = (1500 - rcCommand[3]) / 500; //Throttle
310+
stickPositions[2] = -rcCommand[2] / yawStickMax; //Yaw
311+
stickPositions[3] = pitchStickCurve.lookup(-rcCommand[1]); //Pitch
312+
break;
313+
default: // Mode 2
314+
stickPositions[0] = -rcCommand[2] / yawStickMax; //Yaw
315+
stickPositions[1] = (1500 - rcCommand[3]) / 500; //Throttle
316+
stickPositions[2] = pitchStickCurve.lookup(rcCommand[0]); //Roll
317+
stickPositions[3] = pitchStickCurve.lookup(-rcCommand[1]); //Pitch
318+
}
287319

288320
for (stickIndex = 0; stickIndex < 4; stickIndex++) {
289321
//Clamp to [-1..1]
@@ -318,12 +350,6 @@ function FlightLogGrapher(flightLog, graphConfig, canvas, craftCanvas, analyserC
318350

319351
canvasContext.stroke();
320352

321-
//Draw circle to represent stick position
322-
canvasContext.beginPath();
323-
canvasContext.fillStyle = stickColor;
324-
canvasContext.arc(stickPositions[i * 2 + 0], stickPositions[i * 2 + 1], stickSurroundRadius / 5, 0, 2 * Math.PI);
325-
canvasContext.fill();
326-
327353
if (drawingParams.fontSizeCommandStickLabel) {
328354
canvasContext.fillStyle = WHITE;
329355

@@ -337,12 +363,37 @@ function FlightLogGrapher(flightLog, graphConfig, canvas, craftCanvas, analyserC
337363
stickLabel = frame[idents.rcCommandFields[(1 - i) * 2 + 1]] + "";
338364

339365
canvasContext.textAlign = 'right';
340-
canvasContext.fillText(stickLabel, -stickSurroundRadius - drawingParams.commandStickLabelMargin, drawingParams.fontSizeCurrentValueLabel / 2);
366+
canvasContext.fillText(stickLabel, -stickSurroundRadius, drawingParams.fontSizeCurrentValueLabel / 2);
367+
368+
369+
// put the mode label on the throttle stick
370+
if( (i==0 && (options.stickMode==STICK_MODE_2 || options.stickMode==STICK_MODE_4 )) ||
371+
(i==1 && (options.stickMode==STICK_MODE_1 || options.stickMode==STICK_MODE_3 ))
372+
) {
373+
//Draw stick mode label
374+
375+
canvasContext.fillStyle = crosshairColor;
376+
stickLabel = 'Mode ' + options.stickMode;
377+
378+
canvasContext.textAlign = 'center';
379+
canvasContext.fillText(stickLabel, 0, stickSurroundRadius - (drawingParams.fontSizeCurrentValueLabel / 2));
380+
}
381+
341382
}
383+
384+
//Draw circle to represent stick position
385+
canvasContext.beginPath();
386+
canvasContext.fillStyle = stickColor;
387+
canvasContext.arc(stickPositions[i * 2 + 0], stickPositions[i * 2 + 1], stickSurroundRadius / 7.5, 0, 2 * Math.PI);
388+
canvasContext.fill();
389+
342390

343391
//Advance to next stick
344392
canvasContext.translate(stickSurroundRadius + drawingParams.stickSpacing + stickSurroundRadius, 0);
345393
}
394+
395+
canvasContext.restore();
396+
346397
}
347398

348399
var
@@ -963,6 +1014,11 @@ function FlightLogGrapher(flightLog, graphConfig, canvas, craftCanvas, analyserC
9631014
analyser.setFullscreen( state );
9641015
};
9651016

1017+
// Update user options
1018+
this.refreshOptions = function(newSettings) {
1019+
options = $.extend(defaultOptions, newSettings || {});
1020+
}
1021+
9661022
// Use defaults for any options not provided
9671023
options = extend(defaultOptions, options || {});
9681024

‎js/main.js

Lines changed: 4 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -500,18 +500,13 @@ function BlackboxLogViewer() {
500500
graph.destroy();
501501
}
502502

503-
var graphOptions = {
504-
drawAnalyser:true, // add an analyser option
505-
analyserSampleRate:2000/*Hz*/, // the loop time for the log
506-
};
507-
508503
if((flightLog.getSysConfig().loopTime != null) &&
509504
(flightLog.getSysConfig().frameIntervalPNum != null) &&
510505
(flightLog.getSysConfig().frameIntervalPDenom != null) ) {
511-
graphOptions.analyserSampleRate = 1000000 / (flightLog.getSysConfig().loopTime * flightLog.getSysConfig().frameIntervalPDenom / flightLog.getSysConfig().frameIntervalPNum);
506+
userSettings.analyserSampleRate = 1000000 / (flightLog.getSysConfig().loopTime * flightLog.getSysConfig().frameIntervalPDenom / flightLog.getSysConfig().frameIntervalPNum);
512507
}
513508

514-
graph = new FlightLogGrapher(flightLog, activeGraphConfig, canvas, craftCanvas, analyserCanvas, graphOptions);
509+
graph = new FlightLogGrapher(flightLog, activeGraphConfig, canvas, craftCanvas, analyserCanvas, userSettings);
515510

516511
setVideoInTime(false);
517512
setVideoOutTime(false);
@@ -707,9 +702,7 @@ function BlackboxLogViewer() {
707702
if(item) {
708703
userSettings = item;
709704
} else {
710-
userSettings = { // default settings
711-
customMix: null
712-
};
705+
userSettings = null;
713706
}
714707
});
715708

@@ -1092,6 +1085,7 @@ function BlackboxLogViewer() {
10921085

10931086
// refresh the craft model
10941087
if(graph!=null) {
1088+
graph.refreshOptions(newSettings);
10951089
graph.initializeCraftModel();
10961090
invalidateGraph();
10971091
}

0 commit comments

Comments
 (0)