chore: add eslint

* add eslint with space rules to cover what sonarcloud doesn't
* run lint in travis
* add eslint vue config

.eslintrc.js

@@ -0,0 +1,18 @@
+module.exports = {
+    parserOptions: {
+        ecmaVersion: 2020,
+        sourceType: "module"
+    },
+    extends: ["plugin:vue/recommended"],
+    env: {
+        node: true,
+        jquery: true,
+        es2017: true,
+        browser: true,
+        webextensions: true
+    },
+    rules: {
+        "no-trailing-spaces": "error",
+        "eol-last": "error"
+    }
+};

.gitignore

@@ -13,6 +13,7 @@ dist_cordova/
 debug/
 release/
 testresults/
+.eslintcache
 
 # OSX
 .DS_store

.travis.yml

@@ -41,6 +41,7 @@ before_install:
     }
 
 script:
+  - yarn lint
   - yarn test
   - yarn gulp release
 

package.json

@@ -13,7 +13,9 @@
     "release": "run-script-os",
     "release:default": "NODE_ENV=production gulp release",
     "release:windows": "set NODE_ENV=production&& gulp release",
-    "test": "karma start test/karma.conf.js"
+    "test": "karma start test/karma.conf.js",
+    "lint": "eslint --ext .js,.vue src",
+    "lint:fix": "eslint --fix src"
   },
   "window": {
     "icon": "images/bf_icon_128.png",
@@ -82,6 +84,8 @@
     "command-exists": "^1.2.8",
     "cordova-lib": "^9.0.1",
     "del": "^5.0.0",
+    "eslint": "^7.16.0",
+    "eslint-plugin-vue": "^7.3.0",
     "follow-redirects": "^1.10.0",
     "fs-extra": "^8.1.0",
     "glob": "^7.1.6",
@@ -95,6 +99,7 @@
     "gulp-xml-transformer": "^3.0.0",
     "gulp-yarn": "^2.0.0",
     "gulp-zip": "^5.0.0",
+    "husky": "^4.3.0",
     "karma": "^4.0.1",
     "karma-chai": "^0.1.0",
     "karma-chrome-launcher": "^3.0.0",
@@ -122,5 +127,10 @@
   },
   "optionalDependencies": {
     "gulp-appdmg": "^1.0.3"
+  },
+  "husky": {
+    "hooks": {
+      "pre-commit": "yarn lint"
+    }
   }
 }

src/components/init.js

@@ -32,13 +32,13 @@ i18next.on('initialized', function() {
 
     const app = new Vue({
         i18n: vueI18n,
-        data: betaflightModel,
+        el: '#main-wrapper',
         components: {
             BatteryLegend,
             BetaflightLogo,
             StatusBar,
         },
-        el: '#main-wrapper',
+        data: betaflightModel,
     });
 
 });

src/components/quad-status/BatteryLegend.vue

@@ -1,5 +1,7 @@
 <template>
-  <div class="battery-legend">{{ reading }}</div>
+  <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

src/components/status-bar/PortUtilization.vue

@@ -6,7 +6,11 @@
       :value="usageDown"
       unit="%"
     />
-    <ReadingStat message="statusbar_usage_upload" :value="usageUp" unit="%" />
+    <ReadingStat
+      message="statusbar_usage_upload"
+      :value="usageUp"
+      unit="%"
+    />
   </div>
 </template>
 
