@arcgis/core/views/2d/engine/webgl/TextureManager.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 e from"../../../../config.js";import t from"../../../../request.js";import{bidiText as i}from"../../../../core/BidiText.js";import s from"../../../../core/Error.js";import{getFullyQualifiedFontName as r}from"../../../../core/fontUtils.js";import has from"../../../../core/has.js";import a from"../../../../core/Logger.js";import{throwIfAborted as n,isAbortError as o}from"../../../../core/promiseUtils.js";import{QueueProcessor as c}from"../../../../core/QueueProcessor.js";import{pt2px as h}from"../../../../core/screenUtils.js";import{numericHash as l}from"../../../../core/string.js";import u from"../../../../symbols/cim/CIMResourceManager.js";import{CIMSymbolHelper as p}from"../../../../symbols/cim/CIMSymbolHelper.js";import m from"../../../../symbols/cim/Rasterizer.js";import{normalizeDashTemplate as d}from"../../../../symbols/cim/utils.js";import{svgSdfTextureInnerSize as g,textureBindingSpriteAtlas as f,textureBindingGlyphAtlas as y}from"./definitions.js";import{MosaicType as M}from"./enums.js";import _ from"./GlyphMosaic.js";import I from"./GlyphSource.js";import w from"./Rect.js";import S from"./SDFConverter.js";import z from"./SpriteMosaic.js";import{discardUrlIfHasUrlHash as R}from"./urlUtils.js";import{charCodes as T,getCIMMarkerPlacementHash as C,isSVGImage as P}from"./Utils.js";import{AnimatableTextureResource as x}from"./animatedFormats/AnimatableTextureResource.js";import{AnimationStore as b}from"./animations/store/AnimationStore.js";import{TextureSamplingMode as j}from"../../../webgl/enums.js";const $="arial-unicode-ms-regular",v=()=>a.getLogger("esri.views.MapView"),k=(e,t,i)=>v().error(new s(e,t,i)),A=(e,t="")=>v().warnOnce(e,t);class F{static fromMosaic(e,t){return new F(e,t.page,t.sdf,t.samplingMode)}constructor(e,t,i,s){this.mosaicType=e,this.page=t,this.sdf=i,this.samplingMode=s}}class G{constructor(i){this._requestRender=i,this._resourceManager=new u,this._invalidFontsMap=new Map,this._sdfConverter=new S(g),this._bindingInfos=new Array,this._hashToBindingIndex=new Map,this._ongoingRasterizations=new Map,this._imageRequestQueue=new c({concurrency:10,process:async(e,i)=>{n(i);try{return await t(e,{responseType:"image",signal:i})}catch(r){if(!o(r))throw new s("mapview-invalid-resource",`Could not fetch requested resource at ${e}`,r);throw r}}}),this.animationStore=new b,this._spriteMosaic=new z(2048,2048,500),this._glyphSource=new I(`${e.fontsUrl}/{fontstack}/{range}.pbf`),this._glyphMosaic=new _(1024,1024,this._glyphSource),this._rasterizer=new m(this.resourceManager)}dispose(){this._spriteMosaic.dispose(),this._glyphMosaic.dispose(),this._rasterizer.dispose(),this._sdfConverter.dispose(),this._spriteMosaic=null,this._glyphMosaic=null,this._sdfConverter=null,this._hashToBindingIndex.clear(),this._hashToBindingIndex=null,this._bindingInfos=null,this._ongoingRasterizations.clear(),this._ongoingRasterizations=null,this._imageRequestQueue.clear(),this._imageRequestQueue=null,this._resourceManager.destroy(),this.animationStore.destroy()}get sprites(){return this._spriteMosaic}get glyphs(){return this._glyphMosaic}get resourceManager(){return this._resourceManager}async rasterizeItem(e,t){if(null==e)return k("mapview-null-resource","Unable to rasterize null resource"),null;if("animation-info"===e.type){const{resource:t}=e,i=this.animationStore.add(t),{location:s}=i;return{rect:new w(s.column,s.row,t.length,1),page:s.page,type:"sprite",width:t.length,height:1,rasterizationScale:1,sdfPaddingRatio:.5,samplingMode:"Linear",sdfDecodeCoeff:1,simplePattern:!1}}if("cim-rasterization-info"!==e.type)return k("mapview-unexpected-resource","Unable to rasterize resource"),null;const{resource:i}=e;if("text"===i.type){const e=await this._rasterizeText(i,t);for(const t of e.glyphs)this._setTextureBinding(M.GLYPH,t);return e}const s=await this._rasterizeSprite(i,t);return s&&this._setTextureBinding(M.SPRITE,s),s}getMosaicInfo(e,t,i=!1){const s=this._getTextureBindingInfo(e,t,i);return s?{size:s.size,texture:{texture:s.texture,unit:"sprite"===s.type?f:y}}:(k("mapview-invalid-resource",`Unable to find resource for ${t}`),{size:[0,0],texture:{texture:null,unit:0}})}_getTextureBindingInfo(e,t,i){const s=this._bindingInfos[t-1],r=s.page,a="Nearest"===s.samplingMode?j.NEAREST:i?j.LINEAR_MIPMAP_LINEAR:j.LINEAR;switch(s.mosaicType){case M.SPRITE:{const t=[this.sprites.getWidth(r),this.sprites.getHeight(r)],i=this._spriteMosaic.getTexture(e,r);return i.setSamplingMode(a),{type:"sprite",texture:i,size:t}}case M.GLYPH:{const t=[this.glyphs.width,this.glyphs.height],i=this._glyphMosaic.getTexture(e,r);return this._glyphMosaic.bind(e,a,r,y),i.setSamplingMode(a),{type:"glyph",texture:i,size:t}}default:return k("mapview-texture-manager",`Cannot handle unknown type ${s.mosaicType}`),null}}_hashMosaic(e,t){return 1|e<<1|(t.sdf?1:0)<<2|("Nearest"===t.samplingMode?1:0)<<3|t.page<<4}_setTextureBinding(e,t){const i=this._hashMosaic(e,t);if(!this._hashToBindingIndex.has(i)){const s=F.fromMosaic(e,t),r=this._bindingInfos.length+1;this._hashToBindingIndex.set(i,r),this._bindingInfos.push(s)}t.textureBinding=this._hashToBindingIndex.get(i)}async _rasterizeText(e,t){const{font:s,textString:a}=e,n=r(s),o=this._invalidFontsMap.has(n),[c,h]=i(a),l=T(c);try{const e=o?$:n;has("esri-2d-stabilize-glyphs")&&await this._glyphMosaic.preloadASCIIGlyphCache(e);return{type:"glyphs",glyphs:await this._glyphMosaic.getGlyphItems(e,l,t),isRightToLeft:h}}catch(u){A(`Font ${n} is not available on the web, using "Arial Unicode MS Regular"`),this._invalidFontsMap.set(n,!0);return{type:"glyphs",glyphs:await this._glyphMosaic.getGlyphItems($,l,t),isRightToLeft:h}}}_hashSpriteResource(e){switch(e.type){case"path":return`path:${e.path}.${e.asFill?1:0}`;case"CIMPictureMarker":return`${e.type}:${e.url}:${e.size}:${C(e.markerPlacement)}`;case"CIMPictureFill":return`${e.type}:${e.url}:${e.height}`;case"CIMPictureStroke":return`${e.type}:${e.url}:${e.width}`;case"dash":return`dash:${e.capStyle}.${d(e.dashTemplate).join("")}`;case"sdf":return`sdf:${JSON.stringify(e.geom)}.${e.asFill?1:0}`;case"fill-style":return`fill_style:${e.style}`;case"animated":return JSON.stringify(R(e));case"CIMGradientFill":case"CIMGradientStroke":return`gradient:${JSON.stringify(e.colorRamp)}.${e.gradientType}.${e.interval}`;case"CIMHatchFill":case"CIMVectorMarker":return JSON.stringify(e)}}async _rasterizeSprite(e,t){if(!e)return null;const i=l(this._hashSpriteResource(e));if(this._spriteMosaic.has(i))return this._spriteMosaic.getSpriteItem(i);if("url"in e&&e.url||"CIMPictureFill"===e.type||"CIMPictureStroke"===e.type||"CIMPictureMarker"===e.type||"CIMVectorMarker"===e.type){const t=[];p.fetchResources({type:"CIMPointSymbol",symbolLayers:[e]},this._resourceManager,t),t.length>0&&await Promise.all(t)}switch(e.type){case"CIMPictureMarker":return"CIMMarkerPlacementInsidePolygon"===e.markerPlacement?.type?this._rasterizeJSONResource(i,e):this._handleAsyncResource(i,e,t);case"animated":case"CIMPictureFill":case"CIMPictureStroke":case"path":return this._handleAsyncResource(i,e,t);case"CIMGradientFill":case"CIMGradientStroke":case"CIMHatchFill":case"CIMVectorMarker":case"dash":case"fill-style":case"sdf":return this._rasterizeJSONResource(i,e)}}_rasterizeJSONResource(e,t){const i=this._rasterizer.rasterizeJSONResource(t);if(i){const{size:s,image:r,sdf:a,simplePattern:n,rasterizationScale:o,samplingMode:c,sdfPaddingRatio:h,sdfDecodeCoeff:l}=i;return this._addItemToMosaic(e,s,{type:"static",data:r},N(t),a,n,o,c,h,l)}return null}async _handleAsyncResource(e,t,i){if(this._ongoingRasterizations.has(e))return this._ongoingRasterizations.get(e);let s;return s="path"===t.type?this._handleSVG(t,e,i):this._handleImage(t,e,i),this._ongoingRasterizations.set(e,s),s.finally((()=>this._ongoingRasterizations.delete(e))),s}async _handleSVG(e,t,i){const s=[g,g],{asFill:r}=e,a=await this._sdfConverter.draw(e.path,r,i);return this._addItemToMosaic(t,s,{type:"static",data:new Uint32Array(a.buffer)},!1,!0,!0)}async _handleGIFOrPNG(e,t,i){const s=e.url,r=this.resourceManager.getResource(s);if(null==r)return null;const{width:a,height:n}=r;if(r instanceof HTMLImageElement){if("animated"===e.type)return k("mapview-unexpected-resource","Attempt to configure animations for a non-animated image."),null;const i="colorSubstitutions"in e?e.colorSubstitutions:void 0,{size:s,sdf:o,image:c}=this._rasterizer.rasterizeImageResource(a,n,r,i);return this._addItemToMosaic(t,s,{type:"static",data:c},N(e),o,!1)}let o,c,h;"animated"===e.type?(o=!1,c={type:"CIMAnimatedSymbolProperties",playAnimation:e.playAnimation,reverseAnimation:e.reverseAnimation,randomizeStartTime:e.randomizeStartTime,randomizeStartSeed:e.randomizeStartSeed,startTimeOffset:e.startTimeOffset,duration:e.duration,repeatType:e.repeatType,repeatDelay:e.repeatDelay},h=e.startGroup||0):(o=N(e),c={type:"CIMAnimatedSymbolProperties"},h=0);const l=new x(r,this._requestRender,c,h);return this._addItemToMosaic(t,[l.width,l.height],{type:"animated",data:l},o,!1,!1)}async _handleImage(e,t,i){const r=e.url;if(L(r)||U(r))return this._handleGIFOrPNG(e,t,i);if("animated"===e.type)return k("mapview-unexpected-resource","Attempt to configure animations for a non-animated image."),null;try{let s;const a=this.resourceManager.getResource(r);if(null!=a&&a instanceof HTMLImageElement)s=a;else{const{data:e}=await this._imageRequestQueue.push(r,{...i});s=e}if(P(r))if("width"in e&&"height"in e)s.width=h(e.width),s.height=h(e.height);else if("cim"in e){const t=e;s.width=h(t.width??t.scaleX*t.size),s.height=h(t.size)}if(!s.width||!s.height)return null;const n=s.width,o=s.height,c="colorSubstitutions"in e?e.colorSubstitutions:void 0,{size:l,sdf:u,image:p}=this._rasterizer.rasterizeImageResource(n,o,s,c);return this._addItemToMosaic(t,l,{type:"static",data:p},N(e),u,!1)}catch(k){if(!o(k))throw new s("mapview-invalid-resource",`Could not fetch requested resource at ${r}. ${k.message}`);throw k}}_addItemToMosaic(e,t,i,s,r,a,n,o,c,h){return this._spriteMosaic.addSpriteItem(e,t,i,s,r,a,n,o,c,h)}}function N(e){switch(e.type){case"CIMVectorMarker":case"CIMPictureMarker":return E(e);default:return!0}}const B=e=>null!=e&&e.startsWith("data:image/gif"),L=e=>e&&(e.includes(".gif")||B(e)),O=e=>null!=e&&e.startsWith("data:image/png"),U=e=>e&&(e.includes(".png")||O(e)),E=e=>e&&"markerPlacement"in e&&e.markerPlacement&&"CIMMarkerPlacementInsidePolygon"===e.markerPlacement.type;export{G as default};