@pirireis/webglobeplugins 0.17.0 → 1.0.2

package/programs/polygon-on-globe/texture-dem-triangle-test-plugin-triangle.js

@@ -1,204 +0,0 @@
-import { TextureDemTriangles } from "./texture-dem-triangles";
-import { partialTest } from "../../Math/tessellation/triangle-tessellation";
-/**
- * Loads a plugin with test data for TextureDemTriangles
- */
-const createTestBBOXES = () => {
-    const bboxes = [];
-    for (let i = 0; i < 6; i++) {
-        const north = Math.random() * Math.PI / 2 / 1.4; // random latitude
-        const west = Math.random() * -1 * Math.PI / 10; // random longitude
-        const south = north - Math.PI / 30; // random latitude
-        const east = west + Math.PI / 30; // random longitude
-        const nw = [west, north]; // random northWest
-        const se = [east, south]; // random southEast
-        bboxes.push({ northWest: nw, southEast: se });
-    }
-    return bboxes;
-};
-const demTextureBBOX = createTestBBOXES();
-function showTextureBBoxes(bboxes, demData = []) {
-    for (let i = 0; i < bboxes.length; i++) {
-        const bbox = bboxes[i];
-        console.log(`Texture BBOX ${i}: NW(${(bbox.northWest[0] * 180 / Math.PI).toFixed(2)}, ${(bbox.northWest[1] * 180 / Math.PI).toFixed(2)}) SE(${(bbox.southEast[0] * 180 / Math.PI).toFixed(2)}, ${(bbox.southEast[1] * 180 / Math.PI).toFixed(2)})`);
-        if (demData.length > i) {
-            const dem = demData[i];
-            let demStr = "DEM: \n";
-            for (let j = 0; j < dem.length; j++) {
-                demStr += dem[j].toFixed(1) + " ";
-                if ((j + 1) % 5 === 0) {
-                    demStr += "\n";
-                }
-            }
-            console.log(demStr);
-        }
-    }
-}
-const createTestDemTextures = () => {
-    const textures = [];
-    for (let i = 0; i < 6; i++) {
-        const texture = [];
-        for (let j = 0; j < 5 * 5; j++) {
-            const value = 100 * Math.random(); // random elevation value
-            texture.push(value);
-        }
-        textures.push(texture);
-    }
-    return textures;
-};
-// TODO: NAME IT longlat degree or radian
-export function createBuffersAndFill(gl, vec3s, longLats, indices) {
-    const positionBuffer = gl.createBuffer();
-    const longLatBuffer = gl.createBuffer();
-    const indexBuffer = gl.createBuffer();
-    gl.bindBuffer(gl.ARRAY_BUFFER, positionBuffer);
-    gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vec3s), gl.STATIC_DRAW);
-    gl.bindBuffer(gl.ARRAY_BUFFER, longLatBuffer);
-    gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(longLats), gl.STATIC_DRAW);
-    gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, indexBuffer);
-    gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), gl.STATIC_DRAW);
-    return {
-        buffers: {
-            positionBuffer,
-            longLatBuffer,
-            indexBuffer
-        }
-    };
-}
-export class TextureDemTrianglesTestPlugin {
-    globe = null;
-    textureDemTriangles = null;
-    vao = null;
-    drawOptions = null;
-    bufferInfo = null;
-    id;
-    uboTriangleStyle = null;
-    uboStringStyle = null;
-    showDemPoints = false;
-    bboxZooms = [];
-    constructor(id) {
-        this.id = id;
-        this.bboxZooms = [];
-    }
-    init(globe) {
-        this.globe = globe;
-        this.textureDemTriangles = new TextureDemTriangles(globe);
-        // set bboxes and dem textures
-        const demTextures = createTestDemTextures();
-        // const demTextureBBOX = createTestBBOXES();
-        this.textureDemTriangles.setDemTextures(demTextures, demTextureBBOX);
-        // 
-        // const baseZoom = 5;
-        showTextureBBoxes(demTextureBBOX, demTextures);
-        this.uboTriangleStyle = this.textureDemTriangles.createUBO();
-        this.uboStringStyle = this.textureDemTriangles.createUBO();
-        this.uboTriangleStyle.updateSingle("u_color", new Float32Array([1.0, 0.0, 0.0, 0.0]));
-        this.uboStringStyle.updateSingle("u_color", new Float32Array([.3, .3, .0, 1.0]));
-        const elementBuffer = globe.gl.createBuffer();
-        const bufferInfo = {
-            pos3dBufferInfo: {
-                buffer: globe.gl.createBuffer(),
-                stride: 0,
-                offset: 0,
-            },
-            longLatBufferInfo: {
-                buffer: globe.gl.createBuffer(),
-                stride: 0,
-                offset: 0,
-            },
-            elementBufferInfo: {
-                buffer: elementBuffer,
-                stride: 0,
-                offset: 0,
-            },
-            drawOptions: {
-                drawRange: { count: 0, first: 0 },
-                drawMode: globe.gl.TRIANGLES,
-                elementBuffer: elementBuffer,
-                elementBufferIndexType: globe.gl.UNSIGNED_INT
-            },
-            drawOptionsPoint: {
-                drawRange: { count: 0, first: 0 },
-                drawMode: globe.gl.POINTS,
-            },
-        };
-        this.vao = this.textureDemTriangles.createVAO(bufferInfo.pos3dBufferInfo, bufferInfo.longLatBufferInfo);
-        this.bufferInfo = bufferInfo;
-        this.setZoom(5);
-    }
-    setUniform(key, value) {
-        if (this.uboTriangleStyle) {
-            this.uboTriangleStyle.updateSingle(key, value);
-        }
-        if (this.uboStringStyle) {
-            this.uboStringStyle.updateSingle(key, value);
-        }
-        this.globe?.DrawRender();
-    }
-    setZoom(zoomLevel) {
-        this.bboxZooms = demTextureBBOX.map((bbox, index) => {
-            return {
-                bbox: {
-                    min: [bbox.northWest[0], bbox.southEast[1]], max: [bbox.southEast[0], bbox.northWest[1]]
-                }, zoom: index + zoomLevel + 1
-            };
-        });
-        // all world
-        this.bboxZooms.push({
-            bbox: {
-                min: [-180, -90],
-                max: [180, 90]
-            },
-            zoom: zoomLevel
-        });
-        if (!this.globe || !this.textureDemTriangles || !this.bufferInfo)
-            return;
-        // const p1: LongLatRadian = [-20 * Math.PI / 180, 50 * Math.PI / 180];
-        // const p2: LongLatRadian = [20 * Math.PI / 180, 50 * Math.PI / 180];
-        // const p3: LongLatRadian = [0, -10 * Math.PI / 180];
-        const p1 = [-60 * Math.PI / 180, 60 * Math.PI / 180];
-        const p2 = [60 * Math.PI / 180, 60 * Math.PI / 180];
-        const p3 = [0, -60 * Math.PI / 180];
-        // const p1_1: LongLatRadian = [-20 * Math.PI / 180, 30 * Math.PI / 180];
-        // const p2_2: LongLatRadian = [20 * Math.PI / 180, 20 * Math.PI / 180];
-        // const p3_3: LongLatRadian = [5, -20 * Math.PI / 180];
-        // const { vec3s, longLats, indices } = test1(zoomLevel, p1, p2, p3);
-        // const {vec3s, longLats, indices} = test1(5, p1_1, p2_2, p3_3);
-        const { vec3s, longLats, indices } = partialTest(this.bboxZooms, p1, p2, p3);
-        const bufferInfo = this.bufferInfo;
-        bufferInfo.drawOptions.drawRange.first = 0;
-        bufferInfo.drawOptions.drawRange.count = indices.length;
-        bufferInfo.drawOptionsPoint.drawRange.first = 0;
-        bufferInfo.drawOptionsPoint.drawRange.count = longLats.length / 2;
-        const gl = this.globe.gl;
-        // const longLatArray = createTestLongLatArray();
-        // const pos3dArray = createTestPos3dArray(longLatArray);
-        // @ts-ignore
-        gl.bindBuffer(gl.ARRAY_BUFFER, bufferInfo.pos3dBufferInfo.buffer);
-        gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vec3s), gl.STATIC_DRAW);
-        // @ts-ignore
-        gl.bindBuffer(gl.ARRAY_BUFFER, bufferInfo.longLatBufferInfo.buffer);
-        gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(longLats), gl.STATIC_DRAW);
-        // @ts-ignore
-        gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, bufferInfo.elementBufferInfo.buffer);
-        gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint32Array(indices), gl.STATIC_DRAW);
-        this.globe.DrawRender();
-        console.log("DrawIInfo", this.bufferInfo);
-    }
-    setShowDemPoints(show) {
-        this.showDemPoints = show;
-    }
-    draw3D() {
-        if (!this.globe || !this.textureDemTriangles || !this.vao || !this.bufferInfo)
-            return;
-        const gl = this.globe.gl;
-        gl.frontFace(gl.CW);
-        // @ts-ignore
-        this.textureDemTriangles.draw(this.vao, this.bufferInfo.drawOptions, this.uboTriangleStyle);
-        if (this.showDemPoints) {
-            // @ts-ignore
-            this.textureDemTriangles.draw(this.vao, this.bufferInfo.drawOptionsPoint, this.uboStringStyle);
-        }
-        gl.frontFace(gl.CCW);
-    }
-}

