huge Laravel 10 upgrade

support/laravel-maps/resources/js/utils/customEventPolyfill.js

@@ -0,0 +1,15 @@
+(function () {
+  if (window.CustomEvent) return false;
+  function CustomEvent(event, params) {
+    params = params || {
+      bubbles: false, cancelable: false, detail: undefined
+    };
+    var evt = document.createEvent( 'CustomEvent' );
+    evt.initCustomEvent(
+      event, params.bubbles, params.cancelable, params.detail
+    );
+    return evt;
+  }
+  CustomEvent.prototype = window.Event.prototype;
+  window.CustomEvent = CustomEvent;
+})();

support/laravel-maps/resources/js/utils/dispatchEvent.js

@@ -0,0 +1,23 @@
+export function dispatchEventMapInitialized (serviceName, element, data) {
+  const event = new CustomEvent('LaravelMaps:MapInitialized', {
+    detail: {
+      element: element,
+      map: data.map,
+      markers: data.markers || [],
+      service: serviceName,
+    },
+  });
+  window.dispatchEvent(event);
+}
+
+export function dispatchEventMarkerClicked (serviceName, element, map, marker) {
+  const event = new CustomEvent('LaravelMaps:MarkerClicked', {
+    detail: {
+      element: element,
+      map: map,
+      marker: marker,
+      service: serviceName,
+    },
+  });
+  window.dispatchEvent(event);
+}

support/laravel-maps/resources/js/utils/helper.js

@@ -0,0 +1,11 @@
+export const isDefined = object => typeof object !== 'undefined';
+
+export const fadeElementIn = element => {
+  const target = element.closest('.fade');
+  target.classList.add('show'); // Bootstrap 4
+  target.classList.add('in'); // Backwards compatibility Bootstrap 3.3.7
+};
+
+export const openUrl = url => window.open(url, '_blank');
+
+export const logError = error => isDefined(console) && console.error('[laravel-maps] error:', error);

support/laravel-maps/resources/js/utils/leaflet.js

@@ -0,0 +1,44 @@
+import {openUrl} from './helper';
+import {dispatchEventMarkerClicked} from './dispatchEvent';
+
+export function createMarker(service, element, map, markerData) {
+  const {title, lat, lng, url, popup, icon, iconSize, iconAnchor} = markerData;
+
+  const markerOptions = {
+    title,
+    keyboard: false,
+    draggable: false,
+  };
+
+  if (icon) {
+    const iconOptions = {
+      iconUrl: icon,
+    };
+    if (iconSize) {
+      iconOptions.iconSize = iconSize;
+    }
+    if (iconAnchor) {
+      iconOptions.iconAnchor = iconAnchor;
+    }
+    markerOptions.icon = window.L.icon(iconOptions);
+  }
+
+  const marker = window.L.marker([lat, lng], markerOptions);
+
+  marker.on('click', event => {
+    event.originalEvent.preventDefault();
+    dispatchEventMarkerClicked(service, element, map, marker);
+    if (popup) {
+      window.L.popup()
+        .setLatLng([lat, lng])
+        .setContent(popup)
+        .openOn(map);
+    } else if (url) {
+      openUrl(url);
+    }
+  });
+
+  marker.addTo(map);
+
+  return marker;
+}

support/laravel-maps/resources/js/utils/parser.js

@@ -0,0 +1,74 @@
+import {logError} from './helper';
+
+const parseMap = element => JSON.parse(
+  element.dataset.mapGoogle
+  || element.dataset.mapOsm
+  || element.dataset.mapBing
+  || element.dataset.mapMapquest
+  || element.dataset.mapYandex
+  || element.dataset.mapMapkit
+);
+
+const parseService = element => {
+  const {key, type} = JSON.parse(element.dataset.mapService);
+
+  return {
+    key,
+    type,
+  }
+};
+
+const parseMarkers = element => {
+  const markers = JSON.parse(element.dataset.mapMarkers) || [];
+  return markers.map(marker => {
+    const lat = parseNumberFloat(marker.lat);
+    const lng = parseNumberFloat(marker.lng);
+
+    const {title, url, popup, icon, icon_size, icon_anchor} = marker;
+
+    return {
+      title,
+      lat,
+      lng,
+      url,
+      popup,
+      icon,
+      iconSize: icon_size || marker.iconSize,
+      iconAnchor: icon_anchor || marker.iconAnchor,
+    };
+  });
+};
+
+const parseNumberFloat = number => {
+  return typeof number === 'string'
+    ? parseFloat(number)
+    : number;
+};
+
+const parseNumberInt = number => {
+  return typeof number === 'string'
+    ? parseFloat(number)
+    : number;
+};
+
+export default {
+  map(element) {
+    try {
+      const map = parseMap(element);
+      const lat = parseNumberFloat(map.lat);
+      const lng = parseNumberFloat(map.lng);
+      const zoom = parseNumberInt(map.zoom);
+      const service = parseService(element);
+      const markers = parseMarkers(element);
+      return {
+        lat,
+        lng,
+        zoom,
+        service,
+        markers,
+      };
+    } catch (e) {
+      logError(e);
+    }
+  },
+}