[Dashboard] Loads QSOs with red icons and reloads every 5secs

Adds to #3105 TODO - this doesnt listen to the user options
magicbug · May 16, 2024 · 84dbe80 · 84dbe80
1 parent 9691a8b
commit 84dbe80
Showing 1 changed file with 53 additions and 6 deletions.
diff --git a/application/views/interface_assets/footer.php b/application/views/interface_assets/footer.php
@@ -805,7 +805,6 @@ function showActivatorsMap(call, count, grids) {
 
 <?php if ($this->uri->segment(1) == "" || $this->uri->segment(1) == "dashboard") { ?>
     <script type="text/javascript" src="<?php echo base_url(); ?>assets/js/leaflet/L.Maidenhead.js"></script>
-    <script id="leafembed" type="text/javascript" src="<?php echo base_url(); ?>assets/js/leaflet/leafembed.js" tileUrl="<?php echo $this->optionslib->get_option('option_map_tile_server'); ?>"></script>
 
     <script type="text/javascript">
         $(function() {
@@ -822,18 +821,66 @@ function showActivatorsMap(call, count, grids) {
 
         var qso_loc = '<?php echo site_url('map/map_plot_json'); ?>';
         var q_zoom = 3;
+        var osmUrl = '<?php echo $this->optionslib->get_option('option_map_tile_server'); ?>';
+        var osmCopyright = '<?php echo $this->optionslib->get_option('map_tile_server_copyright'); ?>';
+
+        var redIconImg = L.icon({
+            iconUrl: icon_dot_url,
+            iconSize: [10, 10]
+        });
 
         $(document).ready(function() {
             <?php if ($this->config->item('map_gridsquares') != FALSE) { ?>
                 var grid = "Yes";
             <?php } else { ?>
                 var grid = "No";
             <?php } ?>
-            initmap(grid, 'map', {
-                'dataPost': {
-                    'nb_qso': '18'
-                }
-            });
+
+            var map = L.map('map').setView([q_lat, q_lng], q_zoom);
+
+            L.tileLayer(osmUrl, {
+                attribution: osmCopyright
+            }).addTo(map);
+
+            var printer = L.easyPrint({
+                sizeModes: ['Current'],
+                filename: 'myMap',
+                exportOnly: true,
+                hideControlContainer: true
+            }).addTo(map);
+
+            var layerControl = new L.Control.Layers(null, { 'Gridsquares': maidenhead = L.maidenhead() }).addTo(map);
+
+            var markers = {};
+
+            // Load maidenhead grid squares as a layer control
+
+            function loadMarkers() {
+                fetch(qso_loc)
+                    .then(response => response.json())
+                    .then(data => {
+                        var newMarkers = {};
+                        data.markers.forEach(marker => {
+                            var key = `${marker.lat},${marker.lng}`;
+                            newMarkers[key] = marker;
+                            if (!markers[key]) {
+                                L.marker([marker.lat, marker.lng], {
+                                        icon: redIconImg
+                                    }).addTo(map)
+                                    .bindPopup(marker.html);
+                            }
+                        });
+                        Object.keys(markers).forEach(key => {
+                            if (!newMarkers[key]) {
+                                map.removeLayer(markers[key]);
+                            }
+                        });
+                        markers = newMarkers;
+                    });
+            }
+
+            loadMarkers();
+            setInterval(loadMarkers, 5000);
 
         });
     </script>