@pirireis/webglobeplugins 0.6.19 → 0.6.20

package/bearing-line/plugin.js

@@ -473,11 +473,13 @@ export default class Plugin {
 
 
     __fixPartialProperties(propertyIDs) {
-        const s = new Set("rgba", "dashOpacity", "circleDashAngle");
+        const s = new Set(["rgba", "dashOpacity", "circleDashAngle"]);
         const result = []
         for (const item of propertyIDs) {
             result.push(item);
+            console.log(item + " is processing")
             if (s.has(item)) {
+                console.log(item + "Mercator is added")
                 result.push(item + "Mercator");
             }
         }

package/circle-line-chain/plugin.js

@@ -138,8 +138,6 @@ export class CircleLineChainPlugin {
                             return new Float32Array(item.chainProperties.rgba);
                         }
                     }],
-
-
                     // Mercator buffers
                     ["circleDashAngleMercator", {
                         'bufferManager': new BufferManager(gl, 1 * EDGE_COUNT_2D_CIRCLE, { bufferType, initialCapacity }),
@@ -148,7 +146,7 @@ export class CircleLineChainPlugin {
                             return new populateFloat32Array.fillFloat32Array(EDGE_COUNT_2D_CIRCLE, item.chainProperties.circleDashAngle / 360);
                         }
                     }],
