From 99043037d9279ec4bbf8c74d0fd3c80ca7e9eab7 Mon Sep 17 00:00:00 2001
From: Pedro <ptsmonteiro@gmail.com>
Date: Fri, 3 Nov 2023 13:32:52 +0100
Subject: [PATCH] Move modem control to modem settings area

---
 gui/src/components/main_top_navbar.vue | 75 --------------------------
 gui/src/components/settings_modem.vue  | 49 +++++++++++++++++
 2 files changed, 49 insertions(+), 75 deletions(-)

diff --git a/gui/src/components/main_top_navbar.vue b/gui/src/components/main_top_navbar.vue
index 5f38aa12..1501757e 100644
--- a/gui/src/components/main_top_navbar.vue
+++ b/gui/src/components/main_top_navbar.vue
@@ -13,40 +13,8 @@ const settings = useSettingsStore(pinia);
 import { useAudioStore } from "../store/audioStore.js";
 const audioStore = useAudioStore(pinia);
 
-import { startModem, stopModem } from "../js/daemon";
 import { saveSettingsToFile } from "../js/settingsHandler";
 
-function startStopModem() {
-  switch (state.modem_running_state) {
-    case "stopped":
-
-      let startupInputDeviceValue = parseInt((<HTMLSelectElement>document.getElementById("audio_input_selectbox")).value);
-      let startupOutputDeviceValue = parseInt((<HTMLSelectElement>document.getElementById("audio_output_selectbox")).value);
-
-      let startupInputDeviceIndex = (<HTMLSelectElement>document.getElementById("audio_input_selectbox")).selectedIndex;
-      let startupOutputDeviceIndex = (<HTMLSelectElement>document.getElementById("audio_output_selectbox")).selectedIndex;
-
-
-      audioStore.startupInputDevice = startupInputDeviceValue
-      audioStore.startupOutputDevice = startupOutputDeviceValue
-
-      // get full name of audio device
-      settings.rx_audio = (<HTMLSelectElement>document.getElementById("audio_input_selectbox")).options[startupInputDeviceIndex].text;
-      settings.tx_audio = (<HTMLSelectElement>document.getElementById("audio_output_selectbox")).options[startupOutputDeviceIndex].text;
-
-
-      saveSettingsToFile();
-
-      startModem();
-
-      break;
-    case "running":
-      stopModem();
-
-      break;
-    default:
-  }
-}
 </script>
 
 <template>
@@ -59,49 +27,6 @@ function startStopModem() {
       <span class="badge bg-secondary me-4"
         >Service | {{ state.modem_running_state }}</span
       >
-
-      <div class="btn-group" role="group"></div>
-      <div class="btn-group me-4" role="group">
-        <button
-          type="button"
-          id="startModem"
-          class="btn btn-sm btn-outline-success"
-          data-bs-toggle="tooltip"
-          data-bs-trigger="hover"
-          data-bs-html="false"
-          title="Start the Modem. Please set your audio and radio settings first!"
-          @click="startStopModem()"
-          v-bind:class="{ disabled: state.modem_running_state === 'running' }"
-        >
-          <i class="bi bi-play-fill"></i>
-          <span class="ms-2">start modem</span>
-        </button>
-        <button
-          type="button"
-          id="stopModem"
-          class="btn btn-sm btn-outline-danger"
-          data-bs-toggle="tooltip"
-          data-bs-trigger="hover"
-          data-bs-html="false"
-          title="Stop the Modem."
-          @click="startStopModem()"
-          v-bind:class="{ disabled: state.modem_running_state === 'stopped' }"
-        >
-          <i class="bi bi-stop-fill"></i>
-          <span class="ms-2">stop modem</span>
-        </button>
-      </div>
-
-      <button
-        type="button"
-        id="openHelpModalStartStopModem"
-        data-bs-toggle="modal"
-        data-bs-target="#startStopModemHelpModal"
-        class="btn me-4 p-0 border-0"
-      >
-        <i class="bi bi-question-circle" style="font-size: 1rem"></i>
-      </button>
     </div>
-
 	 </nav>
 </template>
diff --git a/gui/src/components/settings_modem.vue b/gui/src/components/settings_modem.vue
index 20bd5eb6..968ca0f5 100644
--- a/gui/src/components/settings_modem.vue
+++ b/gui/src/components/settings_modem.vue
@@ -11,13 +11,62 @@ const settings = useSettingsStore(pinia);
 import { useAudioStore } from "../store/audioStore.js";
 const audio = useAudioStore(pinia);
 
+import { useStateStore } from "../store/stateStore.js";
+const state = useStateStore(pinia);
+
+import { startModem, stopModem } from "../js/daemon";
+
+function startStopModem() {
+  switch (state.modem_running_state) {
+    case "stopped":
+      startModem();
+
+      break;
+    case "running":
+      stopModem();
+
+      break;
+    default:
+  }
+}
+
 function saveSettings() {
   saveSettingsToFile();
 }
 </script>
 
 <template>
+  <div>
+    <button
+          type="button"
+          id="startModem"
+          class="btn btn-sm btn-outline-success"
+          data-bs-toggle="tooltip"
+          data-bs-trigger="hover"
+          data-bs-html="false"
+          title="Start the Modem. Please set your audio and radio settings first!"
+          @click="startStopModem()"
+          v-bind:class="{ disabled: state.modem_running_state === 'running' }"
+        >
+          <i class="bi bi-play-fill"></i>
+          <span class="ms-2">start modem</span>
+        </button>
+        <button
+          type="button"
+          id="stopModem"
+          class="btn btn-sm btn-outline-danger"
+          data-bs-toggle="tooltip"
+          data-bs-trigger="hover"
+          data-bs-html="false"
+          title="Stop the Modem."
+          @click="startStopModem()"
+          v-bind:class="{ disabled: state.modem_running_state === 'stopped' }"
+        >
+          <i class="bi bi-stop-fill"></i>
+          <span class="ms-2">stop modem</span>
+        </button>
 
+  </div>
   <div class="input-group input-group-sm mb-1">
     <span class="input-group-text" style="width: 180px">Modem port</span>
     <input