| New file |
|---|
| 0,0 → 1,284 |
|---|
| /* |
| * * Leaflet Gesture Handling ** |
| * * Version 1.1.8 |
| */ |
| import LanguageContent from "./language-content"; |
| |
| L.Map.mergeOptions({ |
| gestureHandlingOptions: { |
| text: {}, |
| duration: 1000 |
| } |
| }); |
| |
| var draggingMap = false; |
| |
| export var GestureHandling = L.Handler.extend({ |
| addHooks: function() { |
| this._handleTouch = this._handleTouch.bind(this); |
| |
| this._setupPluginOptions(); |
| this._setLanguageContent(); |
| this._disableInteractions(); |
| |
| //Uses native event listeners instead of L.DomEvent due to issues with Android touch events |
| //turning into pointer events |
| this._map._container.addEventListener("touchstart", this._handleTouch); |
| this._map._container.addEventListener("touchmove", this._handleTouch); |
| this._map._container.addEventListener("touchend", this._handleTouch); |
| this._map._container.addEventListener("touchcancel", this._handleTouch); |
| this._map._container.addEventListener("click", this._handleTouch); |
| |
| L.DomEvent.on( |
| this._map._container, |
| "wheel", |
| this._handleScroll, |
| this |
| ); |
| L.DomEvent.on(this._map, "mouseover", this._handleMouseOver, this); |
| L.DomEvent.on(this._map, "mouseout", this._handleMouseOut, this); |
| |
| // Listen to these events so will not disable dragging if the user moves the mouse out the boundary of the map container whilst actively dragging the map. |
| L.DomEvent.on(this._map, "movestart", this._handleDragging, this); |
| L.DomEvent.on(this._map, "move", this._handleDragging, this); |
| L.DomEvent.on(this._map, "moveend", this._handleDragging, this); |
| }, |
| |
| removeHooks: function() { |
| this._enableInteractions(); |
| |
| this._map._container.removeEventListener( |
| "touchstart", |
| this._handleTouch |
| ); |
| this._map._container.removeEventListener( |
| "touchmove", |
| this._handleTouch |
| ); |
| this._map._container.removeEventListener("touchend", this._handleTouch); |
| this._map._container.removeEventListener( |
| "touchcancel", |
| this._handleTouch |
| ); |
| this._map._container.removeEventListener("click", this._handleTouch); |
| |
| L.DomEvent.off( |
| this._map._container, |
| "wheel", |
| this._handleScroll, |
| this |
| ); |
| L.DomEvent.off(this._map, "mouseover", this._handleMouseOver, this); |
| L.DomEvent.off(this._map, "mouseout", this._handleMouseOut, this); |
| |
| L.DomEvent.off(this._map, "movestart", this._handleDragging, this); |
| L.DomEvent.off(this._map, "move", this._handleDragging, this); |
| L.DomEvent.off(this._map, "moveend", this._handleDragging, this); |
| }, |
| |
| _handleDragging: function(e) { |
| if (e.type == "movestart" || e.type == "move") { |
| draggingMap = true; |
| } else if (e.type == "moveend") { |
| draggingMap = false; |
| } |
| }, |
| |
| _disableInteractions: function() { |
| this._map.dragging.disable(); |
| this._map.scrollWheelZoom.disable(); |
| if (this._map.tap) { |
| this._map.tap.disable(); |
| } |
| }, |
| |
| _enableInteractions: function() { |
| this._map.dragging.enable(); |
| this._map.scrollWheelZoom.enable(); |
| if (this._map.tap) { |
| this._map.tap.enable(); |
| } |
| }, |
| |
| _setupPluginOptions: function() { |
| //For backwards compatibility, merge gestureHandlingText into the new options object |
| if (this._map.options.gestureHandlingText) { |
| this._map.options.gestureHandlingOptions.text = this._map.options.gestureHandlingText; |
| } |
| }, |
| |
| _setLanguageContent: function() { |
| var languageContent; |
| //If user has supplied custom language, use that |
| if ( |
| this._map.options.gestureHandlingOptions && |
| this._map.options.gestureHandlingOptions.text && |
| this._map.options.gestureHandlingOptions.text.touch && |
| this._map.options.gestureHandlingOptions.text.scroll && |
| this._map.options.gestureHandlingOptions.text.scrollMac |
| ) { |
| languageContent = this._map.options.gestureHandlingOptions.text; |
| } else { |
| //Otherwise auto set it from the language files |
| |
| //Determine their language e.g fr or en-US |
| var lang = this._getUserLanguage(); |
| |
| //If we couldn't find it default to en |
| if (!lang) { |
| lang = "en"; |
| } |
| |
| //Lookup the appropriate language content |
| if (LanguageContent[lang]) { |
| languageContent = LanguageContent[lang]; |
| } |
| |
| //If no result, try searching by the first part only. e.g en-US just use en. |
| if (!languageContent && lang.indexOf("-") !== -1) { |
| lang = lang.split("-")[0]; |
| languageContent = LanguageContent[lang]; |
| } |
| |
| if (!languageContent) { |
| // If still nothing, default to English |
| // console.log("No lang found for", lang); |
| lang = "en"; |
| languageContent = LanguageContent[lang]; |
| } |
| } |
| |
| //TEST |
| // languageContent = LanguageContent["bg"]; |
| |
| //Check if they're on a mac for display of command instead of ctrl |
| var mac = false; |
| if (navigator.platform.toUpperCase().indexOf("MAC") >= 0) { |
| mac = true; |
| } |
| |
| var scrollContent = languageContent.scroll; |
| if (mac) { |
| scrollContent = languageContent.scrollMac; |
| } |
| |
| this._map._container.setAttribute( |
| "data-gesture-handling-touch-content", |
| languageContent.touch |
| ); |
| this._map._container.setAttribute( |
| "data-gesture-handling-scroll-content", |
| scrollContent |
| ); |
| }, |
| |
| _getUserLanguage: function() { |
| var lang = navigator.languages |
| ? navigator.languages[0] |
| : navigator.language || navigator.userLanguage; |
| return lang; |
| }, |
| |
| _handleTouch: function(e) { |
| //Disregard touch events on the minimap if present |
| var ignoreList = [ |
| "leaflet-control-minimap", |
| "leaflet-interactive", |
| "leaflet-popup-content", |
| "leaflet-popup-content-wrapper", |
| "leaflet-popup-close-button", |
| "leaflet-control-zoom-in", |
| "leaflet-control-zoom-out" |
| ]; |
| |
| var ignoreElement = false; |
| for (var i = 0; i < ignoreList.length; i++) { |
| if (L.DomUtil.hasClass(e.target, ignoreList[i])) { |
| ignoreElement = true; |
| } |
| } |
| |
| if (ignoreElement) { |
| if ( |
| L.DomUtil.hasClass(e.target, "leaflet-interactive") && |
| e.type === "touchmove" && |
| e.touches.length === 1 |
| ) { |
| L.DomUtil.addClass(this._map._container, |
| "leaflet-gesture-handling-touch-warning" |
| ); |
| this._disableInteractions(); |
| } else { |
| L.DomUtil.removeClass(this._map._container, |
| "leaflet-gesture-handling-touch-warning" |
| ); |
| } |
| return; |
| } |
| // screenLog(e.type+' '+e.touches.length); |
| if (e.type !== "touchmove" && e.type !== "touchstart") { |
| L.DomUtil.removeClass(this._map._container, |
| "leaflet-gesture-handling-touch-warning" |
| ); |
| return; |
| } |
| if (e.touches.length === 1) { |
| L.DomUtil.addClass(this._map._container, |
| "leaflet-gesture-handling-touch-warning" |
| ); |
| this._disableInteractions(); |
| } else { |
| this._enableInteractions(); |
| L.DomUtil.removeClass(this._map._container, |
| "leaflet-gesture-handling-touch-warning" |
| ); |
| } |
| }, |
| |
| _isScrolling: false, |
| |
| _handleScroll: function(e) { |
| if (e.metaKey || e.ctrlKey) { |
| e.preventDefault(); |
| L.DomUtil.removeClass(this._map._container, |
| "leaflet-gesture-handling-scroll-warning" |
| ); |
| this._map.scrollWheelZoom.enable(); |
| } else { |
| L.DomUtil.addClass(this._map._container, |
| "leaflet-gesture-handling-scroll-warning" |
| ); |
| this._map.scrollWheelZoom.disable(); |
| |
| clearTimeout(this._isScrolling); |
| |
| // Set a timeout to run after scrolling ends |
| this._isScrolling = setTimeout(function() { |
| // Run the callback |
| var warnings = document.getElementsByClassName( |
| "leaflet-gesture-handling-scroll-warning" |
| ); |
| for (var i = 0; i < warnings.length; i++) { |
| L.DomUtil.removeClass(warnings[i], |
| "leaflet-gesture-handling-scroll-warning" |
| ); |
| } |
| }, this._map.options.gestureHandlingOptions.duration); |
| } |
| }, |
| |
| _handleMouseOver: function(e) { |
| this._enableInteractions(); |
| }, |
| |
| _handleMouseOut: function(e) { |
| if (!draggingMap) { |
| this._disableInteractions(); |
| } |
| } |
| |
| }); |
| |
| L.Map.addInitHook("addHandler", "gestureHandling", GestureHandling); |
| |
| export default GestureHandling; |