@swf2es/render 0.1.20 → 0.1.21

package/src/webgl/glyph-tables.ts

@@ -0,0 +1,179 @@
+import type { GlState } from "@swf2es/context3d/device";
+import { TABLE_ENTRIES, TABLE_LINE, TABLE_SLOT, TABLE_UNIT } from "./programs.js";
+
+/** Floats a slot: its texels' four each. */
+const SLOT_FLOATS = TABLE_SLOT * 4;
+/** Slots a line of the texture. */
+const SLOTS_A_LINE = TABLE_LINE / TABLE_SLOT;
+/** Floats a text's mode and table take of a slot, compared and hashed. */
+const USED_FLOATS = 4 + TABLE_ENTRIES * 4;
+
+/**
+ * Advanced text's modes and CSM cutoff tables (GeometryData.glyphs), each
+ * distinct one in a slot of a float texture the glyph program reads by
+ * texelFetch: the mode in a slot's first texel, its table's entries after
+ * it. They were a uniform array the shader indexed by each glyph's table
+ * start, the access that hung Intel's GPUs in the fill program's run table
+ * (#717), and uploaded whole for every text drawn. Texts alike share a slot; slots are only
+ * added, between the glyph atlas' repacks, which take them all afresh
+ * (reset), or once the texture is as large as it may be (full). Slot 0 is
+ * left for a text past the room (scratch), uploaded as it is drawn.
+ */
+export class GlyphTables {
+  private readonly gl: WebGL2RenderingContext;
+  private readonly state: GlState;
+  texture: WebGLTexture | null = null;
+  /** The slots' floats as uploaded and to upload, and the texture's lines. */
+  private data = new Float32Array(SLOT_FLOATS * SLOTS_A_LINE);
+  private words = new Uint32Array(this.data.buffer);
+  private lines = 0;
+  private lineMost = 1;
+  /** Slots taken, the first not yet uploaded, and whether the texture's lines are all taken. */
+  private count = 1;
+  private uploaded = 1;
+  full = false;
+  /** The first slot by its contents' hash, then the next of that hash, -1 for none. */
+  private readonly byHash = new Map<number, number>();
+  private next = new Int32Array(SLOTS_A_LINE);
+
+  constructor(gl: WebGL2RenderingContext, state: GlState) {
+    this.gl = gl;
+    this.state = state;
+  }
+
+  /** No texture yet, nor slots, as the context comes or comes back. */
+  setUp(): void {
+    this.texture = null;
+    this.lines = 0;
+    this.lineMost = this.gl.getParameter(this.gl.MAX_TEXTURE_SIZE) as number;
+    this.reset();
+  }
+
+  /** Every slot but the scratch let go of, for the texts to take theirs again. */
+  reset(): void {
+    this.count = 1;
+    this.uploaded = 1;
+    this.full = false;
+    this.byHash.clear();
+  }
+
+  /** The slot holding `mode` and `table`, taken if none does; -1 where the room is full. */
+  slot(mode: Float32Array, table: Float32Array): number {
+    let hash = 0x811c9dc5;
+    const modeWords = new Uint32Array(mode.buffer, mode.byteOffset, 4);
+    const tableWords = new Uint32Array(table.buffer, table.byteOffset, TABLE_ENTRIES * 4);
+    for (let i = 0; i < 4; i++) {
+      hash = Math.imul(hash ^ modeWords[i], 0x01000193);
+    }
+
+    for (let i = 0; i < tableWords.length; i++) {
+      hash = Math.imul(hash ^ tableWords[i], 0x01000193);
+    }
+
+    const words = this.words;
+    let s = this.byHash.get(hash) ?? -1;
+    for (; s >= 0; s = this.next[s]) {
+      const at = s * SLOT_FLOATS;
+      let k = 0;
+      while (k < 4 && words[at + k] === modeWords[k]) {
+        k++;
+      }
+
+      while (k < USED_FLOATS && words[at + k] === tableWords[k - 4]) {
+        k++;
+      }
+
+      if (k === USED_FLOATS) {
+        return s;
+      }
+    }
+
+    if (this.count >= this.lineMost * SLOTS_A_LINE) {
+      this.full = true;
+      return -1;
+    }
+
+    s = this.count++;
+    if (this.count * SLOT_FLOATS > this.data.length) {
+      const grown = new Float32Array(this.data.length * 2);
+      grown.set(this.data);
+      this.data = grown;
+      this.words = new Uint32Array(grown.buffer);
+      const next = new Int32Array(this.next.length * 2);
+      next.set(this.next);
+      this.next = next;
+    }
+
+    this.write(s, mode, table);
+    this.next[s] = this.byHash.get(hash) ?? -1;
+    this.byHash.set(hash, s);
+    return s;
+  }
+
+  /** The slots taken since uploaded: into a texture grown to hold them, all of them if grown. */
+  upload(): void {
+    const gl = this.gl;
+    if (this.uploaded === this.count || gl.isContextLost()) {
+      return;
+    }
+
+    const lines = Math.ceil(this.count / SLOTS_A_LINE);
+    let from = Math.floor(this.uploaded / SLOTS_A_LINE);
+    if (!this.texture || lines > this.lines) {
+      if (this.texture) {
+        this.state.dropTexture(this.texture);
+        gl.deleteTexture(this.texture);
+      }
+
+      this.lines = Math.min(this.lineMost, Math.max(lines, this.lines * 2));
+      this.texture = gl.createTexture() as WebGLTexture;
+      this.state.bindTexture(TABLE_UNIT, this.texture);
+      this.state.activeTexture(TABLE_UNIT);
+      gl.texStorage2D(gl.TEXTURE_2D, 1, gl.RGBA32F, TABLE_LINE, this.lines);
+      gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
+      gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
+      from = 0;
+    }
+
+    this.state.bindTexture(TABLE_UNIT, this.texture);
+    this.state.activeTexture(TABLE_UNIT);
+    gl.texSubImage2D(
+      gl.TEXTURE_2D,
+      0,
+      0,
+      from,
+      TABLE_LINE,
+      lines - from,
+      gl.RGBA,
+      gl.FLOAT,
+      this.data,
+      from * TABLE_LINE * 4,
+    );
+    this.uploaded = this.count;
+  }
+
+  /** The scratch slot made to hold `mode` and `table` now, for a text drawn next past the room. */
+  scratch(mode: Float32Array, table: Float32Array): number {
+    this.write(0, mode, table);
+    const gl = this.gl;
+    this.state.bindTexture(TABLE_UNIT, this.texture);
+    this.state.activeTexture(TABLE_UNIT);
+    gl.texSubImage2D(gl.TEXTURE_2D, 0, 0, 0, TABLE_SLOT, 1, gl.RGBA, gl.FLOAT, this.data, 0);
+    return 0;
+  }
+
+  private write(s: number, mode: Float32Array, table: Float32Array): void {
+    const at = s * SLOT_FLOATS;
+    this.data.set(mode.subarray(0, 4), at);
+    this.data.set(table.subarray(0, TABLE_ENTRIES * 4), at + 4);
+  }
+
+  /** The texture made on the context, deleted. */
+  destroy(): void {
+    if (this.texture) {
+      this.state.dropTexture(this.texture);
+      this.gl.deleteTexture(this.texture);
+      this.texture = null;
+    }
+  }
+}

