@arcgis/core/views/draw/support/GraphicMover.js

ArcGIS Maps SDK for JavaScript: A complete 2D and 3D mapping and data visualization API

/*
All material copyright ESRI, All Rights Reserved, unless otherwise specified.
See https://js.arcgis.com/4.32/esri/copyright.txt for details.
*/
import{_ as i}from"../../../chunks/tslib.es6.js";import t from"../../../core/Evented.js";import{clone as e}from"../../../core/lang.js";import{watch as s,when as r}from"../../../core/reactiveUtils.js";import{property as h}from"../../../core/accessorSupport/decorators/property.js";import"../../../core/has.js";import"../../../core/Logger.js";import{subclass as o}from"../../../core/accessorSupport/decorators/subclass.js";import a from"../../../layers/GraphicsLayer.js";import c from"../../../symbols/SimpleFillSymbol.js";import n from"../../../symbols/SimpleLineSymbol.js";import l from"../../../symbols/SimpleMarkerSymbol.js";import{cloneMove as p}from"./drawUtils.js";import d from"./HighlightHelper.js";import{addUniqueLayer as g,findLayerView as v}from"./layerUtils.js";import{GraphicClickEvent as m,GraphicDoubleClickEvent as _,GraphicPointerDownEvent as y,GraphicPointerUpEvent as u,GraphicPointerOutEvent as f,GraphicMoveStartEvent as G,GraphicMoveEvent as w,GraphicMoveStopEvent as b,GraphicPointerOverEvent as k}from"./input/GraphicMoverEvents.js";import{ViewEventPriorities as O}from"../../input/InputManager.js";import{GraphicManipulator as x}from"../../interactive/GraphicManipulator.js";import{createScreenPointFromEvent as H}from"../../support/screenUtils.js";const M="indicator-symbols";let E=class extends t.EventedAccessor{constructor(i){super(i),this._activeGraphic=null,this._dragEvent=null,this._hoverGraphic=null,this._indicators=[],this._initialDragGeometry=null,this._manipulators=[],this._layerViews=null,this.type="graphic-mover",this.callbacks={onGraphicClick(){},onGraphicDoubleClick(){},onGraphicMoveStart(){},onGraphicMove(){},onGraphicMoveStop(){},onGraphicPointerOver(){},onGraphicPointerOut(){},onGraphicPointerDown(){},onGraphicPointerUp(){}},this.enableMoveAllGraphics=!1,this.graphics=[],this.indicatorsEnabled=!1,this.layer=new a({listMode:"hide",internal:!0,title:"GraphicMover highlight layer"}),this.view=null}initialize(){g(this.view,this.layer),this._highlightHelper=new d({view:this.view}),this.refresh(),this.addHandles([s((()=>this.graphics.length),(()=>this.refresh())),r((()=>this.view?.ready),(()=>{this.addHandles([this.view.on("immediate-click",(i=>this._clickHandler(i)),O.TOOL),this.view.on("double-click",(i=>this._doubleClickHandler(i)),O.TOOL),this.view.on("pointer-down",(i=>this._pointerDownHandler(i)),O.TOOL),this.view.on("pointer-move",(i=>this._pointerMoveHandler(i)),O.TOOL),this.view.on("pointer-up",(i=>this._pointerUpHandler(i)),O.TOOL),this.view.on("drag",(i=>this._dragHandler(i)),O.TOOL),this.view.on("key-down",(i=>this._keyDownHandler(i)),O.TOOL)])}),{once:!0,initial:!0}),s((()=>this.view),(i=>{this._highlightHelper.removeAll(),this._highlightHelper.view=i}))])}destroy(){this._removeIndicators(),this.view.map?.remove(this.layer),this.layer.destroy(),this.reset(),this._manipulators.forEach((i=>i.destroy())),this._manipulators=null}set highlightsEnabled(i){this._highlightHelper?.removeAll(),this._set("highlightsEnabled",i),i&&this._highlightHelper?.add(this.graphics)}get state(){const i=this.view.ready,t=this.graphics.length>0,e=this._activeGraphic;return i&&t?e?"moving":"active":i?"ready":"disabled"}refresh(){this.reset(),this._setup()}reset(){this._activeGraphic=null,this._hoverGraphic=null,this._dragEvent=null,this._highlightHelper.removeAll()}updateGeometry(i,t){const e=this.graphics[i];e&&(e.set("geometry",t),this._setUpIndicators())}_setup(){this._setUpHighlights(),this._setUpIndicators(),this._setUpManipulators(),this._syncLayerViews()}_clickHandler(i){const t=this._findTargetGraphic(H(i));if(t){const e=new m(t,this.graphics.indexOf(t),i.x,i.y,i);this.emit("graphic-click",e),this.callbacks.onGraphicClick&&this.callbacks.onGraphicClick(e)}}_doubleClickHandler(i){const t=this._findTargetGraphic(H(i));if(t){const e=new _(t,this.graphics.indexOf(t),i.x,i.y,i);this.emit("graphic-double-click",e),this.callbacks.onGraphicDoubleClick&&this.callbacks.onGraphicDoubleClick(e)}}_pointerDownHandler(i){const t=this._findTargetGraphic(H(i));if(t){this._activeGraphic=t;const{x:e,y:s}=i,r=new y(t,this.graphics.indexOf(t),e,s,i);this.emit("graphic-pointer-down",r),this.callbacks.onGraphicPointerDown&&this.callbacks.onGraphicPointerDown(r)}else this._activeGraphic=null}_pointerUpHandler(i){if(this._activeGraphic){const{x:t,y:e}=i,s=this.graphics.indexOf(this._activeGraphic),r=new u(this._activeGraphic,s,t,e,i);this.emit("graphic-pointer-up",r),this.callbacks.onGraphicPointerUp&&this.callbacks.onGraphicPointerUp(r)}}_pointerMoveHandler(i){if(this._dragEvent)return;const t=this._findTargetGraphic(H(i));if(t){const{x:e,y:s}=i;if(this._hoverGraphic){if(this._hoverGraphic===t)return;const r=this.graphics.indexOf(this._hoverGraphic),h=new f(this.graphics[r],r,e,s,i);this._hoverGraphic=null,this.emit("graphic-pointer-out",h),this.callbacks.onGraphicPointerOut&&this.callbacks.onGraphicPointerOut(h)}const r=this.graphics.indexOf(t),h=new k(t,r,e,s,i);return this._hoverGraphic=t,this.emit("graphic-pointer-over",h),void(this.callbacks.onGraphicPointerOver&&this.callbacks.onGraphicPointerOver(h))}if(this._hoverGraphic){const{x:t,y:e}=i,s=this.graphics.indexOf(this._hoverGraphic),r=new f(this.graphics[s],s,t,e,i);this._hoverGraphic=null,this.emit("graphic-pointer-out",r),this.callbacks.onGraphicPointerOut&&this.callbacks.onGraphicPointerOut(r)}}_dragHandler(i){if("start"!==i.action&&!this._dragEvent||!this._activeGraphic?.geometry)return;"start"===i.action&&this._removeIndicators(),i.stopPropagation();const{action:t,x:s,y:r}=i,h=this.graphics.indexOf(this._activeGraphic),o=this._dragEvent?s-this._dragEvent.x:0,a=this._dragEvent?r-this._dragEvent.y:0,c=s-i.origin.x,n=r-i.origin.y,l="start"===t?this._activeGraphic.geometry:this._initialDragGeometry,d=p(l,c,n,this.view);if(this._activeGraphic.geometry=d,this.enableMoveAllGraphics&&this.graphics.forEach((i=>{i!==this._activeGraphic&&(i.geometry=p(i.geometry,o,a,this.view))})),this._dragEvent=i,"start"===t){this._initialDragGeometry=e(l);const t=new G(this._activeGraphic,this.graphics,h,s,r,o,a,c,n,i);this.emit("graphic-move-start",t),this.callbacks.onGraphicMoveStart&&this.callbacks.onGraphicMoveStart(t),t.defaultPrevented&&this._activeGraphic.set("geometry",l)}else if("update"===t){const t=new w(this._activeGraphic,this.graphics,h,s,r,o,a,c,n,i);this.emit("graphic-move",t),this.callbacks.onGraphicMove&&this.callbacks.onGraphicMove(t),t.defaultPrevented&&(this._activeGraphic.geometry=l)}else{const t=new b(this._activeGraphic,this.graphics,h,s,r,o,a,c,n,i);this._dragEvent=null,this._activeGraphic=null,this._setUpIndicators(),this.emit("graphic-move-stop",t),this.callbacks.onGraphicMoveStop&&this.callbacks.onGraphicMoveStop(t),t.defaultPrevented&&(this.graphics[h].set("geometry",this._initialDragGeometry),this._setUpIndicators()),this._initialDragGeometry=null}}_keyDownHandler(i){"a"!==i.key&&"d"!==i.key&&"n"!==i.key||"moving"!==this.state||i.stopPropagation()}_findTargetGraphic(i){const t=this.view.toMap(i),e=this.graphics;let s=null,r=Number.MAX_VALUE;this._syncLayerViews();const h=this._layerViews.flatMap((i=>"graphicsViews"in i?Array.from(i.graphicsViews(),(i=>i.hitTest(t))).flat():i.graphicsView.hitTest(t))).filter((i=>e.includes(i))).sort(((i,t)=>e.indexOf(i)-e.indexOf(t)));return h.length?h[0]:(this._manipulators.forEach((t=>{const e=t.intersectionDistance(i);null!=e&&e<r&&(r=e,s=t.graphic)})),s)}_syncLayerViews(){this._layerViews=[];const i=new Set;for(const t of this.graphics){const e=v(this.view,t.layer);e&&i.add(e)}this._layerViews=[...i]}_setUpManipulators(){const{graphics:i,view:t}=this;this._manipulators.forEach((i=>i.destroy())),this._manipulators=i.length?i.map((i=>new x({graphic:i,view:t}))):[]}_setUpHighlights(){this.highlightsEnabled&&this._highlightHelper.add(this.graphics)}_setUpIndicators(){if(this._removeIndicators(),this.indicatorsEnabled){for(const i of this.graphics){const t=i.clone();t.symbol=U(i),this._indicators.push(t),this.addHandles(s((()=>i.symbol),(()=>this._setUpIndicators())),M)}this.layer.addMany(this._indicators)}}_removeIndicators(){this.removeHandles(M),this._indicators.length&&(this.layer.removeMany(this._indicators),this._indicators.forEach((i=>i.destroy())),this._indicators=[])}};function U(i){const t=12;if(null==i.symbol)return null;switch(i.symbol.type){case"cim":return new l({style:"circle",size:t,color:[0,0,0,0],outline:{color:[255,127,0,1],width:1}});case"picture-marker":{const{xoffset:t,yoffset:e,height:s,width:r}=i.symbol,h=s===r?r:Math.max(s,r);return new l({xoffset:t,yoffset:e,size:h,style:"square",color:[0,0,0,0],outline:{color:[255,127,0,1],width:1}})}case"simple-marker":{const{xoffset:t,yoffset:e,size:s,style:r}=i.symbol;return new l({xoffset:t,yoffset:e,style:"circle"===r?"circle":"square",size:s+2,color:[0,0,0,0],outline:{color:[255,127,0,1],width:1}})}case"simple-fill":return new c({color:[0,0,0,0],outline:{style:"dash",color:[255,127,0,1],width:1}});case"simple-line":return new n({color:[255,127,0,1],style:"dash",width:1});case"text":{const{xoffset:e,yoffset:s}=i.symbol;return new l({xoffset:e,yoffset:s,size:t,color:[0,0,0,0],outline:{color:[255,127,0,1],width:1}})}default:return null}}i([h()],E.prototype,"_activeGraphic",void 0),i([h({readOnly:!0})],E.prototype,"type",void 0),i([h()],E.prototype,"callbacks",void 0),i([h()],E.prototype,"enableMoveAllGraphics",void 0),i([h()],E.prototype,"graphics",void 0),i([h({value:!1})],E.prototype,"highlightsEnabled",null),i([h()],E.prototype,"indicatorsEnabled",void 0),i([h()],E.prototype,"layer",void 0),i([h({readOnly:!0})],E.prototype,"state",null),i([h()],E.prototype,"view",void 0),E=i([o("esri.views.draw.support.GraphicMover")],E);const j=E;export{j as default};