textmode.js 0.2.1-beta.4 → 0.2.1-beta.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. package/dist/textmode.esm.js +2133 -1834
  2. package/dist/textmode.esm.min.js +1849 -1549
  3. package/dist/textmode.umd.js +9 -9
  4. package/dist/textmode.umd.min.js +8 -7
  5. package/dist/types/assets/shaders-minified/frag/image-to-mrt.d.ts +14 -0
  6. package/dist/types/assets/shaders-minified/frag/present.d.ts +14 -0
  7. package/dist/types/assets/shaders-minified/index.d.ts +2 -0
  8. package/dist/types/index.d.ts +1 -0
  9. package/dist/types/rendering/index.d.ts +0 -2
  10. package/dist/types/rendering/webgl/DrawQueue.d.ts +9 -7
  11. package/dist/types/rendering/webgl/InstanceData.d.ts +15 -15
  12. package/dist/types/rendering/webgl/RenderPipeline.d.ts +1 -0
  13. package/dist/types/rendering/webgl/RenderState.d.ts +13 -19
  14. package/dist/types/rendering/webgl/Renderer.d.ts +13 -2
  15. package/dist/types/rendering/webgl/Shader.d.ts +3 -4
  16. package/dist/types/rendering/webgl/ShaderManager.d.ts +12 -11
  17. package/dist/types/rendering/webgl/geometries/BaseGeometry.d.ts +2 -1
  18. package/dist/types/rendering/webgl/types/DrawCommand.d.ts +2 -2
  19. package/dist/types/textmode/Canvas.d.ts +6 -0
  20. package/dist/types/textmode/TextmodeImage.d.ts +92 -0
  21. package/dist/types/textmode/Textmodifier.d.ts +17 -2
  22. package/dist/types/textmode/font/CharacterExtractor.d.ts +14 -14
  23. package/dist/types/textmode/font/MetricsCalculator.d.ts +1 -21
  24. package/dist/types/textmode/font/typr/Typr.d.ts +2 -0
  25. package/dist/types/textmode/font/typr/types.d.ts +6 -0
  26. package/dist/types/textmode/font/utils/index.d.ts +0 -1
  27. package/dist/types/textmode/mixins/AnimationMixin.d.ts +6 -0
  28. package/dist/types/textmode/mixins/FontMixin.d.ts +43 -3
  29. package/dist/types/textmode/mixins/KeyboardMixin.d.ts +2 -3
  30. package/dist/types/textmode/mixins/MouseMixin.d.ts +6 -6
  31. package/dist/types/textmode/mixins/RenderingMixin.d.ts +23 -5
  32. package/package.json +1 -1
  33. package/dist/types/rendering/webgl/types/ShaderTypes.d.ts +0 -35
  34. package/dist/types/textmode/font/utils/CmapParser.d.ts +0 -47
@@ -2,7 +2,7 @@ import { GLFramebuffer } from "./Framebuffer";
2
2
  import type { FramebufferOptions } from '../webgl/Framebuffer';
3
3
  import { GLShader } from "./Shader";
4
4
  import { RenderState } from "./RenderState";
5
- import type { ShaderSource } from './types/ShaderTypes';
5
+ import type { TextmodeImage } from "../../textmode/TextmodeImage";
6
6
  /**
7
7
  * Core WebGL renderer that manages the WebGL context and provides high-level rendering operations
8
8
  */
