@pirireis/webglobeplugins 0.15.22-alpha → 0.15.24

package/semiplugins/shape-on-terrain/arc-plugin.js

@@ -7,6 +7,7 @@ import { globe3Dcoordinates, globe2Dcoordinates, RADIANS } from "../../Math/meth
 import { generateArcPoints, evenlySpacedArcPoints } from "../../Math/arc-cdf-points";
 import { StaticDynamicState, StaticDynamicStrategy } from "../../util/build-strategy/static-dynamic";
 import { opacityCheck } from "../../util/check/typecheck";
+import { FrameCounterTrigger } from "../../util/frame-counter-trigger";
 import * as vec3 from "../../Math/vec3";
 import * as arc from "../../Math/arc";
 import { CameraUniformBlockTotemCache } from "../../programs/totems/camerauniformblock";
@@ -17,11 +18,16 @@ const _attractionPoint = [0, 0, 0];
 const _start = [0, 0, 0];
 const _end = [0, 0, 0];
 const _0arc = arc.create([1, 0, 0], [0, 1, 0]); // zero arc for intersection tests
+function createArc(start, end) {
+    vec3.fromLongLatToUnitVector(_start, [start[0] * RADIANS, start[1] * RADIANS]);
+    vec3.fromLongLatToUnitVector(_end, [end[0] * RADIANS, end[1] * RADIANS]);
+    return arc.create(_start, _end);
+}
 export class ArcOnTerrainPlugin {
     id;
     program = null;
-    bufferManagerMap = null;
-    _bufferOrchestrator = new BufferOrchestrator({ capacity: INITAL_CAPACITY });
+    bufferManagersMap = null;
+    bufferOrchestrator = new BufferOrchestrator({ capacity: INITAL_CAPACITY });
     _opacity = 1;
     _arcUBOHandler = null;
     _vao = null;
@@ -33,6 +39,7 @@ export class ArcOnTerrainPlugin {
     _options;
     _coordinaateBufferKeysForUpdate = [];
     _freed = false;
+    _frameCounterTrigger = null;
     constructor(id, { globeViewOn = true, // If true, arcs are drawn in 3D globe view
     flatViewOn = true, // If true, arcs are drawn in 2D flat view
     variativeColorsOn = false, defaultColor = [0.1, 0.1, 1, 1], // Default color in RGBA format
@@ -54,24 +61,69 @@ export class ArcOnTerrainPlugin {
             isMSL: isMSL ? true : false
         };
     }
+    increaseSpace(amount) {
+        if (this._freed) {
+            console.warn("Plugin is freed, cannot increase space");
+            return;
+        }
+        if (this.globe === null) {
+            console.warn("Globe is not initialized.");
+            return;
+        }
+        if (typeof amount !== "number" || amount <= 0) {
+            console.warn("Invalid amount, must be a positive number");
+            return;
+        }
+        this.bufferOrchestrator.ensureSpace(amount, this.bufferManagersMap);
+    }
     insertBulk(arcs) {
         const keys = [];
+        let newItemCount = 0;
         for (let arcInput of arcs) {
             const { key, start, end } = arcInput;
             if (this._arcMap.has(key)) {
-                this._arcMap.delete(key);
+                this._arcMap.delete(key); // Remove old arc
+            }
+            else {
+                newItemCount++;
             }
-            vec3.fromLongLatToUnitVector(_start, [start[0] * RADIANS, start[1] * RADIANS]);
-            vec3.fromLongLatToUnitVector(_end, [end[0] * RADIANS, end[1] * RADIANS]);
-            const _arc = arc.create(_start, _end);
-            this._arcMap.set(key, [_arc, arcInput]); // height is null for now
+            const _arc = createArc(start, end);
+            this._arcMap.set(key, [_arc, arcInput]); // Always set new color
             keys.push(key);
         }
-        this.__buildStaticArcs(keys, true);
+        this.bufferOrchestrator.ensureSpace(newItemCount, this.bufferManagersMap);
+        this._buildArcs(keys);
+        if (this._options.variativeColorsOn) {
+            this.__fillColors(keys);
+        }
+        this.globe.DrawRender();
+    }
+    updateCoordinates(items) {
+        if (this._freed) {
+            console.warn("Plugin is freed, cannot update coordinates");
+            return;
+        }
+        if (this.globe === null || this.gl === null) {
+            console.warn("Globe or WebGL context is not initialized, cannot update coordinates");
+            return;
+        }
+        const updateKeys = [];
+        for (const { key, start, end } of items) {
+            const arcInput = this._arcMap.get(key);
+            if (!arcInput) {
+                console.warn(`Arc with key ${key} not found in arcMap.`);
+                continue;
+            }
+            const _arc = createArc(start, end);
+            arc.copy(arcInput[0], _arc); // Update the arc in the map
+            // Update the arc in the buffer
+            updateKeys.push(key);
+        }
+        this._buildArcs(updateKeys);
         this.globe.DrawRender();
     }
     deleteBulk(keys) {
-        if (!this._bufferOrchestrator || !this.bufferManagerMap || !this.globe) {
+        if (!this.bufferOrchestrator || !this.bufferManagersMap || !this.globe) {
             console.warn("Buffer orchestrator or buffer manager map is not initialized.");
             return;
         }
@@ -83,27 +135,35 @@ export class ArcOnTerrainPlugin {
                 console.warn(`Arc with key ${key} not found in arcMap.`);
             }
         }
-        this._bufferOrchestrator.deleteBulk(keys, this.bufferManagerMap);
+        this.bufferOrchestrator.deleteBulk(keys, this.bufferManagersMap);
         this.globe.DrawRender();
     }
-    updateColor(key, color) {
+    updateColors(keyColorCouples, drawRender = true) {
+        if (this._freed) {
+            console.warn("Plugin is freed, cannot update color");
+            return;
+        }
         if (this._options.variativeColorsOn === false) {
             console.warn("Variative colors are not enabled in this plugin. Create another instance with variativeColorsOn: true to use this feature.");
             return;
         }
-        const { _bufferOrchestrator, bufferManagerMap } = this;
-        if (!_bufferOrchestrator || !bufferManagerMap) {
+        const { bufferOrchestrator, bufferManagersMap } = this;
+        if (!bufferOrchestrator || !bufferManagersMap) {
             console.warn("Buffer orchestrator or buffer manager map is not initialized.");
             return;
         }
-        const arcInput = this._arcMap.get(key);
-        if (!arcInput) {
-            console.warn(`Arc with key ${key} not found in arcMap.`);
-            return;
+        for (const { key, color } of keyColorCouples) {
+            const arcInput = this._arcMap.get(key);
+            if (!arcInput) {
+                console.warn(`Arc with key ${key} not found in arcMap.`);
+                return;
+            }
+            arcInput[1].color = color; // Update the color in the arc map
+            bufferOrchestrator.updateBulk([{ key: key, color: color }], bufferManagersMap, ["color"]);
+        }
+        if (drawRender) {
+            this.globe.DrawRender();
         }
-        arcInput[1].color = color; // Update the color in the arc map
-        _bufferOrchestrator.updateBulk([{ key: key, color: color }], bufferManagerMap, ["color"]);
-        this.globe.DrawRender();
     }
     setPluginOpacity(opacity, drawRender = false) {
         if (!this.globe || !this.gl) {
@@ -152,11 +212,18 @@ export class ArcOnTerrainPlugin {
     init(globe, gl) {
         this.globe = globe;
         this.gl = gl;
+        this._frameCounterTrigger = new FrameCounterTrigger(globe, 15, 1000, (globeChanges) => {
+            if (this._freed)
+                return;
+            this.__buildDynamicArcs();
+        });
         this.program = LineStripProgramCache.get(globe);
-        this._staticDynamicStrategy = new StaticDynamicStrategy(globe, DYNAMIC_STRATEGY_START_LOD); // Initialize static-dynamic strategy with a transition level of 8
+        this._staticDynamicStrategy = new StaticDynamicStrategy(globe, DYNAMIC_STRATEGY_START_LOD, () => {
+            this.__buildStaticArcs();
+        }); // Initialize static-dynamic strategy with a transition level of 8
         this._cameraUniformBlock = CameraUniformBlockTotemCache.get(globe);
-        this._fillBufferManagerMap();
-        this._bufferOrchestrator = new BufferOrchestrator();
+        this._fillbufferManagersMap();
+        this.bufferOrchestrator = new BufferOrchestrator();
         this._arcUBOHandler = this.program.createUBO();
         this._arcUBOHandler.update(new Map([
             ["u_color", new Float32Array(this._options.defaultColor)],
@@ -170,11 +237,12 @@ export class ArcOnTerrainPlugin {
         }
         const globe = this.globe;
         this._staticDynamicStrategy?.updateState();
-        if (globe.api_IsScreenMoving()) {
-            this._buildArcs(); // can be async
-        }
-        const { gl, program, _bufferOrchestrator, _vao, _arcUBOHandler, } = this;
-        if (!gl || !program || !_bufferOrchestrator || !_vao || !_arcUBOHandler) {
+        // if (globe.api_IsScreenMoving()) {
+        // this._buildArcs(); // can be async
+        // }
+        this._frameCounterTrigger?.trigger();
+        const { gl, program, bufferOrchestrator, _vao, _arcUBOHandler, } = this;
+        if (!gl || !program || !bufferOrchestrator || !_vao || !_arcUBOHandler) {
             console.warn("WebGL context, program, or buffer orchestrator is not initialized.");
             return;
         }
@@ -185,28 +253,31 @@ export class ArcOnTerrainPlugin {
         const drawOptions = {
             drawRange: {
                 first: 0,
-                count: _bufferOrchestrator.length * (this._options.vertexCount + 1)
+                count: bufferOrchestrator.length * (this._options.vertexCount + 1)
             },
             indexes: null
         };
         program.draw(_vao, drawOptions, this._opacity, _arcUBOHandler);
         gl.enable(gl.DEPTH_TEST);
     }
-    _buildArcs() {
+    _buildArcs(subSetIDs = null) {
         const state = this._staticDynamicStrategy?.getState();
-        if (state === StaticDynamicState.TO_STATIC) {
-            this.__buildStaticArcs();
+        if (state === StaticDynamicState.DYNAMIC) {
+            this.__buildDynamicArcs(subSetIDs);
         }
-        else if (state === StaticDynamicState.DYNAMIC) {
-            this.__buildArcs();
+        else if (subSetIDs || state === StaticDynamicState.TO_STATIC) {
+            this.__buildStaticArcs(subSetIDs);
         }
     }
-    __buildStaticArcs(keys = [], calledFromInsert = false) {
-        const { globe, _arcMap, _cameraUniformBlock, bufferManagerMap, _bufferOrchestrator } = this;
-        if (!globe || !_cameraUniformBlock || !bufferManagerMap || !_bufferOrchestrator) {
+    __buildStaticArcs(subSetIDs = null) {
+        const { globe, _arcMap, _cameraUniformBlock, bufferManagersMap, bufferOrchestrator } = this;
+        if (!globe || !_cameraUniformBlock || !bufferManagersMap || !bufferOrchestrator) {
             console.warn("Globe or camera uniform block is not initialized.");
             return;
         }
+        const bufferKey = [this.globe.api_GetCurrentGeometry() === 0 ? "position3d" : "position2d"];
+        if (!this.bufferManagersMap?.has(bufferKey[0]))
+            return;
         const longLat = [0, 0];
         const _attractionStrength = 0;
         const longLatArr = new Float32Array(2 * this._options.vertexCount);
@@ -217,60 +288,40 @@ export class ArcOnTerrainPlugin {
                 color: this._options.defaultColor,
                 msl: null
             }];
-        if (keys.length == 0) {
-            for (const [key, [arcInstance, arcInput]] of _arcMap) {
-                arc.copy(_0arc, arcInstance);
-                const generatedPoints = evenlySpacedArcPoints(_0arc.p0, _0arc.normal, _0arc.coverAngle, this._options.vertexCount);
-                for (let i = 0; i < generatedPoints.length; i++) {
-                    const point = generatedPoints[i];
-                    vec3.fromUnitVectorToLongLat(longLat, point);
-                    longLatArr.set([longLat[0] / RADIANS, longLat[1] / RADIANS], i * 2);
-                }
-                data[0].key = key;
-                data[0].height = arcInput.height ?? this._options.defaultHeightFromGroundIn3D;
-                data[0].color = arcInput.color ?? this._options.defaultColor;
-                data[0].msl = arcInput.msl ?? null;
-                if (calledFromInsert) {
-                    this._bufferOrchestrator.insertBulk(data, bufferManagerMap);
-                }
-                else {
-                    this._bufferOrchestrator.updateBulk(data, bufferManagerMap, this._coordinaateBufferKeysForUpdate);
-                }
-            }
+        let keys;
+        if (subSetIDs === null) {
+            keys = _arcMap.keys();
         }
         else {
-            for (let key of keys) {
-                if (!_arcMap.has(key)) {
-                    console.warn(`Arc with key ${key} not found in arcMap.`);
-                    continue;
-                }
-                const [arcInstance, arcInput] = _arcMap.get(key);
-                arc.copy(_0arc, arcInstance);
-                const generatedPoints = evenlySpacedArcPoints(_0arc.p0, _0arc.normal, _0arc.coverAngle, this._options.vertexCount);
-                for (let i = 0; i < generatedPoints.length; i++) {
-                    const point = generatedPoints[i];
-                    vec3.fromUnitVectorToLongLat(longLat, point);
-                    longLatArr.set([longLat[0] / RADIANS, longLat[1] / RADIANS], i * 2);
-                }
-                data[0].key = key;
-                data[0].height = arcInput.height ?? this._options.defaultHeightFromGroundIn3D;
-                data[0].color = arcInput.color ?? this._options.defaultColor;
-                data[0].msl = arcInput.msl ?? null;
-                if (calledFromInsert) {
-                    this._bufferOrchestrator.insertBulk(data, bufferManagerMap);
-                }
-                else {
-                    this._bufferOrchestrator.updateBulk(data, bufferManagerMap, this._coordinaateBufferKeysForUpdate);
-                }
+            keys = subSetIDs;
+        }
+        for (const key of keys) {
+            const [arcInstance, arcInput] = _arcMap.get(key);
+            arc.copy(_0arc, arcInstance);
+            const generatedPoints = evenlySpacedArcPoints(_0arc.p0, _0arc.normal, _0arc.coverAngle, this._options.vertexCount);
+            for (let i = 0; i < generatedPoints.length; i++) {
+                const point = generatedPoints[i];
+                vec3.fromUnitVectorToLongLat(longLat, point);
+                longLatArr.set([longLat[0] / RADIANS, longLat[1] / RADIANS], i * 2);
             }
+            data[0].key = key;
+            data[0].height = arcInput.height ?? this._options.defaultHeightFromGroundIn3D;
+            data[0].color = arcInput.color ?? this._options.defaultColor;
+            data[0].msl = arcInput.msl ?? null;
+            this.bufferOrchestrator.insertBulk(data, bufferManagersMap, bufferKey);
         }
     }
-    __buildArcs() {
-        const { globe, _arcMap, _cameraUniformBlock, bufferManagerMap } = this;
-        if (!globe || !_cameraUniformBlock || !bufferManagerMap) {
+    __buildDynamicArcs(subSetIDs = null) {
+        const { globe, _arcMap, _cameraUniformBlock, bufferManagersMap } = this;
+        if (!globe || !_cameraUniformBlock || !bufferManagersMap) {
             console.warn("Globe or camera uniform block is not initialized.");
             return;
         }
+        const bufferKey = [
+            this.globe.api_GetCurrentGeometry() === 0 ? "position3d" : "position2d"
+        ];
+        if (!this.bufferManagersMap?.has(bufferKey[0]))
+            return;
         const { cameraAttractionIsOn } = this._options;
         const lookAtPosition = _cameraUniformBlock.getLookAtVector();
         const cameraPosition = _cameraUniformBlock.getCameraVector();
@@ -288,7 +339,15 @@ export class ArcOnTerrainPlugin {
         })();
         const result = [];
         const longLat = [0, 0];
-        for (const [key, [arcInstance, arcInput]] of _arcMap) {
+        let keys;
+        if (subSetIDs === null) {
+            keys = _arcMap.keys();
+        }
+        else {
+            keys = subSetIDs;
+        }
+        for (const key of keys) {
+            const [arcInstance, arcInput] = _arcMap.get(key);
             arc.copy(_0arc, arcInstance);
             const isOnArc = arc.closestPoint(_attractionPoint, _0arc, cameraPosition);
             if (!isOnArc) {
@@ -315,15 +374,10 @@ export class ArcOnTerrainPlugin {
                 msl: arcInput.msl ?? null
             });
         }
-        // this._bufferOrchestrator.resetWithCapacity(bufferManagerMap, result.length);
-        const bufferNames = [];
-        if (this._options.globeViewOn)
-            bufferNames.push("position3d");
-        if (this._options.flatViewOn)
-            bufferNames.push("position2d");
-        this._bufferOrchestrator.insertBulk(result, bufferManagerMap, bufferNames);
+        // this.bufferOrchestrator.resetWithCapacity(bufferManagersMap, result.length);
+        this.bufferOrchestrator.insertBulk(result, bufferManagersMap, bufferKey);
     }
-    _fillBufferManagerMap() {
+    _fillbufferManagersMap() {
         const { gl, globe } = this;
         if (!gl || !globe) {
             console.warn("WebGL context or globe is not initialized.");
@@ -331,9 +385,9 @@ export class ArcOnTerrainPlugin {
         }
         const g2D = globe2Dcoordinates(globe);
         const { flatViewOn, globeViewOn, variativeColorsOn } = this._options;
-        this.bufferManagerMap = new Map();
+        this.bufferManagersMap = new Map();
         if (globeViewOn) {
-            this.bufferManagerMap.set("position3d", {
+            this.bufferManagersMap.set("position3d", {
                 bufferManager: new BufferManager(gl, 3 * (this._options.vertexCount + 1), { bufferType: "STREAM_DRAW", initialCapacity: INITAL_CAPACITY }),
                 adaptor: (item) => {
                     const { longLatArr, height = this._options.defaultHeightFromGroundIn3D, msl = this._options.isMSL } = item;
@@ -343,7 +397,7 @@ export class ArcOnTerrainPlugin {
             });
         }
         if (flatViewOn) {
-            this.bufferManagerMap.set("position2d", {
+            this.bufferManagersMap.set("position2d", {
                 bufferManager: new BufferManager(gl, 2 * (this._options.vertexCount + 1), { bufferType: "STREAM_DRAW", initialCapacity: INITAL_CAPACITY }),
                 adaptor: (item) => {
                     const { longLatArr } = item;
@@ -352,8 +406,8 @@ export class ArcOnTerrainPlugin {
             });
         }
         if (this._options.variativeColorsOn) {
-            const _colorArray = new Float32Array(4 * (this._options.vertexCount + 1));
-            this.bufferManagerMap.set("color", {
+            const _colorArray = new Float32Array(4 * (this._options.vertexCount + 1)); // TODO: this could cause data races or unexpected overwrites.
+            this.bufferManagersMap.set("color", {
                 bufferManager: new BufferManager(gl, 4 * (this._options.vertexCount + 1), { bufferType: "STREAM_DRAW", initialCapacity: INITAL_CAPACITY }),
                 adaptor: (item) => {
                     // Calculate color based on radius
@@ -378,7 +432,7 @@ export class ArcOnTerrainPlugin {
                 return null;
             this._coordinaateBufferKeysForUpdate.push(key);
             // @ts-ignore
-            const bufferManager = this.bufferManagerMap.get(key).bufferManager;
+            const bufferManager = this.bufferManagersMap.get(key).bufferManager;
             // @ts-ignore
             return createBufferAndReadInfo(bufferManager.buffer);
         });
@@ -388,6 +442,15 @@ export class ArcOnTerrainPlugin {
         bufferObjects[2] // color
         );
     }
+    __fillColors(subSetIDs) {
+        if (this._options.variativeColorsOn === false)
+            return;
+        const data = [null];
+        for (const id of subSetIDs) {
+            data[0] = this._arcMap.get(id)[1];
+            this.bufferOrchestrator.insertBulk(data, this.bufferManagersMap, ["color"]);
+        }
+    }
     free() {
         if (this._freed) {
             console.warn("Plugin already freed");
@@ -398,7 +461,7 @@ export class ArcOnTerrainPlugin {
             return;
         }
         this._arcUBOHandler?.free();
-        this.bufferManagerMap?.forEach((manager) => {
+        this.bufferManagersMap?.forEach((manager) => {
             manager.bufferManager.free();
         });
         CameraUniformBlockTotemCache.release(this.globe);