@@ -14,6 +18,9 @@
 import ReadingStat from "./ReadingStat.vue";
 
 export default {
+  components: {
+    ReadingStat,
+  },
   props: {
     usageDown: {
       type: Number,
@@ -22,8 +29,5 @@ export default {
       type: Number,
     },
   },
-  components: {
-    ReadingStat,
-  },
 };
 </script>

src/components/status-bar/StatusBar.vue

@@ -1,10 +1,26 @@
 <template>
   <div id="status-bar">
-    <PortUtilization :usage-down="portUsageDown" :usage-up="portUsageUp" />
+    <PortUtilization
-    <ReadingStat message="statusbar_packet_error" :value="packetError" />
+      :usage-down="portUsageDown"
-    <ReadingStat message="statusbar_i2c_error" :value="i2cError" />
+      :usage-up="portUsageUp"
-    <ReadingStat message="statusbar_cycle_time" :value="cycleTime" />
+    />
-    <ReadingStat message="statusbar_cpu_load" :value="cpuLoad" unit="%" />
+    <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"
@@ -20,6 +36,11 @@ import ReadingStat from "./ReadingStat.vue";
 import PortUtilization from "./PortUtilization.vue";
 
 export default {
+  components: {
+    PortUtilization,
+    ReadingStat,
+    StatusBarVersion,
+  },
   props: {
     portUsageDown: {
       type: Number,
@@ -56,10 +77,5 @@ export default {
       type: String,
     },
   },
-  components: {
-    PortUtilization,
-    ReadingStat,
-    StatusBarVersion,
-  },
 };
 </script>

src/js/tabs/gps.js

@@ -72,7 +72,6 @@ TABS.gps.initialize = function (callback) {
                 $('td', row).eq(2).find('progress').val(FC.GPS_DATA.cno[i]);
             }
 
-
             const message = {
                 action: 'center',
                 lat: lat,
@@ -161,8 +160,6 @@ TABS.gps.initialize = function (callback) {
 
 };
 
-
- 
 TABS.gps.cleanup = function (callback) {
     if (callback) callback();
 };

src/js/tabs/led_strip.js

@@ -741,7 +741,6 @@ TABS.led_strip.initialize = function (callback, scrollPosition) {
             case "function-a":
             case "function-f":
                 return true;
-            break;
         }
         return false;
     }
@@ -754,7 +753,6 @@ TABS.led_strip.initialize = function (callback, scrollPosition) {
                 case "function-f":
                 case "function-g":
                     return true;
-                break;
             }
         } else {
             switch (activeFunction) {
@@ -768,7 +766,6 @@ TABS.led_strip.initialize = function (callback, scrollPosition) {
                 case "function-o":
                 case "function-g":
                     return true;
-                break;
             }
         }
         return false;
@@ -781,7 +778,6 @@ TABS.led_strip.initialize = function (callback, scrollPosition) {
                 case "function-a":
                 case "function-f":
                     return true;
-                break;
             }
         }
         return false;
@@ -793,7 +789,6 @@ TABS.led_strip.initialize = function (callback, scrollPosition) {
             case "function-s":
             case "function-g":
                 return false;
-                break;
             case "function-r":
             case "function-b":
                 if (semver.lt(FC.CONFIG.apiVersion, "1.20.0"))
@@ -801,7 +796,6 @@ TABS.led_strip.initialize = function (callback, scrollPosition) {
             break;
             default:
                 return true;
-            break;
         }
     }
 
@@ -813,10 +807,8 @@ TABS.led_strip.initialize = function (callback, scrollPosition) {
                 case "function-a":
                 case "function-f":
                     return true;
-                break;
                 default:
                     return false;
-                break;
             }
         }
     }

src/js/tabs/motors.js

@@ -284,7 +284,6 @@ TABS.motors.initialize = function (callback) {
             motor_mah_drawing_e = $('.motors-bat-mah-drawing'),
             motor_mah_drawn_e = $('.motors-bat-mah-drawn');
 
-
         const rawDataTextElements = {
                 x: [],
                 y: [],
@@ -455,7 +454,6 @@ TABS.motors.initialize = function (callback) {
             motorVoltage.text(i18n.getMessage('motorsVoltageValue', [FC.ANALOG.voltage]));
             motor_mah_drawing_e.text(i18n.getMessage('motorsADrawingValue', [FC.ANALOG.amperage.toFixed(2)]));
             motor_mah_drawn_e.text(i18n.getMessage('motorsmAhDrawnValue', [FC.ANALOG.mAhdrawn]));
-            
         }
         GUI.interval_add('motors_power_data_pull_slow', power_data_pull, 250, true); // 4 fps
 
@@ -714,8 +712,6 @@ TABS.motors.initialize = function (callback) {
 
                     $('.motor_testing .telemetry .motor-' + i).html(telemetryText);
                 }
-                
-
             }
 
             // servo indicators are still using old (not flexible block scale), it will be changed in the future accordingly