@arcgis/core/widgets/OrientedImageryViewer/components/ImageViewerViewModel.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.33/esri/copyright.txt for details.
*/
import{_ as e}from"../../../chunks/tslib.es6.js";import t from"../../../Map.js";import i from"../../../core/Error.js";import r from"../../../core/Evented.js";import a from"../../../core/Logger.js";import{clamp as s}from"../../../core/mathUtils.js";import{destroyMaybe as o}from"../../../core/maybe.js";import{isAbortError as n}from"../../../core/promiseUtils.js";import{watch as l,syncAndInitial as m,initial as h}from"../../../core/reactiveUtils.js";import{property as d}from"../../../core/accessorSupport/decorators/property.js";import"../../../core/has.js";import"../../../core/RandomLCG.js";import{subclass as g}from"../../../core/accessorSupport/decorators/subclass.js";import{UpdatingHandles as p}from"../../../core/support/UpdatingHandles.js";import{rotate as c,intersect as u,nearestCoordinate as y}from"../../../geometry/geometryEngine.js";import v from"../../../geometry/Point.js";import f from"../../../geometry/Polygon.js";import _ from"../../../geometry/SpatialReference.js";import R from"../../../layers/GraphicsLayer.js";import w from"../../../layers/ImageryTileLayer.js";import x from"../../../layers/support/RasterFunction.js";import{convolutionKernel as C}from"../../../layers/support/rasterFunctionConstants.js";import I from"../../../layers/support/TileInfo.js";import j from"../../../views/MapView.js";import{getResolutionToScaleFactor as b}from"../../../views/2d/viewpointUtils.js";import{logAndThrow as M,getMissingPropertyErrorName as P,getMissingPropertyErrorMessage as S,castImageSource as H}from"../utils.js";const V={click:"click-handle",enhancements:"enhancements-handle"};let k=class extends r.EventedAccessor{constructor(e){super(e),this._imageChanged=!1,this._panConstraint=null,this._image=null,this._loadController=null,this._overlays=new R({blendMode:"source-atop"}),this._map=new t,this.autoLoad=!1,this.clickAction="none",this.error=null,this.imageSource=null,this.imageRotation=0,this.navigationManager=null,this.navigationViewModel=null,this.state="ready",this.updatingHandles=new p,this._cancelLoadWithController=()=>{this._loadController?.abort(),this._loadController=null},this._createImageHandles=()=>{this.removeHandles(V.enhancements),this.addHandles(l((()=>[this.brightness,this.contrast,this.sharpness]),(([e,t,i])=>{this.image?.loaded&&(this.image.effect=`contrast(${10*(t+10)}%) brightness(${10*(e+10)}%)`,this.sharpenImage(this.image,i))}),m))},this._createPanConstraint=()=>{const{image:e,imageRenderer:t}=this,i=i=>{if(!(e&&t&&i.targetGeometry&&e.serviceRasterInfo))return i;const{extent:r}=e.serviceRasterInfo,{constraints:a,rotation:s,width:o,height:n}=t,{extent:l}=c(f.fromExtent(r),s),{width:m,height:h}=l,d=i.targetGeometry.clone(),g=a.scaleToZoom(i.scale),p=1/2**g,u=o/n;let v=p*m,_=p*h;g&&(m/o>h/n?_=v/u:v=_*u);const R=l.clone();return R.xmin+=v/2,R.xmax-=v/2,R.ymin+=_/2,R.ymax-=_/2,i.targetGeometry=y(R,d).coordinate,this.state="image-loaded",i};return{constrain:i,applyPanConstraint:i}},this._createResizeHandles=e=>{e.removeHandles("resize"),e.addHandles(l((()=>{if(!this.imageRenderer.ready)return;const{extent:t}=e.serviceRasterInfo,{width:i,height:r,rotation:a}=this.imageRenderer,{extent:s}=c(f.fromExtent(t),a),{width:o,height:n}=s;return Math.max(o/i,n/r)}),(e=>{if(!this.imageRenderer||null==e)return;const{constraints:t,scale:i,spatialReference:r}=this.imageRenderer,a=t.minScale,s=b(r),o=.25*s,n=s*e;let l=n;const m=[];for(;l>o;)m.push(l),l/=2;m.push(l);const{lods:h}=I.create({scales:m});if(t.set({minScale:n,lods:h}),this._imageChanged)return this.imageRenderer.scale=n,void(this._imageChanged=!1);this.imageRenderer.scale=Math.abs(i-a)<=1e-6?n:i}),m),"resize")},this._loadImageInternal=(e,t={})=>{this.state="image-loading",this.clearImage(),this.error=null,this._imageChanged=!0;const i="string"==typeof e,r=i?void 0:e.datasetFormat,s=i?e:e.url,{customParameters:o,options:l}=t;return this._image=new w({ioConfig:{skipExtensions:["aux.xml","jgw"],skipMapInfo:!0,datasetFormat:r},url:s,customParameters:o}),this._image.when((async e=>{this._updatePanConstraint(),this._createResizeHandles(e),this._map.add(e),this.state="image-loaded"}),(t=>{n(t)?this.state="image-load-aborted":(this.state="image-load-error",this.error=t,a.getLogger(this).error(`error occurred while loading image ${i?e:JSON.stringify(e)}`,t),this.imageSource=null)})),this._image.load(l)},this._loadWithController=()=>{this._cancelLoadWithController(),this._loadController=new AbortController,this.loadImage(this._loadController)},this._loadNavigationManager=async()=>{if(!this.navigationManager||this.navigationManager?.destroyed){const e=await import("../navigation/NavigationManager.js").then((e=>e.default));this.navigationManager=new e({viewModel:this.navigationViewModel})}return this.navigationManager},this._updatePanConstraint=()=>{this._panConstraint&&this.imageRenderer.constraints.customConstraints.remove(this._panConstraint),this._panConstraint=this._createPanConstraint(),this.imageRenderer.constraints.customConstraints.add(this._panConstraint)},this.addGraphic=(e,t)=>{this._overlays.graphics.add(e,t)},this.addManyGraphics=e=>{this._overlays.addMany(e)},this.clearGraphics=()=>{this._overlays.graphics.removeAll()},this.clearImage=()=>{this.image&&(this._map.layers.remove(this.image),this._image=o(this._image))},this.loadImage=e=>{const{customParameters:t,imageSource:r}=this;return r?this._loadImageInternal(r,{customParameters:t,options:e}):M(this.declaredClass,new i(P("image-viewer"),S("ImageViewerViewModel","imageSource")))},this.navigate=async(e,t)=>this.updatingHandles.addPromise(this.navigateInternal(e,t)),this.navigateInternal=async(e,t)=>{const i=await this._loadNavigationManager();return await i.navigate(e,t)},this.removeGraphic=e=>{this._overlays.remove(e)},this.removeManyGraphics=e=>{this._overlays.removeMany(e)},this._imageRenderer=new j({constraints:{snapToZoom:!0,rotationEnabled:!1},map:this._map,popupEnabled:!1,spatialReference:_.WebMercator,ui:{components:["zoom"]}})}destroy(){this._imageRenderer.destroy()}initialize(){this.state="initialized",this.addHandles([l((()=>this.imageSource),(e=>{e&&this.autoLoad&&this._loadWithController()}),m),l((()=>this.image?.loaded),(()=>{this._createImageHandles()})),l((()=>this.imageRotation),(()=>{this._rotateImage()})),l((()=>this.imageRenderer.map),((e,t)=>{t?.layers.remove(this._overlays),e?.layers.add(this._overlays)}),h),l((()=>this.imageRenderer.map.allLayers.length),(e=>{e&&this.imageRenderer.map.layers.reorder(this._overlays,e-1)}),m),l((()=>this.clickAction),(e=>{this.removeHandles(V.click),"none"!==e&&this.addHandles(this.imageRenderer.on("click",(t=>{if(this.image?.loaded&&this.imageRenderer.ready)switch(e){case"emit":t.stopPropagation(),this.emit("click",t);break;case"hittest":t.stopPropagation(),t.defer((async()=>{const e=await this.imageRenderer.hitTest(t.screenPoint,{include:this._overlays});e.results=e.results.filter((e=>"graphic"===e.type)),this.emit("hittest-response",e)}));break;case"pixel-location":{if(t.stopPropagation(),!this.image?.serviceRasterInfo||!t.mapPoint)return void this.emit("pixel-location",null);const{extent:e,pixelSize:i}=this.image.serviceRasterInfo,r=(t.mapPoint.x-e.xmin)*i.x,a=(e.ymax-t.mapPoint.y)*i.y,s=new v({x:r,y:a,spatialReference:e.spatialReference});this.emit("pixel-location",s);break}}})))}),m)])}get brightness(){return this._get("brightness")??0}set brightness(e){this._set("brightness",s(e,-10,10))}get contrast(){return this._get("contrast")??0}set contrast(e){this._set("contrast",s(e,-10,10))}get currentNode(){return this.navigationViewModel?.currentNode}get image(){return this._image}get imagePointsInView(){const{extent:e,ready:t}=this.imageRenderer,i=this.imageRotation,r=this.image?.fullExtent,a=this.image?.serviceRasterInfo,s=!0===this._imageRenderer.allLayerViews.find((({layer:e})=>e===this.image))?.attached;if(!(t&&e&&r&&a&&s))return null;const o=c(f.fromExtent(e),i),n=f.fromExtent(r),l=u(o,n),{rings:m}=l;return m.flat().map((([e,t])=>({x:(e-a.extent.xmin)*a.pixelSize.x,y:(a.extent.ymax-t)*a.pixelSize.y})))}get imageSize(){const{image:e}=this;if(!e?.raster)return null;const{width:t,height:i}=e.raster.rasterInfo;return[t,i]}get imageRenderer(){return this._imageRenderer}get imageView(){return this.imageRenderer.allLayerViews.find((e=>e.layer===this.image))}get sharpness(){return this._get("sharpness")??0}set sharpness(e){this._set("sharpness",s(e,0,1))}get updating(){return this.updatingHandles.updating}_rotateImage(){this.imageRenderer.constraints.rotationEnabled=!0,this.imageRenderer.rotation=this.imageRotation,this.imageRenderer.constraints.rotationEnabled=!1}sharpenImage(e,t){if(!t)return void(e.rasterFunction=null);const i=[0,-1*t,0,-1*t,4*t+1,-1*t,0,-1*t,0],r=new x({functionName:"Convolution",functionArguments:{type:C.userDefined,cols:3,rows:3,kernel:i,convolutionType:C.userDefined}});e.rasterFunction=r}};e([d()],k.prototype,"_image",void 0),e([d()],k.prototype,"_imageRenderer",void 0),e([d()],k.prototype,"_loadController",void 0),e([d()],k.prototype,"_overlays",void 0),e([d()],k.prototype,"_map",void 0),e([d({type:Boolean})],k.prototype,"autoLoad",void 0),e([d({type:Number})],k.prototype,"brightness",null),e([d()],k.prototype,"clickAction",void 0),e([d({type:Number})],k.prototype,"contrast",null),e([d()],k.prototype,"currentNode",null),e([d({type:Object})],k.prototype,"customParameters",void 0),e([d({type:i})],k.prototype,"error",void 0),e([d({readOnly:!0})],k.prototype,"image",null),e([d({readOnly:!0})],k.prototype,"imagePointsInView",null),e([d({readOnly:!0})],k.prototype,"imageSize",null),e([d({cast:H})],k.prototype,"imageSource",void 0),e([d({readOnly:!0})],k.prototype,"imageRenderer",null),e([d({type:Number})],k.prototype,"imageRotation",void 0),e([d()],k.prototype,"imageView",null),e([d()],k.prototype,"navigationManager",void 0),e([d()],k.prototype,"navigationViewModel",void 0),e([d({type:Number})],k.prototype,"sharpness",null),e([d()],k.prototype,"state",void 0),e([d()],k.prototype,"updatingHandles",void 0),e([d()],k.prototype,"updating",null),k=e([g("esri.widgets.OrientedImageryViewer.components.ImageViewerViewModel")],k);const E=k;export{E as default};