fix javascript

Tastaturberuf · Nov 4, 2024 · 74262df · 74262df
1 parent 8f3d5b2
commit 74262df
Show file tree

Hide file tree

Showing 3 changed files with 63 additions and 59 deletions.
diff --git a/assets/js/anystores.js b/assets/js/anystores.js
@@ -1,4 +1,4 @@
-function loadMap()
+function loadMap(id, token)
 {
     var oReq = new XMLHttpRequest();
 
@@ -7,7 +7,7 @@ function loadMap()
     oReq.addEventListener("error", transferFailed);
     oReq.addEventListener("abort", transferCanceled);
 
-    oReq.open("GET", "system/modules/anyStores/ajax/ajax.php?module="+anystores.module+'&token='+anystores.token);
+    oReq.open("GET", "system/modules/anyStores/ajax/ajax.php?module=" + id + '&token=' + token);
     oReq.send();
 
     // progress on transfers from the server to the client (downloads)
@@ -21,8 +21,8 @@ function loadMap()
     }
 
     function transferComplete(evt) {
-        anystores = JSON.parse(this.responseText);
-        initialize();
+        let anystores = JSON.parse(this.responseText);
+        initialize(id, anystores);
     }
 
     function transferFailed(evt) {
@@ -35,9 +35,9 @@ function loadMap()
 }
 
 
