@pirireis/webglobeplugins 0.17.1 → 1.0.2

package/util/gl-util/uniform-block/{manager.js → manager.ts}

@@ -1,190 +1,232 @@
-const typeSizes = {
-    'float': 4,
-    'vec2': 8,
-    'vec3': 16, // vec3 takes up same space as vec4 due to alignment
-    'vec4': 16,
-    'mat2': 32, // 2 vec4s (16 * 2)
-    'mat3': 48, // 3 vec4s (16 * 3)
-    'mat4': 64, // 4 vec4s (16 * 4)
-    'int': 4,
-    'ivec2': 8,
-    'ivec3': 16,
-    'ivec4': 16,
-    'bool': 4
-};
-const typeAlignments = {
-    'float': 4,
-    'vec2': 8,
-    'vec3': 16,
-    'vec4': 16,
-    'mat2': 16, // aligns to vec4 boundary
-    'mat3': 16, // aligns to vec4 boundary
-    'mat4': 16, // aligns to vec4 boundary
-    'int': 4,
-    'ivec2': 8,
-    'ivec3': 16,
-    'ivec4': 16,
-    'bool': 4
-};
-const typeArrayConstructors = {
-    'float': Float32Array,
-    'vec2': Float32Array,
-    'vec3': Float32Array,
-    'vec4': Float32Array,
-    'mat2': Float32Array,
-    'mat3': Float32Array,
-    'mat4': Float32Array,
-    'int': Int32Array,
-    'ivec2': Int32Array,
-    'ivec3': Int32Array,
-    'ivec4': Int32Array,
-    'bool': Float32Array
-};
-export class UniformBlockManager {
-    /**
-     *
-     * @param {UniformBlockName} blockName
-     * @param {Array<UniformBlockMember} blockMembers
-     * @param {string} prefix usage name of block in the shader
-     */
-    blockName;
-    blockMembers;
-    bindingPoint;
-    prefix;
-    offsetMap;
-    size;
-    constructor(blockName, blockMembers, bindingPoint, prefix = "") {
-        this.blockName = blockName;
-        this.blockMembers = blockMembers;
-        this.bindingPoint = bindingPoint;
-        this.prefix = prefix;
-        this.offsetMap = this.__create_LayoutSTD140_OffsetMap();
-        this.size = this.__calculateSize();
-    }
-    glslCode() {
-        let code = `layout(std140) uniform ${this.blockName} {`;
-        for (const member of this.blockMembers) {
-            const { name, type } = member;
-            code += `${type} ${this.prefix}${name};`;
-        }
-        if (this.prefix) {
-            code += `} ${this.prefix};`;
-        }
-        else {
-            code += `};`;
-        }
-        return code;
-    }
-    createUBO(gl, bufferWriteType = "STATIC_DRAW") {
-        const ubo = gl.createBuffer();
-        gl.bindBuffer(gl.UNIFORM_BUFFER, ubo);
-        // @ts-ignore
-        gl.bufferData(gl.UNIFORM_BUFFER, this.size, gl[bufferWriteType]);
-        gl.bindBufferBase(gl.UNIFORM_BUFFER, 0, ubo);
-        for (const member of this.blockMembers) {
-            const { name, type, value = null } = member;
-            ;
-            const offset = this.offsetMap.get(name);
-            const data = (value === null) ? new typeArrayConstructors[type](typeSizes[type] / 4).fill(NaN) : value;
-            gl.bufferSubData(gl.UNIFORM_BUFFER, offset, data);
-        }
-        gl.bindBuffer(gl.UNIFORM_BUFFER, null);
-        return {
-            ubo,
-            update: (nameValueMap) => this.updateUBO(gl, ubo, nameValueMap),
-            updateSingle: (key, value) => this.updateUboSingle(gl, ubo, key, value),
-            bind: () => this.bind(gl, ubo),
-            unbind: () => this.unbind(gl),
-            free: () => gl.deleteBuffer(ubo),
-        };
-    }
-    updateUboSingle(gl, ubo, key, value) {
-        gl.bindBuffer(gl.UNIFORM_BUFFER, ubo);
-        const offset = this.offsetMap.get(key);
-        if (offset === undefined) {
-            throw new Error(`Uniform block member ${key} not found in offset map.\nPossible members: ${Array.from(this.offsetMap.keys()).join(", ")}`);
-        }
-        // @ts-ignore
-        const type = this.blockMembers.find(member => member.name === key).type;
-        let data;
-        if (Array.isArray(value)) {
-            data = new typeArrayConstructors[type](value);
-        }
-        else if (typeof value === 'number') {
-            data = new typeArrayConstructors[type]([value]);
-        }
-        else if (value instanceof ArrayBuffer) {
-            data = new typeArrayConstructors[type](value);
-        }
-        else if (ArrayBuffer.isView(value) && !(value instanceof DataView)) {
-            data = (typeof value === 'number') ? new typeArrayConstructors[type]([value]) : new typeArrayConstructors[type](value);
-        }
-        else {
-            throw new Error(`Unsupported value type for ${key}: ${typeof value}.\n Supported types are: number, Array, ArrayBuffer, TypedArray.`);
-        }
-        gl.bufferSubData(gl.UNIFORM_BUFFER, offset, data);
-        gl.bindBuffer(gl.UNIFORM_BUFFER, null);
-    }
-    updateUBO(gl, ubo, nameValueMap) {
-        gl.bindBuffer(gl.UNIFORM_BUFFER, ubo);
-        for (const [name, value] of nameValueMap.entries()) {
-            const offset = this.offsetMap.get(name);
-            if (offset === undefined) {
-                throw new Error(`Uniform block member ${name} not found in offset map.\nPossible members: ${Array.from(this.offsetMap.keys()).join(", ")}`);
-            }
-            // @ts-ignore
-            const type = this.blockMembers.find(member => member.name === name).type;
-            let data;
-            if (Array.isArray(value)) {
-                data = new typeArrayConstructors[type](value);
-            }
-            else if (typeof value === 'number') {
-                data = new typeArrayConstructors[type]([value]);
-            }
-            else if (value instanceof ArrayBuffer) {
-                data = new typeArrayConstructors[type](value);
-            }
-            else if (ArrayBuffer.isView(value) && !(value instanceof DataView))
-                data = (typeof value === 'number') ? new typeArrayConstructors[type]([value]) : new typeArrayConstructors[type](value);
-            else {
-                throw new Error(`Unsupported value type for ${name}: ${typeof value}.\n Supported types are: number, Array, ArrayBuffer, TypedArray.`);
-            }
-            gl.bufferSubData(gl.UNIFORM_BUFFER, offset, data);
-        }
-        gl.bindBuffer(gl.UNIFORM_BUFFER, null);
-    }
-    // call this after linking the program
-    assignBindingPoint(gl, program) {
-        const blockIndex = gl.getUniformBlockIndex(program, this.blockName);
-        gl.uniformBlockBinding(program, blockIndex, this.bindingPoint);
-    }
-    // call this before drawing
-    bind(gl, ubo) {
-        gl.bindBufferBase(gl.UNIFORM_BUFFER, this.bindingPoint, ubo);
-    }
-    // call this right after drawing
-    unbind(gl) {
-        gl.bindBufferBase(gl.UNIFORM_BUFFER, this.bindingPoint, null);
-    }
-    // implicit methods
-    __create_LayoutSTD140_OffsetMap() {
-        let offset = 0;
-        const offsetMap = new Map();
-        for (const member of this.blockMembers) {
-            const { name, type } = member;
-            const size = typeSizes[type];
-            const alignment = typeAlignments[type];
-            const padding = (alignment - (offset % alignment)) % alignment;
-            offset += padding;
-            offsetMap.set(name, offset);
-            offset += size;
-        }
-        return offsetMap;
-    }
-    // __create_LayoutSTD140_OffsetMap() should be called before this
-    __calculateSize() {
-        const lastOffset = Array.from(this.offsetMap.values()).pop() || 0;
-        const lastItemAlignment = typeAlignments[this.blockMembers[this.blockMembers.length - 1].type];
-        return lastOffset + lastItemAlignment;
-    }
-}
+import { UBOHandler } from "../../../types";
+
+
+
+const typeSizes = {
+    'float': 4,
+    'vec2': 8,
+    'vec3': 16,  // vec3 takes up same space as vec4 due to alignment
+    'vec4': 16,
+    'mat2': 32,  // 2 vec4s (16 * 2)
+    'mat3': 48,  // 3 vec4s (16 * 3)
+    'mat4': 64,  // 4 vec4s (16 * 4)
+    'int': 4,
+    'ivec2': 8,
+    'ivec3': 16,
+    'ivec4': 16,
+    'uvec4': 16,
+    'uint': 4,
+    'bool': 4,
+};
+
+const typeAlignments = {
+    'float': 4,
+    'vec2': 8,
+    'vec3': 16,
+    'vec4': 16,
+    'mat2': 16,  // aligns to vec4 boundary
+    'mat3': 16,  // aligns to vec4 boundary
+    'mat4': 16,  // aligns to vec4 boundary
+    'int': 4,
+    'ivec2': 8,
+    'ivec3': 16,
+    'ivec4': 16,
+    'uvec4': 16,
+    'uint': 4,
+    'bool': 4,
+};
+
+
+const typeArrayConstructors = {
+    'float': Float32Array,
+    'vec2': Float32Array,
+    'vec3': Float32Array,
+    'vec4': Float32Array,
+    'mat2': Float32Array,
+    'mat3': Float32Array,
+    'mat4': Float32Array,
+    'int': Int32Array,
+    'ivec2': Int32Array,
+    'ivec3': Int32Array,
+    'ivec4': Int32Array,
+    'bool': Float32Array,
+    'uint': Uint32Array,
+    'uvec2': Uint32Array,
+    'uvec3': Uint32Array,
+    'uvec4': Uint32Array,
+
+};
+
+type UniformBlockMember = {
+    name: string;
+    type: keyof typeof typeSizes;
+    value: Float32Array | Int32Array | Uint32Array | ArrayBuffer | DataView | null;
+};
+
+type NameValueMap = Map<string, Float32Array | Int32Array | Uint32Array | ArrayBuffer | DataView>;
+
+type UniformBlockName = string;
+
+// TODO: the input types should be all same for a single block.
+// no need to ask for typed array constructor in the constructor
+// eacher remove it and raise error when different types are used in the same block
+// or implicitly manage multiple blocks with different types
+
+
+export class UniformBlockManager {
+
+    /**
+     * 
+     * @param {UniformBlockName} blockName 
+     * @param {Array<UniformBlockMember} blockMembers 
+     * @param {string} prefix usage name of block in the shader 
+     */
+
+    blockName: string;
+    blockMembers: Array<UniformBlockMember>;
+    bindingPoint: number;
+    prefix: string;
+    offsetMap: Map<string, number>;
+    size: number;
+
+    constructor(blockName: string, blockMembers: Array<UniformBlockMember>, bindingPoint: number, prefix: string = "") {
+        this.blockName = blockName;
+        this.blockMembers = blockMembers;
+        this.bindingPoint = bindingPoint;
+        this.prefix = prefix;
+        this.offsetMap = this.__create_LayoutSTD140_OffsetMap();
+        this.size = this.__calculateSize();
+    }
+
+
+
+    glslCode() {
+        let code = `layout(std140) uniform ${this.blockName} {`;
+        for (const member of this.blockMembers) {
+            const { name, type } = member;
+            code += `${type} ${this.prefix}${name};`;
+        }
+        if (this.prefix) {
+            code += `} ${this.prefix};`;
+        } else {
+            code += `};`;
+        }
+        return code;
+    }
+
+
+    createUBO(gl: WebGL2RenderingContext, bufferWriteType: string = "STATIC_DRAW"): UBOHandler {
+        const ubo = gl.createBuffer();
+        gl.bindBuffer(gl.UNIFORM_BUFFER, ubo);
+        // @ts-ignore
+        gl.bufferData(gl.UNIFORM_BUFFER, this.size, gl[bufferWriteType]);
+        gl.bindBufferBase(gl.UNIFORM_BUFFER, 0, ubo);
+
+        for (const member of this.blockMembers) {
+            const { name, type, value = null } = member;;
+            const offset = this.offsetMap.get(name) as number;
+            const data = (value === null) ? new typeArrayConstructors[type](typeSizes[type] / 4).fill(NaN) : value;
+            gl.bufferSubData(gl.UNIFORM_BUFFER, offset, data);
+        }
+        gl.bindBuffer(gl.UNIFORM_BUFFER, null);
+
+        return { // TODO typedef this, encapsulate this in a class or something, ask ai
+            ubo,
+            update: (nameValueMap: NameValueMap) => this.updateUBO(gl, ubo, nameValueMap),
+            updateSingle: (key: string, value: Float32Array | Int32Array | Uint32Array | ArrayBuffer | DataView) => this.updateUboSingle(gl, ubo, key, value),
+            bind: () => this.bind(gl, ubo),
+            unbind: () => this.unbind(gl),
+            free: () => gl.deleteBuffer(ubo),
+        };
+    }
+
+    updateUboSingle(gl: WebGL2RenderingContext, ubo: WebGLBuffer, key: string, value: Float32Array | Int32Array | Uint32Array | ArrayBuffer | DataView) { // TEST THIS
+        gl.bindBuffer(gl.UNIFORM_BUFFER, ubo);
+        const offset = this.offsetMap.get(key);
+        if (offset === undefined) {
+            throw new Error(`Uniform block member ${key} not found in offset map.\nPossible members: ${Array.from(this.offsetMap.keys()).join(", ")}`);
+        }
+        const memberType = this.blockMembers.find(member => member.name === key)!.type;
+        let data: Float32Array | Int32Array | Uint32Array | ArrayBuffer | DataView;
+        if (Array.isArray(value)) {
+            data = new typeArrayConstructors[memberType](value);
+        } else if (typeof value === 'number') {
+            data = new typeArrayConstructors[memberType]([value]);
+        } else if (value instanceof ArrayBuffer) {
+            data = new typeArrayConstructors[memberType](value);
+        } else if (ArrayBuffer.isView(value) && !(value instanceof DataView)) {
+            data = (typeof value === 'number') ? new typeArrayConstructors[memberType]([value]) : new typeArrayConstructors[memberType](value);
+        } else {
+            throw new Error(`Unsupported value type for ${key}: ${typeof value}.\n Supported types are: number, Array, ArrayBuffer, TypedArray.`);
+        }
+        gl.bufferSubData(gl.UNIFORM_BUFFER, offset, data);
+        gl.bindBuffer(gl.UNIFORM_BUFFER, null);
+
+    }
+
+    updateUBO(gl: WebGL2RenderingContext, ubo: WebGLBuffer, nameValueMap: NameValueMap) {
+        gl.bindBuffer(gl.UNIFORM_BUFFER, ubo);
+        for (const [name, value] of nameValueMap.entries()) {
+            const offset = this.offsetMap.get(name);
+            if (offset === undefined) {
+                throw new Error(`Uniform block member ${name} not found in offset map.\nPossible members: ${Array.from(this.offsetMap.keys()).join(", ")}`);
+            }
+            const type = this.blockMembers.find(member => member.name === name)!.type;
+            let data: Float32Array | Int32Array | Uint32Array | ArrayBuffer | DataView;
+            if (Array.isArray(value)) {
+                data = new typeArrayConstructors[type](value);
+            } else if (typeof value === 'number') {
+                data = new typeArrayConstructors[type]([value]);
+            } else if (value instanceof ArrayBuffer) {
+                data = new typeArrayConstructors[type](value);
+            } else if (ArrayBuffer.isView(value) && !(value instanceof DataView))
+                data = (typeof value === 'number') ? new typeArrayConstructors[type]([value]) : new typeArrayConstructors[type](value);
+            else {
+                throw new Error(`Unsupported value type for ${name}: ${typeof value}.\n Supported types are: number, Array, ArrayBuffer, TypedArray.`);
+            }
+            gl.bufferSubData(gl.UNIFORM_BUFFER, offset, data);
+        }
+        gl.bindBuffer(gl.UNIFORM_BUFFER, null);
+    }
+
+    // call this after linking the program
+    assignBindingPoint(gl: WebGL2RenderingContext, program: WebGLProgram) { // TODO: this can cause bugs on multiglobe
+        const blockIndex = gl.getUniformBlockIndex(program, this.blockName);
+        gl.uniformBlockBinding(program, blockIndex, this.bindingPoint);
+    }
+
+    // call this before drawing
+    bind(gl: WebGL2RenderingContext, ubo: WebGLBuffer) {
+        gl.bindBufferBase(gl.UNIFORM_BUFFER, this.bindingPoint, ubo);
+    }
+
+    // call this right after drawing
+    unbind(gl: WebGL2RenderingContext) {
+        gl.bindBufferBase(gl.UNIFORM_BUFFER, this.bindingPoint, null);
+    }
+
+
+    // implicit methods
+    __create_LayoutSTD140_OffsetMap(): Map<string, number> {
+        let offset = 0;
+        const offsetMap = new Map();
+        for (const member of this.blockMembers) {
+            const { name, type } = member;
+            const size = typeSizes[type];
+            const alignment = typeAlignments[type];
+            const padding = (alignment - (offset % alignment)) % alignment;
+            offset += padding;
+            offsetMap.set(name, offset);
+            offset += size;
+        }
+        return offsetMap;
+    }
+
+    // __create_LayoutSTD140_OffsetMap() should be called before this
+    __calculateSize() {
+        const lastOffset = Array.from(this.offsetMap.values()).pop() as number || 0;
+        const lastItemAlignment = typeAlignments[this.blockMembers[this.blockMembers.length - 1].type];
+        return lastOffset + lastItemAlignment;
+    }
+
+}