package/programs/polygon-on-globe/texture-dem-triangle-test-plugin.js

@@ -1,118 +0,0 @@
-import { TextureDemTriangles } from "./texture-dem-triangles";
-/**
- * Loads a plugin with test data for TextureDemTriangles
- */
-const TEST_ITEM_COUNT = 1000000;
-function createTestLongLatArray() {
-    const arr = new Float32Array(TEST_ITEM_COUNT * 2);
-    for (let i = 0; i < TEST_ITEM_COUNT; i++) {
-        arr[i * 2 + 0] = (Math.random() - 0.5) * Math.PI * 2; // longitude
-        arr[i * 2 + 1] = (Math.random() - 0.5) * Math.PI; // latitude
-    }
-    return arr;
-}
-function createTestPos3dArray(longLatArray) {
-    const arr = new Float32Array(TEST_ITEM_COUNT * 3);
-    for (let i = 0; i < TEST_ITEM_COUNT; i++) {
-        const long = longLatArray[i * 2 + 0];
-        const lat = longLatArray[i * 2 + 1];
-        // Convert long/lat to 3D position (simplified)
-        arr[i * 3 + 0] = Math.cos(lat) * Math.cos(long);
-        arr[i * 3 + 1] = Math.cos(lat) * Math.sin(long);
-        arr[i * 3 + 2] = Math.sin(lat);
-    }
-    return arr;
-}
-const createTestBBOXES = () => {
-    const bboxes = [];
-    for (let i = 0; i < 6; i++) {
-        const north = Math.random(); // random latitude
-        const west = Math.random() * -1; // random longitude
-        const south = north - Math.PI / 6; // random latitude
-        const east = west + Math.PI / 6; // random longitude
-        const nw = [west, north]; // random northWest
-        const se = [east, south]; // random southEast
-        bboxes.push({ northWest: nw, southEast: se });
-    }
-    return bboxes;
-};
-const createTestDemTextures = () => {
-    const textures = [];
-    for (let i = 0; i < 6; i++) {
-        const texture = [];
-        for (let j = 0; j < 5 * 5; j++) {
-            const value = 1000 * Math.random(); // random elevation value
-            texture.push(value);
-        }
-        textures.push(texture);
-    }
-    return textures;
-};
-export function createBuffersAndFill(gl, vec3s, longLats, indices) {
-    const positionBuffer = gl.createBuffer();
-    const longLatBuffer = gl.createBuffer();
-    const indexBuffer = gl.createBuffer();
-    gl.bindBuffer(gl.ARRAY_BUFFER, positionBuffer);
-    gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vec3s), gl.STATIC_DRAW);
-    gl.bindBuffer(gl.ARRAY_BUFFER, longLatBuffer);
-    gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(longLats), gl.STATIC_DRAW);
-    gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, indexBuffer);
-    gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), gl.STATIC_DRAW);
-    return {
-        buffers: {
-            positionBuffer,
-            longLatBuffer,
-            indexBuffer
-        }
-    };
-}
-export class TextureDemTrianglesTestPlugin {
-    globe = null;
-    textureDemTriangles = null;
-    vao = null;
-    drawOptions = null;
-    bufferInfo = null;
-    ubo = null;
-    id;
-    constructor(id) {
-        this.id = id;
-    }
-    init(globe) {
-        this.globe = globe;
-        this.textureDemTriangles = new TextureDemTriangles(globe);
-        // set bboxes and dem textures
-        const demTextures = createTestDemTextures();
-        const demTextureBBOX = createTestBBOXES();
-        this.textureDemTriangles.setDemTextures(demTextures, demTextureBBOX);
-        // 
-        this.ubo = this.textureDemTriangles.createUBO();
-        this.ubo.updateSingle("u_color", new Float32Array([1.0, 0.0, 0.0, 0.0]));
-        const bufferInfo = {
-            pos3dBufferInfo: {
-                buffer: globe.gl.createBuffer(),
-                stride: 0,
-                offset: 0,
-            },
-            longLatBufferInfo: {
-                buffer: globe.gl.createBuffer(),
-                stride: 0,
-                offset: 0,
-            },
-            drawOptions: { drawRange: { count: TEST_ITEM_COUNT, first: 0 } }
-        };
-        this.vao = this.textureDemTriangles.createVAO(bufferInfo.pos3dBufferInfo, bufferInfo.longLatBufferInfo);
-        const gl = globe.gl;
-        const longLatArray = createTestLongLatArray();
-        const pos3dArray = createTestPos3dArray(longLatArray);
-        gl.bindBuffer(gl.ARRAY_BUFFER, bufferInfo.pos3dBufferInfo.buffer);
-        gl.bufferData(gl.ARRAY_BUFFER, pos3dArray, gl.STATIC_DRAW);
-        gl.bindBuffer(gl.ARRAY_BUFFER, bufferInfo.longLatBufferInfo.buffer);
-        gl.bufferData(gl.ARRAY_BUFFER, longLatArray, gl.STATIC_DRAW);
-        this.bufferInfo = bufferInfo;
-    }
-    draw3D() {
-        if (!this.globe || !this.textureDemTriangles || !this.vao || !this.bufferInfo || !this.ubo)
-            return;
-        this.textureDemTriangles.draw(this.vao, this.bufferInfo.drawOptions, this.ubo);
-    }
-}

