@tarojs/components/dist/taro-components/p-77dee229.entry.js

Taro 组件库

import{r as t,h as s,g as i,H as h,c as e}from"./p-d0cabaaa.js";import{i as a}from"./p-5893c3ed.js";const o=class{constructor(s){t(this,s),this.views=[],this.scaleLength=0,this.viewsChanged=()=>{this.views=[];const t=this.element.querySelectorAll("taro-movable-view-core");Array.from(t).forEach((t=>{this.views.push(t)})),this.updateArea()},this.handleTouchStart=t=>{const s=t.touches;if(!s||s.length<=1)return;const i=s[1].pageX-s[0].pageX,h=s[1].pageY-s[0].pageY;if(this.scaleLength=Math.sqrt(i*i+h*h),this.scaleArea)return;const e=(t,s)=>{const i=(t,s)=>!!(t=t.parentNode)&&(!a(t)||t!==document.body)&&(t===s||t===s.element||t.element===s||i(t,s));for(let h=0;h<s.length;h++){const e=s[h];if(t===e.element||i(t,e))return e}},o=e(s[0].target,this.views),n=e(s[1].target,this.views);this.scaleTarget=o&&o===n?o:void 0},this.handleTouchMove=t=>{const s=t.touches;if(!s||s.length<=1)return;t.preventDefault();const i=s[1].pageX-s[0].pageX,h=s[1].pageY-s[0].pageY;this.scaleLength>0&&this.updateScale(Math.sqrt(i*i+h*h)/this.scaleLength)},this.handleTouchEnd=t=>{var s,i;t.touches&&t.touches.length||!t.changedTouches||(this.scaleLength=0,this.scaleArea?this.views.forEach((t=>{var s;null===(s=t.endScale)||void 0===s||s.call(t)})):null===(i=null===(s=this.scaleTarget)||void 0===s?void 0:s.endScale)||void 0===i||i.call(s),this.scaleTarget=void 0)},this.updateScale=t=>{var s,i;t&&1!==t&&(this.scaleArea?this.views.forEach((s=>{var i;null===(i=s.setScale)||void 0===i||i.call(s,t)})):null===(i=null===(s=this.scaleTarget)||void 0===s?void 0:s.setScale)||void 0===i||i.call(s,t))},this.updateArea=()=>{const t=window.getComputedStyle(this.element),s=this.element.getBoundingClientRect(),i=["Left","Right"].map((s=>parseFloat(t["border"+s+"Width"])+parseFloat(t["padding"+s]))),h=["Top","Bottom"].map((s=>parseFloat(t["border"+s+"Width"])+parseFloat(t["padding"+s])));this.views.forEach((t=>{var e;null===(e=t.setParent)||void 0===e||e.call(t,{element:this.element,area:{height:s.height-h[0]-h[1],width:s.width-i[0]-i[1]}})}))},this.scaleArea=void 0}connectedCallback(){this.observer=new MutationObserver((t=>{t.forEach((t=>{var s,i;if("class"===t.attributeName||"style"===t.attributeName){const t=this.element.offsetWidth,h=this.element.offsetHeight;t===(null===(s=this.offset)||void 0===s?void 0:s.width)&&h===(null===(i=this.offset)||void 0===i?void 0:i.height)||this.updateArea(),this.offset={width:t,height:h}}}))})),this.observer.observe(this.element,{attributes:!0})}disconnectedCallback(){var t;null===(t=this.observer)||void 0===t||t.disconnect()}componentDidLoad(){this.viewsChanged()}render(){return s(h,{onTouchStart:this.handleTouchStart,onTouchMove:this.handleTouchMove,onTouchEnd:this.handleTouchEnd})}get element(){return i(this)}};o.style="taro-movable-area-core{width:10px;height:10px;display:block;position:relative}";const n=class{constructor(s){t(this,s),this.onChange=e(this,"change",7),this.onScale=e(this,"scale",7),this.onHTouchMove=e(this,"htouchmove",7),this.onVTouchMove=e(this,"vtouchmove",7),this.translateX=0,this.translateY=0,this.origin={x:0,y:0},this.area={width:0,height:0},this.originScale=1,this.currentScale=1,this.width=0,this.height=0,this.minX=0,this.minY=0,this.maxX=0,this.maxY=0,this.baseX=0,this.baseY=0,this.offset={x:0,y:0},this.scaleOffset={x:0,y:0},this.getLimitXY=(t,s)=>{let i=!1;return t>this.maxX?(t=this.maxX,i=!0):t<this.minX&&(t=this.minX,i=!0),s>this.maxY?(s=this.maxY,i=!0):s<this.minY&&(s=this.minY,i=!0),{x:t,y:s,outOfBounds:i}},this.animationTo=(t,s,i,h,e,a,o)=>{this.animation?(this.setTransform(t,s,i,h,e,a),null==o||o()):this.setTransform(t,s,i,h,e,a)},this.setTransform=(t,s,i,h,e,a)=>{if(t=Number(t.toFixed(1)),s=Number(s.toFixed(1)),i=Number((null!=i?i:this.currentScale).toFixed(3)),!this.outOfBounds){const i=this.getLimitXY(t,s);t=i.x,s=i.y}const o=(t,s)=>+((1e3*t-1e3*s)/1e3).toFixed(1),n=o(t,this.scaleOffset.x),r=o(s,this.scaleOffset.y);this.translateX===t&&this.translateY===s||!e&&this.onChange.emit({x:n,y:r,source:h}),i!==this.currentScale&&a&&this.onScale.emit({scale:i,x:n,y:r});const c=`translateX(${t}px) translateY(${s}px) translateZ(0px) scale(${i})`;this.element.style.transform=c,this.element.style.webkitTransform=c,this.translateX=t,this.translateY=s,this.currentScale=i},this.updateOffset=()=>{const t=(s,i)=>{if(s===i||!s.offsetParent)return{left:0,top:0};const h=t(s.offsetParent,i);return{left:s.offsetLeft+h.left,top:s.offsetTop+h.top}};if(!this.parent)return;const s=t(this.element,this.parent);this.offset.x=s.left,this.offset.y=s.top},this.updateScaleOffset=(t=this.currentScale)=>{const s=this.element.getBoundingClientRect();this.height=s.height/this.currentScale,this.width=s.width/this.currentScale,this.scaleOffset.x=(this.width*t-this.width)/2,this.scaleOffset.y=(this.height*t-this.height)/2},this.updateBoundary=()=>{const t=0-this.offset.x+this.scaleOffset.x,s=this.area.width-this.width-this.offset.x-this.scaleOffset.x;this.minX=Math.min(t,s),this.maxX=Math.max(t,s);const i=0-this.offset.y+this.scaleOffset.y,h=this.area.height-this.height-this.offset.y-this.scaleOffset.y;this.minY=Math.min(i,h),this.maxY=Math.max(i,h)},this.updateScale=(t,s,i)=>{if(!this.scale)return;const h=this.adjustScale(t);this.updateScaleOffset(h),this.updateBoundary();const{x:e,y:a}=this.getLimitXY(this.translateX,this.translateY);s?this.animationTo(e,a,h,"",!0,!0,i):this.updating||(this.updating=!0,requestAnimationFrame((()=>{this.setTransform(e,a,h,"",!0,!0),this.updating=!1})))},this.setOriginScale=t=>{this.originScale=t},this.adjustScale=t=>Math.min(10,this.scaleMax,Math.max(.5,this.scaleMin,t)),this.handleTouchStart=t=>{const s=t.touches;if(this.disabled||s.length>1||!this.element)return;const i=s[0];this.touching=!0,this.firstMoveFireEvent=!1,this.origin.x=i.screenX,this.origin.y=i.screenY,this.baseX=this.translateX,this.baseY=this.translateY,this.element.style.willChange="transform"},this.handleTouchMove=t=>{const s=t.touches;if(this.disabled||!this.element||this.scaling||!this.touching||s.length>1)return;"horizontal"!==this.direction&&t.preventDefault();const i=s[0],h=i.screenX-this.origin.x,e=i.screenY-this.origin.y;this.setTransform(this.xMove?h+this.baseX:0,this.yMove?e+this.baseY:0),this.firstMoveFireEvent||(this.firstMoveFireEvent=!0,(Math.abs(h)>Math.abs(e)?this.onHTouchMove:this.onVTouchMove).emit({originalEvent:t,bubbles:!1,capturePhase:!1,composed:!0,extraFields:{touches:t.touches||{},changedTouches:t.changedTouches||{}}}))},this.handleTouchEnd=t=>{const s=t.changedTouches[0];!this.disabled&&this.touching&&s&&(this.touching=!1,this.setTransform(this.xMove?s.screenX-this.origin.x+this.baseX:0,this.yMove?s.screenY-this.origin.y+this.baseY:0))},this.x=0,this.y=0,this.direction="none",this.outOfBounds=!1,this.inertia=!1,this.friction=2,this.damping=20,this.disabled=!1,this.scale=!1,this.scaleMin=.5,this.scaleMax=10,this.scaleValue=1,this.animation=!0}watchX(t){this.setTransform(parseFloat(`${t||0}`),this.translateY)}watchY(t){this.setTransform(this.translateX,parseFloat(`${t||0}`))}watchScaleMinOrMax(){if(!this.scale)return!1;this.updateScale(this.currentScale,!0),this.setOriginScale(this.currentScale)}watchScaleValue(t){return!!this.scale&&(this.updateScale(t,!0),this.setOriginScale(t),t)}async setParent({element:t,area:s}){const i=this.scale?this.scaleValue:1;this.area=s,this.parent=t,this.updateOffset(),this.updateScaleOffset(i),this.updateBoundary(),this.setTransform(Number(this.x)+this.scaleOffset.x,Number(this.y)+this.scaleOffset.y,i,"",!0),this.setOriginScale(i)}async endScale(){this.scaling=!1,this.setOriginScale(this.currentScale)}async setScale(t){this.scale&&(this.scaling=!0,this.updateScale(t*this.originScale))}connectedCallback(){this.observer=new MutationObserver((t=>{t.forEach((t=>{const s=t.attributeName;if(s&&["class","style"].includes(s)){const i=t.oldValue,h=t.target.getAttribute(s);if(i===h)return;const e=t=>null==t?void 0:t.split(";").filter((t=>!["transform","will-change"].find((s=>t.trim().startsWith(s))))).join(";");if("style"===s&&e(h)===e(i))return;this.updateOffset(),this.updateScaleOffset(),this.updateBoundary(),this.setTransform(this.translateX,this.translateY)}}))})),this.observer.observe(this.element,{attributes:!0,attributeOldValue:!0})}disconnectedCallback(){var t;null===(t=this.observer)||void 0===t||t.disconnect()}componentDidLoad(){if(this.element.style.transformOrigin="center",this.xMove=["horizontal","all"].includes(this.direction),this.yMove=["vertical","all"].includes(this.direction),this.friction<=0&&(this.friction=2),this.x||this.y){const t=parseFloat(`${this.x||0}`),s=parseFloat(`${this.y||0}`);this.setTransform(t,s)}}render(){return s(h,{onTouchStart:this.handleTouchStart,onTouchMove:this.handleTouchMove,onTouchEnd:this.handleTouchEnd})}get element(){return i(this)}static get watchers(){return{x:["watchX"],y:["watchY"],scaleMin:["watchScaleMinOrMax"],scaleMax:["watchScaleMinOrMax"],scaleValue:["watchScaleValue"]}}};n.style="taro-movable-view-core{width:10px;height:10px;display:inline-block;position:absolute;top:0;left:0}";export{o as taro_movable_area_core,n as taro_movable_view_core}