Merge pull request #417 from DJ2LS/qm-arc

merge into broadcast

gui/preload-main.js

@@ -1601,6 +1601,32 @@ window.addEventListener("DOMContentLoaded", () => {
     };
     ipcRenderer.send("request-show-chat-window", Data);
   });
+
+  document.getElementById("thTime").addEventListener("click", () => {
+    if (hslLastSort == 0 && hslLastSortDir == "asc") hslLastSortDir = "desc";
+    else hslLastSortDir = "asc";
+    sorthslTable(0);
+  });
+  document.getElementById("thFreq").addEventListener("click", () => {
+    if (hslLastSort == 1 && hslLastSortDir == "asc") hslLastSortDir = "desc";
+    else hslLastSortDir = "asc";
+    sorthslTable(1);
+  });
+  document.getElementById("thDxcall").addEventListener("click", () => {
+    if (hslLastSort == 3 && hslLastSortDir == "asc") hslLastSortDir = "desc";
+    else hslLastSortDir = "asc";
+    sorthslTable(3);
+  });
+  document.getElementById("thDxgrid").addEventListener("click", () => {
+    if (hslLastSort == 4 && hslLastSortDir == "asc") hslLastSortDir = "desc";
+    else hslLastSortDir = "asc";
+    sorthslTable(4);
+  });
+  document.getElementById("thDist").addEventListener("click", () => {
+    if (hslLastSort == 5 && hslLastSortDir == "asc") hslLastSortDir = "desc";
+    else hslLastSortDir = "asc";
+    sorthslTable(5);
+  });
 });
 
 function connectedStation(data) {
@@ -2368,6 +2394,7 @@ function updateHeardStations(arg) {
 
     tbl.appendChild(row);
   }
+  sorthslTable(hslLastSort);
 }
 
 var populateSerial = false;
@@ -3514,8 +3541,70 @@ function changeGuiDesign(design) {
 
   //update path to css file
   document.getElementById("bootstrap_theme").href = escape(theme_path);
+}
 
-  function autostart() {
+var hslLastSort = 0;
+var hslLastSortDir = "asc";
+
+//https://www.w3schools.com/howto/howto_js_sort_table.asp
+function sorthslTable(n) {
+  hslLastSort = n;
+  var table,
+    rows,
+    switching,
+    i,
+    x,
+    y,
+    shouldSwitch,
+    dir,
+    switchcount = 0;
+  table = document.getElementById("tblHeardStationList");
+  switching = true;
+  // Set the sorting direction to ascending:
+  //hslLastSortDir = "asc";
+  /* Make a loop that will continue until
+    no switching has been done: */
+  while (switching) {
+    // Start by saying: no switching is done:
+    switching = false;
+    rows = table.rows;
+    /* Loop through all table rows (except the
+      first, which contains table headers): */
+    for (i = 1; i < rows.length - 1; i++) {
+      // Start by saying there should be no switching:
+      shouldSwitch = false;
+      /* Get the two elements you want to compare,
+        one from current row and one from the next: */
+      x = rows[i].getElementsByTagName("TD")[n];
+      y = rows[i + 1].getElementsByTagName("TD")[n];
+      /* Check if the two rows should switch place,
+        based on the direction, asc or desc: */
+      if (hslLastSortDir == "asc") {
+        if (x.innerHTML.toLowerCase() > y.innerHTML.toLowerCase()) {
+          // If so, mark as a switch and break the loop:
+          shouldSwitch = true;
+          break;
+        }
+      } else if (hslLastSortDir == "desc") {
+        if (x.innerHTML.toLowerCase() < y.innerHTML.toLowerCase()) {
+          // If so, mark as a switch and break the loop:
+          shouldSwitch = true;
+          break;
+        }
+      }
+    }
+    if (shouldSwitch) {
+      /* If a switch has been marked, make the switch
+        and mark that a switch has been done: */
+      rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);
+      switching = true;
+      // Each time a switch is done, increase this count by 1:
+      switchcount++;
+    }
+  }
+}
+
+function autostart() {
   //Auto start stuff if option is enabled
   if (config.auto_start == 1) {
     //Start rigctld if radiocontrol is in correct mode and is not active
@@ -3526,8 +3615,7 @@ function changeGuiDesign(design) {
     //Now start TNC
     document.getElementById("startTNC").click();
   }
-  }
-  setTimeout(() => {
-    autostart();
-  }, 5000);
 }
+setTimeout(() => {
+  autostart();
+}, 5000);

gui/src/index.html

@@ -1149,30 +1149,21 @@
               <div class="card-body p-0" style="overflow-y: overlay">
                 <div class="table-responsive">
                   <!-- START OF TABLE FOR HEARD STATIONS -->
-                  <table class="table table-sm">
+                  <table class="table table-sm" id="tblHeardStationList">
                     <thead>
                       <tr>
-                        <th scope="col">Time</th>
+                        <th scope="col" id="thTime">Time</th>
-                        <th scope="col">Frequency</th>
+                        <th scope="col" id="thFreq">Frequency</th>
                         <th>&nbsp;</th>
-                        <th scope="col">DXCall</th>
+                        <th scope="col" id="thDxcall">DXCall</th>
-                        <th scope="col">DXGrid</th>
+                        <th scope="col" id="thDxgrid">DXGrid</th>
-                        <th scope="col">Distance</th>
+                        <th scope="col" id="thDist">Distance</th>
                         <th scope="col">Type</th>
                         <th scope="col">SNR (rx/dx)</th>
                         <!--<th scope="col">Off</th>-->
                       </tr>
                     </thead>
-                    <tbody id="heardstations">
+                    <tbody id="heardstations"></tbody>
-                      <!--
-                                 <tr>
-                                   <th scope="row">1</th>
-                                   <td>Mark</td>
-                                   <td>Otto</td>
-                                   <td>@mdo</td>
-                                 </tr>
-                                     -->
-                    </tbody>
                   </table>
                 </div>
                 <!-- END OF HEARD STATIONS TABLE -->