improve TexturedSprite

Author: spearwolf

packages/twopoint5d-demos/src/starfield/Starfield.ts

@@ -54,7 +54,7 @@ export class Starfield {
   #minMaxSizeScale: [number, number] = [1, 1];
   #nearFar: Vector2 = new Vector2(0, 1);
   #cameraLineOfSightEscape = 2;
-  #baseColors: [number, number, number, number][];
+  #baseColors: Color[];
 
   constructor(textureStore: TextureStore, stage: Stage2D, capacity: number, atlasName: string) {
     eventize(this);
@@ -84,13 +84,10 @@ export class Starfield {
   }
 
   setBaseColors(colors: (Color | number | string)[]) {
-    this.#baseColors = colors.map((color) => {
-      const c = new Color(color);
-      return [c.r, c.g, c.b, 1];
-    });
+    this.#baseColors = colors.map((color) => new Color(color));
   }
 
-  randomBaseColor(): [number, number, number, number] {
+  randomBaseColor(): Color {
     return this.#baseColors[rand(this.#baseColors.length)];
   }
 

packages/twopoint5d/src/sprites/TexturedSprites/TexturedSprite.ts

@@ -26,12 +26,12 @@ export interface TexturedSprite extends VO {
   setQuadSize(quadSize: [width: number, height: number]): void;
   setTexCoords(texCoords: [s: number, t: number, u: number, v: number]): void;
   setInstancePosition(position: [x: number, y: number, z: number]): void;
-  setColor(color: [r: number, g: number, b: number, b: number]): void;
+  setColorValues(color: [r: number, g: number, b: number, b: number]): void;
 }
 
 export class TexturedSprite {
   [voInitialize]() {
-    this.setColor([1, 1, 1, 1]);
+    this.setColorValues([1, 1, 1, 1]);
   }
 
   setSize(width: number, height: number): void {
@@ -47,8 +47,8 @@ export class TexturedSprite {
     this.setTexCoords([coords.s, coords.t, coords.u, coords.v]);
   }
 
-  fromColor(color: Color, a = 1): void {
-    this.setColor([color.r, color.g, color.b, a]);
+  setColor(color: Color, a = 1): void {
+    this.setColorValues([color.r, color.g, color.b, a]);
   }
 
   getColor(target: Color = new Color()): Color {
@@ -65,7 +65,7 @@ export const TexturedSpriteDescriptor: VertexObjectDescription = {
     texCoords: {components: ['s', 't', 'u', 'v']},
     instancePosition: {components: ['x', 'y', 'z'], usage: 'dynamic'},
     rotation: {size: 1, usage: 'dynamic'},
-    color: {components: ['r', 'g', 'b', 'a']},
+    color: {components: ['r', 'g', 'b', 'a'], setter: 'setColorValues', getter: false},
   },
 
   basePrototype: TexturedSprite.prototype,

packages/twopoint5d/src/vertex-objects/VertexAttributeDescriptor.spec.ts

@@ -17,6 +17,32 @@ describe('VertexAttributeDescriptor', () => {
     expect(descriptor.normalizedData).toBe(false);
     expect(descriptor.usageType).toBe('dynamic');
     expect(descriptor.bufferName).toBe('dynamic_float32');
+    expect(descriptor.getterName).toBe('getFoo');
+    expect(descriptor.setterName).toBe('setFoo');
+  });
+
+  test('construct with getter and setter', () => {
+    const descriptor = new VertexAttributeDescriptor('foo', {
+      size: 3,
+      getter: 'getCoords',
+      setter: 'setCoords',
+    });
+    expect(descriptor).toBeDefined();
+    expect(descriptor.name).toBe('foo');
+    expect(descriptor.getterName).toBe('getCoords');
+    expect(descriptor.setterName).toBe('setCoords');
+  });
+
+  test('construct without getter and setter', () => {
+    const descriptor = new VertexAttributeDescriptor('foo', {
+      components: ['x', 'y', 'z'],
+      getter: undefined,
+      setter: false,
+    });
+    expect(descriptor).toBeDefined();
+    expect(descriptor.name).toBe('foo');
+    expect(descriptor.getterName).toBe(undefined);
+    expect(descriptor.setterName).toBe(undefined);
   });
 
   test('construct with size', () => {

packages/twopoint5d/src/vertex-objects/VertexAttributeDescriptor.ts

@@ -1,5 +1,7 @@
 import type {VertexAttributeDataType, VertexAttributeDescription, VertexAttributeUsageType} from './types.js';
 
+const toPascalCase = (str: string) => str.replace(/(^|_)([a-z])/g, (_match: string, _m0: string, m1: string) => m1.toUpperCase());
+
 export class VertexAttributeDescriptor {
   private readonly description: VertexAttributeDescription;
 
@@ -44,4 +46,20 @@ export class VertexAttributeDescriptor {
   get bufferName(): string {
     return this.description.bufferName ?? `${this.usageType}_${this.dataType}${this.normalizedData ? 'N' : ''}`;
   }
+
+  get getterName(): string | undefined {
+    if ('getter' in this.description && !this.description.getter) {
+      return undefined;
+    }
+    if (typeof this.description.getter === 'string') return this.description.getter;
+    return `get${toPascalCase(this.name)}`;
+  }
+
+  get setterName(): string | undefined {
+    if ('setter' in this.description && !this.description.setter) {
+      return undefined;
+    }
+    if (typeof this.description.setter === 'string') return this.description.setter;
+    return `set${toPascalCase(this.name)}`;
+  }
 }

packages/twopoint5d/src/vertex-objects/VertexObjectPool.ts

@@ -18,7 +18,7 @@ export class VertexObjectPool<VOType> {
   #index: Array<VOType & VO>;
   #usedCount = 0;
 
-  onCreateVO?: (vo: VOType & VO) => void;
+  onCreateVO?: (vo: VOType & VO) => (VOType & VO) | void;
 
   constructor(descriptor: VertexObjectDescriptor | VertexObjectDescription, capacityOrData: number | VertexObjectBuffersData) {
     this.descriptor = descriptor instanceof VertexObjectDescriptor ? descriptor : new VertexObjectDescriptor(descriptor);
@@ -119,7 +119,7 @@ export class VertexObjectPool<VOType> {
   #createVertexObject(idx: number) {
     const vo = createVertexObject(this.descriptor, this.buffer, idx);
     if (this.onCreateVO != null) {
-      this.onCreateVO(vo);
+      return this.onCreateVO(vo) ?? vo;
     }
     return vo;
   }

packages/twopoint5d/src/vertex-objects/createVertexObjectPrototype.ts

@@ -3,8 +3,6 @@ import {voBuffer, voIndex} from './constants.js';
 import {createTypedArray} from './createTypedArray.js';
 import type {VO} from './types.js';
 
-const toPascalCase = (str: string) => str.replace(/(^|_)([a-z])/g, (_match: string, _m0: string, m1: string) => m1.toUpperCase());
-
 const makeAttributeGetter = (bufferName: string, instanceOffset: number, attrOffset: number) => {
   return function getAttribute(this: VO) {
     const idx = this[voIndex] * instanceOffset + attrOffset;
@@ -73,9 +71,9 @@ export function createVertexObjectPrototype(voBuffer: VertexObjectBuffer): Objec
     const attr = descriptor.getAttribute(attrName)!;
     const bufAttr = voBuffer.bufferAttributes.get(attrName)!;
     const buf = voBuffer.buffers.get(bufAttr.bufferName)!;
-    const AttrName = toPascalCase(attrName);
 
     const methods: unknown[] = [];
+
     if (descriptor.vertexCount === 1 && attr.size === 1) {
       methods.push([
         attrName,
@@ -86,23 +84,22 @@ export function createVertexObjectPrototype(voBuffer: VertexObjectBuffer): Objec
         },
       ]);
     } else {
-      methods.push(
-        [
-          `get${AttrName}`,
-          {
-            enumerable: true,
-            value: makeAttributeValuesGetter(bufAttr.bufferName, buf.itemSize, descriptor.vertexCount, bufAttr.offset, attr.size),
-          },
-        ],
-        [
-          `set${AttrName}`,
-          {
-            enumerable: true,
-            value: makeAttributeValueSetter(bufAttr.bufferName, buf.itemSize, descriptor.vertexCount, bufAttr.offset, attr.size),
-          },
-        ],
-      );
+      methods.push([
+        attr.getterName,
+        {
+          enumerable: true,
+          value: makeAttributeValuesGetter(bufAttr.bufferName, buf.itemSize, descriptor.vertexCount, bufAttr.offset, attr.size),
+        },
+      ]);
+      methods.push([
+        attr.setterName,
+        {
+          enumerable: true,
+          value: makeAttributeValueSetter(bufAttr.bufferName, buf.itemSize, descriptor.vertexCount, bufAttr.offset, attr.size),
+        },
+      ]);
     }
+
     if (attr.hasComponents) {
       attr.components.forEach((component, componentIndex) => {
         for (let vertexIndex = 0; vertexIndex < descriptor.vertexCount; vertexIndex++) {

packages/twopoint5d/src/vertex-objects/types.ts

@@ -45,7 +45,10 @@ export interface VASizeDescription extends VADescription {
   size: number;
 }
 
-export type VertexAttributeDescription = VAComponentsDescription | VASizeDescription;
+export type VertexAttributeDescription = (VAComponentsDescription | VASizeDescription) & {
+  getter?: string | boolean;
+  setter?: string | boolean;
+};
 
 export type VertexAttributesType = Record<string, VertexAttributeDescription>;