@pirireis/webglobeplugins 0.6.18 → 0.6.20

package/programs/line-on-globe/circle-accurate-flat.js

@@ -0,0 +1,200 @@
+import { createProgram } from "../../util/webglobjectbuilders";
+import { CameraUniformBlockString, CameraUniformBlockTotemCache } from "../totems/camerauniformblock";
+import { noRegisterGlobeProgramCache } from "../programcache";
+import { vaoAttributeLoader } from "../../util/account/util";
+import {
+    mercatorXYToGLPosition, POLE
+} from "../../util/shaderfunctions/geometrytransformations";
+
+/**
+* Warning:
+* Insert the points from the second index and skip 1 point as you placed 361 points
+*/
+
+const EDGE_COUNT = 62; // 1 for returning to the start point. 1 for cutting the circle into pieces. 
+
+const vertexShaderSource = `#version 300 es
+precision highp float;
+${CameraUniformBlockString}
+${mercatorXYToGLPosition}
+
+uniform float edge_count;
+
+
+in vec2 position2d;
+in vec4 color;
+in float dash_ratio;
+in float dash_opacity;
+
+out float interpolation;
+out vec4 v_color;
+out float v_dash_ratio;
+out float v_dash_opacity;
+out vec2 v_limp;
+void main() {
+    interpolation = float( gl_VertexID % 62 ) / ${EDGE_COUNT}.0;
+    if ( gl_VertexID % 62 == 0 ) { return; } // cut on the first point.
+    if ( is3D ) {
+        return;
+        v_limp = vec2(0.0, 0.0);
+    } else {
+        v_limp = position2d;
+        gl_Position = mercatorXYToGLPosition( position2d);
+    }
+    v_dash_ratio = dash_ratio;
+    v_dash_opacity = dash_opacity;
+    v_color = color;
+    gl_PointSize = 15.0;
+
+}`
+
+const fragmentShaderSource = `#version 300 es
+${POLE}
+precision highp float;
+uniform float opacity;
+in vec4 v_color;
+in float v_dash_ratio;
+in float v_dash_opacity;
+in float interpolation;
+in vec2 v_limp;
+out vec4 color;
+void main() {
+    if ( v_limp.x < -POLE || v_limp.x > POLE || v_limp.y < -POLE || v_limp.y > POLE ){ color = vec4(0.0,0.0,0.0,0.0); return; }
+    color = v_color;
+    color.a *= opacity;
+    if ( v_dash_ratio == 1.0 || v_dash_ratio == 0.0 ) return;
+    if (fract(interpolation / (2.0 * v_dash_ratio)) < 0.5 ) {
+        color.a *= v_dash_opacity;
+    }   
+}
+`;
+
+
+
+class Logic {
+
+
+    constructor(globe) {
+        this.globe = globe;
+        this.gl = globe.gl;
+        this._lastOpacity = 1.0;
+        this._lastMercatorMode = 0;
+        this.program = createProgram(this.gl, vertexShaderSource, fragmentShaderSource);
+
+        const { gl, program } = this;
+        this.program.uniforms = {
+            opacity: gl.getUniformLocation(program, "opacity"),
+            mercator_calculation_mode: gl.getUniformLocation(program, "mercator_calculation_mode")
+        };
+
+        { // initial uniform values
+            const currentProgram = gl.getParameter(gl.CURRENT_PROGRAM);
+            gl.useProgram(program);
+            gl.uniform1f(program.uniforms.opacity, 1.0);
+            gl.uniform1i(program.uniforms.mercator_calculation_mode, 0);
+            gl.useProgram(currentProgram);
+
+
+        }
+
+        {   // assign attribute locations
+            gl.bindAttribLocation(program, 0, "position2d");
+            gl.bindAttribLocation(program, 1, "color");
+            gl.bindAttribLocation(program, 2, "dash_ratio");
+            gl.bindAttribLocation(program, 3, "dash_opacity");
+        }
+
+        this.cameraBindingPoint = 0;
+        this.cameraBlockTotem = CameraUniformBlockTotemCache.get(globe);
+        const cameraBlockLocation = gl.getUniformBlockIndex(program, "CameraUniformBlock");
+        gl.uniformBlockBinding(program, cameraBlockLocation, this.cameraBindingPoint);
+    }
+
+
+    createVAO(centerObj, colorObj, dashRatioObj, dashOpacityObj) {
+        const { gl } = this;
+        const vao = gl.createVertexArray();
+        gl.bindVertexArray(vao);
+        {  // make this a function end import from account module. 
+            const { buffer, stride = 0, offset = 0, divisor = 1 } = centerObj;
+            vaoAttributeLoader(gl, buffer, 0, 2, stride, offset, null);
+        }
+
+        {
+            const { buffer, stride = 0, offset = 0, divisor = 1 } = colorObj;
+            vaoAttributeLoader(gl, buffer, 1, 4, stride, offset, null);
+        }
+        {
+            const { buffer, stride = 0, offset = 0, divisor = 1 } = dashRatioObj;
+            vaoAttributeLoader(gl, buffer, 2, 1, stride, offset, null);
+        }
+        {
+            const { buffer, stride = 0, offset = 0, divisor = 1 } = dashOpacityObj;
+            vaoAttributeLoader(gl, buffer, 3, 1, stride, offset, null);
+        }
+        gl.bindVertexArray(null);
+        gl.bindVertexArray(null);
+        return vao;
+    }
+
+
+    draw(vao, length, opacity) {
+        const { gl, program, cameraBlockTotem, cameraBindingPoint } = this;
+        gl.useProgram(program);
+        if (this._lastOpacity !== opacity) {
+            gl.uniform1f(program.uniforms.opacity, opacity);
+            this._lastOpacity = opacity;
+        }
+        gl.bindVertexArray(vao);
+        cameraBlockTotem.bind(cameraBindingPoint);
+        gl.drawArrays(gl.LINE_STRIP, 0, length * EDGE_COUNT)
+        // gl.drawArrays(gl.POINTS, 0, length * EDGE_COUNT)
+        cameraBlockTotem.unbind(cameraBindingPoint);
+        gl.bindVertexArray(null);
+    }
+
+
+    free() {
+        if (this.isFreed) return;
+        CameraUniformBlockTotemCache.release(this.globe);
+        this.gl.deleteProgram(this.program);
+        this.isFreed = true;
+    }
+}
+
+
+
+const CircleCache = Object.freeze({
+    get: (globe) => noRegisterGlobeProgramCache.getProgram(globe, Logic),
+    release: (globe) => noRegisterGlobeProgramCache.releaseProgram(globe, Logic)
+});
+
+
+function centerCoords2dflatDataCreator(globe, centerLong, centerLat, targetLong, targetLat, { startAngleOfCircle = null } = {}) {
+    const centerCoords2dflat = new Float32Array(EDGE_COUNT * 2);
+    const radius2d = globe.Math.GetDist2D(centerLong, centerLat, targetLong, targetLat);
+    let angle;
+    if (startAngleOfCircle === null) {
+        angle = globe.Math.GetAzimuthAngle(centerLong, centerLat, targetLong, targetLat);
+    } else {
+        angle = startAngleOfCircle;
+    }
+    const pointsLongLat = globe.Math.GetEllipseGeo(
+        centerLong,
+        centerLat,
+        radius2d,
+        radius2d,
+        angle,
+        360 / (EDGE_COUNT - 2), // 1 for return to start point, 1 for cutting circles
+    );
+
+    for (let i = 1; i < EDGE_COUNT; i++) {
+        const { long: lg, lat: lt } = pointsLongLat[i - 1];
+        centerCoords2dflat.set(globe.api_GetMercator2DPoint(lg, lt), i * 2);
+    }
+    return centerCoords2dflat;
+}
+
+export {
+    CircleCache, EDGE_COUNT, centerCoords2dflatDataCreator
+}

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

