mirror of
https://github.com/betaflight/betaflight.git
synced 2025-07-21 15:25:36 +03:00
Merge remote-tracking branch 'multiwii/development'
Conflicts: tabs/receiver.css tabs/receiver.html tabs/receiver.js
This commit is contained in:
commit
c46ab5b98c
6 changed files with 65 additions and 116 deletions
|
@ -293,6 +293,9 @@
|
||||||
"receiverRcExpo": {
|
"receiverRcExpo": {
|
||||||
"message": "RC Expo"
|
"message": "RC Expo"
|
||||||
},
|
},
|
||||||
|
"receiverRefreshRateTitle": {
|
||||||
|
"message": "Graph refresh rate"
|
||||||
|
},
|
||||||
"receiverButtonSave": {
|
"receiverButtonSave": {
|
||||||
"message": "Save"
|
"message": "Save"
|
||||||
},
|
},
|
||||||
|
|
10
js/libraries/d3.min.js
vendored
10
js/libraries/d3.min.js
vendored
File diff suppressed because one or more lines are too long
|
@ -24,14 +24,14 @@
|
||||||
.tab-receiver .bars .meter {
|
.tab-receiver .bars .meter {
|
||||||
width: 70%;
|
width: 70%;
|
||||||
}
|
}
|
||||||
.tab-receiver .bars .meter meter {
|
.tab-receiver .bars .meter meter {
|
||||||
margin-top: 4px;
|
margin-top: 4px;
|
||||||
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 14px;
|
height: 14px;
|
||||||
|
|
||||||
border: 1px solid silver;
|
border: 1px solid silver;
|
||||||
}
|
}
|
||||||
.tab-receiver .bars .value {
|
.tab-receiver .bars .value {
|
||||||
width: 50px;
|
width: 50px;
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
|
|
|
@ -1,77 +1,5 @@
|
||||||
<div class="tab-receiver">
|
<div class="tab-receiver">
|
||||||
<div class="bars">
|
<div class="bars">
|
||||||
<ul style="color: #00A8F0">
|
|
||||||
<li class="name">Roll</li>
|
|
||||||
<li class="meter"><meter min="800" max="2200"></meter></li>
|
|
||||||
<li class="value"></li>
|
|
||||||
</ul>
|
|
||||||
<div class="clear-both"></div>
|
|
||||||
<ul style="color: #C0D800">
|
|
||||||
<li class="name">Pitch</li>
|
|
||||||
<li class="meter"><meter min="800" max="2200"></meter></li>
|
|
||||||
<li class="value"></li>
|
|
||||||
</ul>
|
|
||||||
<div class="clear-both"></div>
|
|
||||||
<ul style="color: #CB4B4B">
|
|
||||||
<li class="name">Yaw</li>
|
|
||||||
<li class="meter"><meter min="800" max="2200"></meter></li>
|
|
||||||
<li class="value"></li>
|
|
||||||
</ul>
|
|
||||||
<div class="clear-both"></div>
|
|
||||||
<ul style="color: #4DA74D">
|
|
||||||
<li class="name">Throttle</li>
|
|
||||||
<li class="meter"><meter min="800" max="2200"></meter></li>
|
|
||||||
<li class="value"></li>
|
|
||||||
</ul>
|
|
||||||
<div class="clear-both"></div>
|
|
||||||
<ul style="color: #9440ED">
|
|
||||||
<li class="name">AUX1</li>
|
|
||||||
<li class="meter"><meter min="800" max="2200"></meter></li>
|
|
||||||
<li class="value"></li>
|
|
||||||
</ul>
|
|
||||||
<div class="clear-both"></div>
|
|
||||||
<ul style="color: #45147a">
|
|
||||||
<li class="name">AUX2</li>
|
|
||||||
<li class="meter"><meter min="800" max="2200"></meter></li>
|
|
||||||
<li class="value"></li>
|
|
||||||
</ul>
|
|
||||||
<div class="clear-both"></div>
|
|
||||||
<ul style="color: #cf7a26">
|
|
||||||
<li class="name">AUX3</li>
|
|
||||||
<li class="meter"><meter min="800" max="2200"></meter></li>
|
|
||||||
<li class="value"></li>
|
|
||||||
</ul>
|
|
||||||
<div class="clear-both"></div>
|
|
||||||
<ul style="color: #147a66">
|
|
||||||
<li class="name">AUX4</li>
|
|
||||||
<li class="meter"><meter min="800" max="2200"></meter></li>
|
|
||||||
<li class="value"></li>
|
|
||||||
</ul>
|
|
||||||
<div class="clear-both"></div>
|
|
||||||
<ul style="color: #407a9">
|
|
||||||
<li class="name">AUX5</li>
|
|
||||||
<li class="meter"><meter min="800" max="2200"></meter></li>
|
|
||||||
<li class="value"></li>
|
|
||||||
</ul>
|
|
||||||
<div class="clear-both"></div>
|
|
||||||
<ul style="color: #7a1445">
|
|
||||||
<li class="name">AUX6</li>
|
|
||||||
<li class="meter"><meter min="800" max="2200"></meter></li>
|
|
||||||
<li class="value"></li>
|
|
||||||
</ul>
|
|
||||||
<div class="clear-both"></div>
|
|
||||||
<ul style="color: #267acf">
|
|
||||||
<li class="name">AUX7</li>
|
|
||||||
<li class="meter"><meter min="800" max="2200"></meter></li>
|
|
||||||
<li class="value"></li>
|
|
||||||
</ul>
|
|
||||||
<div class="clear-both"></div>
|
|
||||||
<ul style="color: #7a6614">
|
|
||||||
<li class="name">AUX8</li>
|
|
||||||
<li class="meter"><meter min="800" max="2200"></meter></li>
|
|
||||||
<li class="value"></li>
|
|
||||||
</ul>
|
|
||||||
<div class="clear-both"></div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="tunings">
|
<div class="tunings">
|
||||||
<table class="throttle">
|
<table class="throttle">
|
||||||
|
@ -106,7 +34,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="clear-both"></div>
|
<div class="clear-both"></div>
|
||||||
<select title="Plot refresh rate" name="rx_refresh_rate">
|
<select name="rx_refresh_rate" i18n_title="receiverRefreshRateTitle">
|
||||||
<option value="10">10 ms</option>
|
<option value="10">10 ms</option>
|
||||||
<option value="20">20 ms</option>
|
<option value="20">20 ms</option>
|
||||||
<option value="30">30 ms</option>
|
<option value="30">30 ms</option>
|
||||||
|
|
|
@ -31,6 +31,44 @@ function tab_initialize_receiver() {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// generate bars
|
||||||
|
var bar_names = [
|
||||||
|
'Roll',
|
||||||
|
'Pitch',
|
||||||
|
'Yaw',
|
||||||
|
'Throttle',
|
||||||
|
'AUX 1',
|
||||||
|
'AUX 2',
|
||||||
|
'AUX 3',
|
||||||
|
'AUX 4',
|
||||||
|
'AUX 5',
|
||||||
|
'AUX 6',
|
||||||
|
'AUX 7',
|
||||||
|
'AUX 8'
|
||||||
|
];
|
||||||
|
|
||||||
|
var bar_container = $('.tab-receiver .bars');
|
||||||
|
for (var i = 0; i < RC.active_channels; i++) {
|
||||||
|
bar_container.append('\
|
||||||
|
<ul>\
|
||||||
|
<li class="name">' + bar_names[i] + '</li>\
|
||||||
|
<li class="meter"><meter min="800" max="2200"></meter></li>\
|
||||||
|
<li class="value"></li>\
|
||||||
|
</ul>\
|
||||||
|
<div class="clear-both"></div>\
|
||||||
|
');
|
||||||
|
}
|
||||||
|
|
||||||
|
var meter_array = [];
|
||||||
|
$('meter', bar_container).each(function() {
|
||||||
|
meter_array.push($(this));
|
||||||
|
});
|
||||||
|
|
||||||
|
var meter_values_array = [];
|
||||||
|
$('.value', bar_container).each(function() {
|
||||||
|
meter_values_array.push($(this));
|
||||||
|
});
|
||||||
|
|
||||||
// UI Hooks
|
// UI Hooks
|
||||||
// curves
|
// curves
|
||||||
$('.tunings .throttle input').change(function() {
|
$('.tunings .throttle input').change(function() {
|
||||||
|
@ -142,25 +180,6 @@ function tab_initialize_receiver() {
|
||||||
send_message(MSP_codes.MSP_RC, false, false, update_ui);
|
send_message(MSP_codes.MSP_RC, false, false, update_ui);
|
||||||
}
|
}
|
||||||
|
|
||||||
var meter_array = [];
|
|
||||||
$('.tab-receiver meter').each(function() {
|
|
||||||
meter_array.push($(this));
|
|
||||||
});
|
|
||||||
|
|
||||||
var meter_values_array = [];
|
|
||||||
$('.tab-receiver .value').each(function() {
|
|
||||||
meter_values_array.push($(this));
|
|
||||||
});
|
|
||||||
|
|
||||||
// show only relevant bars and plots for channels
|
|
||||||
$('.tab-receiver .bars ul').hide();
|
|
||||||
$('.tab-receiver .line').hide();
|
|
||||||
|
|
||||||
for (var channelIndex = 0; channelIndex < RC.active_channels; channelIndex++) {
|
|
||||||
$('.tab-receiver .bars ul').eq(channelIndex).show();
|
|
||||||
$('.tab-receiver .line').eq(channelIndex).show();
|
|
||||||
}
|
|
||||||
|
|
||||||
// setup plot
|
// setup plot
|
||||||
var RX_plot_data = new Array(RC.active_channels);
|
var RX_plot_data = new Array(RC.active_channels);
|
||||||
for (var i = 0; i < RX_plot_data.length; i++) {
|
for (var i = 0; i < RX_plot_data.length; i++) {
|
||||||
|
@ -171,9 +190,9 @@ function tab_initialize_receiver() {
|
||||||
var svg = d3.select("svg");
|
var svg = d3.select("svg");
|
||||||
|
|
||||||
var RX_plot_e = $('#RX_plot');
|
var RX_plot_e = $('#RX_plot');
|
||||||
|
var margin = {top: 20, right: 20, bottom: 10, left: 40};
|
||||||
var width, height, widthScale, heightScale;
|
var width, height, widthScale, heightScale;
|
||||||
function update_receiver_plot_size() {
|
function update_receiver_plot_size() {
|
||||||
var margin = {top: 20, right: 20, bottom: 10, left: 40};
|
|
||||||
width = RX_plot_e.width() - margin.left - margin.right;
|
width = RX_plot_e.width() - margin.left - margin.right;
|
||||||
height = RX_plot_e.height() - margin.top - margin.bottom;
|
height = RX_plot_e.height() - margin.top - margin.bottom;
|
||||||
|
|
||||||
|
|
|
@ -40,11 +40,10 @@ function tab_initialize_sensors() {
|
||||||
return sampleNumber + 1;
|
return sampleNumber + 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
function updateGraphHelperSize(selector, helpers) {
|
var margin = {top: 20, right: 20, bottom: 10, left: 40};
|
||||||
var target_e = $(selector);
|
function updateGraphHelperSize(helpers) {
|
||||||
var margin = {top: 20, right: 20, bottom: 10, left: 40};
|
helpers.width = helpers.targetElement.width() - margin.left - margin.right;
|
||||||
helpers.width = target_e.width() - margin.left - margin.right;
|
helpers.height = helpers.targetElement.height() - margin.top - margin.bottom;
|
||||||
helpers.height = target_e.height() - margin.top - margin.bottom;
|
|
||||||
|
|
||||||
helpers.widthScale.range([0, helpers.width]);
|
helpers.widthScale.range([0, helpers.width]);
|
||||||
helpers.heightScale.range([helpers.height, 0]);
|
helpers.heightScale.range([helpers.height, 0]);
|
||||||
|
@ -54,7 +53,7 @@ function tab_initialize_sensors() {
|
||||||
}
|
}
|
||||||
|
|
||||||
function initGraphHelpers(selector, sampleNumber, heightDomain) {
|
function initGraphHelpers(selector, sampleNumber, heightDomain) {
|
||||||
var helpers = {selector: selector, dynamicHeightDomain: !heightDomain};
|
var helpers = {selector: selector, targetElement: $(selector), dynamicHeightDomain: !heightDomain};
|
||||||
|
|
||||||
helpers.widthScale = d3.scale.linear()
|
helpers.widthScale = d3.scale.linear()
|
||||||
.clamp(true)
|
.clamp(true)
|
||||||
|
@ -67,7 +66,7 @@ function tab_initialize_sensors() {
|
||||||
helpers.xGrid = d3.svg.axis();
|
helpers.xGrid = d3.svg.axis();
|
||||||
helpers.yGrid = d3.svg.axis();
|
helpers.yGrid = d3.svg.axis();
|
||||||
|
|
||||||
updateGraphHelperSize(selector, helpers);
|
updateGraphHelperSize(helpers);
|
||||||
|
|
||||||
helpers.xGrid
|
helpers.xGrid
|
||||||
.scale(helpers.widthScale)
|
.scale(helpers.widthScale)
|
||||||
|
@ -352,7 +351,7 @@ function tab_initialize_sensors() {
|
||||||
|
|
||||||
function update_imu_graphs() {
|
function update_imu_graphs() {
|
||||||
if (checkboxes[0]) {
|
if (checkboxes[0]) {
|
||||||
updateGraphHelperSize('#gyro', gyroHelpers);
|
updateGraphHelperSize(gyroHelpers);
|
||||||
|
|
||||||
samples_gyro_i = addSampleToData(gyro_data, samples_gyro_i, SENSOR_DATA.gyroscope);
|
samples_gyro_i = addSampleToData(gyro_data, samples_gyro_i, SENSOR_DATA.gyroscope);
|
||||||
drawGraph(gyroHelpers, gyro_data, samples_gyro_i);
|
drawGraph(gyroHelpers, gyro_data, samples_gyro_i);
|
||||||
|
@ -362,7 +361,7 @@ function tab_initialize_sensors() {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (checkboxes[1]) {
|
if (checkboxes[1]) {
|
||||||
updateGraphHelperSize('#accel', accelHelpers);
|
updateGraphHelperSize(accelHelpers);
|
||||||
|
|
||||||
samples_accel_i = addSampleToData(accel_data, samples_accel_i, SENSOR_DATA.accelerometer);
|
samples_accel_i = addSampleToData(accel_data, samples_accel_i, SENSOR_DATA.accelerometer);
|
||||||
drawGraph(accelHelpers, accel_data, samples_accel_i);
|
drawGraph(accelHelpers, accel_data, samples_accel_i);
|
||||||
|
@ -372,7 +371,7 @@ function tab_initialize_sensors() {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (checkboxes[2]) {
|
if (checkboxes[2]) {
|
||||||
updateGraphHelperSize('#mag', magHelpers);
|
updateGraphHelperSize(magHelpers);
|
||||||
|
|
||||||
samples_mag_i = addSampleToData(mag_data, samples_mag_i, SENSOR_DATA.magnetometer);
|
samples_mag_i = addSampleToData(mag_data, samples_mag_i, SENSOR_DATA.magnetometer);
|
||||||
drawGraph(magHelpers, mag_data, samples_mag_i);
|
drawGraph(magHelpers, mag_data, samples_mag_i);
|
||||||
|
@ -383,7 +382,7 @@ function tab_initialize_sensors() {
|
||||||
}
|
}
|
||||||
|
|
||||||
function update_altitude_graph() {
|
function update_altitude_graph() {
|
||||||
updateGraphHelperSize('#baro', baroHelpers);
|
updateGraphHelperSize(baroHelpers);
|
||||||
|
|
||||||
samples_baro_i = addSampleToData(baro_data, samples_baro_i, [SENSOR_DATA.altitude]);
|
samples_baro_i = addSampleToData(baro_data, samples_baro_i, [SENSOR_DATA.altitude]);
|
||||||
drawGraph(baroHelpers, baro_data, samples_baro_i);
|
drawGraph(baroHelpers, baro_data, samples_baro_i);
|
||||||
|
@ -392,7 +391,7 @@ function tab_initialize_sensors() {
|
||||||
|
|
||||||
function update_debug_graphs() {
|
function update_debug_graphs() {
|
||||||
for (var i = 0; i < 4; i++) {
|
for (var i = 0; i < 4; i++) {
|
||||||
updateGraphHelperSize(debugHelpers[i].selector, debugHelpers[i]);
|
updateGraphHelperSize(debugHelpers[i]);
|
||||||
|
|
||||||
addSampleToData(debug_data[i], samples_debug_i, [SENSOR_DATA.debug[i]]);
|
addSampleToData(debug_data[i], samples_debug_i, [SENSOR_DATA.debug[i]]);
|
||||||
drawGraph(debugHelpers[i], debug_data[i], samples_debug_i);
|
drawGraph(debugHelpers[i], debug_data[i], samples_debug_i);
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue