[CodeFactor] Apply fixes to commit bdc21d1

gui/src/components/dynamic_components2.vue

@@ -51,7 +51,8 @@ const gridWidgets = [
     { x: 0, y: 0, w: 16, h: 40 },
     "Detailed heard stations list",
     true,
-    true,"Activity"
+    true,
+    "Activity",
   ),
   new gridWidget(
     active_stats,
@@ -59,7 +60,7 @@ const gridWidgets = [
     "Stats (waterfall, etc)",
     true,
     true,
-    "Stats"
+    "Stats",
   ),
   new gridWidget(
     active_audio_level,
@@ -75,7 +76,7 @@ const gridWidgets = [
     "Rig control main",
     true,
     true,
-    "Rig"
+    "Rig",
   ),
   new gridWidget(
     active_broadcats,
@@ -83,7 +84,7 @@ const gridWidgets = [
     "Broadcats main",
     true,
     true,
-    "Broadcasts"
+    "Broadcasts",
   ),
   new gridWidget(
     mini_heard_stations,
@@ -91,16 +92,23 @@ const gridWidgets = [
     "Mini heard stations list",
     false,
     true,
-    "Activity"
+    "Activity",
+  ),
+  new gridWidget(
+    s_meter,
+    { x: 1, y: 1, w: 4, h: 8 },
+    "S-Meter",
+    false,
+    true,
+    "Rig",
   ),
-  new gridWidget(s_meter, { x: 1, y: 1, w: 4, h: 8 }, "S-Meter", false, true, "Rig"),
   new gridWidget(
     dbfs_meter,
     { x: 1, y: 1, w: 4, h: 8 },
     "Dbfs Meter",
     false,
     true,
-    "Audio"
+    "Audio",
   ),
   new gridWidget(
     grid_activities,
@@ -110,7 +118,6 @@ const gridWidgets = [
     true,
     "Activity",
   ),
-  
 ];
 onMounted(() => {
   grid = GridStack.init({
@@ -137,23 +144,23 @@ onMounted(() => {
 
   grid.on("change", onChange);
 
-  gridWidgets.forEach((gw) =>{
+  gridWidgets.forEach((gw) => {
     //Dynamically add widgets to widget menu
     let dom = document.getElementById("otherBod");
     switch (gw.category) {
       case "Activity":
         dom = document.getElementById("actBody");
         break;
-        case "Stats":
+      case "Stats":
         dom = document.getElementById("statsBody");
         break;
-        case "Audio":
+      case "Audio":
         dom = document.getElementById("audioBody");
         break;
-        case "Rig":
+      case "Rig":
         dom = document.getElementById("rigBody");
         break;
-        case "Broadcasts":
+      case "Broadcasts":
         dom = document.getElementById("bcBody");
         break;
       default:
@@ -161,19 +168,19 @@ onMounted(() => {
         break;
     }
     var index = gridWidgets.findIndex((w) => gw.text == w.text);
-    dom.insertAdjacentHTML("beforeend",`<div id="gridbtn-${index}""></div>`);
+    dom.insertAdjacentHTML("beforeend", `<div id="gridbtn-${index}""></div>`);
     let dom2 = document.getElementById(`gridbtn-${index}`);
-    let vueComponent = h(grid_button,{btnText: gw.text,btnID:index});
+    let vueComponent = h(grid_button, { btnText: gw.text, btnID: index });
-    render(vueComponent,dom2);
+    render(vueComponent, dom2);
-  })
+  });
   window.addEventListener(
-      "add-widget",
+    "add-widget",
-      function (eventdata) {
+    function (eventdata) {
-        let data = eventdata.detail;
+      let data = eventdata.detail;
-        addNewWidget2(gridWidgets[data]);
+      addNewWidget2(gridWidgets[data]);
-      },
+    },
-      false,
+    false,
-    );
+  );
 });
 function onChange(event, changeItems) {
   // update item position
@@ -273,7 +280,7 @@ function quickfill() {
       <h5 class="offcanvas-title" id="offcanvasGridItemsLabel">
         Manage grid widgets
       </h5>
-      
+
       <button
         type="button"
         class="btn-close"
@@ -282,8 +289,10 @@ function quickfill() {
       ></button>
     </div>
     <div class="offcanvas-body">
-      <p>Grid widgets allow you to customize the display for your own usage.  Here you may add additional widgets to fit your needs.
+      <p>
-        You can move and resize the individual widgets!
+        Grid widgets allow you to customize the display for your own usage. Here
+        you may add additional widgets to fit your needs. You can move and
+        resize the individual widgets!
       </p>
       <div>
         <button
@@ -293,10 +302,8 @@ function quickfill() {
         >
           Fill grid with common widgets
         </button>
-
-
       </div>
-      <hr>
+      <hr />
       <!-- Begin widget selector -->
       <div class="accordion" id="accordionExample">
         <!-- Heard Stations -->
@@ -319,9 +326,7 @@ function quickfill() {
             aria-labelledby="headingHeardStations"
             data-bs-parent="#accordionExample"
           >
-            <div class="accordion-body" id="actBody">
+            <div class="accordion-body" id="actBody"></div>
-
-            </div>
           </div>
         </div>
 
@@ -345,9 +350,7 @@ function quickfill() {
             aria-labelledby="headingActivities"
             data-bs-parent="#accordionExample"
           >
-            <div class="accordion-body" id="audioBody">
+            <div class="accordion-body" id="audioBody"></div>
-              
-            </div>
           </div>
         </div>
         <!-- Broadcasts -->
@@ -370,9 +373,7 @@ function quickfill() {
             aria-labelledby="headingBroadcasts"
             data-bs-parent="#accordionExample"
           >
-            <div class="accordion-body" id="bcBody">
+            <div class="accordion-body" id="bcBody"></div>
-
-            </div>
           </div>
         </div>
         <!-- Radio Control -->
@@ -395,9 +396,7 @@ function quickfill() {
             aria-labelledby="headingRadioControl"
             data-bs-parent="#accordionExample"
           >
-            <div class="accordion-body" id="rigBody">
+            <div class="accordion-body" id="rigBody"></div>
-
-            </div>
           </div>
         </div>
 
@@ -421,9 +420,7 @@ function quickfill() {
             aria-labelledby="headingAudioControl"
             data-bs-parent="#accordionExample"
           >
-            <div class="accordion-body" id="statsBody">
+            <div class="accordion-body" id="statsBody"></div>
-              
-            </div>
           </div>
         </div>
 
@@ -447,20 +444,18 @@ function quickfill() {
             aria-labelledby="headingStatistics"
             data-bs-parent="#accordionExample"
           >
-            <div class="accordion-body" id="otherBod">
+            <div class="accordion-body" id="otherBod"></div>
-              
-            </div>
           </div>
         </div>
       </div>
-      <hr>
+      <hr />
       <button
-          class="btn btn-sm btn-outline-warning"
+        class="btn btn-sm btn-outline-warning"
-          type="button"
+        type="button"
-          @click="clearAllItems"
+        @click="clearAllItems"
-        >
+      >
-          Clear grid
+        Clear grid
-        </button>
+      </button>
     </div>
   </div>
 </template>

gui/src/components/grid/button.vue

@@ -1,12 +1,13 @@
 <script setup lang="ts">
-import { defineProps } from 'vue';
+import { defineProps } from "vue";
-const props = defineProps(['btnText','btnID']);
+const props = defineProps(["btnText", "btnID"]);
 
 function emitClick() {
-    window.dispatchEvent(new CustomEvent("add-widget", { detail: props.btnID }));
+  window.dispatchEvent(new CustomEvent("add-widget", { detail: props.btnID }));
 }
-
 </script>
 <template>
-    <button class="btn btn-small btn-outline-secondary" v-on:click="emitClick">{{ btnText}}</button>
+  <button class="btn btn-small btn-outline-secondary" v-on:click="emitClick">
+    {{ btnText }}
+  </button>
 </template>