package/src/webgl/programs.ts

@@ -37,6 +37,13 @@ export const DRAW_AT = 8;
 
 /** The most cutoff table entries a text's draw takes, as the player's text/saffron.ts builds them. */
 export const TABLE_ENTRIES = 48;
+/**
+ * Texels a text's slot in the glyph tables' texture (GlyphTables): its mode,
+ * then its table's entries; and texels a line of it. Powers of two, which
+ * the vertex shader splits a slot's texel into column and line with.
+ */
+export const TABLE_SLOT = 64;
+export const TABLE_LINE = 1024;
 /** Segments a row of the outlines' texture, as the player's text/saffron.ts stores them. */
 export const OUTLINE_ROW = 1024;
 
@@ -74,6 +81,8 @@ export const RUN_UNIT = FILL_UNIT + FILL_TEXTURES;
 export const MERGED_UNIT = RUN_UNIT + 1;
 /** The merged fills' rows a line of their integer texture: a power of two, as for RUN_MOST. */
 export const MERGED_LINE = 1024;
+/** The glyph tables' unit (GlyphTables), past the merged fills' rows. */
+export const TABLE_UNIT = MERGED_UNIT + 1;
 
 /**
  * Places a vertex by its row's transform, on a quarter of a pixel of
@@ -299,11 +308,14 @@ void main(void) {
  * pixels to Flash's, uUnit of them a stage pixel, on their grid from the
  * stage's origin, a BitmapData's in a draw. A glyph's pen stands where its
  * text's origin, at a whole pixel, puts it, snapped as its grid fits it
- * (uMode: gridFitType 0 none, 1 pixel, 2 subpixel, thickness, sharpness),
- * and its quad reaches out past its outline by the furthest cutoff. Its
- * colour is drawn under the row's colour transform, light or dark as adl
- * chooses its table. aOrigin: the pen, and its light and dark tables, each
- * its first entry plus 64 times its entries; aGlyph: a corner of its
+ * (its mode: gridFitType 0 none, 1 pixel, 2 subpixel, thickness,
+ * sharpness), and its quad reaches out past its outline by the furthest
+ * cutoff. Its colour is drawn under the row's colour transform, light or
+ * dark as adl chooses its table. The text's mode and tables are in its slot
+ * of uTables (uTable; GlyphTables), read by texelFetch: not a uniform array
+ * indexed by each glyph's table start, the access that hung Intel's GPUs
+ * in the fill program's run table. aOrigin: the pen, and its light and dark tables,
+ * each its first entry plus 64 times its entries; aGlyph: a corner of its
  * outline's bounds and the way out from it; aRun: its segments, first and
  * count, the pixels of a unit of its outline, and its size.
  */