package/programs/polygon-on-globe/texture-dem-triangles.js

@@ -1,236 +0,0 @@
-import { createProgram } from "../../util/webglobjectbuilders";
-import { CameraUniformBlockTotemCache, CameraUniformBlockString } from "../totems/camerauniformblock";
-import { cartesian3DToGLPosition, } from "../../util/shaderfunctions/geometrytransformations";
-import { isPointInBBox } from "../../util/shaderfunctions/geometrytransformations";
-import { drawArrays } from "../../util/gl-util/draw-options/methods";
-import { attributeLoader } from "../../util/gl-util/buffer/attribute-loader";
-import { WORLD_RADIUS_3D } from "../../Math/constants";
-import { UniformBlockManager } from "../../util/gl-util/uniform-block/manager";
-const uniformBindingPoints = {
-    camera: 0,
-    style: 1,
-};
-const styleBlockManager = new UniformBlockManager('Style', [
-    { name: "u_color", type: "vec4", value: new Float32Array([0.0, 0.0, 0.0, 0.0]) },
-    { name: "u_pointSize", type: "float", value: new Float32Array([1.0]) },
-    { name: "u_opacity", type: "float", value: new Float32Array([1.0]) },
-], uniformBindingPoints.style);
-const vertexShaderSource = `#version 300 es
-#pragma vscode_glsllint_stage : vert
-
-precision highp float;
-precision highp sampler2DArray;
-
-${CameraUniformBlockString}
-
-${cartesian3DToGLPosition}
-in vec3 a_position;
-in vec2 a_longLat;
-uniform sampler2DArray u_demTexture; // <-- changed from array to single
-uniform vec4 u_demTextureBBOX[6];
-
-
-${styleBlockManager.glslCode()}
-
-
-// TODO: light directioni 
-// out vec3 v_position;
-// out vec3 v_normal;
-// out vec2 v_textureCoord;
-
-out vec4 v_color;
-
-
-${isPointInBBox}
-
-void main() {
-
-    float elevation = ${WORLD_RADIUS_3D}; // default elevation at sea level
-    v_color = vec4(1.0, 1.0, 1.0, 1.0); // default color white
-    for (int i = 0; i < 6; i++) {
-        if (isPointInBBox(a_longLat, u_demTextureBBOX[i])) {
-            vec2 uv = (a_longLat - u_demTextureBBOX[i].xy) / (u_demTextureBBOX[i].zw - u_demTextureBBOX[i].xy);
-            float altitude = texture(u_demTexture, vec3(uv, float(i))).r;
-            elevation += altitude;
-            v_color = mix(vec4(0.0, 0.0, 1.0, 1.0), vec4(1.0, 0.0, 0.0, 1.0), altitude / 100.0); // color from blue to red based on altitude
-            break;
-     }
-    }
-    if (u_color.a > 0.0) {
-        v_color = u_color;
-    }
-    v_color.a *= u_opacity; 
-    vec3 position = a_position * elevation;
-    gl_Position = cartesian3DToGLPosition(position);
-    gl_PointSize = 5.0; //u_pointSize;
-}
-`;
-const fragmentShaderSource = `#version 300 es
-#pragma vscode_glsllint_stage : frag
-
-precision highp float;
-in vec4 v_color;
-out vec4 outColor;
-void main() {
-    outColor = v_color;
-}
-`;
-export class TextureDemTriangles {
-    globe;
-    gl;
-    program;
-    // Later an injection will handle demTextures and demTextureBBOX
-    texture;
-    // demTextures: WebGLTexture[] = [];
-    // demTextureBBOX: Float32Array = new Float32Array(6 * 4); // 6 bounding boxes
-    cameraUniformBlock;
-    _publishedUBOs = [];
-    locations = {
-        attributes: {
-            a_position: -1,
-            a_longLat: -1,
-        },
-        uniforms: {
-            u_demTexture: -1,
-            u_demTextureBBOX: -1,
-            u_style: -1,
-        }
-    };
-    constructor(globe) {
-        this.globe = globe;
-        this.gl = globe.gl;
-        this.program = createProgram(this.gl, vertexShaderSource, fragmentShaderSource);
-        this.cameraUniformBlock = CameraUniformBlockTotemCache.get(this.globe);
-        this.cameraUniformBlock.assignBindingPoint(this.program, uniformBindingPoints.camera);
-        // get attribute locations
-        this.locations.attributes.a_position = this.gl.getAttribLocation(this.program, 'a_position');
-        this.locations.attributes.a_longLat = this.gl.getAttribLocation(this.program, 'a_longLat');
-        // get uniform locations
-        this.locations.uniforms.u_demTexture = this.gl.getUniformLocation(this.program, 'u_demTexture');
-        this.locations.uniforms.u_demTextureBBOX = this.gl.getUniformLocation(this.program, 'u_demTextureBBOX');
-        this.locations.uniforms.u_style = this.gl.getUniformBlockIndex(this.program, 'Style');
-        this.gl.uniformBlockBinding(this.program, this.locations.uniforms.u_style, uniformBindingPoints.style);
-        // create 3d texture
-        const texture = this.gl.createTexture();
-        this.gl.bindTexture(this.gl.TEXTURE_2D_ARRAY, texture);
-        // this.gl.texImage3D(this.gl.TEXTURE_2D_ARRAY, 0, this.gl.R32F, 25, 25, 6, 0, this.gl.RED, this.gl.FLOAT, null);
-        this.gl.texStorage3D(this.gl.TEXTURE_2D_ARRAY, 1, this.gl.R32F, 5, 5, 6);
-        // set texture parameters
-        const ext = this.gl.getExtension('OES_texture_float_linear');
-        console.log('OES_texture_float_linear extension:', ext);
-        this.gl.texParameteri(this.gl.TEXTURE_2D_ARRAY, this.gl.TEXTURE_MIN_FILTER, this.gl.LINEAR);
-        this.gl.texParameteri(this.gl.TEXTURE_2D_ARRAY, this.gl.TEXTURE_MAG_FILTER, this.gl.LINEAR);
-        this.gl.texParameteri(this.gl.TEXTURE_2D_ARRAY, this.gl.TEXTURE_WRAP_S, this.gl.CLAMP_TO_EDGE);
-        this.gl.texParameteri(this.gl.TEXTURE_2D_ARRAY, this.gl.TEXTURE_WRAP_T, this.gl.CLAMP_TO_EDGE);
-        this.gl.bindTexture(this.gl.TEXTURE_2D_ARRAY, null);
-        this.texture = texture;
-    }
-    createVAO(pos3dBufferInfo, longLatBufferInfo) {
-        const vao = this.gl.createVertexArray();
-        this.gl.bindVertexArray(vao);
-        attributeLoader(this.gl, pos3dBufferInfo, this.locations.attributes.a_position, 3);
-        attributeLoader(this.gl, longLatBufferInfo, this.locations.attributes.a_longLat, 2);
-        this.gl.bindVertexArray(null);
-        return vao;
-    }
-    setDemTextures(demTexturesData, demTextureBBOX) {
-        // bind textures to texture units
-        const gl = this.gl;
-        gl.bindTexture(gl.TEXTURE_2D_ARRAY, this.texture);
-        gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, false);
-        // turn off premultiply alpha
-        gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, false);
-        // bind and upload each texture to the 3D texture array
-        for (let i = 0; i < demTexturesData.length; i++) {
-            const data = demTexturesData[i];
-            if (data.length === 5 * 5) { // <-- FIXED
-                gl.texSubImage3D(gl.TEXTURE_2D_ARRAY, 0, 0, 0, i, 5, 5, 1, gl.RED, gl.FLOAT, new Float32Array(data));
-            }
-        }
-        // set uniform for texture units
-        const bboxVec4Array = new Float32Array(6 * 4);
-        for (let i = 0; i < demTextureBBOX.length; i++) {
-            const bbox = demTextureBBOX[i];
-            bboxVec4Array[i * 4 + 0] = bbox.northWest[0];
-            bboxVec4Array[i * 4 + 1] = bbox.southEast[1];
-            bboxVec4Array[i * 4 + 2] = bbox.southEast[0];
-            bboxVec4Array[i * 4 + 3] = bbox.northWest[1];
-        }
-        const currentProgram = gl.getParameter(gl.CURRENT_PROGRAM);
-        gl.useProgram(this.program);
-        gl.uniform4fv(this.locations.uniforms.u_demTextureBBOX, bboxVec4Array);
-        gl.bindTexture(gl.TEXTURE_2D_ARRAY, null);
-        gl.useProgram(currentProgram);
-    }
-    createUBO(bufferReadType = "STATIC_DRAW") {
-        const ubo = styleBlockManager.createUBO(this.gl, bufferReadType);
-        this._publishedUBOs.push(ubo);
-        return ubo;
-    }
-    free() {
-        this.gl.deleteProgram(this.program);
-        this.gl.deleteTexture(this.texture);
-        this._publishedUBOs.forEach(ubo => ubo.free());
-        this._publishedUBOs = [];
-        CameraUniformBlockTotemCache.release(this.globe);
-    }
-    draw(vao, drawOptions, ubo) {
-        const gl = this.gl;
-        gl.useProgram(this.program);
-        this.cameraUniformBlock.bind(uniformBindingPoints.camera);
-        // TURN OFF flip y for texture
-        // gl.disable(gl.DEPTH_TEST);
-        // gl.depthMask(false);
-        // gl.depthRange(0.0, 0.01);  // Use near 1% of depth range
-        // Step 3: Optionally: Set depth func to ALWAYS (to ignore previous depth)
-        //    This ensures your new geometry passes depth test regardless of prior depth values
-        gl.activeTexture(gl.TEXTURE0);
-        gl.bindTexture(gl.TEXTURE_2D_ARRAY, this.texture);
-        gl.uniform1i(this.locations.uniforms.u_demTexture, 0); // texture unit 0
-        // bind VAO and draw
-        gl.bindVertexArray(vao);
-        // bind UBO for style
-        ubo.bind();
-        drawOnTopBegin(gl);
-        drawArrays(gl, gl.POINTS, drawOptions);
-        drawOnTopEnd(gl);
-        gl.bindVertexArray(null);
-        gl.bindTexture(gl.TEXTURE_2D_ARRAY, null);
-        gl.useProgram(null);
-        ubo.unbind();
-        this.cameraUniformBlock.unbind(uniformBindingPoints.camera);
-    }
-    _getUniformBlockOffset(name) {
-        // hardcoded offsets based on std140 layout rules
-        const offsets = {
-            'u_color': 0,
-        };
-        const result = offsets[name];
-        if (result === undefined) {
-            throw new Error(`Unknown uniform block member: ${name}, names are: ${Object.keys(offsets).join(", ")}`);
-        }
-        return result;
-    }
-}
-function drawOnTopBegin(gl) {
-    // gl.disable(gl.DEPTH_TEST);
-    // gl.enable(gl.POLYGON_OFFSET_FILL);
-    // // Use an offset to "nudge" the depth value slightly closer or farther.
-    // // Common values are gl.polygonOffset(1.0, 1.0) or gl.polygonOffset(0.5, 0.5)
-    // gl.polygonOffset(1.0, 1.0);
-    // gl.depthRange(0.0, 0.0001);  // Use near 0.01% of depth range
-    // gl.enable(gl.POLYGON_OFFSET_FILL);
-    // You will need to experiment with these values!
-    // A good starting point is -1.0, -1.0.
-    // Negative values "pull" the fragments closer to the camera.
-    // gl.polygonOffset(-1.0, -1.0);
-    gl.enable(gl.POLYGON_OFFSET_FILL);
-    gl.polygonOffset(-1.0, -2.0);
-}
-function drawOnTopEnd(gl) {
-    // gl.enable(gl.DEPTH_TEST);
-    // gl.disable(gl.POLYGON_OFFSET_FILL);
-    // gl.disable(gl.POLYGON_OFFSET_FILL);
-    // gl.depthRange(0.0, 1.0);  // Restore full depth range
-    gl.disable(gl.POLYGON_OFFSET_FILL);
-}

