sundowndev
/
betaflight-configurator
mirror of https://github.com/sundowndev/betaflight-configurator.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

hook raw values text representations to data

10.3.x-maintenance
cTn 2014-04-13 15:33:06 +02:00
parent a0a2ff47a8
commit b577479678
3 changed files with 60 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
tabs/sensors.css
View File

@ -3,7 +3,7 @@
.tab-sensors .plot_control { .tab-sensors .plot_control {
float: right; float: right;
width: 168px; width: 158px;
border: 1px solid silver; border: 1px solid silver;
} }
@ -31,6 +31,15 @@
margin-left: 20px; margin-left: 20px;
height: 22px; height: 22px;
} }
.tab-sensors .plot_control .x {
color: #00A8F0;
}
.tab-sensors .plot_control .y {
color: #C0D800;
}
.tab-sensors .plot_control .z {
color: #CB4B4B;
}
.tab-sensors select { .tab-sensors select {
width: 70px; width: 70px;
border: 1px solid silver; border: 1px solid silver;
@ -39,7 +48,7 @@
.tab-sensors svg { .tab-sensors svg {
float: right; float: right;
width: 730px; width: 740px;
height: 140px; height: 140px;
margin-bottom: 10px; margin-bottom: 10px;

44
tabs/sensors.html
View File

@ -1,6 +1,6 @@
<div class="tab-sensors"> <div class="tab-sensors">
<div class="plot_control"> <div class="plot_control">
<div class="title">Gyroscope</div> <div class="title">Gyroscope - deg/s</div>
<dl> <dl>
<dt>Refresh:</dt> <dt>Refresh:</dt>
<dd> <dd>
@ -24,9 +24,9 @@
<option value="2000" selected="selected">2000</option> <option value="2000" selected="selected">2000</option>
</select> </select>
</dd> </dd>
<dt>X:</dt><dd>blue</dd> <dt>X:</dt><dd class="x">0</dd>
<dt>Y:</dt><dd>green</dd> <dt>Y:</dt><dd class="y">0</dd>
<dt>Z:</dt><dd>red</dd> <dt>Z:</dt><dd class="z">0</dd>
</dl> </dl>
</div> </div>
<svg id="gyro"> <svg id="gyro">
@ -38,7 +38,7 @@
</svg> </svg>
<div class="clear-both"></div> <div class="clear-both"></div>
<div class="plot_control"> <div class="plot_control">
<div class="title">Accelerometer</div> <div class="title">Accelerometer - g</div>
<dl> <dl>
<dt>Refresh:</dt> <dt>Refresh:</dt>
<dd> <dd>
@ -61,9 +61,9 @@
<option value="2" selected="selected">2</option> <option value="2" selected="selected">2</option>
</select> </select>
</dd> </dd>
<dt>X:</dt><dd>blue</dd> <dt>X:</dt><dd class="x">0</dd>
<dt>Y:</dt><dd>green</dd> <dt>Y:</dt><dd class="y">0</dd>
<dt>Z:</dt><dd>red</dd> <dt>Z:</dt><dd class="z">0</dd>
</dl> </dl>
</div> </div>
<svg id="accel"> <svg id="accel">
@ -75,7 +75,7 @@
</svg> </svg>
<div class="clear-both"></div> <div class="clear-both"></div>
<div class="plot_control"> <div class="plot_control">
<div class="title">Magnetometer</div> <div class="title">Magnetometer - Ga</div>
<dl> <dl>
<dt>Refresh:</dt> <dt>Refresh:</dt>
<dd> <dd>
@ -98,9 +98,9 @@
<option value="1" selected="selected">1</option> <option value="1" selected="selected">1</option>
</select> </select>
</dd> </dd>
<dt>X:</dt><dd>blue</dd> <dt>X:</dt><dd class="x">0</dd>
<dt>Y:</dt><dd>green</dd> <dt>Y:</dt><dd class="y">0</dd>
<dt>Z:</dt><dd>red</dd> <dt>Z:</dt><dd class="z">0</dd>
</dl> </dl>
</div> </div>
<svg id="mag"> <svg id="mag">
@ -112,7 +112,7 @@
</svg> </svg>
<div class="clear-both"></div> <div class="clear-both"></div>
<div class="plot_control"> <div class="plot_control">
<div class="title">Barometer</div> <div class="title">Barometer - meters</div>
<dl> <dl>
<dt>Refresh:</dt> <dt>Refresh:</dt>
<dd> <dd>
@ -121,14 +121,14 @@
<option value="20">20 ms</option> <option value="20">20 ms</option>
<option value="30">30 ms</option> <option value="30">30 ms</option>
<option value="40">40 ms</option> <option value="40">40 ms</option>
<option value="50" selected="selected">50 ms</option> <option value="50">50 ms</option>
<option value="100">100 ms</option> <option value="100" selected="selected">100 ms</option>
<option value="250">250 ms</option> <option value="250">250 ms</option>
<option value="500">500 ms</option> <option value="500">500 ms</option>
<option value="1000">1000 ms</option> <option value="1000">1000 ms</option>
</select> </select>
</dd> </dd>
<dt>X:</dt><dd>blue</dd> <dt>X:</dt><dd class="x">0</dd>
</dl> </dl>
</div> </div>
<svg id="baro"> <svg id="baro">
@ -149,14 +149,14 @@
<option value="20">20 ms</option> <option value="20">20 ms</option>
<option value="30">30 ms</option> <option value="30">30 ms</option>
<option value="40">40 ms</option> <option value="40">40 ms</option>
<option value="50" selected="selected">50 ms</option> <option value="50">50 ms</option>
<option value="100">100 ms</option> <option value="100">100 ms</option>
<option value="250">250 ms</option> <option value="250">250 ms</option>
<option value="500">500 ms</option> <option value="500" selected="selected">500 ms</option>
<option value="1000">1000 ms</option> <option value="1000">1000 ms</option>
</select> </select>
</dd> </dd>
<dt>X:</dt><dd>blue</dd> <dt>X:</dt><dd class="x">0</dd>
</dl> </dl>
</div> </div>
<svg id="debug1"> <svg id="debug1">
@ -170,7 +170,7 @@
<div class="plot_control"> <div class="plot_control">
<div class="title">Debug 2</div> <div class="title">Debug 2</div>
<dl> <dl>
<dt>X:</dt><dd>blue</dd> <dt>X:</dt><dd class="x">blue</dd>
</dl> </dl>
</div> </div>
<svg id="debug2"> <svg id="debug2">
@ -184,7 +184,7 @@
<div class="plot_control"> <div class="plot_control">
<div class="title">Debug 3</div> <div class="title">Debug 3</div>
<dl> <dl>
<dt>X:</dt><dd>blue</dd> <dt>X:</dt><dd class="x">0</dd>
</dl> </dl>
</div> </div>
<svg id="debug3"> <svg id="debug3">
@ -198,7 +198,7 @@
<div class="plot_control"> <div class="plot_control">
<div class="title">Debug 4</div> <div class="title">Debug 4</div>
<dl> <dl>
<dt>X:</dt><dd>blue</dd> <dt>X:</dt><dd class="x">0</dd>
</dl> </dl>
</div> </div>
<svg id="debug4"> <svg id="debug4">

27
tabs/sensors.js
View File

@ -150,6 +150,22 @@ function tab_initialize_sensors() {
initGraphHelpers('#debug4', samples_debug_i) initGraphHelpers('#debug4', samples_debug_i)
]; ];
var raw_data_text_ements = {
x: [],
y: [],
z: [],
};
$('.plot_control .x, .plot_control .y, .plot_control .z').each(function() {
var e = $(this);
if (e.hasClass('x')) {
raw_data_text_ements.x.push(e);
} else if (e.hasClass('y')) {
raw_data_text_ements.y.push(e);
} else {
raw_data_text_ements.z.push(e);
}
});
// set refresh speeds according to configuration saved in storage // set refresh speeds according to configuration saved in storage
chrome.storage.local.get('sensor_refresh_rates', function(result) { chrome.storage.local.get('sensor_refresh_rates', function(result) {
if (typeof result.sensor_refresh_rates != 'undefined') { if (typeof result.sensor_refresh_rates != 'undefined') {
@ -212,23 +228,34 @@ function tab_initialize_sensors() {
function update_imu_graphs() { function update_imu_graphs() {
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);
raw_data_text_ements.x[0].text(SENSOR_DATA.gyroscope[0].toFixed(2));
raw_data_text_ements.y[0].text(SENSOR_DATA.gyroscope[1].toFixed(2));
raw_data_text_ements.z[0].text(SENSOR_DATA.gyroscope[2].toFixed(2));
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);
raw_data_text_ements.x[1].text(SENSOR_DATA.accelerometer[0].toFixed(2));
raw_data_text_ements.y[1].text(SENSOR_DATA.accelerometer[1].toFixed(2));
raw_data_text_ements.z[1].text(SENSOR_DATA.accelerometer[2].toFixed(2));
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);
raw_data_text_ements.x[2].text(SENSOR_DATA.magnetometer[0].toFixed(2));
raw_data_text_ements.y[2].text(SENSOR_DATA.magnetometer[1].toFixed(2));
raw_data_text_ements.z[2].text(SENSOR_DATA.magnetometer[2].toFixed(2));
} }
function update_altitude_graph() { function update_altitude_graph() {
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);
raw_data_text_ements.x[3].text(SENSOR_DATA.altitude.toFixed(2));
} }
function update_debug_graphs() { function update_debug_graphs() {
for (var i = 0; i < 4; i++) { for (var i = 0; i < 4; 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);
raw_data_text_ements.x[4 + i].text(SENSOR_DATA.debug[i]);
} }
samples_debug_i++; samples_debug_i++;
} }