Swipe.min.js

let BMapLib=window.BMapLib||{};const prefix="BMapLib";class Swipe{constructor(t,i,e,n={}){this._container=e,this._mapA=t,this._mapB=i,this._centerX=0,this._mapA.disableTilt(),this._mapB.disableTilt(),this._mapA.disableRotate(),this._mapB.disableRotate(),this._initDom(),this._syncMapA=this._syncMapA.bind(this),this._syncMapB=this._syncMapB.bind(this),this._onSync()}_initDom(){this._swipeControlDiv=document.createElement("div"),this._swipeControlDiv.className=`${prefix}-swipe`,this._swipeBtn=document.createElement("div"),this._swipeBtn.className=`${prefix}-swipe-btn`,this._swipeControlDiv.appendChild(this._swipeBtn),this._onSwipeStart=this._onSwipeStart.bind(this),this._onSwipeMove=this._onSwipeMove.bind(this),this._onSwipeEnd=this._onSwipeEnd.bind(this),this._swipeBtn.addEventListener("mousedown",this._onSwipeStart),this._container.appendChild(this._swipeControlDiv),this._centerX=parseInt(getComputedStyle(this._swipeControlDiv).left),this._containerWidth=parseInt(getComputedStyle(this._container).width);const t=this._containerWidth/2;this._updateSwipe(t)}_onSwipeStart(){document.addEventListener("mousemove",this._onSwipeMove),document.addEventListener("mouseup",this._onSwipeEnd)}_onSwipeMove(t){let i=t.clientX-this._centerX;this._swipeControlDiv.style.transform=`translateX(${i}px)`,this._updateSwipe(t.clientX)}_onSwipeEnd(){document.removeEventListener("mousemove",this._onSwipeMove),document.removeEventListener("mouseup",this._onSwipeEnd)}_updateSwipe(t){const i=`polygon(0 0, ${t}px 0, ${t}px 100%, 0 100%)`,e=`polygon(${t}px 0, 100% 0, 100% 100%, ${t}px 100%)`;this._mapA.getContainer().style.clipPath=i,this._mapB.getContainer().style.clipPath=e}_onSync(){this._mapA.addEventListener("moving",this._syncMapA),this._mapA.addEventListener("zooming",this._syncMapA),this._mapB.addEventListener("moving",this._syncMapB),this._mapB.addEventListener("zooming",this._syncMapB)}_offSync(){this._mapA.removeEventListener("moving",this._syncMapA),this._mapA.removeEventListener("zooming",this._syncMapA),this._mapB.removeEventListener("moving",this._syncMapB),this._mapB.removeEventListener("zooming",this._syncMapB)}_syncMapA(){this._offSync();const t=this._mapA.getZoom(),i=this._mapA.getCenter(),e=this;this._mapB.centerAndZoom(i,t,{noAnimation:!0,callback(){e._onSync()}})}_syncMapB(){this._offSync();const t=this._mapB.getZoom(),i=this._mapB.getCenter(),e=this;this._mapA.centerAndZoom(i,t,{noAnimation:!0,callback(){e._onSync()}})}}BMapLib.Swipe=Swipe;