-                    ["rgbaCircleMercator", {
+                    ["rgbaCircleMercator", {                            // 62
                         "bufferManager": new BufferManager(gl, 4 * EDGE_COUNT_2D_CIRCLE, { bufferType, initialCapacity }),
                         "adaptor": (item) => {
                             if (item.circleProperties?.rgba) return populateFloat32Array.fillWithListData(EDGE_COUNT_2D_CIRCLE, item.circleProperties.rgba);

package/package.json

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

package/programs/line-on-globe/circle-accurate-3d.js

@@ -60,7 +60,6 @@ void main() {
     v_dash_opacity = dash_opacity;
     v_color = color;
     gl_PointSize = 3.0;
-
 }`
 
 const fragmentShaderSource = `#version 300 es

package/rangerings/rangerings copy.js

@@ -0,0 +1,219 @@
+import { rings } from "../programs";
+import { COMPASS_MODES } from "./enum";
+import { PaddingFreeAngleCache } from "../programs/rings/distancering";
+
+import RangeRingAngleText from "./rangeringangletext";
+const { circleProgramCache, PaddingProgramCache, CirclePaddySharedBuffer } = rings;
+
+/**
+ * @typedef RangeRingData
+ * @property {number} centerX
+ * @property {number} centerY
+ * @property {Array<Ring>} rings
+ * 
+ * @typedef Ring
+ * @property {number} radius
+ * @property {number} padding
+ * @property {[number, number, number]} color
+ * 
+ */
+
+
+
+export default class {
+
+    constructor(id, { oneDegreePadding = true, compass = COMPASS_MODES.REAL, showNumbers = true, numbersStyle = null, opacity = 1 } = {}) {
+        this.id = id;
+        this.compass = compass;
+        this._showNumbers = showNumbers;
+        this._numbersStyle = numbersStyle;
+        this._opacity = opacity;
+        this.circleEdgeCount = 360;
+        this._onedegreepaddingOn = oneDegreePadding;
+        this.bufferManager = null;
+
+        this._deleteCounter = 0;
+        this._deleteThreshold = 10;
+    }
+
+
+    setOneDegreePaddingOn(oneDegreePadding) {
+        this._onedegreepaddingOn = oneDegreePadding;
+        this.globe.DrawRender();
+    }
+
+    init(globe, gl) {
+        this.gl = gl;
+        this.globe = globe;
+        this.circleFlatProgram = circleProgramCache.getProgram(globe);
+        this.paddyFlatProgram = PaddingProgramCache.getProgram(globe);
+        this.paddingFreeAngleProgram = PaddingFreeAngleCache.getProgram(globe);
+        if (this._showNumbers) {
+            this.textPlugin = new RangeRingAngleText(globe, this.id + "text", { flatCompassMode: this.compass, style: this._numbersStyle, opacity: this._opacity });
+            delete this._numbersStyle;
+        }
+    }
+
+    // TODO: Add text free
+    free() {
+
+        this.circleProgramCache?.releaseProgram(this.globe);
+        this.PaddingProgramCache?.releaseProgram(this.globe);
+        this.PaddingFreeAngleCache?.releaseProgram(this.globe);
+        this.gl.deleteVertexArray(this.bufferManager?.vao);
+        this.gl.deleteVertexArray(this.paddingBufferManager?.vao);
+        this.paddingBufferManager?.free();
+        this.bufferManager?.free();
+        this.textPlugin?.free();
+        this.circleFlatProgram = null;
+        this.paddyFlatProgram = null;
+        this.bufferManager = null;
+        this.paddingBufferManager = null;
+        this.textPlugin = null;
+    }
+
+
+    setOpacity(opacity) {
+        this._opacity = opacity;
+        this.textPlugin?.setOpacity(opacity); // TODO impolement this
+        this.globe.DrawRender();
+    }
+
+    setGeometry() {
+        this.textPlugin?.setGeometry();
+    }
+
+
+    draw3D() {
+        const { circleFlatProgram, paddyFlatProgram, paddingFreeAngleProgram, bufferManager, compass, gl, circleEdgeCount, paddingBufferManager, _opacity } = this;
+        if (this.bufferManager !== null && bufferManager.length > 0) {
+            gl.disable(gl.DEPTH_TEST);
+            circleFlatProgram.draw(bufferManager, compass, circleEdgeCount, _opacity);
+            if (this._onedegreepaddingOn) paddyFlatProgram.draw(bufferManager, 360, compass, _opacity);
+            paddingFreeAngleProgram.draw(paddingBufferManager, compass, _opacity);
+            gl.enable(gl.DEPTH_TEST);
+        }
+    }
+
+
+
+    /**
+     * @param {RangeRingData} rangeRingData
+     * 0 compass limps
+     * other real distance limp
+     */
+    setCampass(compass) {
+        this.compass = compass;
+        this.textPlugin?.setCompass(compass);
+        this.globe.DrawRender();
+    }
+
+    initilizeBufferManager(initialRingCapacity, bufferDrawType) {
+        const { gl, globe } = this
+        this.bufferDrawType = bufferDrawType;
+        this.bufferManager = new CirclePaddySharedBuffer(gl, globe, { bufferType: bufferDrawType, initialRingCapacity: initialRingCapacity });
+        this.paddingBufferManager = this.paddingFreeAngleProgram.createBuffer({ bufferType: bufferDrawType, initialRingCapacity });
+    }
+
+
+    /**
+     * @typedef {Array<{ringID, radius, paddingRange}>} rings
+     * @param {Array<centerID:string, x:number, y:number, stepAngle:number, rgba:[4 numbers], rings:rings} items
+     */
+    insertBulk(items) {
+        const insertData = ringItemsToCircleBufferInsertDataAdaptor(items);
+
+        this.bufferManager.insertBulk(insertData);
+        for (const item of items) {
+            item.paddingAngles = angleToPaddingAngles(item.stepAngle, 0);
+        }
+        this.paddingBufferManager.insertBulk(items);
+        this.textPlugin?.insertBulk(items);
+        this.globe.DrawRender();
+    }
+
+
+    /**
+     * 
+     * @param {Array<{centerID, x, y}>} items 
+     */
+    updateCentersXY(items) {
+        this.bufferManager.updateCentersXY(items);
+        this.paddingBufferManager.updateCentersXY(items);
+        this.textPlugin?.updateCentersXY(items);
+        this.globe.DrawRender();
+    }
+
+
+    /**
+     * @param   {Array<{centerID, rgba:[4 numbers]}>} centerColors
+     */
+    updateCentersColor(centerColors) {
+        this.bufferManager.updateCentersColor(centerColors);
+        this.paddingBufferManager.updateCentersColor(centerColors);
+        this.globe.DrawRender();
+    }
+
+
+    /**
+     * @param {Array<{centerID}>} centerIds
+     */
+    removeCenters(centerIds) {
+        this.bufferManager.removeCenters(centerIds);
+        this.paddingBufferManager.removeCenters(centerIds);
+        this.textPlugin?.removeCenters(centerIds);
+        this._deleteCounter += centerIds.length;
+        if (this._deleteCounter > this._deleteThreshold) {
+            // this is naive since we are not checking the actual deletion
+            // but it works
+            this._deleteCounter = 0;
+            this.bufferManager.defrag();
+            this.paddingBufferManager.defrag();
+        }
+        this.globe.DrawRender();
+
+    }
+
+    /**
+     * 
+     * @param {Array<{centerID, hide, textHide}>} centerHides
+     */
+    updateCentersHide(centerHides) {
+        this.bufferManager.updateCentersHide(centerHides);
+        this.paddingBufferManager.updateCentersHide(centerHides);
+        this.textPlugin?.updateCentersHide(centerHides);
+        this.globe.DrawRender();
+    }
+}
+
+
+
+
+const ringItemsToCircleBufferInsertDataAdaptor = (ringItems) => {
+
+    const result = [];
+    for (const { centerID, x, y, rgba, rings, hide = 0, textHide = 0 } of ringItems) {
+        const resultRings = [];
+        for (const { ringID, radius, padding } of rings) {
+            resultRings.push({
+                ringID,
+                radius,
+                padding: padding / 5,
+                rgba,
+            });
+        }
+
+        result.push({
+            centerID,
+            x,
+            y,
+            rings: resultRings,
+            hide,
+            textHide
+        });
+    }
+    return result;
+};
+
+const angleToPaddingAngles = (gapDegree, offsetDegree = 0) => Array.from({ length: Math.ceil(360 / gapDegree) }, (_, i) => (i * gapDegree + offsetDegree) * Math.PI / 180);
+

package/rangerings-2/plugin.js

@@ -0,0 +1,3 @@
+/**
+ * Re implementation of rangering plugin.
+ */

package/util/account/single-attribute-buffer-management/buffer-orchestrator.js

@@ -29,79 +29,6 @@
 
 
 
-/**
- * Scratchpad
- * 
- * plugin insertBulk(items){
- *  this.offsetManager.autoExtendBuffers(items.length);
- *  this.offsetManager.assignOffsets(items); // read item.keys and assign offsets to them.
- *  this.attrib1BufferManager.insertBulk(items.map(item => this.attrib1Block(item)), ); 
- *  this.attrib2BufferManager.insertBulk();
- *  if (this.attrib3isInNeed) this.attrib3BufferManager.insertBulk(items);
- *  this.globe.DrawRender();
- * }
- * 
- * useTheCaseThatRequiresAttrib3(){
- *  // generate items from other buffers if possible.
- * }
- * 
- * 
- * assignOffsets(items){
- * for (const item of items){
- * const offset = this.offsetManager.getOffset(item.key) || this.offsetManager.nextOffset();
- * item.__offset__ = offset;
- * 
- * allBuffers = [attrib1BufferManager, attrib2BufferManager, attrib3BufferManager]
- *  // // not single responsibility .. 
- * defrag(allBuffers){
- *  for (const bufferManager of allBuffers){
- *     bufferManager.defrag(this.offsetManager.offsetMap);
- *  }
- *  this.offsetManager._defrag();  
- * }
- * 
- */
-
-
-/**
- * 
- * attrib1BufferManager.insertBulk( items) { 
- *  gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
- *  for (const item of items) {
- *      const block = this.itemToBlock(item); // this changes based on inserted data structure and expected block structure.
- *      gl.bufferSubData(gl.ARRAY_BUFFER, item.__offset__, block);
- *  }
- * gl.bindBuffer(gl.ARRAY_BUFFER, null);
- * }
- * 
- * deleteBulk(offsets){
- *  gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
- * for (const offset of offsets) {
- * gl.bufferSubData(gl.ARRAY_BUFFER, offset, emptyBlock);
- * }
- * gl.bindBuffer(gl.ARRAY_BUFFER, null);
- * }
- * 
- * 
- * // 
- * defrag(offsetMap){
- *  const newArray = new Float32Array(itemCount * itemSize);
- *  const bufferData = this._getBufferData();
- *  let newOffSet = 0;
- *  for (const [key, offSet] of offsetMap) {
- *     const bufferOffset = offset;
- *    newArray.set(bufferData.slice(bufferOffset, bufferOffset + itemSize), newOffSet);
-        newOffset += itemSize * 4;
-    }
-    *
-    * gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
-    * 
- * }
- * 
- * ---------------- 
- 
- */
-
 const EXTRA_SIZE = 10;
 
 export class BufferOrchestrator {
@@ -137,7 +64,6 @@ export class BufferOrchestrator {
         for (const [key, { bufferManager, adaptor }] of bufferManagersMap) {
             bufferManager.insertBulk(items.map(adaptor), offsets);
         }
-
     }
 
 
@@ -155,7 +81,9 @@ export class BufferOrchestrator {
         }
         if (bufferKeys) {
             for (const key of bufferKeys) {
-                const { bufferManager, adaptor } = bufferManagersMap.get(key);
+                const bufferManagerComp = bufferManagersMap.get(key);
+                if (bufferManagerComp === undefined) throw new Error("updateBulk bufferKey does not exist");
+                const { bufferManager, adaptor } = bufferManagerComp;
                 bufferManager.insertBulk(items.map(adaptor), offsets);
             }
         } else {
@@ -228,7 +156,8 @@ export class BufferOrchestrator {
             }
         }
         this._defrag();
-        this._length = this._capacity = newCapacity;
+        this._length = offsetMap.size;
+        this._capacity = newCapacity;
         this.tombstoneOffsets = [];
     }
 

package/circle-line-chain/chain-api.md

@@ -1,336 +0,0 @@
-
-## insertBulk
-```json
-[
-    {
-    "chainID": "Mağrib",
-        "points": [
-            {
-                "id": "Fas",
-                "long": 0,
-                "lat": 0,
-            },
-            {
-                "id":"Cezayir",
-                "long": 10,
-                "lat": 20,
-            },
-            {
-                "id":"Tunus",
-                "long": 10,
-                "lat": 15
-            }
-        ],
-        "rgba": [1,0,0,1],
-        "dashRatio": 0.1,
-        "dashOpacity": 0.5,
-        "circleDashAngle": 15,
-    },
-]
-```
-
-```js
-                                        // ["distance"]
-updateCoordinatesBulk( items, contextTextWriterIDs=[]) {
-    for ( const item of items){
-        this._updateCoordsChain(item.chainID, item.points);
-    }
-}
-
-_updateCoordsChain(chainID, nodes){
-    const chain = this._chainMap(chainID); // chain is a `list`
-    const updateIDs = [];
-    for ( let i = 0; i< chain.length; i++){
-        if ( )
-    }
-}
-```
-
-
-```js
-// text
-const textContextMap = new Map(
-[
-    [
-            "distance",
-            {
-                writer: new ContextTextWriter(globe,),
-                coordsAdaptor: (item, index, array) => { // 
-                    const { long, lat } = globe.Math.GetMidPoint(item.long, item.lat, item.endLong, item.endLat);
-                    return {
-                        long,
-                        lat,
-                    }
-                },
-                textAdaptor: (item) => {
-                    const distance = globe.Math.GetDist2D(item.long, item.lat, item.endLong, item.endLat);
-                    return distance.toFixed(2) + "m";
-                },
-
-            }
-        ]
-    ]
-)
-
-                                                        // ["distance"]
-updateCoordinatesBulk(items, textWriterInjectionSubSetIDs = []) { 
-    
-}
-
-_updateChainCoords(chainID, points){
-    this._updateCoordsBuffer();
-}
-
-```
-
-
----
-
-```js
-const connectNaive = (p1, p2) => {p1.set("to",p2);p2.set("from":p1)};
-const Tanca = new Map([["long", 0],[ "lat",0], ["from", null], ["to":null]]);
-const Cebelitarik = new Map([["long", 0],[ "lat",0], ["from", null], ["to":null]]);
-const Cezayir = new Map([["long", 0],[ "lat",0], ["from", null], ["to":null]]);
-const Tunus = new Map([["long", 0],[ "lat",0], ["from", null], ["to":null]]);
-const Tanca = {id, long,lat, toID}
-
-plugin.insertBulk([
-    {
-        chainID: "Mağrib",
-        points: [
-            {Tanca, to: Cebelitarik}
-            {Cebelitarik, to:"Cezayir"},
-            {Cezayir, to: "Tunus"}, // implicitly connects to Tunus
-            {Tunus, to:null}
-        ]),
-        rgba: [1.0, 0.0, 0.0, 1.0],
-        dashRatio: 0.1,
-        dashOpacity: 0.5,
-        circleDashAngle: 15,
-    }
-]);
-```
-Advantage: User knows patterns of position data.
-Disadventage: Not json. 
-Bug: How to insert into middle?
-
-
-coordinateAdaptor => (v, i, array) => {
-    return {
-        (v.long + array[i+1].long) / 2.0,
-    }
-}
-
-```js
-const connect = (chainMap, chainID, node) => {
-    const chain = chainMap.get(chainID);
-
-}
-
-```
----
-
-## updateCoordinatesBulk
-
-updates pointMap;
-then updates buffers from updated version of pointMap; 
-
-imparatively open next or prev 
-
-```json
-[
-    {
-        "chainID": "Mağrib",
-        "points": [
-            {
-                ""Fas"": {
-               "     "l"ong": 100,
-                    "lat": 30
-                }
-            }
-        ]
-     }
-]
-```
-
-
-## deleteBulk 
-
-```json
-[
-    {
-        "chainID": "Mağrib",
-        "all": false,
-        "points": [
-            "Fas"
-        ]
-    }
-]
-```
-
-
-## ContextTextWriter
-
-```js
-{
-
-    writer: new ContextTextWriter(globe),
-    coordsAdaptor: (item) => 
-        if (item.get("next") === null) return false;
-        const goe = {
-        long: point.get("long"),
-        lat: point.get("lat"),
-        endLong: point.get("next")?.get("long"),
-        endLat: point.get("next")?.get("lat")
-        }
-        return globe.getMidPoint(geo.long,geo.lat, geo.endLong, geo.endLat)
-        }
-    },
-    textAdaptor: (item) => {
-        const angle = item.long, item.lat, item.endLong, item.endLat
-        );
-        if (angle < 0) {
-            return (angle + 360).toFixed(2) + "°";
-        }
-        return angle.toFixed(2) + "°";
-    },
-}
-```
-
----
-
-```js
-class Chain{
-    constractor(id, {rgba = [1,0,0,1], dashOpacity = 1, dashRatio = 0.1, circleDashAngle = 30  } = []){
-        this.id = 0;
-        this.idMap = new Map();
-        this.list = [];
-        this._rgba = rgba;
-        this._dashOpacity = dashOpacity;
-        this._dashRatio = dashRatio;
-        this._circleDashAngle = this.circleDashAngle;
-    }
-
-    add(item, fromID = null){
-        this.idMap.set(item.id, item);
-        let drawIndex;
-        if (from === null) {
-            this.list.push(item);
-            drawIndex = this.list.length - 1;
-        }
-
-        for ( let i = 0 ; i < this.list.length ; i++){
-            if ( fromID === this.list[i].id) {
-                drawIndex = i;
-                this.list.splice(i, 0, item);
-            }
-        }
-
-        this._update( [i, i-1]);
-    }
-
-    nextID(id){
-        // for loop if data source is a list. not performand.
-        // pointer if data rouce is a node. Clunky
-        // reconstract the map on (!append) operation.  
-    }
-}
-
-```
-
----
-## Design Priorities
-
-user interaction. insert, update, get data
-some processies are callback. callbacks uses the pattern user insert the data
-
-ContextTextWriter Plugin interaction I provided was imparative. I fit to that context because item had required data.
-Current context has uses next objects data in the chain. 
-
-What is the imparative way to get next data?
-A `function` - A `pointer` 
-If I go with a `pointer` I need to get the data with a `pointer`
-How to I provide a `function` to get the next data?
-```js
-getNodeData(chainID, id){
-    return this.chainMap.get(chainID).get(id)
-}
-// Problem to use this function the object of getNodeData must be created before creating contextTextWriterMap.
-```
-
-how minimally hold the data
-
-how to render
-
-
-
-Edit mod. user asks chain data and bind placeholders. 
-
-
-
-## API
-
-
-
-getChain(chainID) =>  {pointID, long, lat}
-
-
-
-## explore pattern
-
-(x, index, array ) doesnt fit. 
-
-
-
-
-## insertBulk
-```json
-[
-    {
-    "chainID": "Mağrib",
-        "points": [
-            {
-                "id": "Fas",
-                "long": 0,
-                "lat": 0,
-                "to": "Cezayir"
-            },
-            {
-                "id":"Cezayir",
-                "long": 10,
-                "lat": 20,
-                "to": "Tunus"
-            },
-            {
-                "id":"Tunus",
-                "long": 10,
-                "lat": 15
-            }
-        ],
-        "rgba": [1,0,0,1],
-        "dashRatio": 0.1,
-        "dashOpacity": 0.5,
-        "circleDashAngle": 15,
-    },
-]
-```
-
-```js
-                                        // ["distance"]
-updateCoordinatesBulk( items, contextTextWriterIDs=[]) {
-    for ( const item of items){
-        this._updateCoordsChain(item.chainID, item.points);
-    }
-}
-
-_updateCoordsChain(chainID, nodes){
-    const chain = this._chainMap(chainID); // chain is a `list`
-  
-
-}
-```
-
-
-## 
-Get data from user with `to` keyword. implicitly add from keyword
-