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

Merge pull request #2182 from chmelevskij/chore/add-vue

10.8-maintenance
Michael Keller 2020-10-15 10:12:32 +13:00 committed by GitHub
parent 5ec6078b40 d6cee386e8
commit 7fcc9efc72
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
27 changed files with 1511 additions and 283 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
gulpfile.js
View File

@ -20,6 +20,7 @@ const commandExistsSync = require('command-exists').sync;
const targz = require('targz');
const gulp = require('gulp');
const rollup = require('rollup');
const concat = require('gulp-concat');
const yarn = require("gulp-yarn");
const rename = require('gulp-rename');
@ -42,6 +43,8 @@ const CORDOVA_DIST_DIR = './dist_cordova/';
const LINUX_INSTALL_DIR = '/opt/betaflight';
const NODE_ENV = process.env.NODE_ENV || 'production';
// Global variable to hold the change hash from when we get it, to when we use it.
var gitChangeSetId;
@ -86,7 +89,7 @@ const getChangesetId = gulp.series(getHash, writeChangesetId);
gulp.task('get-changeset-id', getChangesetId);
// dist_yarn MUST be done after dist_src
const distBuild = gulp.series(dist_src, dist_changelog, dist_yarn, dist_locale, dist_libraries, dist_resources, getChangesetId, gulp.series(cordova_dist()));
const distBuild = gulp.series(dist_src, dist_changelog, dist_yarn, dist_locale, dist_libraries, dist_resources, dist_rollup, getChangesetId, gulp.series(cordova_dist()));
const distRebuild = gulp.series(clean_dist, distBuild);
gulp.task('dist', distRebuild);
@ -297,6 +300,38 @@ function dist_resources() {
.pipe(gulp.dest(DIST_DIR));
}
function dist_rollup() {
const commonjs = require('@rollup/plugin-commonjs');
const resolve = require('@rollup/plugin-node-resolve').default;
const alias = require('@rollup/plugin-alias');
const vue = require('rollup-plugin-vue');
const rollupReplace = require('@rollup/plugin-replace');
return rollup
.rollup({
input: 'src/components/init.js',
plugins: [
alias({
entries: {
vue: require.resolve('vue/dist/vue.esm.js'),
},
}),
rollupReplace({
'process.env.NODE_ENV': JSON.stringify(NODE_ENV),
}),
resolve(),
commonjs(),
vue(),
],
})
.then(bundle =>
bundle.write({
format: 'esm',
file: 'dist/components/init.js',
}),
);
}
// Create runable app directories in ./apps
function apps(done) {
var platforms = getPlatforms();

3
locales/en/messages.json
View File

@ -68,9 +68,6 @@
"cancel": {
"message": "Cancel"
},
"cancel": {
"message": "Cancel"
},
"autoConnectEnabled": {
"message": "Auto-Connect: Enabled - Configurator automatically tries to connect when new port is detected"
},

16
package.json
View File

@ -7,9 +7,9 @@
"chromium-args": "--disable-features=nw2",
"default_locale": "en",
"scripts": {
"start": "gulp debug",
"start": "NODE_ENV=development gulp debug",
"gulp": "gulp",
"release": "gulp release",
"release": "NODE_ENV=production gulp release",
"test": "karma start test/karma.conf.js"
},
"window": {
@ -61,16 +61,23 @@
"semver-min": "^0.6.5",
"short-unique-id": "^1.1.1",
"three": "~0.97.0",
"universal-ga": "^1.2.0"
"universal-ga": "^1.2.0",
"vue": "2.6.12",
"vue-i18n": "8.21.1"
},
"devDependencies": {
"@quanle94/innosetup": "^6.0.2",
"@rollup/plugin-alias": "^3.1.1",
"@rollup/plugin-commonjs": "^15.1.0",
"@rollup/plugin-node-resolve": "^9.0.0",
"@rollup/plugin-replace": "^2.3.3",
"chai": "^4.2.0",
"command-exists": "^1.2.8",
"cordova-lib": "^9.0.1",
"del": "^5.0.0",
"follow-redirects": "^1.10.0",
"fs-extra": "^8.1.0",
"postcss": "^8.1.1",
"gulp": "^4.0.2",
"gulp-concat": "~2.6.1",
"gulp-debian": "~0.1.8",
@ -91,12 +98,15 @@
"mocha": "^7.0.1",
"nw-builder": "^3.5.7",
"os": "^0.1.1",
"rollup": "^2.28.2",
"rollup-plugin-vue": "^5.*.*",
"rpm-builder": "^1.2.1",
"sinon": "^9.0.0",
"sinon-chai": "^3.5.0",
"targz": "^1.0.1",
"temp": "^0.9.1",
"vinyl-source-stream": "^2.0.0",
"vue-template-compiler": "^2.6.12",
"yarn": "^1.22.0"
},
"optionalDependencies": {

0
src/Components/MotorOutputReordering/Body.html → src/components/MotorOutputReordering/Body.html
View File

0
src/Components/MotorOutputReordering/MotorOutputReorderingCanvas.js → src/components/MotorOutputReordering/MotorOutputReorderingCanvas.js
View File

2
src/Components/MotorOutputReordering/MotorOutputReorderingComponent.js → src/components/MotorOutputReordering/MotorOutputReorderingComponent.js
View File

@ -16,7 +16,7 @@ class MotorOutputReorderComponent
this._currentSpinningMotor = -1;
this._contentDiv.load("./Components/MotorOutputReordering/Body.html", () =>
this._contentDiv.load("./components/MotorOutputReordering/Body.html", () =>
{
this._setupdialog();
});

0
src/Components/MotorOutputReordering/MotorOutputReorderingConfig.js → src/components/MotorOutputReordering/MotorOutputReorderingConfig.js
View File

0
src/Components/MotorOutputReordering/Styles.css → src/components/MotorOutputReordering/Styles.css
View File

108
src/components/betaflight-logo/BetaflightLogo.vue Normal file
View File

@ -0,0 +1,108 @@
<style>
.logo {
height: 70px;
width: 240px;
background-image: url(./images/light-wide-2.svg);
background-repeat: no-repeat;
background-position: left center;
background-size: contain;
position: relative;
margin-top: -25px;
}
.logo_text {
position: absolute;
left: 80px;
top: 49px;
color: #949494;
opacity: 0.5;
font-size: 10px;
min-width: 210px;
}
.tab_container .logo {
display: none;
}
@media all and (max-width: 575px) {
.logo {
height: 24px;
width: 150px;
background-image: url(./images/light-wide-2-compact.svg);
background-position: left center;
order: 2;
margin-top: 0;
}
.logo_text {
display: none !important;
}
.tab_container .logo {
display: block;
background-image: url(./images/light-wide-2.svg);
background-repeat: no-repeat;
background-position: center 20px;
background-position-x: 12px;
background-size: 80%;
height: 120px;
width: auto;
margin-top: unset;
position: relative;
border-bottom: 1px solid rgba(0, 0, 0, 0.3);
}
.tab_container .logo .logo_text {
display: block !important;
left: 82px;
top: 62px;
}
}
@media all and (min-width: 1125px) {
.logo {
width: 340px;
}
.logo_text {
font-size: inherit;
position: relative;
}
}
</style>
<template>
<div class="logo">
<div class="logo_text">
<span>
{{ $t("versionLabelConfigurator.message") }}: {{ configuratorVersion }}
<br />
<span v-if="firmwareVersion && firmwareId">
{{ $t("versionLabelFirmware.message") }}: {{ firmwareVersion }}
{{ firmwareId }}
</span>
<br />
<span v-if="hardwareId">
{{ $t("versionLabelTarget.message") }}: {{ hardwareId }}
</span>
</span>
</div>
</div>
</template>
<script>
export default {
props: {
configuratorVersion: {
type: String,
required: true,
},
firmwareVersion: {
type: String,
},
firmwareId: {
type: String,
},
hardwareId: {
type: String,
},
},
};
</script>

40
src/components/init.js Normal file
View File

@ -0,0 +1,40 @@
import Vue from "vue";
import vueI18n from "./vueI18n.js";
import BatteryLegend from "./quad-status/BatteryLegend.vue";
import BetaflightLogo from "./betaflight-logo/BetaflightLogo.vue";
import StatusBar from "./status-bar/StatusBar.vue";
// a bit of a hack here to get around the current translations.
// vue i18n provides slightly different api for this. But
// it's also possible to provide custom formatter
Vue.filter(
"stripEnd",
(value) => value.replace(/\$1%/, "")
);
// Most of the global objects can go here at first.
// It's a bit of overkill for simple components,
// but these instance would eventually have more children
// which would find the use for those extra properties.
const betaflightModel = {
CONFIGURATOR,
FC,
MSP,
PortUsage,
};
const app = new Vue({
i18n: vueI18n,
data: betaflightModel,
components: {
BatteryLegend,
BetaflightLogo,
StatusBar,
},
el: '#main-wrapper',
});
// Not strictly necessary here, but if needed
// it's always possible to modify this model in
// jquery land to trigger updates in vue
window.vm = betaflightModel;

32
src/components/quad-status/BatteryLegend.vue Normal file
View File

@ -0,0 +1,32 @@
<template>
<div class="battery-legend">{{ reading }}</div>
</template>
<script>
const NO_BATTERY_VOLTAGE_MAXIMUM = 1.8; // Maybe is better to add a call to MSP_BATTERY_STATE but is not available for all versions
export default {
props: {
voltage: {
type: Number,
default: 0,
},
vbatmaxcellvoltage: {
type: Number,
default: 1,
},
},
computed: {
reading() {
let nbCells = Math.floor(this.voltage / this.vbatmaxcellvoltage) + 1;
if (this.voltage === 0) {
nbCells = 1;
}
const cellsText =
this.voltage > NO_BATTERY_VOLTAGE_MAXIMUM ? `${nbCells}S` : "USB";
return `${this.voltage.toFixed(2)}V (${cellsText})`;
},
},
};
</script>

29
src/components/status-bar/PortUtilization.vue Normal file
View File

@ -0,0 +1,29 @@
<template>
<div>
<span>{{ $t("statusbar_port_utilization.message") }}</span>
<ReadingStat
message="statusbar_usage_download"
:value="usageDown"
unit="%"
/>
<ReadingStat message="statusbar_usage_upload" :value="usageUp" unit="%" />
</div>
</template>
<script>
import ReadingStat from "./ReadingStat.vue";
export default {
props: {
usageDown: {
type: Number,
},
usageUp: {
type: Number,
},
},
components: {
ReadingStat,
},
};
</script>

22
src/components/status-bar/ReadingStat.vue Normal file
View File

@ -0,0 +1,22 @@
<template>
<span>
<span>{{ $t(message + ".message") | stripEnd }}</span>
<span>{{ value }}</span>
<span v-if="unit">{{ unit }}</span>
</span>
</template>
<script>
export default {
props: {
message: {
type: String,
},
value: {
type: Number,
},
unit: {
type: String,
},
},
};
</script>

65
src/components/status-bar/StatusBar.vue Normal file
View File

@ -0,0 +1,65 @@
<template>
<div id="status-bar">
<PortUtilization :usage-down="portUsageDown" :usage-up="portUsageUp" />
<ReadingStat message="statusbar_packet_error" :value="packetError" />
<ReadingStat message="statusbar_i2c_error" :value="i2cError" />
<ReadingStat message="statusbar_cycle_time" :value="cycleTime" />
<ReadingStat message="statusbar_cpu_load" :value="cpuLoad" unit="%" />
<StatusBarVersion
:configurator-version="configuratorVersion"
:firmware-version="firmwareVersion"
:firmware-id="firmwareId"
:hardware-id="hardwareId"
:git-changeset-id="gitChangesetId"
/>
</div>
</template>
<script>
import StatusBarVersion from "./StatusBarVersion.vue";
import ReadingStat from "./ReadingStat.vue";
import PortUtilization from "./PortUtilization.vue";
export default {
props: {
portUsageDown: {
type: Number,
},
portUsageUp: {
type: Number,
},
packetError: {
type: Number,
},
i2cError: {
type: Number,
},
cycleTime: {
type: Number,
},
cpuLoad: {
type: Number,
},
configuratorVersion: {
type: String,
},
firmwareVersion: {
type: String,
},
firmwareId: {
type: String,
},
hardwareId: {
type: String,
},
gitChangesetId: {
type: String,
},
},
components: {
PortUtilization,
ReadingStat,
StatusBarVersion,
},
};
</script>

35
src/components/status-bar/StatusBarVersion.vue Normal file
View File

@ -0,0 +1,35 @@
<template>
<div class="version">
{{ $t("versionLabelConfigurator.message") }}: {{ configuratorVersion }}
<span v-if="firmwareVersion && firmwareId">
, {{ $t("versionLabelFirmware.message") }}: {{ firmwareVersion }}
{{ firmwareId }}
</span>
<span v-if="hardwareId">
, {{ $t("versionLabelTarget.message") }}: {{ hardwareId }}
</span>
({{ gitChangesetId }})
</div>
</template>
<script>
export default {
props: {
configuratorVersion: {
type: String,
},
firmwareVersion: {
type: String,
},
firmwareId: {
type: String,
},
hardwareId: {
type: String,
},
gitChangesetId: {
type: String,
},
},
};
</script>

18
src/components/vueI18n.js Normal file
View File

@ -0,0 +1,18 @@
import Vue from "vue";
import VueI18n from "vue-i18n";
Vue.use(VueI18n);
const vueI18n = new VueI18n(i18next);
i18next.on("initialized", () => {
vueI18n.setLocaleMessage("en", i18next.getDataByLanguage("en").messages);
});
i18next.on("languageChanged", (lang) => {
vueI18n.setLocaleMessage(lang, i18next.getDataByLanguage(lang).messages);
vueI18n.locale = lang;
document.querySelector("html").setAttribute("lang", lang);
});
export default vueI18n;

4
src/css/dark-theme.css
View File

@ -40,8 +40,8 @@ body {
background-color: #414443;
}
#status-bar div {
border-right: 1px solid #9c9c9c;
#status-bar > * ~ * {
border-left: 1px solid #9c9c9c;
}
dialog {

75
src/css/main.css
View File

@ -205,38 +205,6 @@ input[type="number"]::-webkit-inner-spin-button {
margin-left: 15px;
}
#logo {
height: 70px;
width: 240px;
background-image: url(../images/light-wide-2.svg);
background-repeat: no-repeat;
background-position: left center;
background-size: contain;
position: relative;
margin-top: -25px;
}
.logo_text {
position: absolute;
left: 80px;
top: 49px;
color: #949494;
opacity: 0.5;
font-size: 10px;
min-width: 210px;
}
@media all and (min-width: 1125px) {
#logo {
width: 340px;
}
.logo_text {
font-size: inherit;
position: relative;
}
}
#port-picker {
display: flex;
align-items: center;
@ -754,15 +722,6 @@ input[type="number"]::-webkit-inner-spin-button {
order: 1;
}
#logo {
height: 24px;
width: 150px;
background-image: url(../images/light-wide-2-compact.svg);
background-position: left center;
order: 2;
margin-top: 0;
}
#header_btns {
margin-left: auto;
order: 3;
@ -779,7 +738,7 @@ input[type="number"]::-webkit-inner-spin-button {
zoom: 0.6;
}
.logo_text, #port-picker, .header-wrapper, .flash_state, .connect_state {
#port-picker, .header-wrapper, .flash_state, .connect_state {
display: none !important;
}
@ -964,23 +923,6 @@ input[type="number"]::-webkit-inner-spin-button {
background-color: #2e2e2e;
}
#tab_logoversion {
display: none;
background-image: url(../images/light-wide-2.svg);
background-repeat: no-repeat;
background-position: center 20px;
background-position-x: 12px;
background-size: 80%;
height: 120px;
position: relative;
border-bottom: 1px solid rgba(0, 0, 0, 0.30);
}
#tab_logoversion .logo_text {
display: block !important;
left: 82px;
top: 62px;
}
#tabs {
font-size: 13px;
}
@ -1100,9 +1042,6 @@ input[type="number"]::-webkit-inner-spin-button {
.tab_container.reveal {
left: 0;
}
#tab_logoversion {
display: block;
}
}
/* Tab-Icons */
@ -1448,6 +1387,7 @@ li.active .ic_mission {
/** Status bar **/
#status-bar {
position: fixed;
display: flex;
bottom: 0;
width: calc(100% - 20px);
height: 20px;
@ -1457,18 +1397,17 @@ li.active .ic_mission {
background-color: #bfbeb5;
}
#status-bar div {
float: left;
padding-right: 10px;
margin-right: 10px;
border-right: 1px solid #7d7d79;
#status-bar > * ~ * {
padding-left: 10px;
margin-left: 10px;
border-left: 1px solid #7d7d79;
}
#status-bar .version {
float: right;
margin: 0;
padding: 0;
border: 0;
margin-left: auto;
}
/** Status bar (phones) **/

