Finish web UI for submitting spots. Closes #29

webassets/js/spots.js

@@ -337,6 +337,64 @@ function userGridUpdated() {
     saveSettings();
 }
 
+// Method called to add a spot to the server
+function addSpot() {
+    try {
+        var dx = $("#add-spot-dx-call").val().toUpperCase();
+        var freqStr = $("#add-spot-freq").val();
+        var mode = $("#add-spot-mode").val().toUpperCase();
+        var comment = $("#add-spot-comment").val();
+        var de = $("#add-spot-de-call").val().toUpperCase();
+
+        var spot = {}
+        if (dx != "") {
+            spot["dx_call"] = dx;
+        } else {
+            showAddSpotError("A DX callsign is required in order to spot.");
+            return;
+        }
+        if (freqStr != "") {
+            spot["freq"] = parseFloat(freqStr) * 1000;
+        } else {
+            showAddSpotError("A frequency is required in order to spot.");
+            return;
+        }
+        if (mode != "") {
+            spot["mode"] = mode;
+        }
+        if (comment != "") {
+            spot["comment"] = comment;
+        }
+        if (de != "") {
+            spot["de_call"] = de;
+        }
+        spot["time"] = moment.utc().valueOf() / 1000.0;
+
+        $.ajax("/api/v1/spot", {
+            data : JSON.stringify(spot),
+            contentType : 'application/json',
+            type : 'POST',
+            timeout: 10000,
+            success: async function (result) {
+                $("#post-spot-result-good").html("<button type='button' class='btn btn-success' style='margin-top: 2em;'><i class='fa-solid fa-check'></i> OK</button>");
+                setTimeout(() => $("#post-spot-result-good").hide(), 2000);
+                loadSpots();
+            },
+            error: function (result) {
+                showAddSpotError(result.responseText);
+            }
+        });
+    } catch (error) {
+        showAddSpotError(error);
+    }
+    return false;
+}
+
+// Show an "add spot" error.
+function showAddSpotError(text) {
+    $("#post-spot-result-bad").html("<div class='alert alert-danger alert-dismissible fade show mb-0 mt-4' role='alert'><i class='fa-solid fa-triangle-exclamation'></i> " + text + "<button type='button' class='btn-close' data-bs-dismiss='alert' aria-label='Close'></button></div>");
+}
+
 // React to toggling/closing panels
 function toggleFiltersPanel() {
     // If we are going to show the filters panel, hide the display and add spot panels