forked from asola-bi4group/leaflet-side-by-side
-
Notifications
You must be signed in to change notification settings - Fork 1
/
leaflet-side-by-side.min.js
1 lines (1 loc) · 11.5 KB
/
leaflet-side-by-side.min.js
1
!function i(s,a,r){function o(t,e){if(!a[t]){if(!s[t]){var n="function"==typeof require&&require;if(!e&&n)return n(t,!0);if(h)return h(t,!0);throw(n=new Error("Cannot find module '"+t+"'")).code="MODULE_NOT_FOUND",n}n=a[t]={exports:{}},s[t][0].call(n.exports,function(e){return o(s[t][1][e]||e)},n,n.exports,i,s,a,r)}return a[t].exports}for(var h="function"==typeof require&&require,e=0;e<r.length;e++)o(r[e]);return o}({1:[function(p,d,e){!function(e){!function(){var t,n,s="undefined"!=typeof window?window.L:void 0!==e?e.L:null;function i(t,e,n,i){e.split(" ").forEach(function(e){s.DomEvent.on(t,e,n,i)})}function a(t,e,n,i){e.split(" ").forEach(function(e){s.DomEvent.off(t,e,n,i)})}function r(e){return"oninput"in e?"input":"change"}function o(){t=this._map.dragging.enabled(),n=this._map.tap&&this._map.tap.enabled(),this._map.dragging.disable(),this._map.tap&&this._map.tap.disable()}function h(e){this._refocusOnMap(e),t&&this._map.dragging.enable(),n&&this._map.tap.enable()}function l(e){return e?Array.isArray(e)?e:[e]:[]}p("./layout.css"),p("./range.css"),p("./swap.css"),s.Control.SideBySide=s.Control.extend({options:{thumbSize:30,padding:0,swap:!1},swapped:!1,initialize:function(e,t,n){this.setLeftLayers(e),this.setRightLayers(t),s.setOptions(this,n)},getPosition:function(){var e=this._range.value,t=(.5-e)*(2*this.options.padding+this.options.thumbSize);return this._map.getSize().x*e+t},setPosition:function(){},includes:s.Evented.prototype||s.Mixin.Events,addTo:function(e){this.remove(),this._map=e;var t=this._container=s.DomUtil.create("div","leaflet-sbs",e._controlContainer);this._divider=s.DomUtil.create("div","leaflet-sbs-divider",t);e=this._range=s.DomUtil.create("input","leaflet-sbs-range",t);return e.addEventListener("click",function(e){e.stopPropagation(),s.DomEvent.preventDefault(e)}),e.type="range",e.min=0,e.max=1,e.step="any",e.value=.5,e.style.paddingLeft=e.style.paddingRight=this.options.padding+"px",this.options.swap&&((t=this._swap=s.DomUtil.create("button","leaflet-sbs-swap",t)).type="button",t.setAttribute("aria-label","Swap images"),t.setAttribute("data-left",this.swapped?"B":"A"),t.setAttribute("data-right",this.swapped?"A":"B"),t.style.display="none",t.style.paddingLeft=t.style.paddingRight=this.options.padding+"px",t.style.top="calc(50% + "+this.options.thumbSize+"px)"),this._addEvents(),this._updateLayers(),this},getWrapper:function(e){return e.getContainer?e.getContainer():e.getPane()},remove:function(){return this._map&&(this._leftLayers&&this._leftLayers.forEach(this._updateLayerClip.bind(this,"")),this._rightLayers&&this._rightLayers.forEach(this._updateLayerClip.bind(this,"")),this._removeEvents(),s.DomUtil.remove(this._container),this._map=null),this},setLeftLayers:function(e){return this._leftLayers=l(e),this._updateLayers(),this},setRightLayers:function(e){return this._rightLayers=l(e),this._updateLayers(),this},addLeftLayer:function(e){e=l(e),this._leftLayers=[...this._leftLayers,...e],this._updateLayers()},addRightLayer:function(e){e=l(e),this._rightLayers=[...this._rightLayers,...e],this._updateLayers()},_updateLayerClip:function(t,n){if(this._map.hasLayer(n))if("function"==typeof n.getContainer){let e=n.getContainer();null!==e&&void 0!==e&&(e.style.clip=t)}else if("function"==typeof n.getPane)try{let e=n.getPane();e.style.clip=t}catch(e){console.error(e)}else null==n.map?console.warn("Layer May be removed from map cant update clip"):console.error("Unsupported Layer Type: ",n);else console.warn("Layer Not On Map Cant Clip")},_updateClip:function(){var e=this._map,t=e.containerPointToLayerPoint([0,0]),n=e.containerPointToLayerPoint(e.getSize()),i=t.x+this.getPosition(),e=this.getPosition();this._divider.style.left=e+"px",this.fire("dividermove",{x:e}),this._swap&&(this._swap.style.display=this._leftLayer&&this._rightLayer?"block":"none",this._swap.style.left=e-this.options.thumbSize/2+"px",this._swap.setAttribute("data-left",this.swapped?"B":"A"),this._swap.setAttribute("data-right",this.swapped?"A":"B"));e="rect("+[t.y,i,n.y,t.x].join("px,")+"px)",i="rect("+[t.y,n.x,n.y,i].join("px,")+"px)";this._leftLayers.forEach(this._updateLayerClip.bind(this,e)),this._rightLayers.forEach(this._updateLayerClip.bind(this,i))},_updateLayers:function(){if(!this._map)return this;var e=this._leftLayer,t=this._rightLayer;this._leftLayer=this._rightLayer=null,this._leftLayers.forEach(function(e){this._map.hasLayer(e)&&(this._leftLayer=e)},this),this._rightLayers.forEach(function(e){this._map.hasLayer(e)&&(this._rightLayer=e)},this),e!==this._leftLayer&&(e&&this.fire("leftlayerremove",{layer:e}),this._leftLayer&&this.fire("leftlayeradd",{layer:this._leftLayer})),t!==this._rightLayer&&(t&&this.fire("rightlayerremove",{layer:t}),this._rightLayer&&this.fire("rightlayeradd",{layer:this._rightLayer})),this._updateClip()},_swapLayers:function(){var e=this._leftLayers,t=this._rightLayers;this._leftLayers=t,this._rightLayers=e;t=this._leftLayer,e=this._rightLayer;this._leftLayer=e,this._rightLayer=t,this.swapped=!this.swapped,this._updateLayers(),this.fire("swapped",{swapped:this.swapped})},_addEvents:function(){var e=this._range,t=this._map,n=this._swap;t&&t.on("move",this._updateClip,this),e&&(i(e,r(e),this._updateClip,this),i(e,s.Browser.touch?"touchstart":"mousedown",o,this),i(e,s.Browser.touch?"touchend":"mouseup",h,this)),this._leftLayers&&this._leftLayers.forEach(e=>{e.on("layeradd layerremove",this._updateLayers,this)}),this._rightLayers&&this._rightLayers.forEach(e=>{e.on("layeradd layerremove",this._updateLayers,this)}),n&&i(n,"click",this._swapLayers,this)},_removeEvents:function(){var e=this._range,t=this._map,n=this._swap;t&&t.off("move",this._updateClip,this),e&&(a(e,r(e),this._updateClip,this),a(e,s.Browser.touch?"touchstart":"mousedown",o,this),a(e,s.Browser.touch?"touchend":"mouseup",h,this)),this._leftLayers&&this._leftLayers.forEach(e=>{e.off("layeradd layerremove",this._updateLayers,this)}),this._rightLayers&&this._rightLayers.forEach(e=>{e.off("layeradd layerremove",this._updateLayers,this)}),n&&a(n,"click",this._swapLayers,this)}}),s.control.sideBySide=function(e,t,n){return new s.Control.SideBySide(e,t,n)},d.exports=s.Control.SideBySide}.call(this)}.call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{"./layout.css":2,"./range.css":4,"./swap.css":5}],2:[function(e,t,n){var i=".leaflet-sbs-range {\n position: absolute;\n top: 50%;\n width: 100%;\n z-index: 999;\n}\n.leaflet-sbs-divider {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 50%;\n margin-left: -1px;\n width: 2px;\n background-color: #2C405A;\n pointer-events: none;\n z-index: 999;\n}\n";e("./node_modules/cssify")(i,void 0,"_7fquvn"),t.exports=i},{"./node_modules/cssify":3}],3:[function(e,t,n){"use strict";t.exports=function(t,e,n){var i,s=e||document;if(s.createStyleSheet){var a=s.createStyleSheet();return a.cssText=t,a.ownerNode}return i=n,e=function(e){e.styleSheet?e.styleSheet.cssText=t:e.innerHTML=t},(n=(a=s).getElementById(i))?e(n):(s=a.getElementsByTagName("head")[0],n=a.createElement("style"),null!=i&&(n.id=i),e(n),s.appendChild(n)),n},t.exports.byUrl=function(e){if(document.createStyleSheet)return document.createStyleSheet(e).ownerNode;var t=document.getElementsByTagName("head")[0],n=document.createElement("link");return n.rel="stylesheet",n.href=e,t.appendChild(n),n}},{}],4:[function(e,t,n){var i=".leaflet-sbs-range {\n -webkit-appearance: none;\n display: inline-block !important;\n vertical-align: middle;\n height: 0;\n padding: 0;\n margin: 0;\n border: 0;\n right: 0;\n background: rgba(0, 0, 0, 0.25);\n min-width: 100px;\n cursor: pointer;\n pointer-events: none;\n z-index: 999;\n}\n.leaflet-sbs-range::-ms-fill-upper {\n background: transparent;\n}\n.leaflet-sbs-range::-ms-fill-lower {\n background: rgba(255, 255, 255, 0.25);\n}\n/* Browser thingies */\n\n.leaflet-sbs-range::-moz-range-track {\n opacity: 0;\n}\n.leaflet-sbs-range::-ms-track {\n opacity: 0;\n}\n.leaflet-sbs-range::-ms-tooltip {\n display: none;\n}\n/* For whatever reason, these need to be defined\n * on their own so dont group them */\n\n.leaflet-sbs-range::-webkit-slider-thumb {\n -webkit-appearance: none;\n margin: 0;\n padding: 0;\n background: #fff;\n height: 30px;\n width: 30px;\n border-radius: 50%;\n cursor: ew-resize;\n pointer-events: auto;\n border: 2px solid #2c405a;\n color: #2c405a;\n background-image: url(\"data:image/svg+xml,<svg width='6' height='14' xmlns='http://www.w3.org/2000/svg'><path d='M.5.333v13.333h1.667V.333H.5zm5 13.333V.333H3.833v13.333H5.5z' fill='%232C405A'/></svg>\");\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: 6px 14px;\n}\n.leaflet-sbs-range::-ms-thumb {\n margin: 0;\n padding: 0;\n background: #fff;\n height: 30px;\n width: 30px;\n border-radius: 50%;\n cursor: ew-resize;\n pointer-events: auto;\n border: 2px solid #2c405a;\n color: #2c405a;\n background-image: url(\"data:image/svg+xml,<svg width='6' height='14' xmlns='http://www.w3.org/2000/svg'><path d='M.5.333v13.333h1.667V.333H.5zm5 13.333V.333H3.833v13.333H5.5z' fill='%232C405A'/></svg>\");\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: 6px 14px;\n}\n.leaflet-sbs-range::-moz-range-thumb {\n padding: 0;\n right: 0;\n left:0;\n background: #fff;\n height: 30px;\n width: 30px;\n border-radius: 50%;\n cursor: ew-resize;\n pointer-events: auto;\n border: 2px solid #2c405a;\n color: #2c405a;\n background-image: url(\"data:image/svg+xml,<svg width='6' height='14' xmlns='http://www.w3.org/2000/svg'><path d='M.5.333v13.333h1.667V.333H.5zm5 13.333V.333H3.833v13.333H5.5z' fill='%232C405A'/></svg>\");\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: 6px 14px;\n}\n.leaflet-sbs-range:disabled::-moz-range-thumb {\n cursor: default;\n}\n.leaflet-sbs-range:disabled::-ms-thumb {\n cursor: default;\n}\n.leaflet-sbs-range:disabled::-webkit-slider-thumb {\n cursor: default;\n}\n.leaflet-sbs-range:disabled {\n cursor: default;\n}\n.leaflet-sbs-range:focus {\n outline: none !important;\n}\n.leaflet-sbs-range::-moz-focus-outer {\n border: 0;\n}\n";e("./node_modules/cssify")(i,void 0,"_gwkliu"),t.exports=i},{"./node_modules/cssify":3}],5:[function(e,t,n){var i=".leaflet-sbs-swap {\n position: absolute;\n -webkit-appearance: none;\n margin: 0;\n padding: 0;\n background: #2C405A;\n height: 30px;\n width: 30px;\n border-radius: 50%;\n cursor: pointer;\n pointer-events: auto;\n border: 2px solid #2C405A;\n color: white;\n background-image: url(\"data:image/svg+xml,<svg width='16' height='12' xmlns='http://www.w3.org/2000/svg'><path d='M3.825 5.166L.5 8.499l3.325 3.334v-2.5h5.842V7.666H3.825v-2.5zM15.5 3.499L12.175.166v2.5H6.333v1.667h5.842v2.5L15.5 3.499z' fill='white'/></svg>\");\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: 16px 12px;\n z-index: 999;\n}\n\n.leaflet-sbs-swap:focus {\n outline: none;\n box-shadow: 0px 0px 4px white;\n}\n\n.leaflet-sbs-swap::before,\n.leaflet-sbs-swap::after {\n color: white;\n position: absolute;\n font-size: 8px;\n font-weight: bolder;\n}\n\n.leaflet-sbs-swap::before {\n content: 'A';\n content: attr(data-left);\n top: calc(50% - 11px);\n left: calc(50% - 11px);\n}\n\n.leaflet-sbs-swap::after {\n content: 'B';\n content: attr(data-right);\n top: calc(50%);\n left: calc(50% + 4px);\n}\n";e("./node_modules/cssify")(i,void 0,"_1jgtwos"),t.exports=i},{"./node_modules/cssify":3}]},{},[1]);