138
src/js/fc.js
View File

@ -1,5 +1,61 @@
'use strict';
const INITIAL_CONFIG = {
apiVersion: "0.0.0",
flightControllerIdentifier: '',
flightControllerVersion: '',
version: 0,
buildInfo: '',
multiType: 0,
msp_version: 0, // not specified using semantic versioning
capability: 0,
cycleTime: 0,
i2cError: 0,
activeSensors: 0,
mode: 0,
profile: 0,
uid: [0, 0, 0],
accelerometerTrims: [0, 0],
name: '',
displayName: 'JOE PILOT',
numProfiles: 3,
rateProfile: 0,
boardType: 0,
armingDisableCount: 0,
armingDisableFlags: 0,
armingDisabled: false,
runawayTakeoffPreventionDisabled: false,
boardIdentifier: "",
boardVersion: 0,
targetCapabilities: 0,
targetName: "",
boardName: "",
manufacturerId: "",
signature: [],
mcuTypeId: 255,
configurationState: 0,
sampleRateHz: 0,
configurationProblems: 0,
hardwareName: '',
};
const INITIAL_ANALOG = {
voltage: 0,
mAhdrawn: 0,
rssi: 0,
amperage: 0,
last_received_timestamp: Date.now(), // FIXME this code lies, it's never been received at this point
};
const INITIAL_BATTERY_CONFIG = {
vbatmincellvoltage: 0,
vbatmaxcellvoltage: 0,
vbatwarningcellvoltage: 0,
capacity: 0,
voltageMeterSource: 0,
currentMeterSource: 0,
};
const FC = {
// define all the global variables that are uses to hold FC state
@ -7,17 +63,43 @@ const FC = {
ADJUSTMENT_RANGES: null,
ADVANCED_TUNING: null,
ADVANCED_TUNING_ACTIVE: null,
ANALOG: null,
ANALOG: {...INITIAL_CONFIG},
ARMING_CONFIG: null,
AUX_CONFIG: null,
AUX_CONFIG_IDS: null,
BATTERY_CONFIG: null,
BATTERY_CONFIG: {...INITIAL_BATTERY_CONFIG},
BATTERY_STATE: null,
BEEPER_CONFIG: null,
BF_CONFIG: null, // Remove when we officialy retire BF 3.1
BLACKBOX: null,
BOARD_ALIGNMENT_CONFIG: null,
CONFIG: null,
// Shallow copy of original config and added getter
// getter allows this to be used with simple dot notation
// and bridges the vue and rest of the code
CONFIG: {
...INITIAL_CONFIG,
get hardwareName() {
let name;
if (this.targetName) {
name = this.targetName;
} else {
name = this.boardIdentifier;
}
if (this.boardName && this.boardName !== name) {
name = `${this.boardName}(${name})`;
}
if (this.manufacturerId) {
name = `${this.manufacturerId}/${name}`;
}
return name;
},
set hardwareName(name) {
// NOOP, can't really be set. Maybe implement some logic?
},
},
COPY_PROFILE: null,
CURRENT_METERS: null,
CURRENT_METER_CONFIGS: null,
@ -72,43 +154,11 @@ const FC = {
VTX_CONFIG: null,
resetState () {
this.CONFIG = {
apiVersion: "0.0.0",
flightControllerIdentifier: '',
flightControllerVersion: '',
version: 0,
buildInfo: '',
multiType: 0,
msp_version: 0, // not specified using semantic versioning
capability: 0,
cycleTime: 0,
i2cError: 0,
activeSensors: 0,
mode: 0,
profile: 0,
uid: [0, 0, 0],
accelerometerTrims: [0, 0],
name: '',
displayName: 'JOE PILOT',
numProfiles: 3,
rateProfile: 0,
boardType: 0,
armingDisableCount: 0,
armingDisableFlags: 0,
armingDisabled: false,
runawayTakeoffPreventionDisabled: false,
boardIdentifier: "",
boardVersion: 0,
targetCapabilities: 0,
targetName: "",
boardName: "",
manufacturerId: "",
signature: [],
mcuTypeId: 255,
configurationState: 0,
sampleRateHz: 0,
configurationProblems: 0,
};
// Using `Object.assign` instead of reassigning to
// trigger the updates on the Vue side
Object.assign(this.CONFIG, INITIAL_CONFIG);
Object.assign(this.ANALOG, INITIAL_CONFIG);
Object.assign(this.BATTERY_CONFIG, INITIAL_BATTERY_CONFIG);
this.BF_CONFIG = {
currentscale: 0,
@ -249,13 +299,6 @@ const FC = {
cno: [],
};
this.ANALOG = {
voltage: 0,
mAhdrawn: 0,
rssi: 0,
amperage: 0,
last_received_timestamp: Date.now(), // FIXME this code lies, it's never been received at this point
};
this.VOLTAGE_METERS = [];
this.VOLTAGE_METER_CONFIGS = [];
@ -671,6 +714,7 @@ const FC = {
return name;
},
MCU_TYPES: {
0: "SIMULATOR",
1: "F103",

1
src/js/localization.js
View File

@ -39,7 +39,6 @@ i18n.init = function(cb) {
i18n.addResources({"detectedLanguage": detectedLanguage });
i18next.on('languageChanged', function () {
i18n.localizePage(true);
updateStatusBarVersion();
});
}
if (cb !== undefined) {

66
src/js/main.js
View File

@ -188,9 +188,9 @@ function startProcess() {
}
$('.connect_b a.connect').removeClass('disabled');
$('#logo .version, #tab_logoversion .version').text(CONFIGURATOR.version);
updateStatusBarVersion();
updateTopBarVersion();
// with Vue reactive system we don't need to call these,
// our view is reactive to model changes
// updateTopBarVersion();
if (!GUI.isOther() && GUI.operating_system !== 'ChromeOS') {
checkForConfiguratorUpdates();
@ -580,10 +580,6 @@ function notifyOutdatedVersion(releaseData) {
});
}
function update_packet_error(caller) {
$('span.packet-error').html(caller.packet_error);
}
function microtime() {
return new Date().getTime() / 1000;
}
@ -704,62 +700,6 @@ function generateFilename(prefix, suffix) {
return `${filename}.${suffix}`;
}
function getTargetVersion(hardwareId) {
let versionText = '';
if (hardwareId) {
versionText = `${i18n.getMessage('versionLabelTarget')}: ${hardwareId}`;
}
return versionText;
}
function getFirmwareVersion(firmwareVersion, firmwareId) {
let versionText = '';
if (firmwareVersion) {
versionText = `${i18n.getMessage('versionLabelFirmware')}: ${firmwareId} ${firmwareVersion}`;
}
return versionText;
}
function getConfiguratorVersion() {
return `${i18n.getMessage('versionLabelConfigurator')}: ${CONFIGURATOR.version}`;
}
function updateTopBarVersion(firmwareVersion, firmwareId, hardwareId) {
const configuratorVersion = getConfiguratorVersion();
const firmwareVersionAndId = getFirmwareVersion(firmwareVersion, firmwareId);
const targetVersion = getTargetVersion(hardwareId);
const versionText = `${configuratorVersion}<br />${firmwareVersionAndId}<br />${targetVersion}`;
$('#logo .logo_text, #tab_logoversion .version').html(versionText);
}
function updateStatusBarVersion(firmwareVersion, firmwareId, hardwareId) {
let versionText = '';
versionText = versionText + getFirmwareVersion(firmwareVersion, firmwareId);
if (versionText !== '') {
versionText = `${versionText}, `;
}
const targetVersion = getTargetVersion(hardwareId);
versionText = versionText + targetVersion;
if (targetVersion !== '') {
versionText = `${versionText}, `;
}
versionText = `${versionText}${getConfiguratorVersion()} (${CONFIGURATOR.gitChangesetId})`;
$('#status-bar .version').text(versionText);
}
function showErrorDialog(message) {
const dialog = $('.dialogError')[0];

1
src/js/msp/MSPConnector.js
View File

@ -44,7 +44,6 @@ MSPConnectorImpl.prototype.connect = function (port, baud, onConnectCallback, on
serial.onReceive.addListener(read_serial);
MSP.listen(update_packet_error);
mspHelper = new MspHelper();
MSP.listen(mspHelper.process_data.bind(mspHelper));

5
src/js/msp/MSPHelper.js
View File

@ -83,8 +83,6 @@ MspHelper.prototype.process_data = function(dataHandler) {
TABS.pid_tuning.checkUpdateProfile(false);
sensor_status(FC.CONFIG.activeSensors);
$('span.i2c-error').text(FC.CONFIG.i2cError);
$('span.cycle-time').text(FC.CONFIG.cycleTime);
break;
case MSPCodes.MSP_STATUS_EX:
FC.CONFIG.cycleTime = data.readU16();
@ -113,9 +111,6 @@ MspHelper.prototype.process_data = function(dataHandler) {
}
sensor_status(FC.CONFIG.activeSensors);
$('span.i2c-error').text(FC.CONFIG.i2cError);
$('span.cycle-time').text(FC.CONFIG.cycleTime);
$('span.cpu-load').text(i18n.getMessage('statusbar_cpu_load', [FC.CONFIG.cpuload]));
break;
case MSPCodes.MSP_RAW_IMU:

14
src/js/port_usage.js
View File

@ -3,6 +3,8 @@
var PortUsage = {
previous_received: 0,
previous_sent: 0,
port_usage_down: 0,
port_usage_up: 0,
initialize: function() {
var self = this;
@ -18,17 +20,19 @@ var PortUsage = {
this.previous_received = serial.bytesReceived;
this.previous_sent = serial.bytesSent;
this.port_usage_down = port_usage_down;
this.port_usage_up = port_usage_up;
// update UI
$('span.port_usage_down').text(i18n.getMessage('statusbar_usage_download', [port_usage_down]));
$('span.port_usage_up').text(i18n.getMessage('statusbar_usage_upload', [port_usage_up]));
} else {
$('span.port_usage_down').text(i18n.getMessage('statusbar_usage_download', [0]));
$('span.port_usage_up').text(i18n.getMessage('statusbar_usage_upload', [0]));
this.port_usage_down = 0;
this.port_usage_up = 0;
}
},
reset: function() {
this.previous_received = 0;
this.previous_sent = 0;
this.port_usage_down = 0;
this.port_usage_up = 0;
}
};

19
src/js/serial_backend.js
View File

@ -169,18 +169,14 @@ function finishClose(finishedCallback) {
MSP.disconnect_cleanup();
PortUsage.reset();
// To trigger the UI updates by Vue reset the state.
FC.resetState();
GUI.connected_to = false;
GUI.allowedTabs = GUI.defaultAllowedTabsWhenDisconnected.slice();
// close problems dialog
$('#dialogReportProblems-closebtn').click();
// Reset various UI elements
$('span.i2c-error').text(0);
$('span.cycle-time').text(0);
if (semver.gte(FC.CONFIG.apiVersion, "1.20.0"))
$('span.cpu-load').text('');
// unlock port select & baud
$('div#port-picker #port').prop('disabled', false);
if (!GUI.auto_connect) $('div#port-picker #baud').prop('disabled', false);
@ -228,7 +224,6 @@ function onOpen(openInfo) {
setConnectionTimeout();
FC.resetState();
MSP.listen(update_packet_error);
mspHelper = new MspHelper();
MSP.listen(mspHelper.process_data.bind(mspHelper));
@ -247,8 +242,6 @@ function onOpen(openInfo) {
analytics.setFlightControllerData(analytics.DATA.FIRMWARE_VERSION, FC.CONFIG.flightControllerVersion);
GUI.log(i18n.getMessage('fcInfoReceived', [FC.CONFIG.flightControllerIdentifier, FC.CONFIG.flightControllerVersion]));
updateStatusBarVersion(FC.CONFIG.flightControllerVersion, FC.CONFIG.flightControllerIdentifier);
updateTopBarVersion(FC.CONFIG.flightControllerVersion, FC.CONFIG.flightControllerIdentifier);
MSP.send_message(MSPCodes.MSP_BUILD_INFO, false, false, function () {
@ -318,8 +311,6 @@ function processBoardInfo() {
analytics.setFlightControllerData(analytics.DATA.MCU_TYPE, FC.getMcuType());
GUI.log(i18n.getMessage('boardInfoReceived', [FC.getHardwareName(), FC.CONFIG.boardVersion]));
updateStatusBarVersion(FC.CONFIG.flightControllerVersion, FC.CONFIG.flightControllerIdentifier, FC.getHardwareName());
updateTopBarVersion(FC.CONFIG.flightControllerVersion, FC.CONFIG.flightControllerIdentifier, FC.getHardwareName());
if (bit_check(FC.CONFIG.targetCapabilities, FC.TARGET_CAPABILITIES_FLAGS.SUPPORTS_CUSTOM_DEFAULTS) && bit_check(FC.CONFIG.targetCapabilities, FC.TARGET_CAPABILITIES_FLAGS.HAS_CUSTOM_DEFAULTS) && FC.CONFIG.configurationState === FC.CONFIGURATION_STATES.DEFAULTS_BARE) {
var dialog = $('#dialogResetToCustomDefaults')[0];
@ -538,9 +529,6 @@ function onClosed(result) {
$('#tabs ul.mode-connected-cli').hide();
$('#tabs ul.mode-disconnected').show();
updateStatusBarVersion();
updateTopBarVersion();
var sensor_state = $('#sensor-status');
sensor_state.hide();
@ -725,9 +713,6 @@ function update_live_status() {
$(".battery-status").addClass('state-ok').removeClass('state-warning').removeClass('state-empty');
}
}
let cellsText = (FC.ANALOG.voltage > NO_BATTERY_VOLTAGE_MAXIMUM)? nbCells + 'S' : 'USB';
$(".battery-legend").text(FC.ANALOG.voltage.toFixed(2) + "V (" + cellsText + ")");
}

73
src/main.html
View File

@ -38,12 +38,13 @@
<link type="text/css" rel="stylesheet" href="./css/dropdown-lists/css/style_lists.css" media="all"/>
<link type="text/css" rel="stylesheet" href="./js/libraries/switchery/switchery.css" media="all"/>
<link type="text/css" rel="stylesheet" href="./node_modules/@fortawesome/fontawesome-free/css/all.css" media="all"/>
<link type="text/css" rel="stylesheet" href="./Components/MotorOutputReordering/Styles.css" media="all"/>
<link type="text/css" rel="stylesheet" href="./components/MotorOutputReordering/Styles.css" media="all"/>
<link type="text/css" rel="stylesheet" href="./css/select2_custom.css" media="all"/>
<link type="text/css" rel="stylesheet" href="./node_modules/select2/dist/css/select2.min.css" media="all"/>
<link type="text/css" rel="stylesheet" href="./css/dark-theme.css" media="all" disabled/>
<script type="module" src="./components/init.js"></script>
<!-- CORDOVA_INCLUDE js/cordova_chromeapi.js -->
<!-- CORDOVA_INCLUDE js/cordova_startup.js -->
<script type="text/javascript" src="./node_modules/lru_map/lru.js"></script>
@ -138,11 +139,12 @@
<script type="text/javascript" src="./js/TuningSliders.js"></script>
<script type="text/javascript" src="./js/phones_ui.js"></script>
<script type="text/javascript" src="./node_modules/jquery-touchswipe/jquery.touchSwipe.min.js"></script>
<script type="text/javascript" src="./Components/MotorOutputReordering/MotorOutputReorderingComponent.js"></script>
<script type="text/javascript" src="./Components/MotorOutputReordering/MotorOutputReorderingCanvas.js"></script>
<script type="text/javascript" src="./Components/MotorOutputReordering/MotorOutputReorderingConfig.js"></script>
<script type="text/javascript" src="./components/MotorOutputReordering/MotorOutputReorderingComponent.js"></script>
<script type="text/javascript" src="./components/MotorOutputReordering/MotorOutputReorderingCanvas.js"></script>
<script type="text/javascript" src="./components/MotorOutputReordering/MotorOutputReorderingConfig.js"></script>
<script type="text/javascript" src="./node_modules/select2/dist/js/select2.min.js"></script>
<title i18n="windowTitle"></title>
</head>
<body>
@ -153,12 +155,12 @@
<div id="menu_btn">
<em class="fas fa-bars"></em>
</div>
<div id="logo">
<div class="logo_text">
CONFIGURATOR
<div class="version"></div>
</div>
</div>
<betaflight-logo
:configurator-version="CONFIGURATOR.version"
:firmware-version="FC.CONFIG.flightControllerVersion"
:firmware-id="FC.CONFIG.flightControllerIdentifier"
:hardware-id="FC.CONFIG.hardwareName"
></betaflight-logo>
<div id="port-picker">
<div id="port-override-option">
<label for="port-override">
@ -203,7 +205,10 @@
<div class="battery-status"></div>
</div>
</div>
<div class="battery-legend">Battery voltage</div>
<battery-legend
:voltage="FC.ANALOG.voltage"
:vbatmaxcellvoltage="FC.BATTERY_CONFIG.vbatmaxcellvoltage"
></battery-legend>
<div class="bottomStatusIcons">
<div class="armedicon cf_tip" i18n_title="mainHelpArmed"></div>
<div class="failsafeicon cf_tip" i18n_title="mainHelpFailsafe"></div>
@ -274,11 +279,12 @@
</div>
<div id="tab-content-container">
<div class="tab_container">
<div id="tab_logoversion">
<div class="logo_text">
<div class="version"></div>
</div>
</div>
<betaflight-logo
:configurator-version="CONFIGURATOR.version"
:firmware-version="FC.CONFIG.flightControllerVersion"
:firmware-id="FC.CONFIG.flightControllerIdentifier"
:hardware-id="FC.CONFIG.hardwareName"
></betaflight-logo>
<div id="tabs">
<ul class="mode-disconnected">
<li class="tab_landing" id="tab_landing"><a href="#" i18n="tabLanding" class="tabicon ic_welcome" i18n_title="tabLanding"></a>
@ -342,27 +348,20 @@
</div>
<div id="content"></div>
</div>
<div id="status-bar">
<div>
<span i18n="statusbar_port_utilization"></span> <span class="port_usage_down">D: 0%</span> <span
class="port_usage_up">U: 0%</span>
</div>
<div>
<span i18n="statusbar_packet_error"></span> <span class="packet-error">0</span>
</div>
<div>
<span i18n="statusbar_i2c_error"></span> <span class="i2c-error">0</span>
</div>
<div>
<span i18n="statusbar_cycle_time"></span> <span class="cycle-time">0</span>
</div>
<div>
<span class="cpu-load"> </span>
</div>
<div class="version">
<!-- configuration version generated here -->
</div>
</div>
<status-bar
:port-usage-down="PortUsage.port_usage_down"
:port-usage-up="PortUsage.port_usage_up"
:packet-error="MSP.packet_error"
:i2c-error="FC.CONFIG.i2cError"
:cycle-time="FC.CONFIG.cycleTime"
:cpu-load="FC.CONFIG.cpuload"
:configurator-version="CONFIGURATOR.version"
:firmware-version="FC.CONFIG.flightControllerVersion"
:firmware-id="FC.CONFIG.flightControllerIdentifier"
:hardware-id="FC.CONFIG.hardwareName"
:git-changeset-id="CONFIGURATOR.gitChangesetId"
></status-bar>
<div id="cache">
<div class="data-loading">
<p>Waiting for data ...</p>

991
yarn.lock
View File

File diff suppressed because it is too large Load Diff