@@ -71,6 +71,7 @@ void main() {
     v_dash_ratio = dash_ratio;
     v_dash_opacity = dash_opacity;
     v_color = color;
+    gl_PointSize = 3.0;
 
 }`
 
@@ -178,6 +179,7 @@ class Logic {
         gl.bindVertexArray(vao);
         cameraBlockTotem.bind(cameraBindingPoint);
         gl.drawArraysInstanced(gl.LINE_STRIP, 0, EDGE_COUNT_ON_SPHERE + 1, length);
+        gl.drawArraysInstanced(gl.POINTS, 0, EDGE_COUNT_ON_SPHERE + 1, length);
         cameraBlockTotem.unbind(cameraBindingPoint);
         gl.bindVertexArray(null);
     }

package/programs/rings/partial-ring/piece-of-pie.js

@@ -9,7 +9,7 @@ import {
     longLatRadToCartesian3D,
     circleLimpFromLongLatRadCenterCartesian3D_accurate,
     circleLimpFromLongLatRadCenterMercatorCompass_accurate,
-    circleLimpFromLongLatRadCenterMercatorRealDistanceNew_accurate,
+    //circleLimpFromLongLatRadCenterMercatorRealDistanceNew_accurate,
     cartesian3DToGLPosition
 
 
@@ -28,6 +28,7 @@ const drawModeMap = Object.freeze({
 });
 
 
+//${ circleLimpFromLongLatRadCenterMercatorRealDistanceNew_accurate }
 
 const vertexShaderSource = `#version 300 es
 
