@idmwx/idmui-gl3 4.8.9 → 4.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +1 -1
- package/dist/index.umd.cjs +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
package/dist/index.umd.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
(function(D,U){typeof exports=="object"&&typeof module<"u"?U(exports,require("@idm-plugin/tag"),require("vue"),require("@turf/turf"),require("@mapbox/sphericalmercator"),require("moment"),require("mapbox-gl"),require("@idm-plugin/geo"),require("@idm-plugin/meteo"),require("axios")):typeof define=="function"&&define.amd?define(["exports","@idm-plugin/tag","vue","@turf/turf","@mapbox/sphericalmercator","moment","mapbox-gl","@idm-plugin/geo","@idm-plugin/meteo","axios"],U):(D=typeof globalThis<"u"?globalThis:D||self,U(D["idm-gl"]={},D["@idm-plugin/tag"],D.Vue,D["@turf/turf"],D["@mapbox/sphericalmercator"],D.moment,D["mapbox-gl"],D["@idm-plugin/geo"],D["@idm-plugin/meteo"],D.axios))})(this,function(D,U,M,E0,T0,P,i0,x,u0,r0){"use strict";var Ib=Object.defineProperty;var Sb=(D,U,M)=>U in D?Ib(D,U,{enumerable:!0,configurable:!0,writable:!0,value:M}):D[U]=M;var H=(D,U,M)=>(Sb(D,typeof U!="symbol"?U+"":U,M),M);function x0(p){const b=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(p){for(const z in p)if(z!=="default"){const o=Object.getOwnPropertyDescriptor(p,z);Object.defineProperty(b,z,o.get?o:{enumerable:!0,get:()=>p[z]})}}return b.default=p,Object.freeze(b)}const y=x0(E0),Db="",vb="",S=(p,b)=>{const z=p.__vccOpts||p;for(const[o,O]of b)z[o]=O;return z},I0={name:"IdmGlLayer",props:{map:{type:Object},mapProjection:{type:String},top:{type:Number,default:60},layerToggle:{type:Boolean,default:!1},toggleVersion:{type:Number},isLogin:{type:Boolean,default:void 0},showWindFeather:{type:Boolean,default:void 0},showWindParticle:{type:Boolean,default:void 0},showCurrentIsoband:{type:Boolean,default:void 0},showCurrentParticle:{type:Boolean,default:void 0}},emits:["weather","other","toggleWindParticle","toggleWindFeather","toggleCurrentParticle","toggleCurrentIsoband","coordinate","measure","point","3d","layerToggle","handleToggleVersion","login"],data(){return{autoActive:!0,layers:{weather:[...U.LayerHelper.WEATHER_LAYERS.filter(p=>!["swell-height","swell-direction","current-direction","current-speed"].includes(p.key))],other:[...U.LayerHelper.OTHER_LAYERS.filter(p=>p.enabled)]},activeWeatherLayers:[],activeOtherLayers:[],autoActiveCache:"autoActiveCache",activeWeatherLayersCache:"activeWeatherLayersCache",activeOtherLayersCache:"activeOtherLayersCache",collectedLayerCache:"collectedLayerCache",sourceCache:"defaultSourceCache",windFeatherCache:"windFeatherCache",currentIsobandCache:"currentIsobandCache",showCoord:!1,showMeasure:!1,showPoint:!1,show3d:!1,version:{v:"0.0.8",k:"glCacheVersion"},source:"",right:10,rampColorLayers:["visibility","precip3h","temp","water-temp","arctic"]}},computed:{computeLayerClass(){return function(p,b){var o;let z="layer flex-between";return b.some(O=>O.key===p.key)&&(z=z+" active"),(!p.enabled||(o=this.layers.weather)!=null&&o.some(O=>O.key===p.key)&&!this.autoActive||this.rampColorLayers.includes(p.key)&&this.mapProjection==="globe")&&(z=z+" disabled"),z}},hasCollectedLayers(){var p;return((p=this.layers.weather.filter(b=>b.collected))==null?void 0:p.length)>0}},watch:{toggleVersion:{handler(){this.$nextTick(()=>{var p;this.right=(((p=document.getElementsByClassName("right-bar")[0])==null?void 0:p.clientWidth)||0)+10})}},source:{handler(p,b){p&&b&&p!==b&&this.handleConfirm()}}},mounted(){this.fetchCache(),this.handleConfirm()},methods:{fetchCache(){const p=localStorage.getItem(this.version.k);this.version.v!==p&&(localStorage.removeItem(this.activeWeatherLayersCache),localStorage.removeItem(this.collectedLayerCache),localStorage.removeItem(this.activeOtherLayersCache),localStorage.removeItem(this.windFeatherCache),localStorage.removeItem(this.currentIsobandCache),localStorage.setItem(this.version.k,this.version.v));let b=localStorage.getItem(this.autoActiveCache);this.autoActive=b!=="false",b=localStorage.getItem(this.collectedLayerCache);let z=JSON.parse(b||'[{"weight": 16, "name": "Sig Waves", "key": "sig-wave-height", "collected": true},{"weight": 1, "name": "Wind", "key": "wind", "h5": true, "collected": true},{"weight": 96, "name": "Current", "key": "current", "collected": true},{"weight": 256,"name": "Tropicals","key": "tropicals", "collected": true}]');this.layers.weather.forEach(o=>{o.collected=!!z.some(O=>O.key===o.key&&O.collected)}),b=localStorage.getItem(this.activeWeatherLayersCache),b||localStorage.setItem(this.activeWeatherLayersCache,JSON.stringify([{weight:1,name:"Wind",key:"wind",enabled:!0,type:"json",particle:!0},{weight:4096,name:"Pressure",key:"prmsl",enabled:!0,type:"json"},{weight:256,name:"Tropicals",key:"tropicals",enabled:!0,type:"json"}])),b=localStorage.getItem(this.activeWeatherLayersCache),z=JSON.parse(b),this.autoActive&&(this.activeWeatherLayers=[...z]),z.some(o=>o.key==="wind"&&o.particle)&&this.$emit("toggleWindParticle",!0),localStorage.getItem(this.windFeatherCache)==="true"&&this.$emit("toggleWindFeather",!0),z.some(o=>o.key==="current"&&o.particle)&&this.$emit("toggleCurrentParticle",!0),localStorage.getItem(this.currentIsobandCache)==="true"&&this.$emit("toggleCurrentIsoband",!0),b=localStorage.getItem(this.activeOtherLayersCache),z=JSON.parse(b||'[{"weight":4,"name":"ECA Zones","key":"eca-zones","enabled":true,"type":"json"}, {"weight": 2048,"name": "ENC","key": "enc","h5": true,"enabled": true,"type": "origin"}]'),this.activeOtherLayers=z,b=localStorage.getItem(this.sourceCache),this.source=b||"GFS"},handleConfirm(){this.$emit("weather",this.activeWeatherLayers,this.source),this.$emit("other",this.activeOtherLayers),localStorage.setItem(this.autoActiveCache,this.autoActive),localStorage.setItem(this.sourceCache,this.source)},handleWeatherLayerPick(p){if(this.activeWeatherLayers=JSON.parse(localStorage.getItem(this.activeWeatherLayersCache)),this.rampColorLayers.includes(p.key)&&this.mapProjection==="globe"||!this.autoActive)return!1;(p.key==="wind"&&!this.showWindFeather||p.key==="current"&&!this.showCurrentIsoband)&&(p.particle=!0),this.activeWeatherLayers.some(b=>b.key===p.key)?this.activeWeatherLayers=this.activeWeatherLayers.filter(b=>b.key!==p.key):this.activeWeatherLayers.length<6&&p.enabled&&(["png","jpg"].includes(p.type)?(this.activeWeatherLayers.forEach(b=>{(b.key==="wind"&&this.showWindFeather||p.key==="current"&&this.showCurrentIsoband)&&(b.particle=!1)}),this.activeWeatherLayers=this.activeWeatherLayers.filter(b=>b.type==="json"&&!(["wind","current"].includes(b.key)&&b.particle))):p.key==="wind"?(this.activeWeatherLayers.forEach(b=>{b.key==="current"&&this.showCurrentIsoband&&(b.particle=!1)}),this.activeWeatherLayers=this.activeWeatherLayers.filter(b=>b.type==="json"&&!(["wind","current"].includes(b.key)&&b.particle))):p.key==="current"&&(this.activeWeatherLayers.forEach(b=>{b.key==="wind"&&this.showWindFeather&&(b.particle=!1)}),this.activeWeatherLayers=this.activeWeatherLayers.filter(b=>b.type==="json"&&!(["wind","current"].includes(b.key)&&b.particle))),this.activeWeatherLayers.push(p)),this.$emit("weather",this.activeWeatherLayers,this.source),localStorage.setItem(this.activeWeatherLayersCache,JSON.stringify(this.activeWeatherLayers))},handleWeatherLayerCollect(p){var b;!p.collected&&((b=this.layers.weather.filter(z=>z.collected))==null?void 0:b.length)>=6&&(this.layers.weather.filter(z=>z.collected)[0].collected=!1),p.collected=!p.collected,localStorage.setItem(this.collectedLayerCache,JSON.stringify(this.layers.weather)),this.$emit("handleToggleVersion")},handleToggleWindParticle(){!this.showWindFeather&&this.showWindParticle?this.handleWeatherLayerPick({weight:1,name:"Wind",key:"wind",enabled:!0,type:"json",particle:!0}):(this.showCurrentParticle&&(this.$emit("toggleCurrentParticle",!1),this.showCurrentIsoband||(this.activeWeatherLayers=this.activeWeatherLayers.filter(p=>p.key!=="current"),localStorage.setItem(this.activeWeatherLayersCache,JSON.stringify(this.activeWeatherLayers)))),this.$emit("toggleWindParticle",!this.showWindParticle))},handleToggleWindFeather(){this.showWindFeather&&!this.showWindParticle&&this.handleWeatherLayerPick({weight:1,name:"Wind",key:"wind",enabled:!0,type:"json",particle:!0}),this.$emit("toggleWindFeather",!this.showWindFeather),localStorage.setItem(this.windFeatherCache,!this.showWindFeather)},handleToggleCurrentParticle(){!this.showCurrentIsoband&&this.showCurrentParticle?this.handleWeatherLayerPick({weight:96,name:"Current",key:"current",vendor:"cmems",merge:!0,h5:!0,enabled:!0}):(this.showWindParticle&&(this.$emit("toggleWindParticle",!1),this.showWindFeather||(this.activeWeatherLayers=this.activeWeatherLayers.filter(p=>p.key!=="wind"),localStorage.setItem(this.activeWeatherLayersCache,JSON.stringify(this.activeWeatherLayers)))),this.$emit("toggleCurrentParticle",!this.showCurrentParticle))},handleToggleCurrentIsoband(){this.showCurrentIsoband&&!this.showCurrentParticle&&this.handleWeatherLayerPick({weight:96,name:"Current",key:"current",vendor:"cmems",merge:!0,h5:!0,enabled:!0}),this.$emit("toggleCurrentIsoband",!this.showCurrentIsoband),localStorage.setItem(this.currentIsobandCache,!this.showCurrentIsoband)},handleOtherLayerPick(p){this.activeOtherLayers.some(b=>b.key===p.key)?this.activeOtherLayers=this.activeOtherLayers.filter(b=>b.key!==p.key):p.enabled&&this.activeOtherLayers.push(p),localStorage.setItem(this.activeOtherLayersCache,JSON.stringify(this.activeOtherLayers)),this.$emit("other",this.activeOtherLayers)},handleMenuToggle(){this.$emit("layerToggle",!this.layerToggle)},toggleAutoActive(){this.autoActive=!this.autoActive,localStorage.setItem(this.autoActiveCache,this.autoActive),this.autoActive?this.$emit("weather",this.activeWeatherLayers,this.source):this.$emit("weather",[],this.source)},handleCoordToggle(){this.showCoord=!this.showCoord,this.$emit("coordinate",this.showCoord)},handlePointToggle(){this.isLogin?(this.showPoint=!this.showPoint,this.$emit("point",this.showPoint)):this.$emit("login")},handleMeasureToggle(){this.showMeasure=!this.showMeasure,this.$emit("measure",this.showMeasure)},handle3DToggle(){this.show3d=!this.show3d,this.$emit("3d",this.show3d)}}},S0={class:"idm-gl3-layer"},D0={class:"bar-item layer-bars"},v0={class:"bar-item tool-bars"},P0={class:"flex-between"},k0={key:0,class:"iconfont active"},Q0={key:1,class:"iconfont"},H0=["onClick"],_0=["onClick"],j0={key:0,class:"flex-start"},F0={key:1,class:"flex-start"},V0={class:"header-box flex-between"},G0={class:"weather-layers card-bg"},U0={class:"layers-title flex-between"},K0={key:0,class:"iconfont active"},J0={key:1,class:"iconfont"},Y0={class:"layers-body"},Z0={class:"flex-start"},$0=["onClick"],M1=["onClick"],b1={key:0,class:"flex-start"},z1={key:1,class:"flex-start"},p1=["onClick"],O1={key:0,class:"iconfont bookmark-icon active"},o1={key:1,class:"iconfont bookmark-icon inactive"},c1={class:"other-layers card-bg"},e1={class:"layers-body"},A1=["onClick"],t1={class:"flex-start"},a1={class:"switch flex-center"},q1={key:0,class:"iconfont active"},i1={key:1,class:"iconfont"},r1={class:"source-layers card-bg"},n1={class:"layers-body"};function d1(p,b,z,o,O,c){const e=M.resolveComponent("ElTooltip"),t=M.resolveComponent("ElRadio"),q=M.resolveComponent("ElRadioGroup"),r=M.resolveComponent("ElScrollbar");return M.openBlock(),M.createElementBlock("div",S0,[M.createElementVNode("div",{class:"menu-bar-box",style:M.normalizeStyle({top:z.top+10+"px",right:O.right+"px"})},[M.createElementVNode("div",D0,[M.createVNode(e,{placement:"left",effect:"light",content:"Menu","show-after":1e3},{default:M.withCtx(()=>[M.createElementVNode("div",{class:M.normalizeClass(z.layerToggle?"menu-icon active":"menu-icon"),onClick:b[0]||(b[0]=(...a)=>c.handleMenuToggle&&c.handleMenuToggle(...a))},b[17]||(b[17]=[M.createElementVNode("span",{class:"iconfont"},"",-1)]),2)]),_:1})])],4),M.createElementVNode("div",{class:"menu-bar-box",style:M.normalizeStyle({top:z.top+160+"px",right:O.right+"px"})},[M.createElementVNode("div",v0,[M.createVNode(e,{placement:"left",effect:"light",content:"Measure","show-after":1e3},{default:M.withCtx(()=>[M.createElementVNode("div",{class:M.normalizeClass(O.showMeasure?"menu-icon active":"menu-icon"),onClick:b[1]||(b[1]=(...a)=>c.handleMeasureToggle&&c.handleMeasureToggle(...a))},b[18]||(b[18]=[M.createElementVNode("span",{class:"iconfont"},"",-1)]),2)]),_:1}),M.createVNode(e,{placement:"left",effect:"light",content:"Point Meteo","show-after":1e3},{default:M.withCtx(()=>[M.createElementVNode("div",{class:M.normalizeClass(O.showPoint?"menu-icon active":"menu-icon"),onClick:b[2]||(b[2]=(...a)=>c.handlePointToggle&&c.handlePointToggle(...a))},b[19]||(b[19]=[M.createElementVNode("span",{class:"iconfont"},"",-1)]),2)]),_:1}),M.createVNode(e,{placement:"left",effect:"light",content:"Grid","show-after":1e3},{default:M.withCtx(()=>[M.createElementVNode("div",{class:M.normalizeClass(O.showCoord?"menu-icon active":"menu-icon"),onClick:b[3]||(b[3]=(...a)=>c.handleCoordToggle&&c.handleCoordToggle(...a))},b[20]||(b[20]=[M.createElementVNode("span",{class:"iconfont"},"",-1)]),2)]),_:1}),M.createVNode(e,{placement:"left",effect:"light",content:"3D","show-after":1e3},{default:M.withCtx(()=>[M.createElementVNode("div",{class:M.normalizeClass(O.show3d?"menu-icon active":"menu-icon"),onClick:b[4]||(b[4]=(...a)=>c.handle3DToggle&&c.handle3DToggle(...a))},b[21]||(b[21]=[M.createElementVNode("span",{class:"iconfont"},"",-1)]),2)]),_:1})])],4),c.hasCollectedLayers?(M.openBlock(),M.createElementBlock("div",{key:0,class:"active-layers",style:M.normalizeStyle({right:O.right+"px",bottom:"100px"})},[M.createElementVNode("div",P0,[b[22]||(b[22]=M.createElementVNode("div",{style:{margin:"2px 5px"}},"Weather Layers",-1)),M.createElementVNode("div",{class:"switch flex-center",style:{"font-size":"28px","margin-right":"0"},onClick:b[5]||(b[5]=(...a)=>c.toggleAutoActive&&c.toggleAutoActive(...a))},[O.autoActive?(M.openBlock(),M.createElementBlock("i",k0,"")):(M.openBlock(),M.createElementBlock("i",Q0,""))])]),(M.openBlock(!0),M.createElementBlock(M.Fragment,null,M.renderList(O.layers.weather.filter(a=>a.collected),a=>(M.openBlock(),M.createElementBlock("div",{key:a.key,class:M.normalizeClass(c.computeLayerClass(a,O.activeWeatherLayers))},[M.createElementVNode("div",{class:"checkbox",onClick:n=>c.handleWeatherLayerPick(a)},null,8,H0),M.createElementVNode("span",{class:"name",onClick:n=>c.handleWeatherLayerPick(a)},M.toDisplayString(a.name),9,_0),a.key==="wind"&&O.activeWeatherLayers.some(n=>n.key===a.key)?(M.openBlock(),M.createElementBlock("div",j0,[M.createElementVNode("i",{class:M.normalizeClass(["iconfont sub-layer-icon",z.showWindParticle?"active":""]),onClick:b[6]||(b[6]=n=>c.handleToggleWindParticle())},"",2),M.createElementVNode("i",{class:M.normalizeClass(["iconfont sub-layer-icon",z.showWindFeather?"active":""]),onClick:b[7]||(b[7]=n=>c.handleToggleWindFeather())},"",2)])):M.createCommentVNode("",!0),a.key==="current"&&O.activeWeatherLayers.some(n=>n.key===a.key)?(M.openBlock(),M.createElementBlock("div",F0,[M.createElementVNode("i",{class:M.normalizeClass(["iconfont sub-layer-icon",z.showCurrentParticle?"active":""]),onClick:b[8]||(b[8]=n=>c.handleToggleCurrentParticle())},"",2),M.createElementVNode("i",{class:M.normalizeClass(["iconfont sub-layer-icon",z.showCurrentIsoband?"active":""]),onClick:b[9]||(b[9]=n=>c.handleToggleCurrentIsoband())},"",2)])):M.createCommentVNode("",!0)],2))),128))],4)):M.createCommentVNode("",!0),M.createElementVNode("div",{class:"available-layers flex-center",style:M.normalizeStyle({top:z.top+"px",right:z.layerToggle?"0px":"-240px"})},[M.createElementVNode("div",{class:M.normalizeClass(["list-box",z.layerToggle?"right-bar":""])},[M.createElementVNode("div",V0,[b[23]||(b[23]=M.createElementVNode("div",null,"Layers",-1)),M.createElementVNode("div",{class:"iconfont close-btn",onClick:b[10]||(b[10]=(...a)=>c.handleMenuToggle&&c.handleMenuToggle(...a))},"")]),M.createVNode(r,{style:{flex:"1"}},{default:M.withCtx(()=>[M.createElementVNode("div",G0,[M.createElementVNode("div",U0,[b[24]||(b[24]=M.createElementVNode("div",null,"Weather Layers",-1)),M.createElementVNode("div",{class:"switch flex-center",style:{"margin-right":"0"},onClick:b[11]||(b[11]=(...a)=>c.toggleAutoActive&&c.toggleAutoActive(...a))},[O.autoActive?(M.openBlock(),M.createElementBlock("i",K0,"")):(M.openBlock(),M.createElementBlock("i",J0,""))])]),M.createElementVNode("div",Y0,[(M.openBlock(!0),M.createElementBlock(M.Fragment,null,M.renderList(O.layers.weather,a=>(M.openBlock(),M.createElementBlock(M.Fragment,{key:a.key},[a.hide?M.createCommentVNode("",!0):(M.openBlock(),M.createElementBlock("div",{key:0,class:M.normalizeClass(c.computeLayerClass(a,O.activeWeatherLayers))},[M.createElementVNode("div",Z0,[M.createElementVNode("div",{class:"checkbox",onClick:n=>c.handleWeatherLayerPick(a)},null,8,$0),M.createElementVNode("span",{class:"name",onClick:n=>c.handleWeatherLayerPick(a)},M.toDisplayString(a.name),9,M1),a.key==="wind"&&O.activeWeatherLayers.some(n=>n.key===a.key)?(M.openBlock(),M.createElementBlock("div",b1,[M.createElementVNode("i",{class:M.normalizeClass(["iconfont sub-layer-icon",z.showWindParticle?"active":""]),onClick:b[12]||(b[12]=n=>c.handleToggleWindParticle())},"",2),M.createElementVNode("i",{class:M.normalizeClass(["iconfont sub-layer-icon",z.showWindFeather?"active":""]),onClick:b[13]||(b[13]=n=>c.handleToggleWindFeather())},"",2)])):M.createCommentVNode("",!0),a.key==="current"&&O.activeWeatherLayers.some(n=>n.key===a.key)?(M.openBlock(),M.createElementBlock("div",z1,[M.createElementVNode("i",{class:M.normalizeClass(["iconfont sub-layer-icon",z.showCurrentParticle?"active":""]),onClick:b[14]||(b[14]=n=>c.handleToggleCurrentParticle())},"",2),M.createElementVNode("i",{class:M.normalizeClass(["iconfont sub-layer-icon",z.showCurrentIsoband?"active":""]),onClick:b[15]||(b[15]=n=>c.handleToggleCurrentIsoband())},"",2)])):M.createCommentVNode("",!0)]),M.createElementVNode("div",{onClick:n=>c.handleWeatherLayerCollect(a)},[a.collected?(M.openBlock(),M.createElementBlock("i",O1,"")):(M.openBlock(),M.createElementBlock("i",o1,""))],8,p1)],2))],64))),128)),b[25]||(b[25]=M.createElementVNode("div",{class:"tip flex-start"},[M.createElementVNode("i",{class:"iconfont bookmark-icon",style:{"align-self":"flex-start",padding:"5px 5px 0 0"}},""),M.createElementVNode("div",null,"You can add the layers to your favorites. (Max 6)")],-1))])]),M.createElementVNode("div",c1,[b[26]||(b[26]=M.createElementVNode("div",{class:"layers-title"},"Other Layers",-1)),M.createElementVNode("div",e1,[(M.openBlock(!0),M.createElementBlock(M.Fragment,null,M.renderList(O.layers.other,a=>{var n;return M.openBlock(),M.createElementBlock("div",{key:a.key,class:M.normalizeClass(["layer flex-between",c.computeLayerClass(a,O.activeOtherLayers)]),onClick:s=>c.handleOtherLayerPick(a)},[M.createElementVNode("div",t1,[M.createElementVNode("div",a1,[(n=c.computeLayerClass(a,O.activeOtherLayers))!=null&&n.includes("active")?(M.openBlock(),M.createElementBlock("i",q1,"")):(M.openBlock(),M.createElementBlock("i",i1,""))]),M.createElementVNode("span",null,M.toDisplayString(a.name),1)])],10,A1)}),128))])]),M.createElementVNode("div",r1,[b[29]||(b[29]=M.createElementVNode("span",{class:"layers-title"},"Forecast Model",-1)),M.createElementVNode("div",n1,[M.createVNode(q,{modelValue:O.source,"onUpdate:modelValue":b[16]||(b[16]=a=>O.source=a),class:"layer-radio flex-col-center-start"},{default:M.withCtx(()=>[M.createVNode(t,{value:"GFS"},{default:M.withCtx(()=>b[27]||(b[27]=[M.createTextVNode("GFS")])),_:1}),M.createVNode(t,{value:"CMEMS"},{default:M.withCtx(()=>b[28]||(b[28]=[M.createTextVNode("CMEMS")])),_:1})]),_:1},8,["modelValue"])])])]),_:1})],2)],4)])}const s1=S(I0,[["render",d1]]),Pb="",W1={name:"IdmWindBarb",props:{map:{type:Object},wind:{type:Object},current:{type:Object},beforeLayer:{type:String},mapProjection:{type:String},showWindFeather:{type:Boolean,default:!1},showWindParticle:{type:Boolean,default:!1},toggleVersion:{type:Number}},emits:["particle","showWindFeather"],data(){return{source:"wind-barb-source",barbs:[0,2,5,10,15,20,25,30,35,40,45,50,55,60,65,70,75,80,85,90,95,100,105],empty:y.featureCollection([]),right:10,bottom:125,windBarbLoaded:!1}},watch:{"wind.version":{handler(){var p;(p=this.wind)!=null&&p.active&&this.showWindFeather?this.handleRender():this.handleClear()},deep:!0},showWindParticle:{handler(){this.handleParticle()}},showWindFeather:{handler(){this.handleToggle()}}},methods:{handleParticle(){this.$emit("particle",{particle:this.showWindParticle,key:"wind",weight:1})},handleRender(){var p,b,z,o;if(!this.map)setTimeout(()=>{this.handleRender()},500);else if(this.wind){const O=new Date().valueOf();let c=0,e=0,t=this.empty;if((p=this.wind)!=null&&p.active&&(t=(b=this.wind)==null?void 0:b.data),(z=this.map)!=null&&z.getSource(this.source))(o=this.map)==null||o.getSource(this.source).setData(t),e=new Date().valueOf()-(O+c),console.log("[wind] update elapsed: ",e,", total: ",c+=e);else{this.map.addSource(this.source,{type:"geojson",data:t});for(let q=0;q<(this.barbs??[]).length-1;q++){const r=(this.barbs??[])[q]||0,a=(this.barbs??[])[q+1]||0,n=r<10?`00${r}kts`:r<100?`0${r}kts`:`${r}kts`;this.map.addLayer({id:n,type:"symbol",filter:["all",[">=","spd",r],["<","spd",a]],source:this.source,layout:{"symbol-placement":"point","icon-image":n,"icon-size":.14,"icon-offset":[0,-20],"icon-allow-overlap":!0,"icon-rotation-alignment":"map","icon-rotate":{property:"val",stops:[[0,0],[360,360]]}},paint:{"icon-opacity":1,"text-color":"#222"}},this.beforeLayer)}this.windBarbLoaded=!0,e=new Date().valueOf()-(O+c),console.log("[wind] add elapsed: ",e,", total: ",c+=e)}}},handleToggle(){if(!this.windBarbLoaded)this.handleRender();else for(const p of this.barbs??[]){const b=p<10?`00${p}kts`:p<100?`0${p}kts`:`${p}kts`;this.map.getLayer(b)&&this.map.setLayoutProperty(b,"visibility",this.showWindFeather?"visible":"none")}},handleClear(){for(const p of this.barbs??[]){const b=p<10?`00${p}kts`:p<100?`0${p}kts`:`${p}kts`;this.map.getLayer(b)&&this.map.removeLayer(b)}this.map.getSource(this.source)&&this.map.removeSource(this.source),this.windBarbLoaded=!1}}},l1={key:0};function f1(p,b,z,o,O,c){var e;return(e=z.wind)!=null&&e.active?(M.openBlock(),M.createElementBlock("div",l1)):M.createCommentVNode("",!0)}const L1=S(W1,[["render",f1]]);class l0{constructor(b){H(this,"map");H(this,"mercator");H(this,"rampColorLayer");H(this,"rampColorSource");H(this,"particleLayer");H(this,"particleSource");H(this,"rampColorCanvas");H(this,"particleCanvas");H(this,"ratio");this.map=b,this.mercator=new T0,this.rampColorLayer="ramp-color-layer",this.rampColorSource="ramp-color-source",this.particleLayer="particle-layer",this.particleSource="particle-source",this.rampColorCanvas=document.createElement("canvas"),this.particleCanvas=document.createElement("canvas"),this.ratio=window.devicePixelRatio}convertNLng(b,z=0){return b>180?this.convertNLng(b-360,z+1):b<-180?this.convertNLng(b+360,z+1):[b,z]}getBoundLngLat(){const b=this.map.getBounds();return[[b._sw.lng,b._ne.lat],[b._ne.lng,b._ne.lat],[b._ne.lng,b._sw.lat],[b._sw.lng,b._sw.lat]]}getBoundPixel(){const b=this.map.getBounds(),z=this.map.getZoom()+1,o=[b._ne.lng,b._ne.lat],O=[b._sw.lng,b._sw.lat],[c,e]=this.convertNLng(o[0]),[t,q]=this.convertNLng(O[0]),[r,a]=this.mercator.px([c,o[1]],z),[n,s]=this.mercator.px([t,O[1]],z),d=Math.round(this.mercator.size*Math.pow(2,z)*(e+q));return[n,s,r+d,a]}getBoundRange(){const b=this.map.getZoom()+1,z=this.mercator.size*Math.pow(2,b),o=this.getBoundPixel();return[o[0]/z,o[2]/z,o[3]/z,o[1]/z]}getWorldCopy(b,z){const o=2**z,[O,c,e,t]=b.map(a=>~~(a/(o*256))),q=[];for(let a=t;a<=c;a++)for(let n=O;n<=e;n++)q.push([n,a]);return q.map(a=>{const n=2**z*256;return[a[0]*n,a[1]*n,n]})}resize(){let b=this.map.getSource(this.rampColorSource);b.setCoordinates(this.getBoundLngLat()),b=this.map.getSource(this.particleSource),b.setCoordinates(this.getBoundLngLat()),this.rampColorCanvas.width=this.map._canvas.clientWidth,this.rampColorCanvas.height=this.map._canvas.clientHeight,this.particleCanvas.width=this.map._canvas.clientWidth,this.particleCanvas.height=this.map._canvas.clientHeight}toggle(b){const z=this.map.getLayoutProperty(this.rampColorLayer,"visibility"),o=b?"visible":"none";z!==o&&this.map.setLayoutProperty(this.rampColorLayer,"visibility",o)}toggleParticle(b){const z=this.map.getLayoutProperty(this.particleLayer,"visibility"),o=b?"visible":"none";z!==o&&this.map.setLayoutProperty(this.particleLayer,"visibility",o)}}class W0{createShader(b,z,o){const O=b.createShader(z);if(O&&(b.shaderSource(O,o),b.compileShader(O),!b.getShaderParameter(O,b.COMPILE_STATUS)))throw new Error(b.getShaderInfoLog(O)||"error happened while create shader...");return O}createTexture(b,z,o,O,c,e,t){const q=b.createTexture();return b.bindTexture(b.TEXTURE_2D,q),b.texParameteri(b.TEXTURE_2D,b.TEXTURE_MIN_FILTER,z),b.texParameteri(b.TEXTURE_2D,b.TEXTURE_MAG_FILTER,o),b.texParameteri(b.TEXTURE_2D,b.TEXTURE_WRAP_S,O),b.texParameteri(b.TEXTURE_2D,b.TEXTURE_WRAP_T,O),c instanceof Uint8Array?b.texImage2D(b.TEXTURE_2D,0,b.RGBA,e,t,0,b.RGBA,b.UNSIGNED_BYTE,c):b.texImage2D(b.TEXTURE_2D,0,b.RGBA,b.RGBA,b.UNSIGNED_BYTE,c),b.bindTexture(b.TEXTURE_2D,null),q}createDataBuffer(b,z,o){if(b){const O=b.createBuffer();return z==="array"?(b.bindBuffer(b.ARRAY_BUFFER,O),o&&b.bufferData(b.ARRAY_BUFFER,o,b.STATIC_DRAW)):z==="element"&&(b.bindBuffer(b.ELEMENT_ARRAY_BUFFER,O),o&&b.bufferData(b.ELEMENT_ARRAY_BUFFER,o,b.STATIC_DRAW)),O}return null}createProgram(b,z,o){const O=b.createProgram(),c=this.createShader(b,b.VERTEX_SHADER,z),e=this.createShader(b,b.FRAGMENT_SHADER,o);if(O&&c&&e&&(b.attachShader(O,c),b.attachShader(O,e),b.linkProgram(O),!b.getProgramParameter(O,b.LINK_STATUS)))throw new Error(b.getProgramInfoLog(O)||"error happened while creating ramp color program");return O}createProgramWrapper(b,z,o){const O=this.createProgram(b,z,o);if(O){const c={program:O},e=b.getProgramParameter(O,b.ACTIVE_ATTRIBUTES);for(let q=0;q<e;q++){const r=b.getActiveAttrib(O,q);c[r.name]=b.getAttribLocation(O,r.name)}const t=b.getProgramParameter(O,b.ACTIVE_UNIFORMS);for(let q=0;q<t;q++){const r=b.getActiveUniform(O,q);c[r.name]=b.getUniformLocation(O,r.name)}return c}}setup(b,z,o=!1,O,c){const e=document.createElement("canvas");e.width=256,e.height=1;const t=e.getContext("2d");if(t&&b){const q=t==null?void 0:t.createLinearGradient(0,0,256,0);return z.forEach(([r,a])=>{q.addColorStop(r,a)}),t.fillStyle=q,t.fillRect(0,0,256,1),{canvas:e,texture:this.createTexture(b,b.LINEAR,b.LINEAR,b.CLAMP_TO_EDGE,o?new Uint8Array(t.getImageData(0,0,256,1).data):e,O,c)}}}setupParticle(b,z=1e3){const o=Math.ceil(Math.sqrt(z)),O=o*o,c=new Uint8Array(O*4);for(let a=0;a<c.length;a++)c[a]=Math.floor(Math.random()*256);const e=this.createTexture(b,b.NEAREST,b.NEAREST,b.CLAMP_TO_EDGE,c,o,o),t=this.createTexture(b,b.NEAREST,b.NEAREST,b.CLAMP_TO_EDGE,c,o,o),q=new Float32Array(O);for(let a=0;a<O;a++)q[a]=a;const r=this.createDataBuffer(b,"array",q);return{resolution:o,total:O,texture0:e,texture1:t,indexBuffer:r}}bind(b,z,o){const O=this.createProgram(b,z,o);if(O){const c=this.createDataBuffer(b,"array",void 0),e=b.getAttribLocation(O,"a_position");b.enableVertexAttribArray(e),b.vertexAttribPointer(e,2,b.FLOAT,!1,0,0);const t=new Float32Array([0,0,1,0,0,1,0,1,1,0,1,1]);this.createDataBuffer(b,"array",t);const q=b.getAttribLocation(O,"a_texCoord");return b.enableVertexAttribArray(q),b.vertexAttribPointer(q,2,b.FLOAT,!1,0,0),{program:O,aPositionBuffer:c}}return{}}bindParticle(b,z,o,O,c,e){const t=this.createProgramWrapper(b,z,o),q=this.createProgramWrapper(b,O,c),r=this.createProgramWrapper(b,O,e),a=this.createDataBuffer(b,"array",new Float32Array([0,0,1,0,0,1,0,1,1,0,1,1])),n=b.createFramebuffer();return{particle:t,screen:q,update:r,quadBuffer:a,frameBuffer:n}}draw(b,z,o,O,c,e,t){var q,r;if(z&&o){b.resize(),z==null||z.viewport(0,0,(q=z==null?void 0:z.canvas)==null?void 0:q.width,(r=z==null?void 0:z.canvas)==null?void 0:r.height),z.clearColor(0,0,0,0),z.clear(z.COLOR_BUFFER_BIT|z.DEPTH_BUFFER_BIT);try{const a=z.getUniformLocation(o,"u_resolution"),n=z.getUniformLocation(o,"u_image"),s=z.getUniformLocation(o,"u_color");if(z.useProgram(o),z.uniform2f(a,z.canvas.width*b.ratio,z.canvas.height*b.ratio),z.activeTexture(z.TEXTURE0),z.bindTexture(z.TEXTURE_2D,O),z.uniform1i(n,0),z.activeTexture(z.TEXTURE1),z.bindTexture(z.TEXTURE_2D,c),z.uniform1i(s,1),t!=null&&t.uvRange&&(t!=null&&t.sRange)){const W=z.getUniformLocation(o,"u_range_u_v"),R=z.getUniformLocation(o,"u_range_s");z.uniform2f(W,t.uvRange[0],t.uvRange[1]),z.uniform2f(R,t.sRange[0],t.sRange[1])}const d=b.getBoundPixel(),h=b.map.getZoom()+1,f=b.getWorldCopy(d,h);for(const W of f){const R=(W[0]-d[0])*b.ratio,L=(W[1]-d[3])*b.ratio,g=W[2]*b.ratio,[X,B,v,Q]=[R,g+R,L,g+L],_=new Float32Array([X,v,B,v,X,Q,X,Q,B,v,B,Q]);z.bindBuffer(z.ARRAY_BUFFER,e),z.bufferData(z.ARRAY_BUFFER,_,z.STATIC_DRAW),z.drawArrays(z.TRIANGLES,0,6)}}catch(a){console.log(`render failed...${a}`)}}}drawParticle(b,z,o,O,c){var e,t;z&&(z==null||z.viewport(0,0,(e=z==null?void 0:z.canvas)==null?void 0:e.width,(t=z==null?void 0:z.canvas)==null?void 0:t.height),z.disable(z.DEPTH_TEST),z.disable(z.STENCIL_TEST),z.activeTexture(z.TEXTURE0),z.bindTexture(z.TEXTURE_2D,o),z.activeTexture(z.TEXTURE1),z.bindTexture(z.TEXTURE_2D,O.texture0),this.renderScreen(b,z,O,c),this.updateParticles(b,z,O,c))}renderScreen(b,z,o,O){z.bindFramebuffer(z.FRAMEBUFFER,o.frameBuffer),z.framebufferTexture2D(z.FRAMEBUFFER,z.COLOR_ATTACHMENT0,z.TEXTURE_2D,o.screenTexture,0),z.viewport(0,0,z.canvas.width,z.canvas.height),this.renderScreenTexture(z,o.backgroundTexture,o.screen,o.quadBuffer,.95),this.renderParticles(b,z,o,O),z.bindFramebuffer(z.FRAMEBUFFER,null),this.renderScreenTexture(z,o.screenTexture,o.screen,o.quadBuffer,1);const c=o.backgroundTexture;o.backgroundTexture=o.screenTexture,o.screenTexture=c}renderScreenTexture(b,z,o,O,c){b&&(b.useProgram(o.program),b.bindBuffer(b.ARRAY_BUFFER,O),b.enableVertexAttribArray(o.a_pos),b.vertexAttribPointer(o.a_pos,2,b.FLOAT,!1,0,0),b.activeTexture(b.TEXTURE2),b.bindTexture(b.TEXTURE_2D,z),b.uniform1i(o.u_screen,2),b.uniform1f(o.u_opacity,c),b.drawArrays(b.TRIANGLES,0,6))}renderParticles(b,z,o,O){if(z){z.useProgram(o.particle.program),z.bindBuffer(z.ARRAY_BUFFER,o.indexBuffer),z.enableVertexAttribArray(o.particle.a_index),z.vertexAttribPointer(o.particle.a_index,1,z.FLOAT,!1,0,0),z.activeTexture(z.TEXTURE2),z.bindTexture(z.TEXTURE_2D,o.color.texture),z.uniform1i(o.particle.u_factor,0),z.uniform1i(o.particle.u_particles,1),z.uniform1i(o.particle.u_color_ramp,2),z.uniform1f(o.particle.u_particles_resolution,o.resolution*b.ratio),z.uniform1f(o.particle.u_point,b.ratio);const c=b.getBoundRange();z.uniform4f(o.particle.u_viewport,c[0],c[1],c[2],c[3]),z.uniform2f(o.particle.u_factor_min,O.uvRange[0],O.uvRange[0]),z.uniform2f(o.particle.u_factor_max,O.uvRange[1],O.uvRange[1]),z.drawArrays(z.POINTS,0,o.total)}}updateParticles(b,z,o,O){var e,t;if(z){z.bindFramebuffer(z.FRAMEBUFFER,o.frameBuffer),z.framebufferTexture2D(z.FRAMEBUFFER,z.COLOR_ATTACHMENT0,z.TEXTURE_2D,o.texture1,0),z.viewport(0,0,o.resolution,o.resolution),z.useProgram(o.update.program),z.bindBuffer(z.ARRAY_BUFFER,o.quadBuffer),z.enableVertexAttribArray(o.update.a_pos),z.vertexAttribPointer(o.update.a_pos,2,z.FLOAT,!1,0,0),z.uniform1i(o.update.u_factor,0),z.uniform1i(o.update.u_particles,1);const q=b.getBoundRange();z.uniform4f(o.update.u_viewport,q[0],q[1],q[2],q[3]),z.uniform1f(o.update.u_rand_seed,Math.random()),z.uniform2f(o.update.u_factor_res,(e=o==null?void 0:o.image)==null?void 0:e.width,(t=o==null?void 0:o.image)==null?void 0:t.height),z.uniform2f(o.update.u_factor_min,O.uvRange[0],O.uvRange[0]),z.uniform2f(o.update.u_factor_max,O.uvRange[1],O.uvRange[1]),z.uniform1f(o.update.u_speed_factor,O.speedFactor*b.ratio),z.uniform1f(o.update.u_drop_rate,O.dropRate),z.uniform1f(o.update.u_drop_rate_bump,O.dropRateBump),z.drawArrays(z.TRIANGLES,0,6)}const c=o.texture0;o.texture0=o.texture1,o.texture1=c}resize(b,z){b.resize();const o=new Uint8Array(z.canvas.width*z.canvas.height*4).fill(0,0,z.canvas.width*z.canvas.height*4),O=this.createTexture(z,z.NEAREST,z.NEAREST,z.CLAMP_TO_EDGE,o,z.canvas.width,z.canvas.height),c=this.createTexture(z,z.NEAREST,z.NEAREST,z.CLAMP_TO_EDGE,o,z.canvas.width,z.canvas.height);return{screenTexture:O,backgroundTexture:c}}async loadImg(b){return new Promise(z=>{const o=new Blob([b],{type:b.type}),O=URL.createObjectURL(o),c=new Image;c.crossOrigin="anonymous",c.src=O,c.onload=()=>z(c)})}}class K{}H(K,"vertexSchema",`
|
|
1
|
+
(function(D,U){typeof exports=="object"&&typeof module<"u"?U(exports,require("@idm-plugin/tag"),require("vue"),require("@turf/turf"),require("@mapbox/sphericalmercator"),require("moment"),require("mapbox-gl"),require("@idm-plugin/geo"),require("@idm-plugin/meteo"),require("axios")):typeof define=="function"&&define.amd?define(["exports","@idm-plugin/tag","vue","@turf/turf","@mapbox/sphericalmercator","moment","mapbox-gl","@idm-plugin/geo","@idm-plugin/meteo","axios"],U):(D=typeof globalThis<"u"?globalThis:D||self,U(D["idm-gl"]={},D["@idm-plugin/tag"],D.Vue,D["@turf/turf"],D["@mapbox/sphericalmercator"],D.moment,D["mapbox-gl"],D["@idm-plugin/geo"],D["@idm-plugin/meteo"],D.axios))})(this,function(D,U,M,E0,T0,P,i0,x,u0,r0){"use strict";var Ib=Object.defineProperty;var Sb=(D,U,M)=>U in D?Ib(D,U,{enumerable:!0,configurable:!0,writable:!0,value:M}):D[U]=M;var H=(D,U,M)=>(Sb(D,typeof U!="symbol"?U+"":U,M),M);function x0(p){const b=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(p){for(const z in p)if(z!=="default"){const o=Object.getOwnPropertyDescriptor(p,z);Object.defineProperty(b,z,o.get?o:{enumerable:!0,get:()=>p[z]})}}return b.default=p,Object.freeze(b)}const y=x0(E0),Db="",vb="",S=(p,b)=>{const z=p.__vccOpts||p;for(const[o,O]of b)z[o]=O;return z},I0={name:"IdmGlLayer",props:{map:{type:Object},mapProjection:{type:String},top:{type:Number,default:60},layerToggle:{type:Boolean,default:!1},toggleVersion:{type:Number},isLogin:{type:Boolean,default:void 0},showWindFeather:{type:Boolean,default:void 0},showWindParticle:{type:Boolean,default:void 0},showCurrentIsoband:{type:Boolean,default:void 0},showCurrentParticle:{type:Boolean,default:void 0}},emits:["weather","other","toggleWindParticle","toggleWindFeather","toggleCurrentParticle","toggleCurrentIsoband","coordinate","measure","point","3d","layerToggle","handleToggleVersion","login"],data(){return{autoActive:!0,layers:{weather:[...U.LayerHelper.WEATHER_LAYERS.filter(p=>!["swell-height","swell-direction","current-direction","current-speed"].includes(p.key))],other:[...U.LayerHelper.OTHER_LAYERS.filter(p=>p.enabled)]},activeWeatherLayers:[],activeOtherLayers:[],autoActiveCache:"autoActiveCache",activeWeatherLayersCache:"activeWeatherLayersCache",activeOtherLayersCache:"activeOtherLayersCache",collectedLayerCache:"collectedLayerCache",sourceCache:"defaultSourceCache",windFeatherCache:"windFeatherCache",currentIsobandCache:"currentIsobandCache",showCoord:!1,showMeasure:!1,showPoint:!1,show3d:!1,version:{v:"0.0.9",k:"glCacheVersion"},source:"",right:10,rampColorLayers:["visibility","precip3h","temp","water-temp","arctic"]}},computed:{computeLayerClass(){return function(p,b){var o;let z="layer flex-between";return b.some(O=>O.key===p.key)&&(z=z+" active"),(!p.enabled||(o=this.layers.weather)!=null&&o.some(O=>O.key===p.key)&&!this.autoActive||this.rampColorLayers.includes(p.key)&&this.mapProjection==="globe")&&(z=z+" disabled"),z}},hasCollectedLayers(){var p;return((p=this.layers.weather.filter(b=>b.collected))==null?void 0:p.length)>0}},watch:{toggleVersion:{handler(){this.$nextTick(()=>{var p;this.right=(((p=document.getElementsByClassName("right-bar")[0])==null?void 0:p.clientWidth)||0)+10})}},source:{handler(p,b){p&&b&&p!==b&&this.handleConfirm()}}},mounted(){this.fetchCache(),this.handleConfirm()},methods:{fetchCache(){const p=localStorage.getItem(this.version.k);this.version.v!==p&&(localStorage.removeItem(this.activeWeatherLayersCache),localStorage.removeItem(this.collectedLayerCache),localStorage.removeItem(this.activeOtherLayersCache),localStorage.removeItem(this.windFeatherCache),localStorage.removeItem(this.currentIsobandCache),localStorage.setItem(this.version.k,this.version.v));let b=localStorage.getItem(this.autoActiveCache);this.autoActive=b!=="false",b=localStorage.getItem(this.collectedLayerCache);let z=JSON.parse(b||'[{"weight": 16, "name": "Sig Waves", "key": "sig-wave-height", "collected": true},{"weight": 1, "name": "Wind", "key": "wind", "h5": true, "collected": true},{"weight": 96, "name": "Current", "key": "current", "collected": true},{"weight": 256,"name": "Tropicals","key": "tropicals", "collected": true}]');this.layers.weather.forEach(o=>{o.collected=!!z.some(O=>O.key===o.key&&O.collected)}),b=localStorage.getItem(this.activeWeatherLayersCache),b||localStorage.setItem(this.activeWeatherLayersCache,JSON.stringify([{weight:1,name:"Wind",key:"wind",enabled:!0,type:"json",particle:!0},{weight:4096,name:"Pressure",key:"prmsl",enabled:!0,type:"json"},{weight:256,name:"Tropicals",key:"tropicals",enabled:!0,type:"json"}])),b=localStorage.getItem(this.activeWeatherLayersCache),z=JSON.parse(b),this.autoActive&&(this.activeWeatherLayers=[...z]),z.some(o=>o.key==="wind"&&o.particle)&&this.$emit("toggleWindParticle",!0),localStorage.getItem(this.windFeatherCache)==="true"&&this.$emit("toggleWindFeather",!0),z.some(o=>o.key==="current"&&o.particle)&&this.$emit("toggleCurrentParticle",!0),localStorage.getItem(this.currentIsobandCache)==="true"&&this.$emit("toggleCurrentIsoband",!0),b=localStorage.getItem(this.activeOtherLayersCache),z=JSON.parse(b||'[{"weight":4,"name":"ECA Zones","key":"eca-zones","enabled":true,"type":"json"}, {"weight": 2048,"name": "ENC","key": "enc","h5": true,"enabled": true,"type": "origin"}]'),this.activeOtherLayers=z,b=localStorage.getItem(this.sourceCache),this.source=b||"GFS"},handleConfirm(){this.$emit("weather",this.activeWeatherLayers,this.source),this.$emit("other",this.activeOtherLayers),localStorage.setItem(this.autoActiveCache,this.autoActive),localStorage.setItem(this.sourceCache,this.source)},handleWeatherLayerPick(p){if(this.activeWeatherLayers=JSON.parse(localStorage.getItem(this.activeWeatherLayersCache)),this.rampColorLayers.includes(p.key)&&this.mapProjection==="globe"||!this.autoActive)return!1;(p.key==="wind"&&!this.showWindFeather||p.key==="current"&&!this.showCurrentIsoband)&&(p.particle=!0),this.activeWeatherLayers.some(b=>b.key===p.key)?this.activeWeatherLayers=this.activeWeatherLayers.filter(b=>b.key!==p.key):this.activeWeatherLayers.length<6&&p.enabled&&(["png","jpg"].includes(p.type)?(this.activeWeatherLayers.forEach(b=>{(b.key==="wind"&&this.showWindFeather||p.key==="current"&&this.showCurrentIsoband)&&(b.particle=!1)}),this.activeWeatherLayers=this.activeWeatherLayers.filter(b=>b.type==="json"&&!(["wind","current"].includes(b.key)&&b.particle))):p.key==="wind"?(this.activeWeatherLayers.forEach(b=>{b.key==="current"&&this.showCurrentIsoband&&(b.particle=!1)}),this.activeWeatherLayers=this.activeWeatherLayers.filter(b=>b.type==="json"&&!(["wind","current"].includes(b.key)&&b.particle))):p.key==="current"&&(this.activeWeatherLayers.forEach(b=>{b.key==="wind"&&this.showWindFeather&&(b.particle=!1)}),this.activeWeatherLayers=this.activeWeatherLayers.filter(b=>b.type==="json"&&!(["wind","current"].includes(b.key)&&b.particle))),this.activeWeatherLayers.push(p)),this.$emit("weather",this.activeWeatherLayers,this.source),localStorage.setItem(this.activeWeatherLayersCache,JSON.stringify(this.activeWeatherLayers))},handleWeatherLayerCollect(p){var b;!p.collected&&((b=this.layers.weather.filter(z=>z.collected))==null?void 0:b.length)>=6&&(this.layers.weather.filter(z=>z.collected)[0].collected=!1),p.collected=!p.collected,localStorage.setItem(this.collectedLayerCache,JSON.stringify(this.layers.weather)),this.$emit("handleToggleVersion")},handleToggleWindParticle(){!this.showWindFeather&&this.showWindParticle?this.handleWeatherLayerPick({weight:1,name:"Wind",key:"wind",enabled:!0,type:"json",particle:!0}):(this.showCurrentParticle&&(this.$emit("toggleCurrentParticle",!1),this.showCurrentIsoband||(this.activeWeatherLayers=this.activeWeatherLayers.filter(p=>p.key!=="current"),localStorage.setItem(this.activeWeatherLayersCache,JSON.stringify(this.activeWeatherLayers)))),this.$emit("toggleWindParticle",!this.showWindParticle))},handleToggleWindFeather(){this.showWindFeather&&!this.showWindParticle&&this.handleWeatherLayerPick({weight:1,name:"Wind",key:"wind",enabled:!0,type:"json",particle:!0}),this.$emit("toggleWindFeather",!this.showWindFeather),localStorage.setItem(this.windFeatherCache,!this.showWindFeather)},handleToggleCurrentParticle(){!this.showCurrentIsoband&&this.showCurrentParticle?this.handleWeatherLayerPick({weight:96,name:"Current",key:"current",vendor:"cmems",merge:!0,h5:!0,enabled:!0}):(this.showWindParticle&&(this.$emit("toggleWindParticle",!1),this.showWindFeather||(this.activeWeatherLayers=this.activeWeatherLayers.filter(p=>p.key!=="wind"),localStorage.setItem(this.activeWeatherLayersCache,JSON.stringify(this.activeWeatherLayers)))),this.$emit("toggleCurrentParticle",!this.showCurrentParticle))},handleToggleCurrentIsoband(){this.showCurrentIsoband&&!this.showCurrentParticle&&this.handleWeatherLayerPick({weight:96,name:"Current",key:"current",vendor:"cmems",merge:!0,h5:!0,enabled:!0}),this.$emit("toggleCurrentIsoband",!this.showCurrentIsoband),localStorage.setItem(this.currentIsobandCache,!this.showCurrentIsoband)},handleOtherLayerPick(p){this.activeOtherLayers.some(b=>b.key===p.key)?this.activeOtherLayers=this.activeOtherLayers.filter(b=>b.key!==p.key):p.enabled&&this.activeOtherLayers.push(p),localStorage.setItem(this.activeOtherLayersCache,JSON.stringify(this.activeOtherLayers)),this.$emit("other",this.activeOtherLayers)},handleMenuToggle(){this.$emit("layerToggle",!this.layerToggle)},toggleAutoActive(){this.autoActive=!this.autoActive,localStorage.setItem(this.autoActiveCache,this.autoActive),this.autoActive?this.$emit("weather",this.activeWeatherLayers,this.source):this.$emit("weather",[],this.source)},handleCoordToggle(){this.showCoord=!this.showCoord,this.$emit("coordinate",this.showCoord)},handlePointToggle(){this.isLogin?(this.showPoint=!this.showPoint,this.$emit("point",this.showPoint)):this.$emit("login")},handleMeasureToggle(){this.showMeasure=!this.showMeasure,this.$emit("measure",this.showMeasure)},handle3DToggle(){this.show3d=!this.show3d,this.$emit("3d",this.show3d)}}},S0={class:"idm-gl3-layer"},D0={class:"bar-item layer-bars"},v0={class:"bar-item tool-bars"},P0={class:"flex-between"},k0={key:0,class:"iconfont active"},Q0={key:1,class:"iconfont"},H0=["onClick"],_0=["onClick"],j0={key:0,class:"flex-start"},F0={key:1,class:"flex-start"},V0={class:"header-box flex-between"},G0={class:"weather-layers card-bg"},U0={class:"layers-title flex-between"},K0={key:0,class:"iconfont active"},J0={key:1,class:"iconfont"},Y0={class:"layers-body"},Z0={class:"flex-start"},$0=["onClick"],M1=["onClick"],b1={key:0,class:"flex-start"},z1={key:1,class:"flex-start"},p1=["onClick"],O1={key:0,class:"iconfont bookmark-icon active"},o1={key:1,class:"iconfont bookmark-icon inactive"},c1={class:"other-layers card-bg"},e1={class:"layers-body"},A1=["onClick"],t1={class:"flex-start"},a1={class:"switch flex-center"},q1={key:0,class:"iconfont active"},i1={key:1,class:"iconfont"},r1={class:"source-layers card-bg"},n1={class:"layers-body"};function d1(p,b,z,o,O,c){const e=M.resolveComponent("ElTooltip"),t=M.resolveComponent("ElRadio"),q=M.resolveComponent("ElRadioGroup"),r=M.resolveComponent("ElScrollbar");return M.openBlock(),M.createElementBlock("div",S0,[M.createElementVNode("div",{class:"menu-bar-box",style:M.normalizeStyle({top:z.top+10+"px",right:O.right+"px"})},[M.createElementVNode("div",D0,[M.createVNode(e,{placement:"left",effect:"light",content:"Menu","show-after":1e3},{default:M.withCtx(()=>[M.createElementVNode("div",{class:M.normalizeClass(z.layerToggle?"menu-icon active":"menu-icon"),onClick:b[0]||(b[0]=(...a)=>c.handleMenuToggle&&c.handleMenuToggle(...a))},b[17]||(b[17]=[M.createElementVNode("span",{class:"iconfont"},"",-1)]),2)]),_:1})])],4),M.createElementVNode("div",{class:"menu-bar-box",style:M.normalizeStyle({top:z.top+160+"px",right:O.right+"px"})},[M.createElementVNode("div",v0,[M.createVNode(e,{placement:"left",effect:"light",content:"Measure","show-after":1e3},{default:M.withCtx(()=>[M.createElementVNode("div",{class:M.normalizeClass(O.showMeasure?"menu-icon active":"menu-icon"),onClick:b[1]||(b[1]=(...a)=>c.handleMeasureToggle&&c.handleMeasureToggle(...a))},b[18]||(b[18]=[M.createElementVNode("span",{class:"iconfont"},"",-1)]),2)]),_:1}),M.createVNode(e,{placement:"left",effect:"light",content:"Point Meteo","show-after":1e3},{default:M.withCtx(()=>[M.createElementVNode("div",{class:M.normalizeClass(O.showPoint?"menu-icon active":"menu-icon"),onClick:b[2]||(b[2]=(...a)=>c.handlePointToggle&&c.handlePointToggle(...a))},b[19]||(b[19]=[M.createElementVNode("span",{class:"iconfont"},"",-1)]),2)]),_:1}),M.createVNode(e,{placement:"left",effect:"light",content:"Grid","show-after":1e3},{default:M.withCtx(()=>[M.createElementVNode("div",{class:M.normalizeClass(O.showCoord?"menu-icon active":"menu-icon"),onClick:b[3]||(b[3]=(...a)=>c.handleCoordToggle&&c.handleCoordToggle(...a))},b[20]||(b[20]=[M.createElementVNode("span",{class:"iconfont"},"",-1)]),2)]),_:1}),M.createVNode(e,{placement:"left",effect:"light",content:"3D","show-after":1e3},{default:M.withCtx(()=>[M.createElementVNode("div",{class:M.normalizeClass(O.show3d?"menu-icon active":"menu-icon"),onClick:b[4]||(b[4]=(...a)=>c.handle3DToggle&&c.handle3DToggle(...a))},b[21]||(b[21]=[M.createElementVNode("span",{class:"iconfont"},"",-1)]),2)]),_:1})])],4),c.hasCollectedLayers?(M.openBlock(),M.createElementBlock("div",{key:0,class:"active-layers",style:M.normalizeStyle({right:O.right+"px",bottom:"100px"})},[M.createElementVNode("div",P0,[b[22]||(b[22]=M.createElementVNode("div",{style:{margin:"2px 5px"}},"Weather Layers",-1)),M.createElementVNode("div",{class:"switch flex-center",style:{"font-size":"28px","margin-right":"0"},onClick:b[5]||(b[5]=(...a)=>c.toggleAutoActive&&c.toggleAutoActive(...a))},[O.autoActive?(M.openBlock(),M.createElementBlock("i",k0,"")):(M.openBlock(),M.createElementBlock("i",Q0,""))])]),(M.openBlock(!0),M.createElementBlock(M.Fragment,null,M.renderList(O.layers.weather.filter(a=>a.collected),a=>(M.openBlock(),M.createElementBlock("div",{key:a.key,class:M.normalizeClass(c.computeLayerClass(a,O.activeWeatherLayers))},[M.createElementVNode("div",{class:"checkbox",onClick:n=>c.handleWeatherLayerPick(a)},null,8,H0),M.createElementVNode("span",{class:"name",onClick:n=>c.handleWeatherLayerPick(a)},M.toDisplayString(a.name),9,_0),a.key==="wind"&&O.activeWeatherLayers.some(n=>n.key===a.key)?(M.openBlock(),M.createElementBlock("div",j0,[M.createElementVNode("i",{class:M.normalizeClass(["iconfont sub-layer-icon",z.showWindParticle?"active":""]),onClick:b[6]||(b[6]=n=>c.handleToggleWindParticle())},"",2),M.createElementVNode("i",{class:M.normalizeClass(["iconfont sub-layer-icon",z.showWindFeather?"active":""]),onClick:b[7]||(b[7]=n=>c.handleToggleWindFeather())},"",2)])):M.createCommentVNode("",!0),a.key==="current"&&O.activeWeatherLayers.some(n=>n.key===a.key)?(M.openBlock(),M.createElementBlock("div",F0,[M.createElementVNode("i",{class:M.normalizeClass(["iconfont sub-layer-icon",z.showCurrentParticle?"active":""]),onClick:b[8]||(b[8]=n=>c.handleToggleCurrentParticle())},"",2),M.createElementVNode("i",{class:M.normalizeClass(["iconfont sub-layer-icon",z.showCurrentIsoband?"active":""]),onClick:b[9]||(b[9]=n=>c.handleToggleCurrentIsoband())},"",2)])):M.createCommentVNode("",!0)],2))),128))],4)):M.createCommentVNode("",!0),M.createElementVNode("div",{class:"available-layers flex-center",style:M.normalizeStyle({top:z.top+"px",right:z.layerToggle?"0px":"-240px"})},[M.createElementVNode("div",{class:M.normalizeClass(["list-box",z.layerToggle?"right-bar":""])},[M.createElementVNode("div",V0,[b[23]||(b[23]=M.createElementVNode("div",null,"Layers",-1)),M.createElementVNode("div",{class:"iconfont close-btn",onClick:b[10]||(b[10]=(...a)=>c.handleMenuToggle&&c.handleMenuToggle(...a))},"")]),M.createVNode(r,{style:{flex:"1"}},{default:M.withCtx(()=>[M.createElementVNode("div",G0,[M.createElementVNode("div",U0,[b[24]||(b[24]=M.createElementVNode("div",null,"Weather Layers",-1)),M.createElementVNode("div",{class:"switch flex-center",style:{"margin-right":"0"},onClick:b[11]||(b[11]=(...a)=>c.toggleAutoActive&&c.toggleAutoActive(...a))},[O.autoActive?(M.openBlock(),M.createElementBlock("i",K0,"")):(M.openBlock(),M.createElementBlock("i",J0,""))])]),M.createElementVNode("div",Y0,[(M.openBlock(!0),M.createElementBlock(M.Fragment,null,M.renderList(O.layers.weather,a=>(M.openBlock(),M.createElementBlock(M.Fragment,{key:a.key},[a.hide?M.createCommentVNode("",!0):(M.openBlock(),M.createElementBlock("div",{key:0,class:M.normalizeClass(c.computeLayerClass(a,O.activeWeatherLayers))},[M.createElementVNode("div",Z0,[M.createElementVNode("div",{class:"checkbox",onClick:n=>c.handleWeatherLayerPick(a)},null,8,$0),M.createElementVNode("span",{class:"name",onClick:n=>c.handleWeatherLayerPick(a)},M.toDisplayString(a.name),9,M1),a.key==="wind"&&O.activeWeatherLayers.some(n=>n.key===a.key)?(M.openBlock(),M.createElementBlock("div",b1,[M.createElementVNode("i",{class:M.normalizeClass(["iconfont sub-layer-icon",z.showWindParticle?"active":""]),onClick:b[12]||(b[12]=n=>c.handleToggleWindParticle())},"",2),M.createElementVNode("i",{class:M.normalizeClass(["iconfont sub-layer-icon",z.showWindFeather?"active":""]),onClick:b[13]||(b[13]=n=>c.handleToggleWindFeather())},"",2)])):M.createCommentVNode("",!0),a.key==="current"&&O.activeWeatherLayers.some(n=>n.key===a.key)?(M.openBlock(),M.createElementBlock("div",z1,[M.createElementVNode("i",{class:M.normalizeClass(["iconfont sub-layer-icon",z.showCurrentParticle?"active":""]),onClick:b[14]||(b[14]=n=>c.handleToggleCurrentParticle())},"",2),M.createElementVNode("i",{class:M.normalizeClass(["iconfont sub-layer-icon",z.showCurrentIsoband?"active":""]),onClick:b[15]||(b[15]=n=>c.handleToggleCurrentIsoband())},"",2)])):M.createCommentVNode("",!0)]),M.createElementVNode("div",{onClick:n=>c.handleWeatherLayerCollect(a)},[a.collected?(M.openBlock(),M.createElementBlock("i",O1,"")):(M.openBlock(),M.createElementBlock("i",o1,""))],8,p1)],2))],64))),128)),b[25]||(b[25]=M.createElementVNode("div",{class:"tip flex-start"},[M.createElementVNode("i",{class:"iconfont bookmark-icon",style:{"align-self":"flex-start",padding:"5px 5px 0 0"}},""),M.createElementVNode("div",null,"You can add the layers to your favorites. (Max 6)")],-1))])]),M.createElementVNode("div",c1,[b[26]||(b[26]=M.createElementVNode("div",{class:"layers-title"},"Other Layers",-1)),M.createElementVNode("div",e1,[(M.openBlock(!0),M.createElementBlock(M.Fragment,null,M.renderList(O.layers.other,a=>{var n;return M.openBlock(),M.createElementBlock("div",{key:a.key,class:M.normalizeClass(["layer flex-between",c.computeLayerClass(a,O.activeOtherLayers)]),onClick:s=>c.handleOtherLayerPick(a)},[M.createElementVNode("div",t1,[M.createElementVNode("div",a1,[(n=c.computeLayerClass(a,O.activeOtherLayers))!=null&&n.includes("active")?(M.openBlock(),M.createElementBlock("i",q1,"")):(M.openBlock(),M.createElementBlock("i",i1,""))]),M.createElementVNode("span",null,M.toDisplayString(a.name),1)])],10,A1)}),128))])]),M.createElementVNode("div",r1,[b[29]||(b[29]=M.createElementVNode("span",{class:"layers-title"},"Forecast Model",-1)),M.createElementVNode("div",n1,[M.createVNode(q,{modelValue:O.source,"onUpdate:modelValue":b[16]||(b[16]=a=>O.source=a),class:"layer-radio flex-col-center-start"},{default:M.withCtx(()=>[M.createVNode(t,{value:"GFS"},{default:M.withCtx(()=>b[27]||(b[27]=[M.createTextVNode("GFS")])),_:1}),M.createVNode(t,{value:"CMEMS"},{default:M.withCtx(()=>b[28]||(b[28]=[M.createTextVNode("CMEMS")])),_:1})]),_:1},8,["modelValue"])])])]),_:1})],2)],4)])}const s1=S(I0,[["render",d1]]),Pb="",W1={name:"IdmWindBarb",props:{map:{type:Object},wind:{type:Object},current:{type:Object},beforeLayer:{type:String},mapProjection:{type:String},showWindFeather:{type:Boolean,default:!1},showWindParticle:{type:Boolean,default:!1},toggleVersion:{type:Number}},emits:["particle","showWindFeather"],data(){return{source:"wind-barb-source",barbs:[0,2,5,10,15,20,25,30,35,40,45,50,55,60,65,70,75,80,85,90,95,100,105],empty:y.featureCollection([]),right:10,bottom:125,windBarbLoaded:!1}},watch:{"wind.version":{handler(){var p;(p=this.wind)!=null&&p.active&&this.showWindFeather?this.handleRender():this.handleClear()},deep:!0},showWindParticle:{handler(){this.handleParticle()}},showWindFeather:{handler(){this.handleToggle()}}},methods:{handleParticle(){this.$emit("particle",{particle:this.showWindParticle,key:"wind",weight:1})},handleRender(){var p,b,z,o;if(!this.map)setTimeout(()=>{this.handleRender()},500);else if(this.wind){const O=new Date().valueOf();let c=0,e=0,t=this.empty;if((p=this.wind)!=null&&p.active&&(t=(b=this.wind)==null?void 0:b.data),(z=this.map)!=null&&z.getSource(this.source))(o=this.map)==null||o.getSource(this.source).setData(t),e=new Date().valueOf()-(O+c),console.log("[wind] update elapsed: ",e,", total: ",c+=e);else{this.map.addSource(this.source,{type:"geojson",data:t});for(let q=0;q<(this.barbs??[]).length-1;q++){const r=(this.barbs??[])[q]||0,a=(this.barbs??[])[q+1]||0,n=r<10?`00${r}kts`:r<100?`0${r}kts`:`${r}kts`;this.map.addLayer({id:n,type:"symbol",filter:["all",[">=","spd",r],["<","spd",a]],source:this.source,layout:{"symbol-placement":"point","icon-image":n,"icon-size":.14,"icon-offset":[0,-20],"icon-allow-overlap":!0,"icon-rotation-alignment":"map","icon-rotate":{property:"val",stops:[[0,0],[360,360]]}},paint:{"icon-opacity":1,"text-color":"#222"}},this.beforeLayer)}this.windBarbLoaded=!0,e=new Date().valueOf()-(O+c),console.log("[wind] add elapsed: ",e,", total: ",c+=e)}}},handleToggle(){if(!this.windBarbLoaded)this.handleRender();else for(const p of this.barbs??[]){const b=p<10?`00${p}kts`:p<100?`0${p}kts`:`${p}kts`;this.map.getLayer(b)&&this.map.setLayoutProperty(b,"visibility",this.showWindFeather?"visible":"none")}},handleClear(){for(const p of this.barbs??[]){const b=p<10?`00${p}kts`:p<100?`0${p}kts`:`${p}kts`;this.map.getLayer(b)&&this.map.removeLayer(b)}this.map.getSource(this.source)&&this.map.removeSource(this.source),this.windBarbLoaded=!1}}},l1={key:0};function f1(p,b,z,o,O,c){var e;return(e=z.wind)!=null&&e.active?(M.openBlock(),M.createElementBlock("div",l1)):M.createCommentVNode("",!0)}const L1=S(W1,[["render",f1]]);class l0{constructor(b){H(this,"map");H(this,"mercator");H(this,"rampColorLayer");H(this,"rampColorSource");H(this,"particleLayer");H(this,"particleSource");H(this,"rampColorCanvas");H(this,"particleCanvas");H(this,"ratio");this.map=b,this.mercator=new T0,this.rampColorLayer="ramp-color-layer",this.rampColorSource="ramp-color-source",this.particleLayer="particle-layer",this.particleSource="particle-source",this.rampColorCanvas=document.createElement("canvas"),this.particleCanvas=document.createElement("canvas"),this.ratio=window.devicePixelRatio}convertNLng(b,z=0){return b>180?this.convertNLng(b-360,z+1):b<-180?this.convertNLng(b+360,z+1):[b,z]}getBoundLngLat(){const b=this.map.getBounds();return[[b._sw.lng,b._ne.lat],[b._ne.lng,b._ne.lat],[b._ne.lng,b._sw.lat],[b._sw.lng,b._sw.lat]]}getBoundPixel(){const b=this.map.getBounds(),z=this.map.getZoom()+1,o=[b._ne.lng,b._ne.lat],O=[b._sw.lng,b._sw.lat],[c,e]=this.convertNLng(o[0]),[t,q]=this.convertNLng(O[0]),[r,a]=this.mercator.px([c,o[1]],z),[n,s]=this.mercator.px([t,O[1]],z),d=Math.round(this.mercator.size*Math.pow(2,z)*(e+q));return[n,s,r+d,a]}getBoundRange(){const b=this.map.getZoom()+1,z=this.mercator.size*Math.pow(2,b),o=this.getBoundPixel();return[o[0]/z,o[2]/z,o[3]/z,o[1]/z]}getWorldCopy(b,z){const o=2**z,[O,c,e,t]=b.map(a=>~~(a/(o*256))),q=[];for(let a=t;a<=c;a++)for(let n=O;n<=e;n++)q.push([n,a]);return q.map(a=>{const n=2**z*256;return[a[0]*n,a[1]*n,n]})}resize(){let b=this.map.getSource(this.rampColorSource);b.setCoordinates(this.getBoundLngLat()),b=this.map.getSource(this.particleSource),b.setCoordinates(this.getBoundLngLat()),this.rampColorCanvas.width=this.map._canvas.clientWidth,this.rampColorCanvas.height=this.map._canvas.clientHeight,this.particleCanvas.width=this.map._canvas.clientWidth,this.particleCanvas.height=this.map._canvas.clientHeight}toggle(b){const z=this.map.getLayoutProperty(this.rampColorLayer,"visibility"),o=b?"visible":"none";z!==o&&this.map.setLayoutProperty(this.rampColorLayer,"visibility",o)}toggleParticle(b){const z=this.map.getLayoutProperty(this.particleLayer,"visibility"),o=b?"visible":"none";z!==o&&this.map.setLayoutProperty(this.particleLayer,"visibility",o)}}class W0{createShader(b,z,o){const O=b.createShader(z);if(O&&(b.shaderSource(O,o),b.compileShader(O),!b.getShaderParameter(O,b.COMPILE_STATUS)))throw new Error(b.getShaderInfoLog(O)||"error happened while create shader...");return O}createTexture(b,z,o,O,c,e,t){const q=b.createTexture();return b.bindTexture(b.TEXTURE_2D,q),b.texParameteri(b.TEXTURE_2D,b.TEXTURE_MIN_FILTER,z),b.texParameteri(b.TEXTURE_2D,b.TEXTURE_MAG_FILTER,o),b.texParameteri(b.TEXTURE_2D,b.TEXTURE_WRAP_S,O),b.texParameteri(b.TEXTURE_2D,b.TEXTURE_WRAP_T,O),c instanceof Uint8Array?b.texImage2D(b.TEXTURE_2D,0,b.RGBA,e,t,0,b.RGBA,b.UNSIGNED_BYTE,c):b.texImage2D(b.TEXTURE_2D,0,b.RGBA,b.RGBA,b.UNSIGNED_BYTE,c),b.bindTexture(b.TEXTURE_2D,null),q}createDataBuffer(b,z,o){if(b){const O=b.createBuffer();return z==="array"?(b.bindBuffer(b.ARRAY_BUFFER,O),o&&b.bufferData(b.ARRAY_BUFFER,o,b.STATIC_DRAW)):z==="element"&&(b.bindBuffer(b.ELEMENT_ARRAY_BUFFER,O),o&&b.bufferData(b.ELEMENT_ARRAY_BUFFER,o,b.STATIC_DRAW)),O}return null}createProgram(b,z,o){const O=b.createProgram(),c=this.createShader(b,b.VERTEX_SHADER,z),e=this.createShader(b,b.FRAGMENT_SHADER,o);if(O&&c&&e&&(b.attachShader(O,c),b.attachShader(O,e),b.linkProgram(O),!b.getProgramParameter(O,b.LINK_STATUS)))throw new Error(b.getProgramInfoLog(O)||"error happened while creating ramp color program");return O}createProgramWrapper(b,z,o){const O=this.createProgram(b,z,o);if(O){const c={program:O},e=b.getProgramParameter(O,b.ACTIVE_ATTRIBUTES);for(let q=0;q<e;q++){const r=b.getActiveAttrib(O,q);c[r.name]=b.getAttribLocation(O,r.name)}const t=b.getProgramParameter(O,b.ACTIVE_UNIFORMS);for(let q=0;q<t;q++){const r=b.getActiveUniform(O,q);c[r.name]=b.getUniformLocation(O,r.name)}return c}}setup(b,z,o=!1,O,c){const e=document.createElement("canvas");e.width=256,e.height=1;const t=e.getContext("2d");if(t&&b){const q=t==null?void 0:t.createLinearGradient(0,0,256,0);return z.forEach(([r,a])=>{q.addColorStop(r,a)}),t.fillStyle=q,t.fillRect(0,0,256,1),{canvas:e,texture:this.createTexture(b,b.LINEAR,b.LINEAR,b.CLAMP_TO_EDGE,o?new Uint8Array(t.getImageData(0,0,256,1).data):e,O,c)}}}setupParticle(b,z=1e3){const o=Math.ceil(Math.sqrt(z)),O=o*o,c=new Uint8Array(O*4);for(let a=0;a<c.length;a++)c[a]=Math.floor(Math.random()*256);const e=this.createTexture(b,b.NEAREST,b.NEAREST,b.CLAMP_TO_EDGE,c,o,o),t=this.createTexture(b,b.NEAREST,b.NEAREST,b.CLAMP_TO_EDGE,c,o,o),q=new Float32Array(O);for(let a=0;a<O;a++)q[a]=a;const r=this.createDataBuffer(b,"array",q);return{resolution:o,total:O,texture0:e,texture1:t,indexBuffer:r}}bind(b,z,o){const O=this.createProgram(b,z,o);if(O){const c=this.createDataBuffer(b,"array",void 0),e=b.getAttribLocation(O,"a_position");b.enableVertexAttribArray(e),b.vertexAttribPointer(e,2,b.FLOAT,!1,0,0);const t=new Float32Array([0,0,1,0,0,1,0,1,1,0,1,1]);this.createDataBuffer(b,"array",t);const q=b.getAttribLocation(O,"a_texCoord");return b.enableVertexAttribArray(q),b.vertexAttribPointer(q,2,b.FLOAT,!1,0,0),{program:O,aPositionBuffer:c}}return{}}bindParticle(b,z,o,O,c,e){const t=this.createProgramWrapper(b,z,o),q=this.createProgramWrapper(b,O,c),r=this.createProgramWrapper(b,O,e),a=this.createDataBuffer(b,"array",new Float32Array([0,0,1,0,0,1,0,1,1,0,1,1])),n=b.createFramebuffer();return{particle:t,screen:q,update:r,quadBuffer:a,frameBuffer:n}}draw(b,z,o,O,c,e,t){var q,r;if(z&&o){b.resize(),z==null||z.viewport(0,0,(q=z==null?void 0:z.canvas)==null?void 0:q.width,(r=z==null?void 0:z.canvas)==null?void 0:r.height),z.clearColor(0,0,0,0),z.clear(z.COLOR_BUFFER_BIT|z.DEPTH_BUFFER_BIT);try{const a=z.getUniformLocation(o,"u_resolution"),n=z.getUniformLocation(o,"u_image"),s=z.getUniformLocation(o,"u_color");if(z.useProgram(o),z.uniform2f(a,z.canvas.width*b.ratio,z.canvas.height*b.ratio),z.activeTexture(z.TEXTURE0),z.bindTexture(z.TEXTURE_2D,O),z.uniform1i(n,0),z.activeTexture(z.TEXTURE1),z.bindTexture(z.TEXTURE_2D,c),z.uniform1i(s,1),t!=null&&t.uvRange&&(t!=null&&t.sRange)){const W=z.getUniformLocation(o,"u_range_u_v"),R=z.getUniformLocation(o,"u_range_s");z.uniform2f(W,t.uvRange[0],t.uvRange[1]),z.uniform2f(R,t.sRange[0],t.sRange[1])}const d=b.getBoundPixel(),h=b.map.getZoom()+1,f=b.getWorldCopy(d,h);for(const W of f){const R=(W[0]-d[0])*b.ratio,L=(W[1]-d[3])*b.ratio,g=W[2]*b.ratio,[X,B,v,Q]=[R,g+R,L,g+L],_=new Float32Array([X,v,B,v,X,Q,X,Q,B,v,B,Q]);z.bindBuffer(z.ARRAY_BUFFER,e),z.bufferData(z.ARRAY_BUFFER,_,z.STATIC_DRAW),z.drawArrays(z.TRIANGLES,0,6)}}catch(a){console.log(`render failed...${a}`)}}}drawParticle(b,z,o,O,c){var e,t;z&&(z==null||z.viewport(0,0,(e=z==null?void 0:z.canvas)==null?void 0:e.width,(t=z==null?void 0:z.canvas)==null?void 0:t.height),z.disable(z.DEPTH_TEST),z.disable(z.STENCIL_TEST),z.activeTexture(z.TEXTURE0),z.bindTexture(z.TEXTURE_2D,o),z.activeTexture(z.TEXTURE1),z.bindTexture(z.TEXTURE_2D,O.texture0),this.renderScreen(b,z,O,c),this.updateParticles(b,z,O,c))}renderScreen(b,z,o,O){z.bindFramebuffer(z.FRAMEBUFFER,o.frameBuffer),z.framebufferTexture2D(z.FRAMEBUFFER,z.COLOR_ATTACHMENT0,z.TEXTURE_2D,o.screenTexture,0),z.viewport(0,0,z.canvas.width,z.canvas.height),this.renderScreenTexture(z,o.backgroundTexture,o.screen,o.quadBuffer,.95),this.renderParticles(b,z,o,O),z.bindFramebuffer(z.FRAMEBUFFER,null),this.renderScreenTexture(z,o.screenTexture,o.screen,o.quadBuffer,1);const c=o.backgroundTexture;o.backgroundTexture=o.screenTexture,o.screenTexture=c}renderScreenTexture(b,z,o,O,c){b&&(b.useProgram(o.program),b.bindBuffer(b.ARRAY_BUFFER,O),b.enableVertexAttribArray(o.a_pos),b.vertexAttribPointer(o.a_pos,2,b.FLOAT,!1,0,0),b.activeTexture(b.TEXTURE2),b.bindTexture(b.TEXTURE_2D,z),b.uniform1i(o.u_screen,2),b.uniform1f(o.u_opacity,c),b.drawArrays(b.TRIANGLES,0,6))}renderParticles(b,z,o,O){if(z){z.useProgram(o.particle.program),z.bindBuffer(z.ARRAY_BUFFER,o.indexBuffer),z.enableVertexAttribArray(o.particle.a_index),z.vertexAttribPointer(o.particle.a_index,1,z.FLOAT,!1,0,0),z.activeTexture(z.TEXTURE2),z.bindTexture(z.TEXTURE_2D,o.color.texture),z.uniform1i(o.particle.u_factor,0),z.uniform1i(o.particle.u_particles,1),z.uniform1i(o.particle.u_color_ramp,2),z.uniform1f(o.particle.u_particles_resolution,o.resolution*b.ratio),z.uniform1f(o.particle.u_point,b.ratio);const c=b.getBoundRange();z.uniform4f(o.particle.u_viewport,c[0],c[1],c[2],c[3]),z.uniform2f(o.particle.u_factor_min,O.uvRange[0],O.uvRange[0]),z.uniform2f(o.particle.u_factor_max,O.uvRange[1],O.uvRange[1]),z.drawArrays(z.POINTS,0,o.total)}}updateParticles(b,z,o,O){var e,t;if(z){z.bindFramebuffer(z.FRAMEBUFFER,o.frameBuffer),z.framebufferTexture2D(z.FRAMEBUFFER,z.COLOR_ATTACHMENT0,z.TEXTURE_2D,o.texture1,0),z.viewport(0,0,o.resolution,o.resolution),z.useProgram(o.update.program),z.bindBuffer(z.ARRAY_BUFFER,o.quadBuffer),z.enableVertexAttribArray(o.update.a_pos),z.vertexAttribPointer(o.update.a_pos,2,z.FLOAT,!1,0,0),z.uniform1i(o.update.u_factor,0),z.uniform1i(o.update.u_particles,1);const q=b.getBoundRange();z.uniform4f(o.update.u_viewport,q[0],q[1],q[2],q[3]),z.uniform1f(o.update.u_rand_seed,Math.random()),z.uniform2f(o.update.u_factor_res,(e=o==null?void 0:o.image)==null?void 0:e.width,(t=o==null?void 0:o.image)==null?void 0:t.height),z.uniform2f(o.update.u_factor_min,O.uvRange[0],O.uvRange[0]),z.uniform2f(o.update.u_factor_max,O.uvRange[1],O.uvRange[1]),z.uniform1f(o.update.u_speed_factor,O.speedFactor*b.ratio),z.uniform1f(o.update.u_drop_rate,O.dropRate),z.uniform1f(o.update.u_drop_rate_bump,O.dropRateBump),z.drawArrays(z.TRIANGLES,0,6)}const c=o.texture0;o.texture0=o.texture1,o.texture1=c}resize(b,z){b.resize();const o=new Uint8Array(z.canvas.width*z.canvas.height*4).fill(0,0,z.canvas.width*z.canvas.height*4),O=this.createTexture(z,z.NEAREST,z.NEAREST,z.CLAMP_TO_EDGE,o,z.canvas.width,z.canvas.height),c=this.createTexture(z,z.NEAREST,z.NEAREST,z.CLAMP_TO_EDGE,o,z.canvas.width,z.canvas.height);return{screenTexture:O,backgroundTexture:c}}async loadImg(b){return new Promise(z=>{const o=new Blob([b],{type:b.type}),O=URL.createObjectURL(o),c=new Image;c.crossOrigin="anonymous",c.src=O,c.onload=()=>z(c)})}}class K{}H(K,"vertexSchema",`
|
|
2
2
|
//canvas 坐标系上的坐标 (x, y)
|
|
3
3
|
attribute vec2 a_position; //像素坐标
|
|
4
4
|
attribute vec2 a_texCoord; //纹理坐标
|