Fix colours of table rows and JS exception on sig_refs being null.

core/constants.py

@@ -216,7 +216,7 @@ DXCC_FLAGS = {
     146: "\U0001F1F1\U0001F1F9",  # LITHUANIA
     147: "",  # LORD HOWE ISLAND
     148: "\U0001F1FB\U0001F1EA",  # VENEZUELA
-    149: "",  # AZORES
+    149: "\U0001F1F5\U0001F1F9",  # AZORES
     150: "\U0001F1E6\U0001F1FA",  # AUSTRALIA
     151: "",  # MALYJ VYSOTSKIJ ISLAND
     152: "\U0001F1F2\U0001F1F4",  # MACAO

webassets/css/style.css

@@ -59,14 +59,6 @@ button#add-spot-button {
 
 /* SPOTS/ALERTS PAGES, MAIN TABLE */
 
-/* Custom version of Bootstrap table colouring to colour 2 in every 4 rows, because of our second row per spot that
-appears on mobile */
-.table-striped-custom > tbody > tr:nth-of-type(4n+3) > *,
-.table-striped-custom > tbody > tr:nth-of-type(4n+4) > * {
-    --bs-table-color-type: var(--bs-table-striped-color);
-    --bs-table-bg-type: var(--bs-table-striped-bg);
-}
-
 td.nowrap, span.nowrap {
     text-wrap: nowrap;
 }

webassets/js/alerts.js

@@ -51,7 +51,7 @@ function updateTable() {
     var showRef = $("#tableShowRef")[0].checked;
 
     // Populate table with headers
-    let table = $('<table class="table table-striped-custom table-hover">').append('<thead><tr class="table-primary"></tr></thead><tbody></tbody>');
+    let table = $('<table class="table table-hover">').append('<thead><tr class="table-primary"></tr></thead><tbody></tbody>');
     if (showStartTime) {
         table.find('thead tr').append(`<th>${useLocalTime ? "Start&nbsp;(Local)" : "Start&nbsp;UTC"}</th>`);
     }
@@ -107,10 +107,18 @@ function updateTable() {
 
 // Add a row to tbody for each alert in the provided list
 function addAlertRowsToTable(tbody, alerts) {
+    var count = 0;
     alerts.forEach(a => {
         // Create row
         let $tr = $('<tr>');
 
+        // Apply striping to the table. We can't just use Bootstrap's table-striped class because we have all sorts of
+        // extra faff to deal with, like the mobile view having extra rows, and the On Now / Next 24h / Later banners
+        // which cause the table-striped colouring to go awry.
+        if (count % 2 == 1) {
+            $tr.addClass("table-active");
+        }
+
         // Use local time instead of UTC?
         var useLocalTime = $("#timeZone")[0].value == "local";
 
@@ -236,6 +244,9 @@ function addAlertRowsToTable(tbody, alerts) {
 
         // Second row for mobile view only, containing source, ref, freqs/modes & comment
         $tr2 = $("<tr class='hidenotonmobile'>");
+        if (count % 2 == 1) {
+            $tr2.addClass("table-active");
+        }
         $td2 = $("<td colspan='100'>");
         if (showSource) {
             $td2.append(`<span class='icon-wrapper'><i class='fa-solid fa-${a["icon"]}'></i></span> `);
@@ -251,6 +262,8 @@ function addAlertRowsToTable(tbody, alerts) {
         }
         $tr2.append($td2);
         tbody.append($tr2);
+
+        count++;
     });
 }
 

webassets/js/map.js

@@ -106,11 +106,13 @@ function getTooltipText(s) {
 
     // Format sig_refs
     var sig_refs = "";
+    if (s["sig_refs"] != null) {
         var items = []
         for (var i = 0; i < s["sig_refs"].length; i++) {
             items[i] = `<a href='${s["sig_refs"][i]["url"]}' title='${s["sig_refs"][i]["name"]}' target='_new' class='sig-ref-link'>${s["sig_refs"][i]["id"]}</a>`
         }
         sig_refs = items.join(", ");
+    }
 
     // DX
     ttt = `<span class='nowrap'><span class='icon-wrapper'>${dx_flag}</span> <a href='https://www.qrz.com/db/${dx_call}' target='_blank' class="dx-link">${dx_call}</a></span><br/>`;

webassets/js/spots.js

@@ -43,7 +43,7 @@ function updateTable() {
     var showDE = $("#tableShowDE")[0].checked;
 
     // Populate table with headers
-    let table = $('<table class="table table-striped-custom table-hover">').append('<thead><tr class="table-primary"></tr></thead><tbody></tbody>');
+    let table = $('<table class="table table-hover">').append('<thead><tr class="table-primary"></tr></thead><tbody></tbody>');
     if (showTime) {
         table.find('thead tr').append(`<th>${useLocalTime ? "Local" : "UTC"}</th>`);
     }
@@ -76,10 +76,18 @@ function updateTable() {
         table.find('tbody').append('<tr class="table-danger"><td colspan="100" style="text-align:center;">No spots match your filters.</td></tr>');
     }
 
+    var count = 0;
     spots.forEach(s => {
         // Create row
         let $tr = $('<tr>');
 
+        // Apply striping to the table. We can't just use Bootstrap's table-striped class because we have all sorts of
+        // extra faff to deal with, like the mobile view having extra rows, and the On Now / Next 24h / Later banners
+        // which cause the table-striped colouring to go awry.
+        if (count % 2 == 1) {
+            $tr.addClass("table-active");
+        }
+
         // Show faded out if QRT
         if (s["qrt"] == true) {
           $tr.addClass("table-faded");
@@ -161,11 +169,13 @@ function updateTable() {
 
         // Format sig_refs
         var sig_refs = "";
+        if (s["sig_refs"] != null) {
             var items = []
             for (var i = 0; i < s["sig_refs"].length; i++) {
                 items[i] = `<a href='${s["sig_refs"][i]["url"]}' title='${s["sig_refs"][i]["name"]}' target='_new' class='sig-ref-link'>${s["sig_refs"][i]["id"]}</a>`
             }
             sig_refs = items.join(", ");
+        }
 
         // Format DE flag
         var de_flag = "<i class='fa-solid fa-circle-question'></i>";
@@ -224,6 +234,9 @@ function updateTable() {
 
         // Second row for mobile view only, containing type, ref & comment
         $tr2 = $("<tr class='hidenotonmobile'>");
+        if (count % 2 == 1) {
+            $tr2.addClass("table-active");
+        }
         if (s["qrt"] == true) {
           $tr2.addClass("table-faded");
         }
@@ -242,6 +255,8 @@ function updateTable() {
         }
         $tr2.append($td2);
         table.find('tbody').append($tr2);
+
+        count++;
     });
 
     // Update DOM