@pirireis/webglobeplugins 1.0.3 → 1.0.5

package/webglobeplugins/semiplugins/shape-on-terrain/terrain-polygon/data/polygon-to-triangles.js

@@ -0,0 +1,76 @@
+/**
+ * # Purpose
+ * Divide long edges of polygons into smaller segments
+ *
+ * This algorithm should be called after earcutting / triangulation.
+ * Then earcut should run second time to further divide long edges.
+ *
+ * populate points on a arc between two given points on a sphere
+ *
+ */
+import earcut from "earcut";
+function _isReal(a, b, len) {
+    return (Math.abs(a - b) === 1 || Math.abs(a - b) === len);
+}
+function edgeKey(a, b) {
+    // undirected edge key
+    return a < b ? `${a},${b}` : `${b},${a}`;
+}
+export function calculateRealEdges(geom, indeces) {
+    const realEdges = [];
+    const boundaryEdges = new Set();
+    // Build boundary edges for all geometries, using a running vertex offset
+    // (must match how triangulation() concatenates vertices and offsets indices).
+    let vertexIndexOffset = 0;
+    for (const g of geom) {
+        const vertexCount = g.vertices.length / 2;
+        if (!Number.isInteger(vertexCount) || vertexCount <= 1) {
+            vertexIndexOffset += vertexCount; // still advance consistently
+            continue;
+        }
+        // Build rings: [0..holes[0]), [holes[0]..holes[1]), ... , [holes[last]..vertexCount)
+        const ringStarts = [0, ...(g.holes ?? [])];
+        const ringEnds = [...(g.holes ?? []), vertexCount];
+        for (let r = 0; r < ringStarts.length; r++) {
+            const start = ringStarts[r];
+            const end = ringEnds[r];
+            if (end - start < 2)
+                continue;
+            for (let i = start; i < end - 1; i++) {
+                boundaryEdges.add(edgeKey(vertexIndexOffset + i, vertexIndexOffset + i + 1));
+            }
+            // close the ring
+            boundaryEdges.add(edgeKey(vertexIndexOffset + (end - 1), vertexIndexOffset + start));
+        }
+        vertexIndexOffset += vertexCount;
+    }
+    // Mark each triangle edge as "real" iff it belongs to any boundary ring edge
+    for (let i = 0; i < indeces.length; i += 3) {
+        const a = indeces[i];
+        const b = indeces[i + 1];
+        const c = indeces[i + 2];
+        realEdges.push(boundaryEdges.has(edgeKey(a, b)));
+        realEdges.push(boundaryEdges.has(edgeKey(b, c)));
+        realEdges.push(boundaryEdges.has(edgeKey(c, a)));
+    }
+    return realEdges;
+}
+function triangulation(polygon) {
+    const finalVertices = [];
+    const finalIndices = [];
+    let vertexIndexOffset = 0;
+    for (const geom of polygon.geometry) {
+        const indices = earcut(geom.vertices, geom.holes, 2);
+        finalVertices.push(...geom.vertices);
+        for (const index of indices) {
+            finalIndices.push(index + vertexIndexOffset);
+        }
+        vertexIndexOffset += geom.vertices.length / 2;
+    }
+    return {
+        key: polygon.key,
+        vertices: finalVertices,
+        indices: finalIndices,
+    };
+}
+export { triangulation };

package/{semiplugins → webglobeplugins/semiplugins}/shape-on-terrain/terrain-polygon/data/worker-contact.js