@@ -25,7 +25,7 @@ export declare class GLRenderer {
25
25
  * Set the current shader
26
26
  */
27
27
  $shader(shader: GLShader): void;
28
- $createShader(vertexSource: ShaderSource, fragmentSource: ShaderSource): GLShader;
28
+ $createShader(vertexSource: string, fragmentSource: string): GLShader;
29
29
  /**
30
30
  * Get the shared MRT copy shader
31
31
  */
@@ -38,6 +38,8 @@ export declare class GLRenderer {
38
38
  * Get the ASCII conversion shader
39
39
  */
40
40
  $getConversionShader(): GLShader;
41
+ /** Internal: image to MRT shader */
42
+ private $getImageToMRTShader;
41
43
  /**
42
44
  * Set a custom user shader for subsequent rendering operations
43
45
  */
@@ -59,6 +61,15 @@ export declare class GLRenderer {
59
61
  * This uses the internal copy shader and preserves draw ordering within the pipeline.
60
62
  */
61
63
  $imageRect(src: GLFramebuffer, x: number, y: number, width: number, height: number): void;
64
+ /**
65
+ * Enqueue drawing of an RGBA texture by converting to MRT attachments on the fly.
66
+ * The texture is sampled and resized into the target rect, writing brightness to character and grayscale to primary color.
67
+ */
68
+ /**
69
+ * Enqueue drawing of a TextmodeImage by converting its RGBA texture to MRT attachments on the fly.
70
+ * The method accepts only TextmodeImage to make the intent explicit and simplify callers.
71
+ */
72
+ $imageTexture(image: TextmodeImage, x: number, y: number, width: number, height: number): void;
62
73
  /**
63
74
  * Draw a quad covering the pixel rectangle (x, y, width, height) on the canvas.
64
75
  * The quad is converted to NDC and rendered with the current shader using only a_position.
@@ -1,5 +1,4 @@
1
1
  import { GLFramebuffer } from './Framebuffer';
2
- import type { ShaderSource } from './types/ShaderTypes';
3
2
  /**
4
3
  * Supported uniform value types
5
4
  */
@@ -17,11 +16,11 @@ export declare class GLShader {
17
16
  /**
18
17
  * Creates a new GLShader instance.
19
18
  * @param gl The WebGL rendering context.
20
- * @param vertexSource The source code for the vertex shader (or ShaderData object).
21
- * @param fragmentSource The source code for the fragment shader (or ShaderData object).
19
+ * @param vertexSource The source code for the vertex shader.
20
+ * @param fragmentSource The source code for the fragment shader.
22
21
  * @ignore
23
22
  */
24
- constructor(gl: WebGLRenderingContext, vertexSource: ShaderSource, fragmentSource: ShaderSource);
23
+ constructor(gl: WebGLRenderingContext, vertexSource: string, fragmentSource: string);
25
24
  private _cacheLocations;
26
25
  private _createProgram;
27
26
  private _createShader;
@@ -1,12 +1,12 @@
1
1
  import { GLShader } from './Shader';
2
- import type { ShaderSource } from './types/ShaderTypes';
3
2
  /**
4
3
  * Registry keys for built-in shaders
5
4
  */
6
5
  export declare enum BuiltInShader {
7
6
  MRT_DRAW = "mrt-draw",
8
7
  MRT_COPY = "mrt-copy",
9
- ASCII_CONVERSION = "ascii-conversion"
8
+ ASCII_CONVERSION = "ascii-conversion",
9
+ IMAGE_TO_MRT = "image-to-mrt"
10
10
  }
11
11
  /**
12
12
  * Centralized shader management system for textmode.js
@@ -22,16 +22,12 @@ export declare enum BuiltInShader {
22
22
  * - Consistent resource management
23
23
  */
24
24
  export declare class ShaderManager {
25
- private _shaders;
26
25
  private _gl;
26
+ private _copyShader;
27
+ private _mainDrawShader;
28
+ private _conversionShader;
29
+ private _imageToMRTShader;
27
30
  constructor(gl: WebGL2RenderingContext);
28
- /**
29
- * Get or create a shader with lazy initialization
30
- * @param key Unique identifier for the shader
31
- * @param factory Function that creates the shader if it doesn't exist
32
- * @returns The shader instance
33
- */
34
- $getOrCreateShader(key: string, factory: () => GLShader): GLShader;
35
31
  /**
36
32
  * Get the shared MRT copy shader used for framebuffer compositing
37
33
  * This shader handles copying 5-attachment MRT data with proper transparency
@@ -47,6 +43,11 @@ export declare class ShaderManager {
47
43
  * This shader converts MRT data to final ASCII characters
48
44
  */
49
45
  $getConversionShader(): GLShader;
46
+ /**
47
+ * Get the shader that converts a single RGBA texture into MRT attachments.
48
+ * It writes brightness into o_character and grayscale into o_primaryColor.
49
+ */
50
+ $getImageToMRTShader(): GLShader;
50
51
  /**
51
52
  * Create a custom filter shader using the standard instanced vertex shader
52
53
  * These shaders are not cached as they are user-specific
@@ -56,7 +57,7 @@ export declare class ShaderManager {
56
57
  * Create a custom shader with arbitrary vertex and fragment sources
57
58
  * These shaders are not cached as they are user-specific
58
59
  */
59
- $createCustomShader(vertexSource: ShaderSource, fragmentSource: ShaderSource): GLShader;
60
+ $createShader(vertexSource: string, fragmentSource: string): GLShader;
60
61
  /**
61
62
  * Dispose of all managed shaders and clear the registry
62
63
  * This method is idempotent and safe to call multiple times
@@ -4,6 +4,7 @@
4
4
  import type { InstanceBatch } from '../InstanceBatch';
5
5
  import type { InstanceData } from '../InstanceData';
6
6
  import type { IGeometry, GeometryType, UnitGeometryData } from '../types/GeometryTypes';
7
+ import type { IRenderState } from '../RenderState';
7
8
  /**
8
9
  * Abstract base class for all instanced geometries.
9
10
  * Provides common functionality for instance data creation and batch management.
@@ -28,7 +29,7 @@ export declare abstract class BaseGeometry implements IGeometry {
28
29
  * This method handles the common instance data creation logic.
29
30
  * Subclasses can override this to add geometry-specific data.
30
31
  */
31
- protected _createBaseInstanceData(x: number, y: number, width: number, height: number, renderState: any): InstanceData;
32
+ protected _createBaseInstanceData(x: number, y: number, width: number, height: number, renderState: IRenderState): InstanceData;
32
33
  /**
33
34
  * Convert screen coordinates to NDC for compatibility with existing code
34
35
  */
@@ -1,5 +1,5 @@
1
1
  import type { GeometryParams, GeometryType } from './GeometryTypes';
2
- import type { IRenderState } from '../RenderState';
2
+ import type { RenderState } from '../RenderState';
3
3
  import type { GLShader } from '../Shader';
4
4
  export type CustomRectParams = {
5
5
  x: number;
@@ -14,5 +14,5 @@ export interface DrawCommand {
14
14
  id: number;
15
15
  type: GeometryType;
16
16
  params: DrawParams;
17
- state: IRenderState;
17
+ state: RenderState;
18
18
  }
@@ -5,6 +5,8 @@ import type { TextmodeOptions } from "./Textmodifier";
5
5
  */
6
6
  export declare class TextmodeCanvas {
7
7
  private _canvas;
8
+ private _targetCanvas;
9
+ private _isOverlay;
8
10
  private _resizeObserver?;
9
11
  private _canvasCreatedByUs;
10
12
  /**
@@ -14,6 +16,9 @@ export declare class TextmodeCanvas {
14
16
  */
15
17
  constructor(opts?: TextmodeOptions);
16
18
  private _createCanvas;
19
+ private _createOverlayCanvas;
20
+ private _setupOverlayPositioning;
21
+ private _positionOverlayCanvas;
17
22
  /**
18
23
  * Resize the canvas to the specified width and height.
19
24
  * If width or height is not provided, it retains the current dimension.
@@ -34,6 +39,7 @@ export declare class TextmodeCanvas {
34
39
  */
35
40
  $dispose(): void;
36
41
  get canvas(): HTMLCanvasElement;
42
+ get targetCanvas(): HTMLCanvasElement | HTMLVideoElement | null;
37
43
  get width(): number;
38
44
  get height(): number;
39
45
  }
@@ -0,0 +1,92 @@
1
+ import type { GLRenderer } from '../rendering/webgl/Renderer';
2
+ /**
3
+ * TextmodeImage represents an image source uploaded to a WebGL texture.
4
+ * It can be drawn via the textmode image() API, which resizes into the MRT pipeline.
5
+ */
6
+ export declare class TextmodeImage {
7
+ /**
8
+ * Underlying WebGL texture handle.
9
+ */
10
+ readonly texture: WebGLTexture;
11
+ /** Original pixel dimensions of the source image. */
12
+ readonly width: number;
13
+ readonly height: number;
14
+ private _gl;
15
+ private _invert;
16
+ private _flipX;
17
+ private _flipY;
18
+ private _charRotation;
19
+ private _charColorMode;
20
+ private _cellColorMode;
21
+ private _charColor;
22
+ private _cellColor;
23
+ private _backgroundColor;
24
+ private _glyphColors;
25
+ private _glyphColorResolver;
26
+ constructor(gl: WebGL2RenderingContext, texture: WebGLTexture, width: number, height: number);
27
+ /** Dispose of GPU resources. */
28
+ $dispose(): void;
29
+ /** Normalize boolean | number to 0/1 */
30
+ private _to01;
31
+ /**
32
+ * Invert the image colors indicator flag to pass into MRT transform (stored in o_transform.r).
33
+ * Does not modify the source texture pixels; downstream stages can respond accordingly.
34
+ */
35
+ invert(v?: boolean | number): this;
36
+ /**
37
+ * Set horizontal flip indicator flag (stored in o_transform.g).
38
+ */
39
+ flipX(v?: boolean | number): this;
40
+ /**
41
+ * Set vertical flip indicator flag (stored in o_transform.b).
42
+ */
43
+ flipY(v?: boolean | number): this;
44
+ /**
45
+ * Set character rotation in degrees, encoded into two channels as in RenderState.
46
+ */
47
+ charRotation(degrees: number): this;
48
+ /** Snapshot of flags for renderer uniform binding */
49
+ get flags(): Readonly<{
50
+ invert: number;
51
+ flipX: number;
52
+ flipY: number;
53
+ }>;
54
+ /** Encoded (r,g) rotation channels */
55
+ get charRotationRG(): Readonly<[number, number]>;
56
+ /** Set character color mode: 'sampled' (from image) or 'fixed' (use charColor) */
57
+ charColorMode(mode: 'sampled' | 'fixed'): this;
58
+ /** Set cell color mode: 'sampled' (from image) or 'fixed' (use cellColor) */
59
+ cellColorMode(mode: 'sampled' | 'fixed'): this;
60
+ /** Set fixed character color; numbers are 0..255 like other APIs */
61
+ charColor(r: number, g?: number, b?: number): this;
62
+ /** Set fixed cell color; numbers are 0..255 like other APIs */
63
+ cellColor(r: number, g?: number, b?: number): this;
64
+ /** Set background color for transparent pixels; numbers are 0..255 like other APIs */
65
+ background(r: number, g?: number, b?: number, a?: number): this;
66
+ /**
67
+ * Define the characters to use for brightness mapping, as a string.
68
+ * The string will be translated to glyph shader colors externally and stored here (max 64).
69
+ * Note: In this core class we only accept the precomputed colors via a helper; the public method is wired through RenderingMixin.
70
+ */
71
+ charactersFromColors(colors: ([number, number, number] | null)[]): this;
72
+ /** Convert a string to glyph colors using the resolver (from Textmodifier font) and store. */
73
+ characters(chars: string): this;
74
+ /** Internal: uniforms for character list */
75
+ get characterListUniforms(): Readonly<{
76
+ count: number;
77
+ list: number[][];
78
+ }>;
79
+ /** Internal: snapshot of color uniforms for renderer */
80
+ get colorUniforms(): Readonly<{
81
+ charColorFixed: boolean;
82
+ _charColor: [number, number, number];
83
+ cellColorFixed: boolean;
84
+ cellColor: [number, number, number];
85
+ backgroundColor: [number, number, number, number];
86
+ }>;
87
+ /**
88
+ * Create a TextmodeImage from an HTML image/video/canvas element.
89
+ * Texture parameters use NEAREST and CLAMP to align with grid sampling.
90
+ */
91
+ static fromSource(renderer: GLRenderer, source: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement, glyphResolver: (s: string) => ([number, number, number])[]): TextmodeImage;
92
+ }
@@ -2,6 +2,7 @@ import { GLRenderer } from '../rendering/webgl/Renderer';
2
2
  import { TextmodeFont } from './font';
3
3
  import { TextmodeGrid } from './Grid';
4
4
  import { TextmodeCanvas } from './Canvas';
5
+ import { TextmodeImage } from './TextmodeImage';
5
6
  import { AnimationController } from './AnimationController';
6
7
  import { MouseManager } from './managers';
7
8
  import { KeyboardManager } from './managers';
@@ -35,6 +36,17 @@ export type TextmodeOptions = {
35
36
  * Optional for full builds *(will override embedded font if provided)*.
36
37
  */
37
38
  fontSource?: string;
39
+ /**
40
+ * Use `textmode.js` in overlay mode,
41
+ * which sets up the textmode <canvas> on top of an existing HTMLCanvasElement or HTMLVideoElement,
42
+ * automatically resizing and positioning it to match the target element.
43
+ *
44
+ * In this mode `textmode.js` fetches the content of the target element and applies it with adjustable textmode conversion
45
+ * as a first layer to the textmode canvas.
46
+ *
47
+ * Useful for applying textmode conversion to p5.js sketches, YouTube videos, and sooo much more.
48
+ */
49
+ overlay?: boolean;
38
50
  };
39
51
  /**
40
52
  * Base class for mixin application.
@@ -50,6 +62,8 @@ declare class TextmodifierCore implements TextmodifierContext {
50
62
  _textmodeDrawShader: Shader;
51
63
  _textmodeDrawFramebuffer: GLFramebuffer;
52
64
  _textmodeConversionShader: Shader;
65
+ _asciiColorFramebuffer: GLFramebuffer;
66
+ _presentShader: Shader;
53
67
  $render(): void;
54
68
  }
55
69
  declare const Textmodifier_base: typeof TextmodifierCore;
@@ -67,6 +81,8 @@ export declare class Textmodifier extends Textmodifier_base {
67
81
  private _drawCallback;
68
82
  private _resizedCallback;
69
83
  private _windowResizeListener;
84
+ private _isOverlay;
85
+ private _targetCanvasImage?;
70
86
  /**
71
87
  * Creates an instance of Textmodifier.
72
88
  * @param opts Optional configuration options for the Textmodifier instance.
@@ -216,8 +232,7 @@ export declare class Textmodifier extends Textmodifier_base {
216
232
  get canvas(): HTMLCanvasElement;
217
233
  /** Check if the instance has been disposed/destroyed. */
218
234
  get isDisposed(): boolean;
219
- /** Get the draw framebuffer used for offscreen rendering. @ignore */
220
- get drawFramebuffer(): GLFramebuffer;
235
+ get overlay(): TextmodeImage | undefined;
221
236
  }
222
237
  export interface Textmodifier extends RenderingCapabilities, ExportCapabilities, FontCapabilities, AnimationCapabilities, MouseCapabilities, KeyboardCapabilities {
223
238
  }
@@ -4,32 +4,32 @@ import type { TyprFont } from './typr/types.ts';
4
4
  * This class encapsulates the complex logic for reading different cmap table formats.
5
5
  */
6
6
  export declare class CharacterExtraction {
7
- private _cmapParser;
8
- constructor();
9
7
  /**
10
8
  * Extracts all available characters from a font's cmap tables.
11
9
  * @param font The parsed font object from Typr
12
10
  * @returns Array of unique character strings
13
11
  */
14
- extractCharacters(font: TyprFont): string[];
12
+ $extractCharacters(font: TyprFont): string[];
15
13
  /**
16
14
  * Filters out problematic characters that might cause rendering issues.
17
15
  * @param characters Array of character strings to filter
18
16
  * @returns Filtered array of character strings
19
17
  */
20
- filterProblematicCharacters(characters: string[]): string[];
18
+ $filterProblematicCharacters(characters: string[]): string[];
21
19
  /**
22
- * Checks if a character exists in the font.
23
- * @param font The parsed font object from Typr
24
- * @param character The character to check
25
- * @returns True if the character exists in the font
20
+ * Extracts characters from a Format 4 cmap table (Basic Multilingual Plane).
26
21
  */
27
- characterExists(font: TyprFont, character: string): boolean;
22
+ private _extractCharactersFromFormat4;
28
23
  /**
29
- * Checks if all characters in a string exist in the font.
30
- * @param font The parsed font object from Typr
31
- * @param text The text string to check
32
- * @returns True if all characters exist in the font
24
+ * Extracts characters from a Format 12 cmap table (Extended Unicode ranges).
25
+ */
26
+ private _extractCharactersFromFormat12;
27
+ /**
28
+ * Calculates the glyph index for a character in a Format 4 cmap table.
29
+ */
30
+ private _calculateGlyphIndexFormat4;
31
+ /**
32
+ * Checks if a character is valid for rendering.
33
33
  */
34
- allCharactersExist(font: TyprFont, text: string): boolean;
34
+ private _isValidCharacter;
35
35
  }
@@ -19,27 +19,7 @@ export declare class FontMetricsCalculator {
19
19
  * @param font Parsed TyprFont object containing font data
20
20
  * @returns Object containing width and height dimensions
21
21
  */
22
- calculateMaxGlyphDimensions(characters: string[], fontSize: number, font: TyprFont): GlyphDimensions;
23
- /**
24
- * Gets the character advance width for a specific character and font size.
25
- * @param character The character to measure
26
- * @param fontSize Font size to use for scaling
27
- * @param font Parsed TyprFont object
28
- * @returns Advance width in pixels
29
- */
30
- getCharacterAdvanceWidth(character: string, fontSize: number, font: TyprFont): number;
31
- /**
32
- * Gets the font-level ascender, descender, and line gap values for a given font size.
33
- * @param fontSize Font size to use for scaling
34
- * @param font Parsed TyprFont object
35
- * @returns Object containing ascender, descender, and lineGap in pixels
36
- */
37
- getFontMetrics(fontSize: number, font: TyprFont): {
38
- ascender: number;
39
- descender: number;
40
- lineGap: number;
41
- lineHeight: number;
42
- };
22
+ $calculateMaxGlyphDimensions(characters: string[], fontSize: number, font: TyprFont): GlyphDimensions;
43
23
  /**
44
24
  * Clears internal caches. Useful for memory management.
45
25
  */
@@ -11,8 +11,10 @@
11
11
  * @license MIT
12
12
  */
13
13
  import type { TyprStatic } from './types';
14
+ declare function woffToOtfSync(buff: ArrayBuffer): ArrayBuffer;
14
15
  /**
15
16
  * Main Typr class implementation
16
17
  */
17
18
  declare const Typr: TyprStatic;
18
19
  export default Typr;
20
+ export declare const convertWoffToOtf: typeof woffToOtfSync;
@@ -18,6 +18,12 @@ export interface TyprBinary {
18
18
  readUint: (buff: Uint8Array, p: number) => number;
19
19
  /** Read ASCII string */
20
20
  readASCII: (buff: Uint8Array, p: number, l: number) => string;
21
+ /** Write unsigned 16-bit integer (big-endian) */
22
+ writeUshort: (buff: Uint8Array, p: number, n: number) => void;
23
+ /** Write unsigned 32-bit integer (big-endian) */
24
+ writeUint: (buff: Uint8Array, p: number, n: number) => void;
25
+ /** Write ASCII string */
26
+ writeASCII: (buff: Uint8Array, p: number, s: string) => void;
21
27
  /** Shared typed array buffers for efficient reading */
22
28
  t: {
23
29
  uint8: Uint8Array;
@@ -5,4 +5,3 @@
5
5
  * across the font system components.
6
6
  */
7
7
  export { FontTableReader } from './FontTableReader.ts';
8
- export { CmapParser } from './CmapParser.ts';
@@ -111,7 +111,13 @@ export interface AnimationCapabilities {
111
111
  * ```
112
112
  */
113
113
  isLooping(): boolean;
114
+ /**
115
+ * Get the current frame count.
116
+ */
114
117
  get frameCount(): number;
118
+ /**
119
+ * Set the current frame count.
120
+ */
115
121
  set frameCount(value: number);
116
122
  }
117
123
  /**
@@ -13,10 +13,10 @@ export interface FontCapabilities {
13
13
  * const textmodifier = textmode.create();
14
14
  *
15
15
  * // Load a custom font from a URL
16
- * await textmodifier.loadFont('https://example.com/fonts/myfont.ttf');
16
+ * textmodifier.loadFont('https://example.com/fonts/myfont.ttf');
17
17
  *
18
18
  * // Local font example
19
- * // await textmodifier.loadFont('./fonts/myfont.ttf');
19
+ * // textmodifier.loadFont('./fonts/myfont.ttf');
20
20
  * ```
21
21
  */
22
22
  loadFont(fontSource: string): Promise<void>;
@@ -27,13 +27,53 @@ export interface FontCapabilities {
27
27
  * @example
28
28
  * ```javascript
29
29
  * // Create a Textmodifier instance
30
- * const textmodifier = await textmode.create();
30
+ * const textmodifier = textmode.create();
31
31
  *
32
32
  * // Set the font size to 32
33
33
  * textmodifier.fontSize(32);
34
34
  * ```
35
35
  */
36
36
  fontSize(size: number): void;
37
+ /**
38
+ * Get the RGB shader color of a specific character in the current font.
39
+ *
40
+ * Useful for custom shaders to control the character to render.
41
+ *
42
+ * @param char The character to get the color for.
43
+ * @returns An array representing the RGB color, or null if the character is not found.
44
+ * @example
45
+ * ```javascript
46
+ * // Create a Textmodifier instance
47
+ * const textmodifier = textmode.create();
48
+ *
49
+ * // Get the color of the character 'A'
50
+ * textmodifier.setup(() => {
51
+ * const color = textmodifier.glyphColor('A');
52
+ * console.log(color); // e.g., [1, 0, 0] for red
53
+ * });
54
+ * ```
55
+ */
56
+ glyphColor(char: string): [number, number, number] | null;
57
+ /**
58
+ * Get the RGB shader colors of all characters in a string for the current font.
59
+ *
60
+ * Useful for custom shaders to control the characters to render.
61
+ *
62
+ * @param str The string to get the colors for.
63
+ * @returns An array of RGB color arrays, or null if a character is not found.
64
+ * @example
65
+ * ```javascript
66
+ * // Create a Textmodifier instance
67
+ * const textmodifier = textmode.create();
68
+ *
69
+ * // Get the colors of the string 'Hello'
70
+ * textmodifier.setup(() => {
71
+ * const colors = textmodifier.glyphColors('Hello');
72
+ * console.log(colors); // e.g., [[0.1, 0, 0], ...]
73
+ * });
74
+ * ```
75
+ */
76
+ glyphColors(str: string): ([number, number, number] | null)[];
37
77
  }
38
78
  /**
39
79
  * Mixin that adds font capabilities to a class
@@ -1,5 +1,4 @@
1
1
  import type { Mixin } from './TextmodifierMixin';
2
- import type { KeyboardEventHandler } from '../managers';
3
2
  /**
4
3
  * Capabilities provided by the KeyboardMixin
5
4
  */
@@ -62,7 +61,7 @@ export interface KeyboardCapabilities {
62
61
  * });
63
62
  * ```
64
63
  */
65
- keyPressed(callback: KeyboardEventHandler): void;
64
+ keyPressed(callback: () => void): void;
66
65
  /**
67
66
  * Set a callback function that will be called when a key is released.
68
67
  *
@@ -80,7 +79,7 @@ export interface KeyboardCapabilities {
80
79
  * });
81
80
  * ```
82
81
  */
83
- keyReleased(callback: KeyboardEventHandler): void;
82
+ keyReleased(callback: () => void): void;
84
83
  }
85
84
  /**
86
85
  * Mixin that adds keyboard interaction capabilities to Textmodifier.
@@ -1,5 +1,5 @@
1
1
  import type { Mixin } from './TextmodifierMixin';
2
- import type { MousePosition, MouseEventHandler } from '../managers';
2
+ import type { MousePosition } from '../managers';
3
3
  /**
4
4
  * Capabilities provided by the MouseMixin
5
5
  */
@@ -19,7 +19,7 @@ export interface MouseCapabilities {
19
19
  * });
20
20
  * ```
21
21
  */
22
- mouseClicked(callback: MouseEventHandler): void;
22
+ mouseClicked(callback: () => void): void;
23
23
  /**
24
24
  * Set a callback function that will be called when the mouse is pressed down.
25
25
  *
@@ -34,7 +34,7 @@ export interface MouseCapabilities {
34
34
  * });
35
35
  * ```
36
36
  */
37
- mousePressed(callback: MouseEventHandler): void;
37
+ mousePressed(callback: () => void): void;
38
38
  /**
39
39
  * Set a callback function that will be called when the mouse is released.
40
40
  *
@@ -49,7 +49,7 @@ export interface MouseCapabilities {
49
49
  * });
50
50
  * ```
51
51
  */
52
- mouseReleased(callback: MouseEventHandler): void;
52
+ mouseReleased(callback: () => void): void;
53
53
  /**
54
54
  * Set a callback function that will be called when the mouse moves.
55
55
  *
@@ -67,7 +67,7 @@ export interface MouseCapabilities {
67
67
  * });
68
68
  * ```
69
69
  */
70
- mouseMoved(callback: MouseEventHandler): void;
70
+ mouseMoved(callback: () => void): void;
71
71
  /**
72
72
  * Set a callback function that will be called when the mouse wheel is scrolled.
73
73
  *
@@ -83,7 +83,7 @@ export interface MouseCapabilities {
83
83
  * });
84
84
  * ```
85
85
  */
86
- mouseScrolled(callback: MouseEventHandler): void;
86
+ mouseScrolled(callback: () => void): void;
87
87
  /**
88
88
  * Get the current mouse position in grid coordinates.
89
89
  *
@@ -1,6 +1,7 @@
1
1
  import type { Mixin } from './TextmodifierMixin';
2
2
  import type { GLShader } from '../../rendering/webgl/Shader';
3
3
  import type { GLFramebuffer } from '../../rendering';
4
+ import { TextmodeImage } from '../TextmodeImage';
4
5
  /**
5
6
  * Options for creating a framebuffer.
6
7
  */
@@ -128,7 +129,12 @@ export interface RenderingCapabilities {
128
129
  * });
129
130
  * ```
130
131
  */
131
- image(framebuffer: GLFramebuffer, x: number, y: number, width?: number, height?: number): void;
132
+ image(source: GLFramebuffer | TextmodeImage, x: number, y: number, width?: number, height?: number): void;
133
+ /**
134
+ * Load an image and return a TextmodeImage that can be drawn with image().
135
+ * @param src URL or existing HTMLImageElement
136
+ */
137
+ loadImage(src: string | HTMLImageElement): Promise<TextmodeImage>;
132
138
  /**
133
139
  * Set a uniform value for the current custom shader.
134
140
  * @param name The name of the uniform variable
@@ -240,7 +246,10 @@ export interface RenderingCapabilities {
240
246
  */
241
247
  createFilterShader(fragmentSource: string): GLShader;
242
248
  /**
243
- * Sets the rotation angles for subsequent shape rendering operations
249
+ * Sets the rotation angles for subsequent shape rendering operations.
250
+ *
251
+ * All geometries rotate around the center of the shape.
252
+ *
244
253
  * @param degreesX The rotation angle in degrees around the X-axis (optional, defaults to 0)
245
254
  * @param degreesY The rotation angle in degrees around the Y-axis (optional, defaults to 0)
246
255
  * @param degreesZ The rotation angle in degrees around the Z-axis (optional, defaults to 0)
@@ -267,7 +276,10 @@ export interface RenderingCapabilities {
267
276
  */
268
277
  rotate(degreesX?: number, degreesY?: number, degreesZ?: number): void;
269
278
  /**
270
- * Sets the X-axis rotation angle for subsequent shape rendering operations
279
+ * Sets the X-axis rotation angle for subsequent shape rendering operations.
280
+ *
281
+ * All geometries rotate around the center of the shape.
282
+ *
271
283
  * @param degrees The rotation angle in degrees around the X-axis
272
284
  *
273
285
  * @example
@@ -286,7 +298,10 @@ export interface RenderingCapabilities {
286
298
  */
287
299
  rotateX(degrees: number): void;
288
300
  /**
289
- * Sets the Y-axis rotation angle for subsequent shape rendering operations
301
+ * Sets the Y-axis rotation angle for subsequent shape rendering operations.
302
+ *
303
+ * All geometries rotate around the center of the shape.
304
+ *
290
305
  * @param degrees The rotation angle in degrees around the Y-axis
291
306
  *
292
307
  * @example
@@ -305,7 +320,10 @@ export interface RenderingCapabilities {
305
320
  */
306
321
  rotateY(degrees: number): void;
307
322
  /**
308
- * Sets the Z-axis rotation angle for subsequent shape rendering operations
323
+ * Sets the Z-axis rotation angle for subsequent shape rendering operations.
324
+ *
325
+ * All geometries rotate around the center of the shape.
326
+ *
309
327
  * @param degrees The rotation angle in degrees around the Z-axis
310
328
  *
311
329
  * @example