package/util/{webglobe/gldefaultstates.js → globe-default-gl-states.ts}

@@ -1,4 +1,5 @@
-export function defaultblendfunction(gl) {
-    gl.blendEquation(gl.FUNC_ADD); // TODO: TESTING THIS
-    gl.blendFuncSeparate(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA, gl.ONE, gl.ONE_MINUS_SRC_ALPHA);
-}
+
+export function defaultblendfunction(gl: WebGL2RenderingContext): void {
+    gl.blendEquation(gl.FUNC_ADD); // TODO: TESTING THIS
+    gl.blendFuncSeparate(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA, gl.ONE, gl.ONE_MINUS_SRC_ALPHA);
+}

package/util/helper-methods.ts

@@ -0,0 +1,9 @@
+export function hashColorTo4IntArray(pickedColor: string): [number, number, number, number] {
+
+    const pickedHex = pickedColor.replace('#', '');
+    const pickedR = parseInt(pickedHex.substring(0, 2), 16) / 255;
+    const pickedG = parseInt(pickedHex.substring(2, 4), 16) / 255;
+    const pickedB = parseInt(pickedHex.substring(4, 6), 16) / 255;
+    const pickedA = parseInt(pickedHex.substring(6, 8) || 'FF', 16) / 255;
+    return [pickedR, pickedG, pickedB, pickedA];
+}