package/programs/vectorfields/logics/drawrectangleparticles.js

@@ -1,112 +0,0 @@
-import { createProgram } from "../../../util/webglobjectbuilders";
-import { glProgramCache } from "../../programcache";
-import { SeaWaveUbo } from "./ubo-new";
-/**
- * [+] ubo
- */
-const vertexShaderSource = `#version 300 es
-precision highp float;
-` + SeaWaveUbo.glslCode() + `
-uniform sampler2D u_vector_field;
-in vec2 in_position;
-out vec3 base_color;
-
-
-vec2 read_value(const vec2 uv) {
-    vec2 value = texture(u_vector_field, uv).rg;
-    if ( value.x == escape_value || value.y == escape_value) {
-        return vec2(0.0);
-    }
-    return value;
-}
-    
-
-vec2 lookup_wind(const vec2 uv) { // gerek kalmayabilir. sampler linear methodu ayni isi yapiyor 
-    // return texture(u_vector_field, uv).rg; // lower-res hardware filtering
-    vec2 res = vec2(textureSize(u_vector_field, 0));
-    vec2 px = 1.0 / res;
-    vec2 vc = (floor(uv * res)) * px;
-    vec2 f = fract(uv * res);
-    vec2 tl = read_value(vc).rg;
-    vec2 tr = read_value(vc + vec2(px.x, 0)).rg;
-    vec2 bl = read_value(vc + vec2(0, px.y)).rg;
-    vec2 br = read_value(vc + px).rg;
-
-    return mix(mix(tl, tr, f.x), mix(bl, br, f.x), f.y);
-}
-
-
-void main(){
-    vec2 direction_vector = lookup_wind(in_position);
-    if (direction_vector.r == 0.0 && direction_vector.g == 0.0) return;
-    
-
-    vec2 limp;
-    if ( 0 == gl_VertexID) { limp = -tail_wing_base_limp; }
-    else if ( 1 == gl_VertexID) { limp = vec2( tail_wing_base_limp.x, -tail_wing_base_limp.y); }
-    else if ( 2 == gl_VertexID) { limp = tail_wing_base_limp; }
-    else  { limp = vec2(-tail_wing_base_limp.x,  tail_wing_base_limp.y); } // if ( 3 == gl_VertexID)
-
-    limp = (limp  * mat2( 
-        direction_vector.x, -direction_vector.y,
-        direction_vector.y, direction_vector.x)) / draw_texture_size;
-
-    vec2 pos = in_position * 2.0 - 1.0;
-    gl_Position = vec4(pos + limp, 0.0, 1.0);
-    base_color = color;
-}`;
-const fragmentShaderSource = `#version 300 es
-precision highp float;
-out vec4 outColor;
-in vec3 base_color;
-void main(){
-    outColor = vec4(base_color, 1.0);
-}`;
-class Logic {
-    constructor(gl) {
-        this.gl = gl;
-        [this.program,
-            this._vector_field_location] = this._createProgram();
-        // this.decoyBuffer = new DecoyBufferManager(gl);
-    }
-    _createProgram() {
-        const gl = this.gl;
-        const program = createProgram(gl, vertexShaderSource, fragmentShaderSource);
-        // ubo point
-        // const ubo_location = gl.getUniformBlockIndex(program, 'UBO');
-        // gl.uniformBlockBinding(program, ubo_location, UBO_BINDING_POINT);
-        SeaWaveUbo.assignBindingPoint(gl, program, 0);
-        return [program, gl.getUniformLocation(program, 'u_vector_field')];
-    }
-    /**
-     * @param {*} bufferManager | PingPongBufferManager
-     * @param {*} vectorTexture | RG32F texture R: x, G: y
-     * @param {*} uboManager | WaveParticalUboManager under ubo.js
-     */
-    draw(bufferManager, vectorTexture, uboManager) {
-        const { gl, program } = this;
-        gl.useProgram(program);
-        gl.bindVertexArray(bufferManager.getSourceVao());
-        // gl.bindVertexArray(this.decoyBuffer.getSourceVao());
-        uboManager.bind();
-        gl.activeTexture(gl.TEXTURE0);
-        gl.uniform1i(this._vector_field_location, 0);
-        gl.bindTexture(gl.TEXTURE_2D, vectorTexture);
-        gl.drawArraysInstanced(gl.TRIANGLE_FAN, 0, 4, bufferManager.length);
-        gl.drawArraysInstanced(gl.POINTS, 0, 4, bufferManager.length);
-        gl.bindVertexArray(null);
-        uboManager.unbind();
-    }
-    free() {
-        this.gl.deleteProgram(this.program);
-        this.program = null;
-    }
-}
-export const drawRectangleParticlesProgramCache = Object.freeze({
-    getProgram: (gl) => {
-        return glProgramCache.getProgram(gl, Logic);
-    },
-    releaseProgram: (gl) => {
-        glProgramCache.releaseProgram(gl, Logic);
-    }
-});