@@ -1,4 +1,4 @@
-import { DemTextureManagerCache } from "../../../../programs/totems/dem-textures-manager";
+import { DemTextureManagerCache } from "../../../../programs/totems/attachments/dem-textures-manager";
 import { RADIAN } from "../../../../Math/methods";
 export class WorkerContact {
     _masterWorker;
@@ -10,12 +10,13 @@ export class WorkerContact {
         this.onResult = onResult;
         // Initialize the Master Worker
         // @ts-ignore
-        this._masterWorker = new Worker(new URL("./master-worker.js", import.meta.url), { type: 'module' });
+        this._masterWorker = new Worker(new URL("./master-worker.ts", import.meta.url), { type: 'module' });
         this._masterWorker.onmessage = (event) => {
             this.onResult(event.data);
         };
         // Initialize Master Worker state
         this._masterWorker.postMessage({
+            arcState: this._options.drawEdges,
             pickableState: this._options.pickable,
             variativeColorsOn: this._options.variativeColorsOn,
             insertDeleteQueue: [],

package/webglobeplugins/semiplugins/shape-on-terrain/terrain-polygon/data/worker.js

@@ -0,0 +1,162 @@
+/// <reference lib="webworker" />
+/* eslint-disable no-restricted-globals */
+import { Cache } from "./cache";
+import { partialTessellation, uint32Escape, zoomLevelShowThreshold } from "../../../../Math/tessellation/triangle-tessellation";
+const cache = new Cache();
+let _pickableState = false;
+let _arcState = false;
+let _variativeColorsOnState = false;
+let showThreshold = 0;
+const NO_COLOR_ALPHA = 255;
+const MAX_ALPHA_VALUE = 254;
+function clamp01(value) {
+    if (!Number.isFinite(value))
+        return 0;
+    return Math.max(0, Math.min(1, value));
+}
+function colorToBytes(color) {
+    if (!color)
+        return [0, 0, 0, NO_COLOR_ALPHA];
+    const r = Math.round(clamp01(color[0]) * 255);
+    const g = Math.round(clamp01(color[1]) * 255);
+    const b = Math.round(clamp01(color[2]) * 255);
+    // Reserve 255 for "no color" sentinel.
+    const a = Math.round(clamp01(color[3]) * MAX_ALPHA_VALUE);
+    return [r, g, b, a];
+}
+self.onmessage = (event) => {
+    try {
+        const { bboxes, insertDeleteQueue, pickableState, variativeColorsOn, arcState } = event.data;
+        if (variativeColorsOn !== undefined) {
+            _variativeColorsOnState = variativeColorsOn;
+        }
+        if (pickableState !== undefined) {
+            _pickableState = pickableState;
+        }
+        if (arcState !== undefined) {
+            _arcState = arcState;
+        }
+        // Process insert/delete queue
+        if (insertDeleteQueue && insertDeleteQueue.length > 0) {
+            if (insertDeleteQueue[0] === "__CLEAR_ALL_ITEMS__") {
+                insertDeleteQueue.shift();
+                cache.clear();
+            }
+            for (const item of insertDeleteQueue) {
+                if (typeof item === "string") {
+                    cache.remove(item);
+                }
+                else {
+                    cache.insert(item.key, item);
+                }
+            }
+        }
+        // Update bboxes if provided
+        if (bboxes) {
+            cache.setBBOXes(bboxes);
+            if (bboxes.length > 0) {
+                showThreshold = zoomLevelShowThreshold(bboxes[0].zoom, 0.05);
+            }
+        }
+        const trianglesInView = cache.search();
+        const results = [];
+        // Convert bbox to BBoxZoom format for partialTessellation
+        // @ts-ignore
+        const bboxZooms = bboxes
+            ? bboxes.map((b) => ({
+                bbox: {
+                    min: [b.minX, b.minY],
+                    max: [b.maxX, b.maxY],
+                },
+                zoom: b.zoom,
+            }))
+            : [];
+        let counter = 0;
+        let indexCounter = 0;
+        let arcCounter = 0;
+        for (const triangle of trianglesInView) {
+            if (triangle.tessellationMeta.showThreshold * 0.075 > showThreshold) {
+                continue;
+            }
+            const tessResult = triangle.tessellationMeta.showThreshold < showThreshold
+                ? partialTessellation(triangle.tessellationMeta, bboxZooms, 5, _arcState)
+                : triangle.tessellationMeta.shortCut;
+            const result = {
+                vec3s: tessResult.vec3s,
+                indices: tessResult.indices,
+                longLats: tessResult.longLats,
+                realEdgeArcIndices: _arcState ? tessResult.realEdgeArcIndices : null,
+            };
+            counter += result.vec3s.length;
+            indexCounter += result.indices.length;
+            if (_pickableState) {
+                result.pickIndex = triangle.polygon.index;
+            }
+            if (_arcState) {
+                arcCounter += result.realEdgeArcIndices ? result.realEdgeArcIndices.length : 0;
+            }
+            if (_variativeColorsOnState) {
+                result.variativeColors = colorToBytes(triangle.polygon.color);
+            }
+            results.push(result);
+        }
+        const totalArcCount = arcCounter;
+        const output = {
+            vec3s: new Float32Array(counter),
+            longLats: new Float32Array((counter / 3) * 2),
+            indices: new Uint32Array(indexCounter),
+            realEdgeArcIndices: _arcState ? new Uint32Array(totalArcCount) : null,
+            pickIndices: _pickableState ? new Float32Array(counter / 3) : null,
+            variativeColors: _variativeColorsOnState ? new Uint8Array((counter / 3) * 4) : null,
+        };
+        let currentVertexOffset = 0;
+        let indexOffset = 0;
+        let arcOffset = 0;
+        for (const result of results) {
+            output.vec3s.set(result.vec3s, currentVertexOffset);
+            output.longLats.set(result.longLats, (currentVertexOffset / 3) * 2);
+            const startVertex = currentVertexOffset / 3;
+            for (let i = 0; i < result.indices.length; i++) {
+                output.indices[indexOffset + i] = result.indices[i] + startVertex;
+            }
+            const vertexCount = result.vec3s.length / 3;
+            currentVertexOffset += result.vec3s.length;
+            indexOffset += result.indices.length;
+            if (_pickableState && output.pickIndices && result.pickIndex !== undefined) {
+                output.pickIndices.fill(result.pickIndex, startVertex, startVertex + vertexCount);
+            }
+            if (_variativeColorsOnState && output.variativeColors && result.variativeColors) {
+                for (let i = 0; i < vertexCount; i++) {
+                    const o = (startVertex + i) * 4;
+                    output.variativeColors[o + 0] = result.variativeColors[0];
+                    output.variativeColors[o + 1] = result.variativeColors[1];
+                    output.variativeColors[o + 2] = result.variativeColors[2];
+                    output.variativeColors[o + 3] = result.variativeColors[3];
+                }
+            }
+            if (_arcState && output.realEdgeArcIndices && result.realEdgeArcIndices) {
+                for (let i = 0; i < result.realEdgeArcIndices.length; i++) {
+                    const value = result.realEdgeArcIndices[i];
+                    if (value === uint32Escape) {
+                        output.realEdgeArcIndices[arcOffset + i] = uint32Escape;
+                    }
+                    else {
+                        output.realEdgeArcIndices[arcOffset + i] = value + startVertex;
+                    }
+                }
+                arcOffset += result.realEdgeArcIndices.length;
+            }
+        }
+        const buffers = [output.vec3s.buffer, output.indices.buffer, output.longLats.buffer];
+        if (_arcState && output.realEdgeArcIndices)
+            buffers.push(output.realEdgeArcIndices.buffer);
+        if (_pickableState && output.pickIndices)
+            buffers.push(output.pickIndices.buffer);
+        if (_variativeColorsOnState && output.variativeColors)
+            buffers.push(output.variativeColors.buffer);
+        self.postMessage(output, buffers);
+    }
+    catch (error) {
+        console.error("Error in worker:", error);
+    }
+};

package/{semiplugins → webglobeplugins/semiplugins}/shape-on-terrain/terrain-polygon/terrain-polygon.js

@@ -3,10 +3,12 @@ import { TextureDemTriangles } from "../../../programs/polygon-on-globe/texture-
 import { noRegisterGlobeProgramCache } from "../../../programs/programcache";
 import { PickerDisplayer } from "../../../util/picking/picker-displayer";
 import { IndexPolygonMap } from "./data/index-polygon-map";
+import { TestRecords } from "./test-records";
 export class TerrainPolygonSemiPlugin {
     id;
     globe = null;
     _options = {
+        drawEdges: true,
         pickable: false,
         variativeColorsOn: false,
         defaultColor: [0.5, 0.5, 1, 1],
@@ -26,6 +28,7 @@ export class TerrainPolygonSemiPlugin {
     _mercatorXYBuffer = null;
     _vao = null;
     _uboHandler = null;
+    _uboForRealEdgeArcs = null;
     _drawPointsRangeIndexParams = {
         drawRange: {
             first: 0,
@@ -35,6 +38,15 @@ export class TerrainPolygonSemiPlugin {
         elementBufferIndexType: WebGL2RenderingContext.UNSIGNED_INT,
         elementBuffer: WebGLBuffer = null,
     };
+    _drawRealEdgeArcs = {
+        drawRange: {
+            first: 0,
+            count: 0,
+        },
+        drawMode: WebGL2RenderingContext.LINE_STRIP,
+        elementBufferIndexType: WebGL2RenderingContext.UNSIGNED_INT,
+        elementBuffer: WebGLBuffer = null,
+    };
     _drawRangeIndexParams = {
         drawRange: {
             first: 0,
@@ -47,6 +59,7 @@ export class TerrainPolygonSemiPlugin {
     constructor(id, options = {}) {
         this.id = id;
         this._options = { ...this._options, ...options };
+        console.log("TerrainPolygonSemiPlugin options:", this._options);
     }
     ;
     init(globe, gl) {
@@ -66,6 +79,12 @@ export class TerrainPolygonSemiPlugin {
             this._uboHandler.updateSingle("private_isPickedOn", new Float32Array([1.0]));
             this._uboHandler.updateSingle("pickedColor", new Float32Array(this._options.pickedColor));
         }
+        if (this._options.drawEdges) {
+            this._uboForRealEdgeArcs = this._program.createUBO();
+            this._uboForRealEdgeArcs.updateSingle("defaultColor", new Float32Array([1, 1, 0, 1]));
+            this._uboForRealEdgeArcs.updateSingle("dontUseColor", new Float32Array([1]));
+            this._drawRealEdgeArcs.elementBuffer = gl.createBuffer();
+        }
         if (this._options.variativeColorsOn) {
             this._variativeColorBuffer = gl.createBuffer();
         }
@@ -96,9 +115,10 @@ export class TerrainPolygonSemiPlugin {
     }
     insertBulk(polygons) {
         // if (this._indexPolygonMap) {
-        polygons = this._indexPolygonMap.insertBulk(polygons);
+        let filteredPolygons = polygons.filter(inputCheck);
+        filteredPolygons = this._indexPolygonMap.insertBulk(filteredPolygons);
         // }
-        this._workerContact.insertBulk(polygons);
+        this._workerContact.insertBulk(filteredPolygons);
     }
     deleteBulk(keys) {
         this._workerContact.deleteBulk(keys);
@@ -122,11 +142,11 @@ export class TerrainPolygonSemiPlugin {
         if (this._options.opacity !== opacity) {
             this._options.opacity = opacity;
             this._uboHandler.updateSingle("opacity", new Float32Array([opacity]));
+            this._uboForRealEdgeArcs?.updateSingle("opacity", new Float32Array([opacity]));
             this.globe.DrawRender();
         }
     }
     setBuffers(data) {
-        console.log("TerrainPolygonSemiPlugin updating buffers", data.indices.length / 3, "triangles");
         const gl = this.globe.gl;
         gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this._elementArrayBuffer);
         gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, data.indices, gl.STREAM_DRAW);
@@ -142,6 +162,14 @@ export class TerrainPolygonSemiPlugin {
             gl.bindBuffer(gl.ARRAY_BUFFER, this._variativeColorBuffer);
             gl.bufferData(gl.ARRAY_BUFFER, data.variativeColors, gl.STREAM_DRAW);
         }
+        if (this._options.drawEdges && data.realEdgeArcIndices) {
+            gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this._drawRealEdgeArcs.elementBuffer);
+            gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, data.realEdgeArcIndices, gl.STREAM_DRAW);
+            this._drawRealEdgeArcs.drawRange.count = data.realEdgeArcIndices.length;
+        }
+        else {
+            this._drawRealEdgeArcs.drawRange.count = 0;
+        }
         gl.bindBuffer(gl.ARRAY_BUFFER, null);
         this._drawRangeIndexParams.drawRange.count = data.indices.length;
         this._drawPointsRangeIndexParams.drawRange.count = data.indices.length;
@@ -210,10 +238,45 @@ export class TerrainPolygonSemiPlugin {
             this._pickerDisplayer.drawColorTexture();
             this._selfSelect();
         }
+        if (this._options.drawEdges) {
+            gl.disable(gl.DEPTH_TEST);
+            // gl.enable(gl.POLYGON_OFFSET_FILL);
+            // gl.polygonOffset(-3.0, -3.0);
+            this._program.draw(this._vao, this._drawRealEdgeArcs, this._uboForRealEdgeArcs);
+            // gl.disable(gl.POLYGON_OFFSET_FILL);
+        }
         gl.enable(gl.DEPTH_TEST);
     }
     free() {
         this._workerContact.free();
         noRegisterGlobeProgramCache.releaseProgram(this.globe, TextureDemTriangles);
     }
+    loadTest(recordName) {
+        if (!TestRecords.has(recordName)) {
+            console.warn(`Test record ${recordName} not found.`);
+            return;
+        }
+        else {
+            this.insertBulk(TestRecords.get(recordName));
+        }
+    }
+}
+function inputCheck(input) {
+    if (!input.geometry || !Array.isArray(input.geometry) || input.geometry.length === 0) {
+        console.warn("Invalid polygon input: geometry is required and must be a non-empty array.");
+        return false;
+    }
+    // lat and long should be in range
+    for (const geom of input.geometry) {
+        const vertices = geom.vertices;
+        for (let i = 0; i < vertices.length / 2; i++) {
+            const lon = vertices[i * 2];
+            const lat = vertices[i * 2 + 1];
+            if (lon < -180 || lon > 180 || lat < -90 || lat > 90) {
+                console.warn(`Invalid polygon input: longitude ${lon} or latitude ${lat} out of range.`);
+                return false;
+            }
+        }
+    }
+    return true;
 }

package/webglobeplugins/semiplugins/shape-on-terrain/terrain-polygon/test-records.js

@@ -0,0 +1,14 @@
+const rect2 = {
+    key: "2 rectangles",
+    geometry: [
+        {
+            vertices: [-5, -5, -5, 0, 0, 0, 0, -5],
+        },
+        {
+            vertices: [-15, -15, -15, -10, -10, -10, -10, -15],
+        }
+    ],
+};
+export const TestRecords = new Map([
+    ["2 rectangles", [rect2]],
+]);

package/{semiplugins → webglobeplugins/semiplugins}/shell/bbox-renderer/object.js

@@ -4,7 +4,6 @@ export class BBOXGlobeShell {
     globe;
     program;
     shellBlockManager;
-    update;
     innerTime;
     texture;
     bbox;
@@ -15,7 +14,6 @@ export class BBOXGlobeShell {
         this.globe = globe;
         this.program = BBOXGlobeShellProgramCache.get(globe);
         this.shellBlockManager = this.program.getShellBlockBufferManager();
-        this.update = this.shellBlockManager.update.bind(this.shellBlockManager);
         this.innerTime = 0;
         this.wiggleInKM = wiggleInKM;
         this.wiggleSpeed = wiggleSpeed;
@@ -32,6 +30,11 @@ export class BBOXGlobeShell {
         this.shellBlockManager.update({ height });
         this.globe.DrawRender();
     }
+    // public update(data: any): void {
+    //     console.log("BBOXGlobeShell update", data);
+    //     this.shellBlockManager.update(data);
+    //     this.globe.DrawRender();
+    // }
     setOpacity(opacity) {
         this.shellBlockManager.update({ opacity });
         this.globe.DrawRender();

package/{tracks → webglobeplugins/tracks}/timetracks/program-line-strip.js

@@ -538,6 +538,7 @@ void main() {
         this._resetTexture();
         gl.enable(gl.BLEND);
         gl.blendFuncSeparate(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA, gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
+        // if (this.sample_alpha_to_covarage) gl.enable(gl.SAMPLE_ALPHA_TO_COVERAGE);
         // draw lines
         gl.bindFramebuffer(gl.FRAMEBUFFER, this._frameBuffer);
         gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, this._middleTexture, 0);
@@ -585,6 +586,7 @@ void main() {
         gl.bindTexture(gl.TEXTURE_2D, this._middleTexture);
         gl.uniform1i(this._combineProgram.u_main_texture, 0);
         gl.drawArrays(gl.TRIANGLES, 0, 6);
+        // if (this.sample_alpha_to_covarage) gl.disable(gl.SAMPLE_ALPHA_TO_COVERAGE);
         gl.bindVertexArray(null);
         defaultblendfunction(gl);
     }

package/{util → webglobeplugins/util}/gl-util/buffer/attribute-loader.js

@@ -18,10 +18,10 @@
  * @param {Array<number>} options.escapeValues
  * @returns
  */
-const attributeLoader = (gl, bufferAndReadInfo, index, size, { divisor = null, type = null, escapeValues = null, normalized = false } = {}) => {
+const attributeLoader = (gl, bufferAndReadInfo, index, size, { divisor = null, type = null, escapeValues = null, normalized = false, integer = false, integerUnsigned = true, } = {}) => {
     if (bufferAndReadInfo == null || bufferAndReadInfo.buffer == null) {
         if (escapeValues)
-            constantFunction(gl, index, size, escapeValues);
+            constantFunction(gl, index, size, escapeValues, integer, integerUnsigned);
         return;
     }
     const { buffer, stride, offset } = bufferAndReadInfo;
@@ -37,7 +37,12 @@ const attributeLoader = (gl, bufferAndReadInfo, index, size, { divisor = null, t
     const attribType = type === null ? gl.FLOAT : type;
     gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
     gl.enableVertexAttribArray(index);
-    gl.vertexAttribPointer(index, size, attribType, normalized, stride, offset);
+    if (integer) {
+        gl.vertexAttribIPointer(index, size, attribType, stride, offset);
+    }
+    else {
+        gl.vertexAttribPointer(index, size, attribType, normalized, stride, offset);
+    }
     if (divisor !== null) {
         gl.vertexAttribDivisor(index, divisor);
     }
@@ -54,9 +59,16 @@ const createBufferAndReadInfo = (buffer, stride = 0, offset = 0) => {
         return null;
     return { buffer, stride, offset };
 };
-const constantFunction = (gl, index, size, escapeValues) => {
-    const func = `vertexAttrib${size}f`;
+const constantFunction = (gl, index, size, escapeValues, integer, integerUnsigned) => {
+    if (!integer) {
+        const func = `vertexAttrib${size}f`;
+        // @ts-ignore
+        gl[func](index, ...escapeValues);
+        return;
+    }
+    const values = escapeValues.map((v) => Math.trunc(v));
+    const func = integerUnsigned ? `vertexAttribI${size}ui` : `vertexAttribI${size}i`;
     // @ts-ignore
-    gl[func](index, ...escapeValues);
+    gl[func](index, ...values);
 };
 export { attributeLoader, createBufferAndReadInfo };

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

@@ -92,7 +92,8 @@ export class UniformBlockManager {
         gl.bindBuffer(gl.UNIFORM_BUFFER, ubo);
         // @ts-ignore
         gl.bufferData(gl.UNIFORM_BUFFER, this.size, gl[bufferWriteType]);
-        gl.bindBufferBase(gl.UNIFORM_BUFFER, 0, ubo);
+        // bind to the configured binding point, not zero
+        gl.bindBufferBase(gl.UNIFORM_BUFFER, this.bindingPoint, ubo);
         for (const member of this.blockMembers) {
             const { name, type, value = null } = member;
             ;
@@ -193,8 +194,16 @@ export class UniformBlockManager {
     }
     // __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;
+        // compute size as last member's offset + its actual std140 size,
+        // then round the total block size up to a 16-byte multiple per std140.
+        if (this.blockMembers.length === 0)
+            return 0;
+        const names = Array.from(this.offsetMap.keys());
+        const lastName = names[names.length - 1];
+        const lastOffset = this.offsetMap.get(lastName);
+        const lastType = this.blockMembers[this.blockMembers.length - 1].type;
+        const rawSize = lastOffset + typeSizes[lastType];
+        const paddedSize = (rawSize + 15) & ~15; // round up to multiple of 16
+        return paddedSize;
     }
 }