-function initialize()
+function initialize(id, anystores)
 {
-    var map = new google.maps.Map(document.getElementById('map-canvas'), {
+    var map = new google.maps.Map(document.getElementById('map-canvas-' + id), {
         zoom: anystores.module.zoom,
         center: new google.maps.LatLng(anystores.module.latitude, anystores.module.longitude),
         streetViewControl: anystores.module.streetview,
@@ -99,5 +99,3 @@ function initialize()
         imagePath: 'system/modules/anyStores/assets/js/markerclusterer/images/m'
     });
 }
-
-google.maps.event.addDomListener(window, 'load', loadMap);
diff --git a/templates/modules/mod_anystores_map.html5 b/templates/modules/mod_anystores_map.html5
@@ -1,9 +1,12 @@
 <!-- indexer::stop -->
+<div id="map-canvas-<?= $this->id ?>" style="height:<?= $this->mapHeight['value'] ?><?= $this->mapHeight['unit'] ?>"
+     class="<?= $this->class ?> block"<?= $this->cssID ?><?php if ($this->style): ?> style="<?= $this->style ?>"<?php endif ?>>
+</div>
 <script>
-var anystores = {
-    "module": <?php echo $this->id ?>,
-    "token": "<?php echo $this->anystores_token ?>"
-};
+    if (document.readyState === 'loading') {
+        document.addEventListener('DOMContentLoaded', () => loadMap(<?= $this->id ?>, '<?= $this->anystores_token ?>'));
+    } else {
+        loadMap(<?= $this->id ?>, '<?= $this->anystores_token ?>');
+    }
 </script>
-<section id="map-canvas" style="height:<?= $this->mapHeight['value'] ?><?= $this->mapHeight['unit'] ?>" class="<?= $this->class ?> block"<?= $this->cssID ?><?php if ($this->style): ?> style="<?php echo $this->style; ?>"<?php endif ?>></section>
 <!-- indexer::continue -->
diff --git a/templates/modules/mod_anystores_searchmap.html5 b/templates/modules/mod_anystores_searchmap.html5
@@ -1,59 +1,62 @@
+<section id="map-canvas-<?= $this->id ?>"
+         style="height:<?php echo $this->mapHeight['value']; ?><?php echo $this->mapHeight['unit']; ?>"
+         class="<?= $this->class ?> block"<?= $this->cssID ?><?php if ($this->style): ?> style="<?php echo $this->style; ?>"<?php endif ?>></section>
 <script>
-function initialize()
-{
-    var map = new google.maps.Map(document.getElementById('map-canvas'), {
-        zoom: <?= $this->anystores_zoom ?>,
-        center: new google.maps.LatLng(<?= $this->anystores_latitude ?>, <?= $this->anystores_longitude ?>),
-        streetViewControl: <?= $this->anystores_streetview ? 'true' : 'false' ?>,
-        mapTypeId: "<?= $this->anystores_maptype ?>"
-    });
-
-    var stores = <?= $this->stores ?>;
-
-    var markers = [];
-
-    for (var i = 0; i < stores.length; i++)
-    {
-        var store = stores[i];
-
-        var marker = new google.maps.Marker({
-            position: new google.maps.LatLng(store.latitude, store.longitude),
-            title: store.name
+    function initialize_map(id) {
+        var map = new google.maps.Map(document.getElementById('map-canvas-' + id), {
+            zoom: <?= $this->anystores_zoom ?>,
+            center: new google.maps.LatLng(<?= $this->anystores_latitude ?>, <?= $this->anystores_longitude ?>),
+            streetViewControl: <?= $this->anystores_streetview ? 'true' : 'false' ?>,
+            mapTypeId: "<?= $this->anystores_maptype ?>"
         });
 
-        if ( store.marker )
-        {
-            marker.setIcon(store.marker);
-        }
-
-        var infowindow = new google.maps.InfoWindow();
+        var stores = <?= $this->stores ?>;
 
-        google.maps.event.addListener(marker, 'click', (function(marker, i) {
+        var markers = [];
 
-            var html = "<b><a href=\"" + store.href + "\">" + store.name + "</a></b><br>";
+        for (var i = 0; i < stores.length; i++) {
+            var store = stores[i];
 
-            (store.street !="") ? html += store.street  + "<br>" : "";
-            (store.city !="")   ? html += store.postal  + " " +  store.city  + "<br>" : "";
-            (store.phone !="")  ? html += store.phone  + "<br>" : "";
-            (store.url !="")    ? html += "<a href=\"" + store.url  + "\">" + store.url  + "</a><br>" : "";
-            (store.email !="")  ? html += "<a href=\"mailto:" + store.email  + "\">" + store.email  + "</a><br>" : "";
-            (store.href !="")   ? html += "<br><a href=\"" + store.href + "\">Mehr Informationen</a>" : "";
+            var marker = new google.maps.Marker({
+                position: new google.maps.LatLng(store.latitude, store.longitude),
+                title: store.name
+            });
 
-            return function() {
-                infowindow.setContent(html);
-                infowindow.open(map, marker);
+            if (store.marker) {
+                marker.setIcon(store.marker);
             }
 
-        })(marker, i));
+            var infowindow = new google.maps.InfoWindow();
 
-        markers.push(marker);
-    }
+            google.maps.event.addListener(marker, 'click', (function (marker, i) {
+
+                var html = "<b><a href=\"" + store.href + "\">" + store.name + "</a></b><br>";
+
+                (store.street != "") ? html += store.street + "<br>" : "";
+                (store.city != "") ? html += store.postal + " " + store.city + "<br>" : "";
+                (store.phone != "") ? html += store.phone + "<br>" : "";
+                (store.url != "") ? html += "<a href=\"" + store.url + "\">" + store.url + "</a><br>" : "";
+                (store.email != "") ? html += "<a href=\"mailto:" + store.email + "\">" + store.email + "</a><br>" : "";
+                (store.href != "") ? html += "<br><a href=\"" + store.href + "\">Mehr Informationen</a>" : "";
+
+                return function () {
+                    infowindow.setContent(html);
+                    infowindow.open(map, marker);
+                }
 
-    var markerCluster = new MarkerClusterer(map, markers, {
-        imagePath: 'system/modules/anyStores/assets/js/markerclusterer/images/m'
-    });
-}
+            })(marker, i));
 
-google.maps.event.addDomListener(window, 'load', initialize);
+            markers.push(marker);
+        }
+
+        var markerCluster = new MarkerClusterer(map, markers, {
+            imagePath: 'system/modules/anyStores/assets/js/markerclusterer/images/m'
+        });
+    }
+
+    if (document.readyState === 'loading') {
+        document.addEventListener('DOMContentLoaded', () => initialize_map(<?= $this->id ?>));
+    } else {
+        initialize_map(<?= $this->id ?>);
+    }
 </script>
-<section id="map-canvas" style="height:<?php echo $this->mapHeight['value']; ?><?php echo $this->mapHeight['unit']; ?>" class="<?= $this->class ?> block"<?= $this->cssID ?><?php if ($this->style): ?> style="<?php echo $this->style; ?>"<?php endif ?>></section>