@@ -318,8 +330,8 @@ uniform highp sampler2D uRows;
 uniform int uRow;
 uniform vec4 uView;
 uniform float uUnit;
-uniform vec4 uMode;
-uniform vec4 uTable[${TABLE_ENTRIES}];
+uniform highp sampler2D uTables;
+uniform int uTable;
 out vec2 vPixel;
 flat out vec2 vPen;
 flat out vec4 vToGlyph;
@@ -327,10 +339,16 @@ flat out vec4 vToPixel;
 flat out vec4 vCut;
 flat out vec4 vShown;
 
+// Texel i of the text's slot: its mode, then its tables' entries.
+vec4 slot(int i) {
+  int at = uTable * ${TABLE_SLOT} + i;
+  return texelFetch(uTables, ivec2(at & ${TABLE_LINE - 1}, at >> ${Math.log2(TABLE_LINE)}), 0);
+}
+
 // The cutoffs at ppem by the table of entries start to start + count, as text/csm.ts' cutoffs.
-vec2 cutoffs(int start, int count, float ppem) {
-  vec4 first = uTable[start];
-  vec4 last = uTable[start + count - 1];
+vec2 cutoffs(vec4 mode, int start, int count, float ppem) {
+  vec4 first = slot(1 + start);
+  vec4 last = slot(start + count);
   vec2 c = first.yz;
   if (ppem >= last.x) {
     c = last.yz;
@@ -340,9 +358,9 @@ vec2 cutoffs(int start, int count, float ppem) {
         break;
       }
 
-      vec4 b = uTable[start + i];
+      vec4 b = slot(1 + start + i);
       if (ppem <= b.x) {
-        vec4 a = uTable[start + i - 1];
+        vec4 a = slot(start + i);
         c = mix(a.yz, b.yz, (ppem - a.x) / (b.x - a.x));
         break;
       }
@@ -350,8 +368,8 @@ vec2 cutoffs(int start, int count, float ppem) {
   }
 
   float unit = 0.0001 * ppem;
-  float t = clamp(uMode.y, -200.0, 200.0);
-  float s = clamp(uMode.z, -400.0, 400.0);
+  float t = clamp(mode.y, -200.0, 200.0);
+  float s = clamp(mode.z, -400.0, 400.0);
   c -= unit * vec2(t + s * 0.5, t - s * 0.5);
   if (c.x < c.y) {
     c = vec2((c.x + c.y) * 0.5);
@@ -366,6 +384,7 @@ void main(void) {
   vec4 t = texelFetch(uRows, at + ivec2(1, 0), 0);
   vec4 mul = texelFetch(uRows, at + ivec2(2, 0), 0);
   vec4 add = texelFetch(uRows, at + ivec2(3, 0), 0);
+  vec4 mode = slot(0);
   // The text's pixels to Flash's.
   mat2 linear = mat2(m.xy, m.zw) * uUnit;
   vec2 origin = t.xy * uUnit;
@@ -373,9 +392,9 @@ void main(void) {
   float across = max(abs(linear[0][1]), abs(linear[1][0]));
   if (across > max(abs(linear[0][0]), abs(linear[1][1])) / 65536.0) {
     // Turned or skewed: no grid.
-  } else if (uMode.x == 1.0) {
+  } else if (mode.x == 1.0) {
     pen = vec2(roundEven(pen.x * 8.0) / 8.0 + 0.5, roundEven(pen.y));
-  } else if (uMode.x == 2.0) {
+  } else if (mode.x == 2.0) {
     pen = vec2(roundEven(pen.x * 4.0) / 4.0 + 0.5, roundEven(pen.y));
   } else {
     pen = roundEven(pen * 4.0) / 4.0 + vec2(0.5, 0.0);
@@ -386,7 +405,7 @@ void main(void) {
   vec4 shown = clamp(aColor * mul + add, 0.0, 1.0);
   bool light = dot(floor(shown.rgb * 255.0 + 0.5), vec3(30.0, 59.0, 11.0)) > 20000.0;
   int table = int(light ? aOrigin.z : aOrigin.w);
-  vec2 cut = cutoffs(table & 63, table >> 6, ppem);
+  vec2 cut = cutoffs(mode, table & 63, table >> 6, ppem);
   mat2 toPixel = linear * aRun.z;
   float margin = max(abs(cut.x), abs(cut.y)) + 1.0;
   float det = determinant(toPixel);