package/util/index.js

@@ -1,10 +1,9 @@
-"use strict";
-// import * as webglobjectbuilders from './webglobjectbuilders';
-// import * as shaderfunctions from './shaderfunctions';
-// import * as geometry from './geometry';
-// import * as webglobe from './webglobe';
-// export { webglobjectbuilders, shaderfunctions, geometry, webglobe };
-// export * from './webglobe';
-// export * from './webglobjectbuilders';
-// export * from './shaderfunctions';
-// export * from './geometry';
+// import * as webglobjectbuilders from './webglobjectbuilders';
+// import * as shaderfunctions from './shaderfunctions';
+// import * as geometry from './geometry';
+// import * as webglobe from './webglobe';
+// export { webglobjectbuilders, shaderfunctions, geometry, webglobe };
+// export * from './webglobe';
+// export * from './webglobjectbuilders';
+// export * from './shaderfunctions';
+// export * from './geometry';

package/util/interpolation/index.js

@@ -1 +0,0 @@
-"use strict";

package/util/interpolation/timetrack/index.js

@@ -1,2 +1,9 @@
-const createWorker = () => new Worker(new URL('./web-worker.js', import.meta.url), { type: 'module' });
-export { createWorker };
+const createWorker = () =>  new Worker(
+            new URL(
+                './web-worker.js',
+                import.meta.url
+            ), { type: 'module' }
+        );
+
+
+export {createWorker}