Skip to content

Commit

Permalink
Add all 8 debug values in sensors tab and only show active debugs (be…
Browse files Browse the repository at this point in the history
…taflight#3522)

* Add all 8 debug values in sensors tab

* Make debug columns dynamic

* Do it for all debug columns

* Use semver to decide initial column count

* Some improvements from NerdCopter
  • Loading branch information
haslinghuis authored Jul 24, 2023
1 parent d1cb74e commit 62a9cde
Show file tree
Hide file tree
Showing 5 changed files with 154 additions and 76 deletions.
2 changes: 1 addition & 1 deletion src/js/fc.js
Original file line number Diff line number Diff line change
Expand Up @@ -280,7 +280,7 @@ const FC = {
altitude: 0,
sonar: 0,
kinematics: [0.0, 0.0, 0.0],
debug: [0, 0, 0, 0],
debug: [0, 0, 0, 0, 0, 0, 0, 0],
};

this.MOTOR_DATA = Array.from({length: 8});
Expand Down
2 changes: 1 addition & 1 deletion src/js/msp/MSPHelper.js
Original file line number Diff line number Diff line change
Expand Up @@ -668,7 +668,7 @@ MspHelper.prototype.process_data = function(dataHandler) {
console.log('Voltage config saved');
break;
case MSPCodes.MSP_DEBUG:
for (let i = 0; i < 4; i++) {
for (let i = 0; i < 8; i++) {
FC.SENSOR_DATA.debug[i] = data.read16();
}
break;
Expand Down
2 changes: 2 additions & 0 deletions src/js/tabs/onboard_logging.js
Original file line number Diff line number Diff line change
Expand Up @@ -320,6 +320,7 @@ onboard_logging.initialize = function (callback) {
{text: "GPS_RESCUE_VELOCITY"},
{text: "GPS_RESCUE_HEADING"},
{text: "GPS_RESCUE_TRACKING"},
{text: "GPS_UNIT_CONNECTION"},
{text: "ATTITUDE"},
{text: "VTX_MSP"},
{text: "GPS_DOP"},
Expand All @@ -329,6 +330,7 @@ onboard_logging.initialize = function (callback) {
{text: "ANGLE_TARGET"},
{text: "CURRENT_ANGLE"},
{text: "DSHOT_TELEMETRY_COUNTS"},
{text: "RPM_LIMIT"},
];

for (let i = 0; i < FC.PID_ADVANCED_CONFIG.debugModeCount; i++) {
Expand Down
41 changes: 28 additions & 13 deletions src/js/tabs/sensors.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,8 @@ import MSP from "../msp";
import MSPCodes from "../msp/MSPCodes";
import serial from "../serial";
import * as d3 from 'd3';
import semver from 'semver';
import { API_VERSION_1_46 } from "../data_storage";

const sensors = {};
sensors.initialize = function (callback) {
Expand All @@ -15,13 +17,18 @@ sensors.initialize = function (callback) {
GUI.active_tab = 'sensors';
}

sensors.debugColumns = semver.gte(FC.CONFIG.apiVersion, API_VERSION_1_46) ? 8 : 4;

function initSensorData(){
for (let i = 0; i < 3; i++) {
FC.SENSOR_DATA.accelerometer[i] = 0;
FC.SENSOR_DATA.gyroscope[i] = 0;
FC.SENSOR_DATA.magnetometer[i] = 0;
FC.SENSOR_DATA.sonar = 0;
FC.SENSOR_DATA.altitude = 0;
}

for (let i = 0; i < sensors.debugColumns; i++) {
FC.SENSOR_DATA.debug[i] = 0;
}
}
Expand Down Expand Up @@ -178,6 +185,10 @@ sensors.initialize = function (callback) {
function plot_debug(enable) {
if (enable) {
$('.wrapper.debug').show();
for (let i = 0; i < 8; i++) {
$(`svg#debug${i}`).hide();
$(`div.plot_control.debug${i}`).hide();
}
} else {
$('.wrapper.debug').hide();
}
Expand Down Expand Up @@ -261,24 +272,22 @@ sensors.initialize = function (callback) {
mag_data = initDataArray(3),
altitude_data = initDataArray(1),
sonar_data = initDataArray(1),
debug_data = [
initDataArray(1),
initDataArray(1),
initDataArray(1),
initDataArray(1),
];
debug_data = [];

for (let i = 0; i < sensors.debugColumns; i++) {
debug_data.push(initDataArray(1));
}

let gyroHelpers = initGraphHelpers('#gyro', samples_gyro_i, [-2000, 2000]);
let accelHelpers = initGraphHelpers('#accel', samples_accel_i, [-2, 2]);
let magHelpers = initGraphHelpers('#mag', samples_mag_i, [-1, 1]);
const altitudeHelpers = initGraphHelpers('#altitude', samples_altitude_i);
const sonarHelpers = initGraphHelpers('#sonar', samples_sonar_i);
const debugHelpers = [
initGraphHelpers('#debug1', samples_debug_i),
initGraphHelpers('#debug2', samples_debug_i),
initGraphHelpers('#debug3', samples_debug_i),
initGraphHelpers('#debug4', samples_debug_i),
];
const debugHelpers = [];

for (let i = 0; i < sensors.debugColumns; i++) {
debugHelpers.push(initGraphHelpers(`#debug${i}`, samples_debug_i));
}

const raw_data_text_ements = {
x: [],
Expand Down Expand Up @@ -417,9 +426,15 @@ sensors.initialize = function (callback) {
}

function update_debug_graphs() {
for (let i = 0; i < 4; i++) {
for (let i = 0; i < sensors.debugColumns; i++) {
updateGraphHelperSize(debugHelpers[i]);

// enable/disable graphs based on debug values
if (FC.SENSOR_DATA.debug[i]) {
$(`svg#debug${i}`).show();
$(`div.plot_control.debug${i}`).show();
}

addSampleToData(debug_data[i], samples_debug_i, [FC.SENSOR_DATA.debug[i]]);
drawGraph(debugHelpers[i], debug_data[i], samples_debug_i);
raw_data_text_ements.x[5 + i].text(FC.SENSOR_DATA.debug[i]);
Expand Down
183 changes: 122 additions & 61 deletions src/tabs/sensors.html
Original file line number Diff line number Diff line change
Expand Up @@ -66,12 +66,12 @@
</dl>
</div>
<svg id="gyro">
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<div class="clear-both"></div>
</div>
</div>
Expand Down Expand Up @@ -111,12 +111,12 @@
</dl>
</div>
<svg id="accel">
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<div class="clear-both"></div>
</div>
</div>
Expand Down Expand Up @@ -156,12 +156,12 @@
</dl>
</div>
<svg id="mag">
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<div class="clear-both"></div>
</div>
</div>
Expand Down Expand Up @@ -193,12 +193,12 @@
</div>

<svg id="altitude">
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<div class="clear-both"></div>
</div>
</div>
Expand Down Expand Up @@ -226,18 +226,19 @@
</dl>
</div>
<svg id="sonar">
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<div class="clear-both"></div>
</div>
</div>

<div class="wrapper debug">
<div class="gui_box grey">
<div class="plot_control">
<div class="plot_control debug0">
<div class="title"><span i18n="sensorsDebugTitle"></span> 0</div>
<dl>
<dt i18n="sensorsRefresh"></dt>
Expand All @@ -258,58 +259,118 @@
<dd class="x">0</dd>
</dl>
</div>
<svg id="debug1">
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<svg id="debug0">
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<div class="clear-both"></div>
<div class="plot_control">
<div class="plot_control debug1">
<div class="title"><span i18n="sensorsDebugTitle"></span> 1</div>
<dl>
<dt>X:</dt>
<dd class="x">blue</dd>
</dl>
</div>
<svg id="debug2">
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<svg id="debug1">
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<div class="clear-both"></div>
<div class="plot_control">
<div class="plot_control debug2">
<div class="title"><span i18n="sensorsDebugTitle"></span> 2</div>
<dl>
<dt>X:</dt>
<dd class="x">0</dd>
</dl>
</div>
<svg id="debug3">
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<svg id="debug2">
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<div class="clear-both"></div>
<div class="plot_control">
<div class="plot_control debug3">
<div class="title"><span i18n="sensorsDebugTitle"></span> 3</div>
<dl>
<dt>X:</dt>
<dd class="x">0</dd>
</dl>
</div>
<svg id="debug3">
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<div class="clear-both"></div>
<div class="plot_control debug4">
<div class="title"><span i18n="sensorsDebugTitle"></span> 4</div>
<dl>
<dt>X:</dt>
<dd class="x">0</dd>
</dl>
</div>
<svg id="debug4">
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<div class="clear-both"></div>
<div class="plot_control debug5">
<div class="title"><span i18n="sensorsDebugTitle"></span> 5</div>
<dl>
<dt>X:</dt>
<dd class="x">0</dd>
</dl>
</div>
<svg id="debug5">
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<div class="clear-both"></div>
<div class="plot_control debug6">
<div class="title"><span i18n="sensorsDebugTitle"></span> 6</div>
<dl>
<dt>X:</dt>
<dd class="x">0</dd>
</dl>
</div>
<svg id="debug6">
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
<div class="clear-both"></div>
<div class="plot_control debug7">
<div class="title"><span i18n="sensorsDebugTitle"></span> 7</div>
<dl>
<dt>X:</dt>
<dd class="x">0</dd>
</dl>
</div>
<svg id="debug7">
<g class="grid x" transform="translate(40, 120)"></g>
<g class="grid y" transform="translate(40, 10)"></g>
<g class="data" transform="translate(41, 10)"></g>
<g class="axis x" transform="translate(40, 120)"></g>
<g class="axis y" transform="translate(40, 10)"></g>
</svg>
</div>
</div>
</div>
Expand Down

0 comments on commit 62a9cde

Please sign in to comment.