@raruto/leaflet-elevation 1.7.4 → 1.8.0

package/src/utils.js

@@ -22,29 +22,6 @@ export function deepMerge(target, ...sources) {
 	return deepMerge(target, ...sources);
 }
 
-/**
- * Wait for document load before execute function.
- */
-export function deferFunc(f) {
-	if (document.readyState !== 'complete') window.addEventListener("load", f, { once: true });
-	else f();
-}
-/**
- * Debounce function to limit events are being fired.
- */
-export function debounce(func, wait, context, immediate) {
-	var timeout;
-	return function() {
-		var args = arguments;
-		clearTimeout(timeout);
-		timeout  = setTimeout(function() {
-			timeout = null;
-		if (!immediate) func.apply(context, args);
-		}, wait);
-		if (immediate && !timeout) func.apply(context, args);
-	};
-}
-
 const SEC  = 1000;
 const MIN  = SEC * 60;
 const HOUR = MIN * 60;
@@ -73,14 +50,13 @@ export function GeoJSONLoader(data, control) {
 	}
 	control = control || this;
 
-  let distanceMarkers = (
+	let distanceMarkers = (
 			control.options.distanceMarkers === true
 				? { lazy: true }
 				: L.extend({ lazy: true }, control.options.distanceMarkers)
 	);
 
-  let wptIcons  = control.options.wptIcons;
-  let wptLabels = control.options.wptLabels;
+	let { wptIcons, wptLabels } = control.options;
 
 	let layer = L.geoJson(data, {
 		distanceMarkers: distanceMarkers,
@@ -99,33 +75,32 @@ export function GeoJSONLoader(data, control) {
 			let name   = prop.name ?? '';
 			let sym    = (prop.sym ?? name).replace(' ', '-').replace('"', '').replace("'", '').toLowerCase();
 
-      // Handle waypoint lables (markers and dots)
-      if (!wptLabels) {
-        name = '';
-        desc = '';
-      }
-
-      // Handle chart waypoints (dots)
-      if ([true, "dots"].includes(control.options.waypoints)) {
-        control._registerCheckPoint({latlng: latlng, label: name}, true);
-      }
-
-      // Handle map waypoints (markers)
-      if ([true, "markers"].includes(control.options.waypoints) && wptIcons != false) {
-        // generate and cache appropriate icon symbol
-        if (!wptIcons.hasOwnProperty(sym)) {
-          wptIcons[sym] = L.divIcon(
-            L.extend({}, wptIcons[""].options, { html: '<i class="elevation-waypoint-icon ' + sym + '"></i>' } )
-          );
-        }
-  			let marker = L.marker(latlng, { icon: wptIcons[sym] });
-  			if (name || desc) {
-  				marker.bindPopup("<b>" + name + "</b>" + (desc.length > 0 ? '<br>' + desc : '')).openPopup();
-  			}
-        control._addMarker(marker);
-  			control.fire('waypoint_added', { point: marker, element: latlng, properties: prop });
-        return marker;
-      }
+			// Handle chart waypoints (dots)
+			if ([true, 'dots'].includes(control.options.waypoints)) {
+				control._registerCheckPoint({
+						latlng: latlng,
+						label: ([true, 'dots'].includes(wptLabels) ? name : '')
+					},
+					true
+				);
+			}
+
+			// Handle map waypoints (markers)
+			if ([true, 'markers'].includes(control.options.waypoints) && wptIcons != false) {
+				// generate and cache appropriate icon symbol
+				if (!wptIcons.hasOwnProperty(sym)) {
+					wptIcons[sym] = L.divIcon(
+						L.extend({}, wptIcons[""].options, { html: '<i class="elevation-waypoint-icon ' + sym + '"></i>' } )
+					);
+				}
+				let marker = L.marker(latlng, { icon: wptIcons[sym] });
+				if ([true, 'markers'].includes(wptLabels) && (name || desc)) {
+					marker.bindPopup("<b>" + name + "</b>" + (desc.length > 0 ? '<br>' + desc : '')).openPopup();
+				}
+				control._addMarker(marker);
+				control.fire('waypoint_added', { point: marker, element: latlng, properties: prop });
+				return marker;
+			}
 		},
 		onEachFeature: (feature, layer) => {
 			if (feature.geometry && feature.geometry.type == 'Point') return;
@@ -152,12 +127,12 @@ export function GeoJSONLoader(data, control) {
 
 			// Postpone adding the distance markers (lazy: true)
 			if(control.options.distanceMarkers && distanceMarkers.lazy) {
-			  layer.on('add remove', (e) => {
-			    let path = e.target;
-			    if (L.DistanceMarkers && path instanceof L.Polyline) {
+				layer.on('add remove', (e) => {
+					let path = e.target;
+					if (L.DistanceMarkers && path instanceof L.Polyline) {
 						path[e.type + 'DistanceMarkers']();
-			    }
-			  });
+					}
+				});
 			}
 
 			control.track_info = L.extend({}, control.track_info, { type: "geojson", name: data.name });
@@ -171,13 +146,6 @@ export function GeoJSONLoader(data, control) {
 	return layer;
 }
 
-/**
- * Check DOM element visibility.
- */
-export function isDomVisible(elem) {
-	return !!(elem.offsetWidth || elem.offsetHeight || elem.getClientRects().length);
-}
-
 /**
  * Check object type.
  */
@@ -185,47 +153,6 @@ export function isObject(item) {
 	return (item && typeof item === 'object' && !Array.isArray(item));
 }
 
-/**
- * Check DOM element viewport visibility.
- */
-export function isVisible(elem) {
-	if (!elem) return false;
-
-	let styles = window.getComputedStyle(elem);
-
-	function isVisibleByStyles(elem, styles) {
-		return styles.visibility !== 'hidden' && styles.display !== 'none';
-	}
-
-	function isAboveOtherElements(elem, styles) {
-		let boundingRect = elem.getBoundingClientRect();
-		let left = boundingRect.left + 1;
-		let right = boundingRect.right - 1;
-		let top = boundingRect.top + 1;
-		let bottom = boundingRect.bottom - 1;
-		let above = true;
-
-		let pointerEvents = elem.style.pointerEvents;
-
-		if (styles['pointer-events'] == 'none') elem.style.pointerEvents = 'auto';
-
-		if (document.elementFromPoint(left, top) !== elem) above = false;
-		if (document.elementFromPoint(right, top) !== elem) above = false;
-
-		// Only for completely visible elements
-		// if (document.elementFromPoint(left, bottom) !== elem) above = false;
-		// if (document.elementFromPoint(right, bottom) !== elem) above = false;
-
-		elem.style.pointerEvents = pointerEvents;
-
-		return above;
-	}
-
-	if (!isVisibleByStyles(elem, styles)) return false;
-	if (!isAboveOtherElements(elem, styles)) return false;
-	return true;
-}
-
 /**
  * Check JSON object type.
  */
@@ -260,6 +187,17 @@ export function isXMLDoc(doc, lazy) {
 	}
 }
 
+/**
+ * Generate download data event.
+ */
+ export function saveFile(dataURI, fileName) {
+	let a = create('a', '', { href: dataURI, target: '_new', download: fileName || "", style: "display:none;" });
+	let b = document.body;
+	b.appendChild(a);
+	a.click();
+	b.removeChild(a);
+}
+
 /**
  * Async JS script download.
  */
@@ -278,39 +216,71 @@ export function lazyLoader(url, skip, loader) {
 	});
 }
 
+export function lazyLoad(src, control) {
+	if (!control.options.lazyLoadJS) return Promise.resolve();
+
+	const Elevation = L.Control.Elevation;
+	let loader      = '';
+	let condition = false;
+
+	switch(src) {
+		case control.__D3:
+			loader    = '_d3LazyLoader';
+			condition = typeof d3 !== 'object';
+		break;
+		case control.__TOGEOJSON:
+			loader    = '_togeojsonLazyLoader';
+			condition = typeof toGeoJSON !== 'object';
+		break;
+		case control.__LGEOMUTIL:
+			loader    = '_geomutilLazyLoader';
+			condition = typeof L.GeometryUtil !== 'object';
+		case control.__LALMOSTOVER:
+			loader    = '_almostoverLazyLoader';
+			condition = typeof L.Handler.AlmostOver  !== 'function ';
+		break;
+		case control.__LDISTANCEM:
+			loader    = '_distanceMarkersLazyLoader';
+			condition = typeof L.DistanceMarkers  !== 'function';
+		break;
+	}
+	return Elevation[loader] = lazyLoader(src, condition, Elevation[loader]);
+}
+
 /**
- * Generate download data event.
+ * Convert SVG Path into Path2D and then update canvas
  */
-export function saveFile(dataURI, fileName) {
-	let a = create('a', '', { href: dataURI, target: '_new', download: fileName || "", style: "display:none;" });
-	let b = document.body;
-	b.appendChild(a);
-	a.click();
-	b.removeChild(a);
+ export function drawCanvas(ctx, path) {
+	path.classed('canvas-path', true);
+
+	ctx.beginPath();
+	ctx.moveTo(0, 0);
+	let p = new Path2D(path.attr('d'));
+
+	ctx.strokeStyle = path.attr('stroke');
+	ctx.fillStyle   = path.attr('fill');
+	ctx.lineWidth   = 1.25;
+	ctx.globalCompositeOperation = 'source-over';
+
+	// stroke opacity
+	ctx.globalAlpha = path.attr('stroke-opacity') || 0.3;
+	ctx.stroke(p);
+
+	// fill opacity
+	ctx.globalAlpha = path.attr('fill-opacity')   || 0.45;
+	ctx.fill(p);
+
+	ctx.globalAlpha = 1;
+
+	ctx.closePath();
 }
 
 /**
- * Wait for element visible before execute function.
+ * Limit a number between min / max values
  */
-export function waitHolder(elem) {
-	return new Promise((resolve, reject) => {
-		let ticking = false;
-		let scrollFn = () => {
-			if (!ticking) {
-				L.Util.requestAnimFrame(() => {
-					if (isVisible(elem)) {
-						window.removeEventListener('scroll', scrollFn);
-						resolve();
-					}
-					ticking = false;
-				});
-				ticking = true;
-			}
-		};
-		window.addEventListener('scroll', scrollFn);
-		if (elem) elem.addEventListener('mouseenter', scrollFn, { once: true });
-		scrollFn();
-	});
+ export function clamp(val, range) {
+	if (range) return val < range[0] ? range[0] : val > range[1] ? range[1] : val;
+	return val;
 }
 
 /**
@@ -332,8 +302,8 @@ export function toggleClass(targetNode, className, conditional) {
 }
 
 export function replaceClass(targetNode, removeClassName, addClassName) {
-  if (removeClassName) removeClass(targetNode, removeClassName);
-  if (addClassName) addClass(targetNode, addClassName);
+	if (removeClassName) removeClass(targetNode, removeClassName);
+	if (addClassName) addClass(targetNode, addClassName);
 }
 
 export function style(targetNode, name, value) {
@@ -342,7 +312,7 @@ export function style(targetNode, name, value) {
 }
 
 export function toggleStyle(targetNode, name, value, conditional) {
-  return style(targetNode, name, conditional ? value : '');
+	return style(targetNode, name, conditional ? value : '');
 }
 
 export function toggleEvent(leafletElement, eventName, handler, conditional) {
@@ -403,10 +373,16 @@ export const off = L.DomEvent.off;
 export const hasClass = L.DomUtil.hasClass;
 
 
+/**
+ * Generate a random string
+ */
 export function randomId() {
 	return Math.random().toString(36).substr(2, 9);
 }
 
+/**
+ * Execute a function foreach element in object
+ */
 export function each(obj, fn) {
 	for (let i in obj) fn(obj[i], i);
-}
+}