@arcgis/core/views/2d/engine/webgl/TextureManager.js

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

/* COPYRIGHT Esri - https://js.arcgis.com/5.0.8/LICENSE.txt */
import e from"../../../../config.js";import t from"../../../../request.js";import i from"../../../../core/Error.js";import{getFullyQualifiedFontName as s}from"../../../../core/fontUtils.js";import has from"../../../../core/has.js";import r from"../../../../core/Logger.js";import{throwIfAborted as a,isAbortError as n}from"../../../../core/promiseUtils.js";import{QueueProcessor as o}from"../../../../core/QueueProcessor.js";import{pt2px as c}from"../../../../core/screenUtils.js";import{numericHash as h}from"../../../../core/string.js";import l from"../../../../symbols/cim/CIMResourceManager.js";import{CIMSymbolHelper as u}from"../../../../symbols/cim/CIMSymbolHelper.js";import p from"../../../../symbols/cim/Rasterizer.js";import{normalizeDashTemplate as d}from"../../../../symbols/cim/utils.js";import{svgSdfTextureInnerSize as m,textureBindingSpriteAtlas as g,textureBindingGlyphAtlas as f,sdfBufferGlyphSDFCreator as y,sdfBufferServer as _,sdfRadiusComplex as M,sdfRadiusSimple as I,sdfSizeComplex as w,sdfSizeSimple as S}from"./definitions.js";import z from"./GlyphMosaic.js";import T from"./GlyphSource.js";import R from"./Rect.js";import C from"./SDFConverter.js";import x from"./SpriteMosaic.js";import{discardUrlIfHasUrlHash as P}from"./urlUtils.js";import{getCIMMarkerPlacementHash as b,isSVGImage as $}from"./Utils.js";import{AnimatableTextureResource as v}from"./animatedFormats/AnimatableTextureResource.js";import{AnimationStore as j}from"./animations/store/AnimationStore.js";const k="arial-unicode-ms-regular",F=/[\u0695\u0698\u06a9\u06af\u06b5\u06be\u06c6\u06cc\u06ce\u06d5\u06ca]|\p{Script=Thai}|\p{Script=Lao}|\p{Script=Tamil}|\p{Script=Khmer}/u,A=()=>r.getLogger("esri.views.MapView"),G=(e,t,s)=>A().error(new i(e,t,s)),O=(e,t="")=>A().warnOnce(e,t);class B{static fromMosaic(e,t){return new B(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 N{constructor(s){this._requestRender=s,this._resourceManager=new l,this._invalidFonts=new Set,this._sdfConverter=new C(m),this._bindingInfos=new Array,this._hashToBindingIndex=new Map,this._ongoingRasterizations=new Map,this._imageRequestQueue=new o({concurrency:10,process:async(e,s)=>{a(s);try{return await t(e,{responseType:"image",signal:s})}catch(r){if(!n(r))throw new i("mapview-invalid-resource",`Could not fetch requested resource at ${e}`,r);throw r}}}),this.animationStore=new j,this._spriteMosaic=new x(2048,2048,500),this._glyphSource=new T(`${e.fontsUrl}/{fontstack}/{range}.pbf`),this._glyphMosaic=new z(1024,1024,this._glyphSource),this._rasterizer=new p(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 G("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 R(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 G("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(1,t);return e}const s=await this._rasterizeSprite(i,t);return s&&this._setTextureBinding(0,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?g:f}}:(G("mapview-invalid-resource",`Unable to find resource for ${t}`),{size:[0,0],texture:{texture:null,unit:0}})}_getTextureBindingInfo(e,t,i){const{context:s}=e,r=this._bindingInfos[t-1],a=r.page,n="Nearest"===r.samplingMode?9728:i?9987:9729;switch(r.mosaicType){case 0:{const t=[this.sprites.getWidth(a),this.sprites.getHeight(a)],i=this._spriteMosaic.getTexture(e,a);return i.setSamplingMode(n),{type:"sprite",texture:i,size:t}}case 1:{const e=[this.glyphs.width,this.glyphs.height],t=this._glyphMosaic.getTexture(s,a);return this._glyphMosaic.bind(s,n,a,f),t.setSamplingMode(n),{type:"glyph",texture:t,size:e}}default:return G("mapview-texture-manager",`Cannot handle unknown type ${r.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=B.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:i,textString:r}=e,a=s(i),n=this._invalidFonts.has(a),o=!!has("esri-2d-force-complex-shaping")||!!has("esri-2d-complex-shaping")&&F.test(r),c=o?w:S,h=o?M:I,l=o?y:_;try{const e=n?k:a;has("esri-2d-stabilize-glyphs")&&await this._glyphMosaic.preloadASCIIGlyphCache(e);const{isRightToLeft:i,glyphs:s,faceInfo:u}=await this._glyphMosaic.getGlyphItems(r,o,e,t);return{type:"glyphs",glyphs:s,faceInfo:u,isRightToLeft:i,sdfSize:c,sdfRadius:h,sdfPadding:l}}catch(u){O(`Font ${a} is not available on the web, using "Arial Unicode MS Regular"`),this._invalidFonts.add(a);const{isRightToLeft:e,glyphs:i,faceInfo:s}=await this._glyphMosaic.getGlyphItems(r,o,k,t);return{type:"glyphs",glyphs:i,faceInfo:s,isRightToLeft:e,sdfSize:c,sdfRadius:h,sdfPadding:l}}}_hashSpriteResource(e){switch(e.type){case"path":return`path:${e.path}.${e.asFill?1:0}`;case"CIMPictureMarker":return`${e.type}:${e.url}:${e.size}:${b(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.geometry)}.${e.sdfTextureSize}.${e.asFill?1:0}`;case"fill-style":return`fill_style:${e.style}`;case"animated":return JSON.stringify(P(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=h(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=[];u.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},L(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=[m,m],{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)}_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 G("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},L(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=L(e),c={type:"CIMAnimatedSymbolProperties"},h=0);const l=new v(r,this._requestRender,c,h);return this._addItemToMosaic(t,[l.width,l.height],{type:"animated",data:l},o,!1,!1)}async _handleImage(e,t,s){const r=e.url;if(q(r)||V(r))return this._handleGIFOrPNG(e,t,s);if("animated"===e.type)return G("mapview-unexpected-resource","Attempt to configure animations for a non-animated image."),null;try{let i;const a=this.resourceManager.getResource(r);if(null!=a&&a instanceof HTMLImageElement)i=a;else{const{data:e}=await this._imageRequestQueue.push(r,{...s});i=e}if($(r))if("width"in e&&"height"in e)i.width=c(e.width),i.height=c(e.height);else if("cim"in e){const t=e;i.width=c(t.width??t.scaleX*t.size),i.height=c(t.size)}if(!i.width||!i.height)return null;const n=i.width,o=i.height,h="colorSubstitutions"in e?e.colorSubstitutions:void 0,{size:l,sdf:u,image:p}=this._rasterizer.rasterizeImageResource(n,o,i,h);return this._addItemToMosaic(t,l,{type:"static",data:p},L(e),u,!1)}catch(G){if(!n(G))throw new i("mapview-invalid-resource",`Could not fetch requested resource at ${r}. ${G.message}`);throw G}}_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 L(e){switch(e.type){case"CIMVectorMarker":case"CIMPictureMarker":return H(e);default:return!0}}const U=e=>null!=e&&e.startsWith("data:image/gif"),q=e=>e&&(e.includes(".gif")||U(e)),J=e=>null!=e&&e.startsWith("data:image/png"),V=e=>e&&(e.includes(".png")||J(e)),H=e=>e&&"markerPlacement"in e&&e.markerPlacement&&"CIMMarkerPlacementInsidePolygon"===e.markerPlacement.type;export{N as default};