Simplify Expert Mode (#3301)

locales/en/messages.json

@@ -90,10 +90,7 @@
         "message": "Enable Expert Mode"
     },
     "expertModeDescription": {
-        "message": "Show development builds that are potentially unstable"
+        "message": "Enable Expert Mode options"
-    },
-    "permanentExpertMode": {
-        "message": "Permanently enable Expert Mode"
     },
     "warningSettings": {
         "message": "Show warnings"

src/js/main.js

@@ -539,14 +539,14 @@ function startProcess() {
         $("#showlog").trigger('click');
     }
 
-    result = getConfig('permanentExpertMode');
+    result = getConfig('expertMode').expertMode ?? false;
-    const expertModeCheckbox = 'input[name="expertModeCheckbox"]';
+
-    if (result.permanentExpertMode) {
+    const expertModeCheckbox = $('input[name="expertModeCheckbox"]');
-        $(expertModeCheckbox).prop('checked', true);
+    expertModeCheckbox.prop('checked', result).trigger('change');
-    }
+
+    expertModeCheckbox.on("change", () => {
+        const checked = expertModeCheckbox.is(':checked');
 
-    $(expertModeCheckbox).on("change", () => {
-        const checked = $(expertModeCheckbox).is(':checked');
         checkSetupAnalytics(function (analyticsService) {
             analyticsService.setDimension(analyticsService.DIMENSIONS.CONFIGURATOR_EXPERT_MODE, checked ? 'On' : 'Off');
         });
@@ -558,9 +558,9 @@ function startProcess() {
         if (GUI.active_tab) {
             TABS[GUI.active_tab]?.expertModeChanged?.(checked);
         }
-    });
 
-    $(expertModeCheckbox).trigger("change");
+        setConfig({'expertMode': checked});
+    });
 
     result = getConfig('cliAutoComplete');
     CliAutoComplete.setEnabled(typeof result.cliAutoComplete === "undefined" || result.cliAutoComplete); // On by default

src/js/serial_backend.js

@@ -259,10 +259,8 @@ function onOpen(openInfo) {
         }
 
         // reset expert mode
-        result = getConfig('permanentExpertMode');
+        result = getConfig('expertMode')?.expertMode ?? false;
-        if (result.permanentExpertMode) {
+        $('input[name="expertModeCheckbox"]').prop('checked', result).trigger('change');
-            $('input[name="expertModeCheckbox"]').prop('checked', result.permanentExpertMode).trigger('change');
-        }
 
         serial.onReceive.addListener(read_serial);
         setConnectionTimeout();

src/js/tabs/firmware_flasher.js

@@ -221,35 +221,39 @@ firmware_flasher.initialize = function (callback) {
 
             if (showExtraReleases) {
                 $('tr.build_type').show();
-                $('tr.expert_mode').show();
             } else {
                 $('tr.build_type').hide();
-                $('tr.expert_mode').hide();
                 buildType_e.val(0).trigger('change');
             }
         }
 
-        const globalExpertMode_e = $('input[name="expertModeCheckbox"]');
         function showOrHideExpertMode() {
             const expertModeChecked = $(this).is(':checked');
 
-            globalExpertMode_e.prop('checked', expertModeChecked).trigger('change');
             if (expertModeChecked) {
                 buildTypesToShow = buildTypes;
             } else {
                 buildTypesToShow = buildTypes.slice(0,2);
             }
+
             buildBuildTypeOptionsList();
             buildType_e.val(0).trigger('change');
 
-            setConfig({'selected_expert_mode': expertModeChecked});
+            setTimeout(() => {
+                $('tr.expertOptions').toggle(expertModeChecked);
+                $('div.expertOptions').toggle(expertModeChecked);
+            }, 0);
+
+            setConfig({'expertMode': expertModeChecked});
         }
 
         const expertMode_e = $('.tab-firmware_flasher input.expert_mode');
-        const expertMode = getConfig('selected_expert_mode');
+        const expertMode = getConfig('expertMode').expertMode;
-        expertMode_e.prop('checked', expertMode.selected_expert_mode ?? false);
+
+        expertMode_e.prop('checked', expertMode);
+        expertMode_e.on('change', showOrHideExpertMode).trigger('change');
+
         $('input.show_development_releases').change(showOrHideBuildTypes).change();
-        expertMode_e.change(showOrHideExpertMode).change();
 
         // translate to user-selected language
         i18n.localizePage();
@@ -302,8 +306,6 @@ firmware_flasher.initialize = function (callback) {
 
                     const expertMode = $('.tab-firmware_flasher input.expert_mode').is(':checked');
                     if (expertMode) {
-                        $('div.expertOptions').show();
-
                         if (response.releaseType === 'Unstable') {
                             self.releaseLoader.loadCommits(response.release, (commits) => {
                                 const select_e = $('select[name="commits"]');
@@ -317,9 +319,9 @@ firmware_flasher.initialize = function (callback) {
                         } else {
                             $('div.commitSelection').hide();
                         }
-                    } else {
-                        $('div.expertOptions').hide();
                     }
+
+                    $('div.expertOptions').toggle(expertMode);
                 }
 
                 if (response.configuration && !self.isConfigLocal) {
@@ -489,11 +491,12 @@ firmware_flasher.initialize = function (callback) {
         }
 
         const portPickerElement = $('div#port-picker #port');
+
         function flashFirmware(firmware) {
             const options = {};
 
             let eraseAll = false;
-            if ($('input.erase_chip').is(':checked')) {
+            if ($('input.erase_chip').is(':checked') || $('.tab-firmware_flasher input.expert_mode').not(':checked')) {
                 options.erase_chip = true;
 
                 eraseAll = true;

src/js/tabs/options.js

@@ -16,7 +16,6 @@ options.initialize = function (callback) {
     $('#content').load("./tabs/options.html", function () {
         i18n.localizePage();
 
-        TABS.options.initPermanentExpertMode();
         TABS.options.initRememberLastTab();
         TABS.options.initCheckForConfiguratorUnstableVersions();
         TABS.options.initAnalyticsOptOut();
@@ -50,21 +49,6 @@ options.initShowWarnings = function () {
     }).change();
 };
 
-options.initPermanentExpertMode = function () {
-    const result = getConfig('permanentExpertMode');
-    if (result.permanentExpertMode) {
-        $('div.permanentExpertMode input').prop('checked', true);
-    }
-
-    $('div.permanentExpertMode input').change(function () {
-        const checked = $(this).is(':checked');
-
-        setConfig({'permanentExpertMode': checked});
-
-        $('input[name="expertModeCheckbox"]').prop('checked', checked).change();
-    }).change();
-};
-
 options.initRememberLastTab = function () {
     const result = getConfig('rememberLastTab');
     $('div.rememberLastTab input')

src/tabs/firmware_flasher.html

@@ -8,17 +8,6 @@
             <div class="spacer" style="margin-bottom: 10px;">
                 <div class="margin-bottom">
                 <table class="cf_table" style="margin-top: 10px;">
-                    <tr class="option">
-                        <td>
-                            <label>
-                                <input class="show_development_releases toggle" type="checkbox" />
-                                <span i18n="firmwareFlasherShowDevelopmentReleases"></span>
-                            </label>
-                            <div class="helpicon cf_tip_wide" i18n_title="firmwareFlasherShowDevelopmentReleasesDescription"></div>
-                        </td>
-                        <td>
-                        </td>
-                    </tr>
                     <tr class="expert_mode option">
                         <td>
                             <label>
@@ -30,6 +19,17 @@
                         <td>
                         </td>
                     </tr>
+                    <tr class="option">
+                        <td>
+                            <label>
+                                <input class="show_development_releases toggle" type="checkbox" />
+                                <span i18n="firmwareFlasherShowDevelopmentReleases"></span>
+                            </label>
+                            <div class="helpicon cf_tip_wide" i18n_title="firmwareFlasherShowDevelopmentReleasesDescription"></div>
+                        </td>
+                        <td>
+                        </td>
+                    </tr>
                     <tr class="build_type">
                         <td>
                             <select name="build_type">
@@ -64,7 +64,7 @@
                         <td>
                         </td>
                     </tr>
-                    <tr>
+                    <tr class="expertOptions option">
                         <td>
                             <label>
                                 <input class="updating toggle" type="checkbox" />
@@ -75,7 +75,7 @@
                         <td>
                         </td>
                     </tr>
-                    <tr class="option flash_on_connect_wrapper">
+                    <tr class="expertOptions option flash_on_connect_wrapper">
                         <td>
                             <label>
                                 <input class="flash_on_connect toggle" type="checkbox" />
@@ -86,7 +86,7 @@
                         <td>
                         </td>
                     </tr>
-                    <tr class="option">
+                    <tr class="expertOptions option">
                         <td>
                             <label>
                                 <input class="erase_chip toggle" type="checkbox" />
@@ -97,7 +97,7 @@
                         <td>
                         </td>
                     </tr>
-                    <tr class="option manual_baud_rate noboarder">
+                    <tr class="expertOptions option manual_baud_rate noboarder">
                         <td>
                             <label>
                                 <input class="flash_manual_baud toggle" type="checkbox" />

src/tabs/options.html

@@ -5,12 +5,6 @@
                 <div class="spacer_box_title" i18n="tabOptions"></div>
             </div>
             <div class="spacer">
-                <div class="permanentExpertMode margin-bottom">
-                    <div>
-                        <input type="checkbox" class="toggle" />
-                    </div>
-                    <span class="freelabel" i18n="permanentExpertMode"></span>
-                </div>
                 <div class="checkForConfiguratorUnstableVersions margin-bottom">
                     <div>
                         <input type="checkbox" class="toggle" />