Add option for which center calibration method to use on DS5 and Edge controllers

index.html

@@ -170,9 +170,23 @@
                 <button type="button" class="btn btn-primary ds-btn" onclick="calibrate_stick_centers()" id="four-step-center-calib" style="display: none;">
                   1. <span class="ds-i18n">Calibrate stick center</span>
                 </button>
-                <button type="button" class="btn btn-primary ds-btn" onclick="auto_calibrate_stick_centers()" id="quick-center-calib" style="display: none;">
-                  1. <span class="ds-i18n">Calibrate stick center</span>
-                </button>
+                <div class="btn-group w-100" role="group" style="display: none;" id="quick-center-calib-group">
+                  <button type="button" class="btn btn-primary ds-btn flex-grow-1" onclick="executeSelectedCenterCalibration()" id="quick-center-calib">
+                    <span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
+                    1. <span class="ds-i18n">Calibrate stick center</span>
+                  </button>
+                  <button type="button" class="btn btn-primary ds-btn dropdown-toggle dropdown-toggle-split" data-bs-toggle="dropdown" aria-expanded="false" style="flex: 0 0 35px;">
+                    <span class="visually-hidden">Toggle dropdown</span>
+                  </button>
+                  <ul class="dropdown-menu">
+                    <li><a class="dropdown-item" href="#" onclick="setCenterCalibrationMethod('quick', event)">
+                      <i class="fas fa-check me-2" id="check-quick" style="visibility: hidden;"></i><span class="ds-i18n">Use quick calibration</span>
+                    </a></li>
+                    <li><a class="dropdown-item" href="#" onclick="setCenterCalibrationMethod('four-step', event)">
+                      <i class="fas fa-check me-2" id="check-four-step"></i><span class="ds-i18n">Use four-step calibration</span>
+                    </a></li>
+                  </ul>
+                </div>
                 <button type="button" class="btn btn-primary ds-btn" onclick="calibrate_range()">
                   2. <span class="ds-i18n">Calibrate stick range</span>
                 </button>

js/core.js

@@ -23,6 +23,9 @@ const app = {
 
   shownRangeCalibrationWarning: false,
 
+  // Calibration method preference
+  centerCalibrationMethod: 'four-step', // 'quick' or 'four-step'
+
   // Language and UI state
   lang_orig_text: {},
   lang_orig_text: {},
@@ -107,6 +110,7 @@ function gboot() {
     initAnalyticsApi(app); // init just with gu for now
     lang_init(app, handleLanguageChange, show_welcome_modal);
     show_welcome_modal();
+    initCalibrationMethod();
 
     $("input[name='displayMode']").on('change', on_stick_mode_change);
 
@@ -217,6 +221,7 @@ async function continue_connection({data, device}) {
       $("#four-step-center-calib").toggle(!!showFourStepCalib);
       $("#quick-tests-div").css("visibility", showQuickTests ? "visible" : "hidden");
       $("#quick-center-calib").toggle(!!showQuickCalib);
+      $("#quick-center-calib-group").toggle(!!showQuickCalib);
     }
 
     let controllerInstance = null;
@@ -1103,6 +1108,70 @@ window.flash_all_changes = flash_all_changes;
 window.reboot_controller = reboot_controller;
 window.refresh_nvstatus = refresh_nvstatus;
 window.nvsunlock = nvsunlock;
+
+// Calibration method selection
+window.setCenterCalibrationMethod = (method, event) => {
+  if (event) {
+    event.preventDefault();
+    event.stopPropagation();
+  }
+  app.centerCalibrationMethod = method;
+  localStorage.setItem('centerCalibrationMethod', method);
+  updateCalibrationMethodUI();
+  // Close the dropdown
+  const dropdownButton = event?.target?.closest('.dropdown-menu')?.previousElementSibling;
+  if (dropdownButton) {
+    const dropdown = bootstrap.Dropdown.getInstance(dropdownButton);
+    if (dropdown) dropdown.hide();
+  }
+};
+
+window.executeSelectedCenterCalibration = () => {
+  if (app.centerCalibrationMethod === 'quick') {
+    auto_calibrate_stick_centers(
+      controller,
+      (success, message) => {
+        if (success) {
+          resetStickDiagrams();
+          successAlert(message);
+          switchTo10xZoomMode();
+        }
+      }
+    );
+  } else {
+    calibrate_stick_centers(
+      controller,
+      (success, message) => {
+        if (success) {
+          resetStickDiagrams();
+          successAlert(message);
+          switchTo10xZoomMode();
+        }
+      }
+    );
+  }
+};
+
+function updateCalibrationMethodUI() {
+  const checkQuick = document.getElementById('check-quick');
+  const checkFourStep = document.getElementById('check-four-step');
+
+  if (app.centerCalibrationMethod === 'quick') {
+    checkQuick.style.visibility = 'visible';
+    checkFourStep.style.visibility = 'hidden';
+  } else {
+    checkQuick.style.visibility = 'hidden';
+    checkFourStep.style.visibility = 'visible';
+  }
+}
+
+function initCalibrationMethod() {
+  const savedMethod = localStorage.getItem('centerCalibrationMethod');
+  if (savedMethod && (savedMethod === 'quick' || savedMethod === 'four-step')) {
+    app.centerCalibrationMethod = savedMethod;
+  }
+  updateCalibrationMethodUI();
+}
 window.nvslock = nvslock;
 window.welcome_accepted = welcome_accepted;
 window.show_donate_modal = show_donate_modal;