@pirireis/webglobeplugins 0.6.30-c → 0.6.32-a

package/circle-line-chain/plugin.js

@@ -41,18 +41,18 @@ export class CircleLineChainPlugin {
     /**
      * 
      * @param {*} id 
-     * @param {Map<[key, ContextTextWriter3]} textContextWriterInjectionMap //import { ContextTextWriter3 } from "@pirireis/webglobeplugins/write-text/context-text3"; 
+     * @param {Map<[key, ContextTextWriter3]} textWritersMap //import { ContextTextWriter3 } from "@pirireis/webglobeplugins/write-text/context-text3"; 
      */
     constructor(id, {
         drawCircleOn = true,
-        textContextWriterInjectionMap = new Map(),
+        textWritersMap = new Map(),
         textDataPreAdaptor = null,
         circleFlatEdgeCount = flatCircleEdgeCount - 2
     } = {}) {
         this.id = id;
-        this._checkTextContextWriterInjectionMap(textContextWriterInjectionMap);
-        this._textContextWriterInjectionMap = textContextWriterInjectionMap;
-        this._textContextWriterInjectionMap.forEach((writer) => writer.setKeyAdaptor((v, i, c, properties) => v.__identity__));
+        this._checktextWritersMap(textWritersMap);
+        this._textWritersMap = textWritersMap;
+        this._textWritersMap.forEach((writer) => writer.setKeyAdaptor((v, i, c, properties) => v.__identity__));
         this._opacity = 1;
         this._chainListMap = new ChainListMap(keyMethod);
         this.bufferOrchestrator = new BufferOrchestrator({ capacity: 10 });
@@ -63,136 +63,15 @@ export class CircleLineChainPlugin {
 
     // init
 
-    init(globe, gl) {
-        this.gl = gl;
-        this.globe = globe
-        this._initOrchestrations()
-    }
-
-    _checkTextContextWriterInjectionMap(textContextWriterInjectionMap) {
-        if (!(textContextWriterInjectionMap instanceof Map)) throw new Error("textContextWriterInjectionMap is not an instance of Map");
-        textContextWriterInjectionMap.forEach((v) => {
-            if (!(v instanceof ContextTextWriter3)) throw new Error("textContextWriterInjectionMap element is not an instance of ContextTextWriter3");
-        });
-    }
-
-    _initOrchestrations() {
-        const { gl, globe } = this;
-        this.lineProgram = LineOnGlobeCache.get(globe);
-        this.circleProgram2d = CircleCache.get(globe);
-        this.circle3DProgram = Circle3DCache.get(globe);
-
-        // this.lineToTheOriginProgram = LineToTheOriginCache.get(globe);
-        const _circleFlatEdgeCount = this._circleFlatEdgeCount;
-        {
-            // createBuffers
-            const bufferType = "DYNAMIC_DRAW";
-            const initialCapacity = this.bufferOrchestrator.capacity;
-            this.bufferManagersCompMap = new Map(
-                [
-                    ["centerCoords2d", {
-                        'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
-                        'adaptor': (item) => new Float32Array(globe.api_GetMercator2DPoint(item.long, item.lat)),
-                    }],
-                    ["centerCoords3d", {
-                        'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
-                        'adaptor': (item) => new Float32Array(globe.api_GetCartesian3DPoint(item.long, item.lat, 0, 0)),
-                    }],
-                    ["targetCoords2d", {
-                        'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
-                        'adaptor': (item) => new Float32Array(globe.api_GetMercator2DPoint(item.targetLong, item.targetLat)),
-                    }],
-                    ["targetCoords3d", {
-                        'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
-                        'adaptor': (item) => new Float32Array(globe.api_GetCartesian3DPoint(item.targetLong, item.targetLat, 0, 0)),
-                    }],
-                    ["rgba", {
-                        'bufferManager': new BufferManager(gl, 4, { bufferType, initialCapacity }),
-                        'adaptor': (item) => {
-                            if (item.lineProperties?.rgba) return new Float32Array(item.lineProperties.rgba);
-                            return new Float32Array(item.chainProperties.rgba);
-                        }
-                    }],
-                    ["bigRadius", {
-                        'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
-                        'adaptor': (item) => new Float32Array([item.bigRadius])
-                    }],
-                    ["dashRatio", {
-                        'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
-                        'adaptor': (item) => new Float32Array([item.chainProperties.dashRatio])
-                    }],
-
-                    ["dashOpacity", {
-                        'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
-                        'adaptor': (item) => new Float32Array([item.chainProperties.dashOpacity])
-                    }],
-                    ["circleDashAngle", {
-                        'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
-                        'adaptor': (item) => {
-                            if (item.circleProperties?.circleDashAngle) return new Float32Array([item.circleProperties.circleDashAngle / 360]);
-                            return new Float32Array([item.chainProperties.circleDashAngle / 360]);
-                        }
-                    }],
-                    ["rgbaCircle", {
-                        "bufferManager": new BufferManager(gl, 4, { bufferType, initialCapacity }),
-                        "adaptor": (item) => {
-                            if (item.circleProperties?.rgba) return new Float32Array(item.circleProperties.rgba);
-                            return new Float32Array(item.chainProperties.rgba);
-                        }
-                    }],
-                    // Mercator buffers
-                    ["circleDashAngleMercator", {
-                        'bufferManager': new BufferManager(gl, 1 * _circleFlatEdgeCount, { bufferType, initialCapacity }),
-                        'adaptor': (item) => {
-                            if (item.circleProperties?.circleDashAngle) return new Float32Array([item.circleProperties.circleDashAngle / 360]);
-                            return populateFloat32Array.fillFloat32Array(_circleFlatEdgeCount, item.chainProperties.circleDashAngle / 360);
-                        }
-                    }],
-                    ["rgbaCircleMercator", {                            // 62
-                        "bufferManager": new BufferManager(gl, 4 * _circleFlatEdgeCount, { bufferType, initialCapacity }),
-                        "adaptor": (item) => {
-                            if (item.circleProperties?.rgba) return populateFloat32Array.fillWithListData(_circleFlatEdgeCount, item.circleProperties.rgba);
-                            return populateFloat32Array.fillWithListData(_circleFlatEdgeCount, item.chainProperties.rgba);
-                        }
-                    }],
-                    ["dashOpacityMercator", {
-                        'bufferManager': new BufferManager(gl, 1 * _circleFlatEdgeCount, { bufferType, initialCapacity }),
-                        'adaptor': (item) => populateFloat32Array.fillFloat32Array(_circleFlatEdgeCount, item.chainProperties.dashOpacity)
-                    }],
-                    ["centerCoords2dMercator", {
-                        'bufferManager': new BufferManager(gl, 2 * _circleFlatEdgeCount, { bufferType, initialCapacity }),
-                        'adaptor': (item) => item.centerCoords2dflat,
-                    }],
-                ]
-            );
-            // (startPotisionBufferObj, endPositionBufferObj, dashRatioBufferObj, colorBufferObj)
-            const obj = function (bufferManagerComp) {
-                return { 'buffer': bufferManagerComp.bufferManager.buffer, 'stride': 0, 'offset': 0 }
-            };
-            this.lineVao = this.lineProgram.createVAO(
-                ...['centerCoords2d', 'centerCoords3d', 'targetCoords2d', 'targetCoords3d', 'dashRatio', 'dashOpacity', 'rgba'].map(key => obj(this.bufferManagersCompMap.get(key))));
-            this.circleVao2d = this.circleProgram2d.createVAO(
-                ...["centerCoords2dMercator", "rgbaCircleMercator", "circleDashAngleMercator", "dashOpacityMercator"].map(key => obj(this.bufferManagersCompMap.get(key))));
-            // this.toOriginVao = this.lineToTheOriginProgram.createVAO(
-            //     ...["targetCoords3d", "rgba"].map(key => obj(this.bufferManagersCompMap.get(key))));
-            this.circle3DVao = this.circle3DProgram.createVAO(
-                ...["centerCoords3d", "bigRadius", "rgbaCircle", "circleDashAngle", "dashOpacity"].map(key => obj(this.bufferManagersCompMap.get(key)))
-            );
-
-        }
-
-    }
-
-
     // API
     setDrawCircleOn(bool) {
         if (typeof bool !== 'boolean') throw new Error("setDrawCircleOn parameter must be a boolean");
         this._drawCircleOn = bool;
         this.globe.DrawRender();
     }
-    // -- update bulk family
+
+    // ---- updateBulk
     /**
-     * 
      * @param {Array<chain>} data 
      * @typedef chain
      * @property {string} chainKey
@@ -220,7 +99,6 @@ export class CircleLineChainPlugin {
 
 
     /**
-     * 
      * @param {*} chainKey 
      * @param {Array<{nodeKey, circleProperties:Map[propertyName ,value],  lineProperties:Map[propertyName ,value] }} propertyMap 
      */
@@ -232,7 +110,6 @@ export class CircleLineChainPlugin {
     }
 
     /**
-     * 
      * @param {*} chainKey 
      * @param {Map<propertyName ,value} propertyMap 
      */
@@ -242,7 +119,22 @@ export class CircleLineChainPlugin {
         if (textWriterIDs) this._updateTexts([chainKey], textWriterIDs);
     }
 
-    // ---- insertBulk family
+
+    updateNodeCoordinates(node, chainKey, { textWriterIDs = [] } = {}) {
+        this._chainListMap.updateCoordsinatesOfNode(node, chainKey);
+        if (textWriterIDs) this._updateTexts([chainKey], textWriterIDs);
+        this._reconstructChains([chainKey]);
+        this.globe.DrawRender();
+    }
+
+
+    updateText(textWriterIDs) {
+        const chainKeyIterator = this._chainListMap.getAllChainKeysIterator();
+        this._updateTexts(chainKeyIterator, textWriterIDs);
+    }
+
+
+    // ---- insertBulk
     /**
      * 
      * @param {Array<chain>} data 
@@ -258,7 +150,7 @@ export class CircleLineChainPlugin {
      * @property {number} lat  
      * @property {StyleProperties} circleProperties
      */
-    insertBulk(data, { textWriterIDs = [] } = []) {
+    insertBulk(data, { textWriterIDs = [] } = {}) {
         // first insert everything to implicit structure,
         // then iterate over data again to update text
         // let _reconstractChainBufferData method interact with data and bufferOrchestrator.
@@ -275,7 +167,6 @@ export class CircleLineChainPlugin {
     }
 
     /**
-     * 
      * @param {{key, long, lat}} node
      * @param {*} chainKey 
      * @param {*} theNodeKeyFront | node key of the next node, null places to the last
@@ -289,20 +180,10 @@ export class CircleLineChainPlugin {
     }
 
 
-
-    updateNodeCoordinates(node, chainKey, { textWriterIDs = [] } = {}) {
-        this._chainListMap.updateCoordsinatesOfNode(node, chainKey);
-        if (textWriterIDs) this._updateTexts([chainKey], textWriterIDs);
-        this._reconstructChains([chainKey]);
-        this.globe.DrawRender();
-    }
-
-
-
     setOpacity(opacity) {
         if (typeof opacity !== 'number') throw new Error("opacity must be a number");
         if (opacity < 0 || 1 < opacity) throw new Error("opacity must be between 0-1");
-        this._textContextWriterInjectionMap.forEach((writer) => writer.setOpacity(opacity));
+        this._textWritersMap.forEach((writer) => writer.setOpacity(opacity));
         this._opacity = opacity;
         this.globe.DrawRender();
     }
@@ -322,8 +203,8 @@ export class CircleLineChainPlugin {
         for (const chainKey of chainKeys) {
             bufferKeys.push(...this._chainListMap.deleteChainAndReturnChainKeys(chainKey));
         }
-        this._textContextWriterInjectionMap.forEach((writer) => writer.deleteTextBulk(bufferKeys));
-        this._updateTexts(chainKeys, this._textContextWriterInjectionMap.keys());
+        this._textWritersMap.forEach((writer) => writer.deleteTextBulk(bufferKeys));
+        this._updateTexts(chainKeys, this._textWritersMap.keys());
         this.bufferOrchestrator.deleteBulk(bufferKeys, this.bufferManagersCompMap);
         this.globe.DrawRender();
     }
@@ -340,7 +221,7 @@ export class CircleLineChainPlugin {
             bufferKeys.push(...this._chainListMap.deleteNodesBelongToAChain(chainKey, nodeKeys));
             chainKeysToReconstuct.push(chainKey);
         });
-        this._textContextWriterInjectionMap.forEach((writer) => writer.deleteTextBulk(bufferKeys));
+        this._textWritersMap.forEach((writer) => writer.deleteTextBulk(bufferKeys));
         this.bufferOrchestrator.deleteBulk(bufferKeys, this.bufferManagersCompMap);
         this._reconstructChains(chainKeysToReconstuct);
         this._updateTexts(chainKeysToReconstuct, textWriterIDs);
@@ -349,17 +230,129 @@ export class CircleLineChainPlugin {
     }
 
 
-    updateText(textWriterIDs) {
-        const chainKeyIterator = this._chainListMap.getAllChainKeysIterator();
-        this._updateTexts(chainKeyIterator, textWriterIDs);
+    init(globe, gl) {
+        this.gl = gl;
+        this.globe = globe
+        this._initOrchestrations()
     }
 
-
     // implicit
 
+    _checktextWritersMap(textWritersMap) {
+        if (!(textWritersMap instanceof Map)) throw new Error("textWritersMap is not an instance of Map");
+        textWritersMap.forEach((v) => {
+            if (!(v instanceof ContextTextWriter3)) throw new Error("textWritersMap element is not an instance of ContextTextWriter3");
+        });
+    }
+
+    _initOrchestrations() {
+        const { gl, globe } = this;
+        this.lineProgram = LineOnGlobeCache.get(globe);
+        this.circleProgram2d = CircleCache.get(globe);
+        this.circle3DProgram = Circle3DCache.get(globe);
+
+        // this.lineToTheOriginProgram = LineToTheOriginCache.get(globe);
+        const _circleFlatEdgeCount = this._circleFlatEdgeCount;
+        {
+            // createBuffers
+            const bufferType = "DYNAMIC_DRAW";
+            const initialCapacity = this.bufferOrchestrator.capacity;
+            this.bufferManagersCompMap = new Map(
+                [
+                    ["centerCoords2d", {
+                        'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
+                        'adaptor': (item) => new Float32Array(globe.api_GetMercator2DPoint(item.long, item.lat)),
+                    }],
+                    ["centerCoords3d", {
+                        'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
+                        'adaptor': (item) => new Float32Array(globe.api_GetCartesian3DPoint(item.long, item.lat, 0, 0)),
+                    }],
+                    ["targetCoords2d", {
+                        'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
+                        'adaptor': (item) => new Float32Array(globe.api_GetMercator2DPoint(item.targetLong, item.targetLat)),
+                    }],
+                    ["targetCoords3d", {
+                        'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
+                        'adaptor': (item) => new Float32Array(globe.api_GetCartesian3DPoint(item.targetLong, item.targetLat, 0, 0)),
+                    }],
+                    ["rgba", {
+                        'bufferManager': new BufferManager(gl, 4, { bufferType, initialCapacity }),
+                        'adaptor': (item) => {
+                            if (item.lineProperties?.rgba) return new Float32Array(item.lineProperties.rgba);
+                            return new Float32Array(item.chainProperties.rgba);
+                        }
+                    }],
+                    ["bigRadius", {
+                        'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
+                        'adaptor': (item) => new Float32Array([item.bigRadius])
+                    }],
+                    ["dashRatio", {
+                        'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
+                        'adaptor': (item) => new Float32Array([item.chainProperties.dashRatio])
+                    }],
+                    ["dashOpacity", {
+                        'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
+                        'adaptor': (item) => new Float32Array([item.chainProperties.dashOpacity])
+                    }],
+                    ["circleDashAngle", {
+                        'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
+                        'adaptor': (item) => {
+                            if (item.circleProperties?.circleDashAngle) return new Float32Array([item.circleProperties.circleDashAngle / 360]);
+                            return new Float32Array([item.chainProperties.circleDashAngle / 360]);
+                        }
+                    }],
+                    ["rgbaCircle", {
+                        "bufferManager": new BufferManager(gl, 4, { bufferType, initialCapacity }),
+                        "adaptor": (item) => {
+                            if (item.circleProperties?.rgba) return new Float32Array(item.circleProperties.rgba);
+                            return new Float32Array(item.chainProperties.rgba);
+                        }
+                    }],
+                    // Mercator buffers
+                    ["circleDashAngleMercator", {
+                        'bufferManager': new BufferManager(gl, 1 * _circleFlatEdgeCount, { bufferType, initialCapacity }),
+                        'adaptor': (item) => {
+                            if (item.circleProperties?.circleDashAngle) return new Float32Array([item.circleProperties.circleDashAngle / 360]);
+                            return populateFloat32Array.fillFloat32Array(_circleFlatEdgeCount, item.chainProperties.circleDashAngle / 360);
+                        }
+                    }],
+                    ["rgbaCircleMercator", {                            // 62
+                        "bufferManager": new BufferManager(gl, 4 * _circleFlatEdgeCount, { bufferType, initialCapacity }),
+                        "adaptor": (item) => {
+                            if (item.circleProperties?.rgba) return populateFloat32Array.fillWithListData(_circleFlatEdgeCount, item.circleProperties.rgba);
+                            return populateFloat32Array.fillWithListData(_circleFlatEdgeCount, item.chainProperties.rgba);
+                        }
+                    }],
+                    ["dashOpacityMercator", {
+                        'bufferManager': new BufferManager(gl, 1 * _circleFlatEdgeCount, { bufferType, initialCapacity }),
+                        'adaptor': (item) => populateFloat32Array.fillFloat32Array(_circleFlatEdgeCount, item.chainProperties.dashOpacity)
+                    }],
+                    ["centerCoords2dMercator", {
+                        'bufferManager': new BufferManager(gl, 2 * _circleFlatEdgeCount, { bufferType, initialCapacity }),
+                        'adaptor': (item) => item.centerCoords2dflat,
+                    }],
+                ]
+            );
+            const obj = function (bufferManagerComp) {
+                return { 'buffer': bufferManagerComp.bufferManager.buffer, 'stride': 0, 'offset': 0 }
+            };
+            this.lineVao = this.lineProgram.createVAO(
+                ...['centerCoords2d', 'centerCoords3d', 'targetCoords2d', 'targetCoords3d', 'dashRatio', 'dashOpacity', 'rgba'].map(key => obj(this.bufferManagersCompMap.get(key))));
+            this.circleVao2d = this.circleProgram2d.createVAO(
+                ...["centerCoords2dMercator", "rgbaCircleMercator", "circleDashAngleMercator", "dashOpacityMercator"].map(key => obj(this.bufferManagersCompMap.get(key))));
+            this.circle3DVao = this.circle3DProgram.createVAO(
+                ...["centerCoords3d", "bigRadius", "rgbaCircle", "circleDashAngle", "dashOpacity"].map(key => obj(this.bufferManagersCompMap.get(key)))
+            );
+
+        }
+
+    }
+
+
+
     _updateTexts(chainKeys, textWriterIDs) {
         if (textWriterIDs.length === 0) return;
-        const textWriters = textWriterGetOrThrow(this._textContextWriterInjectionMap, textWriterIDs)
+        const textWriters = textWriterGetOrThrow(this._textWritersMap, textWriterIDs)
         chainKeys.forEach((chainKey) => {
             this._chainListMap.textUpdate(chainKey, textWriters, this._textDataPreAdaptor);
         })
@@ -419,7 +412,7 @@ export class CircleLineChainPlugin {
         CircleCache.release(this.globe);
         Circle3DCache.release(this.globe);
         LineToTheOriginCache.release(this.globe);
-        this._textContextWriterInjectionMap.forEach((writer) => writer.free());
+        this._textWritersMap.forEach((writer) => writer.free());
         const { gl } = this;
         gl.deleteVertexArray(this.lineVao);
         gl.deleteVertexArray(this.circleVao2d);
@@ -434,7 +427,7 @@ export class CircleLineChainPlugin {
         const { gl, globe } = this;
         gl.disable(gl.DEPTH_TEST);
         this.lineProgram.draw(this.lineVao, this.bufferOrchestrator.length, this._opacity);
-        this._textContextWriterInjectionMap.forEach((writer) => writer.draw());
+        this._textWritersMap.forEach((writer) => writer.draw());
         // this.lineToTheOriginProgram.draw(this.toOriginVao, this.bufferOrchestrator.length, this._opacity);
         const is3D = globe.api_GetCurrentGeometry() === 0;
         if (this._drawCircleOn) {
@@ -454,4 +447,4 @@ const radiusMethod = (globe) => (v, i, array) => {
     return globe.Math.GetDist3D(v.long, v.lat, array[i + 1].long, array[i + 1].lat)
 }
 
-const textWriterGetOrThrow = mapGetOrThrow("textWriterIds is invalid")
+const textWriterGetOrThrow = mapGetOrThrow("textWriterIDs is invalid")

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@pirireis/webglobeplugins",
-    "version": "0.6.30-c",
+    "version": "0.6.32-a",
     "main": "index.js",
     "author": "Toprak Nihat Deniz Ozturk",
     "license": "MIT"

package/programs/totems/camerauniformblock.js

@@ -48,7 +48,8 @@ export default class
         const { gl } = this;
         const ubo = gl.createBuffer();
         gl.bindBuffer(gl.UNIFORM_BUFFER, ubo);
-        gl.bufferData(gl.UNIFORM_BUFFER, 184, gl.STREAM_DRAW);
+        // 184 bytes in reality. Overflow on linux for some reason. So, 200 bytes.
+        gl.bufferData(gl.UNIFORM_BUFFER, 200, gl.STREAM_DRAW);
         gl.bindBufferBase(gl.UNIFORM_BUFFER, 0, ubo);
         gl.bindBuffer(gl.UNIFORM_BUFFER, null);
         return ubo;