@@ -38,7 +39,6 @@ ${mercatorXYToGLPosition}
 ${longLatRadToCartesian3D}
 ${circleLimpFromLongLatRadCenterCartesian3D_accurate}
 ${circleLimpFromLongLatRadCenterMercatorCompass_accurate}
-${circleLimpFromLongLatRadCenterMercatorRealDistanceNew_accurate}
 ${cartesian3DToGLPosition}
 
 uniform float edge_count;
@@ -113,7 +113,7 @@ void main() {
         gl_Position = cartesian3DToGLPosition(pos);
     }
     else {
-        vec2 pos2 = circleLimpFromLongLatRadCenterMercatorRealDistanceNew_accurate(center2d, radius_, angle);
+        vec2 pos2 = circleLimpFromLongLatRadCenterMercatorCompass_accurate(center2d, radius_, angle);
         v_pos = pos2;
         gl_Position = mercatorXYToGLPosition(pos2);
     }

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/util/jshelpers/data-filler.js

@@ -0,0 +1,19 @@
+const populateFloat32Array = Object.freeze({
+    fillFloat32Array: (length, data) => {
+        const result = new Float32Array(length);
+        result.fill(data);
+        return result;
+    },
+
+    fillWithListData: (length, listdata) => {
+        const result = new Float32Array(length * listdata.length);
+        let offset = 0;
+        for (let i = 0; i < length; i++) {
+            result.set(listdata, offset);
+            offset += listdata.length;
+        }
+        return result
+    }
+});
+
+export { populateFloat32Array };

package/util/shaderfunctions/geometrytransformations.js

@@ -344,11 +344,16 @@ vec2 circleLimpFromLongLatRadCenterMercatorRealDistanceNew_accurate(vec2 mercato
 
     float delta_long = atan(sin(ang) * sin_r * cos(center.y), cos_r - sin(center.y) * sin_lat);
     float longi = center.x + delta_long;
-    float y = mix(-80.5, 80.5, abs(lat + PI / 2.0));
-    return vec2(
+    // float y = mix(-80.5, 80.5, abs(center.y + PI / 2.0));
+    vec2 limp = vec2(
         R * longi,
-        R * log(tan(PI / 4.0 + lat / 2.0)) - y
+        R * log(tan(PI / 4.0 + lat / 2.0))
+    );
+    vec2 center_mercator = vec2(
+        R * center.x,
+        R * log(tan(PI/4.0+ center.y / 2.0))
     );
+    return mercator_center - center_mercator + limp;
 }`;
 
 export {

package/write-text/context-text3.js

@@ -160,6 +160,10 @@ export class ContextTextWriter3 {
     clear() {
         this.itemMap.clear();
     }
+
+    free() {
+        this.itemMap = null;
+    }
 }