/** * a base renderer object * @category Rendering */ declare class Renderer { /** * Create and return a new Canvas element (or `OffscreenCanvas` when * supported and `returnOffscreenCanvas` is true). Centralized * renderer-side allocator so every scratch / fallback / render- * target canvas in the engine routes through the same * `OffscreenCanvas`-aware path, instead of duplicating * `document.createElement` calls that throw in worker contexts. * @param {number} width - canvas width in pixels * @param {number} height - canvas height in pixels * @param {boolean} [returnOffscreenCanvas=false] - return an * `OffscreenCanvas` if the platform supports it * @returns {HTMLCanvasElement|OffscreenCanvas} a new canvas of the given size */ static createCanvas(width: number, height: number, returnOffscreenCanvas?: boolean): HTMLCanvasElement | OffscreenCanvas; /** * Shared 1×1 fully-white canvas used as a no-op texture fallback. * Renderers and renderables that need a "blank" texture binding * (e.g. to satisfy a shader's sampler input when there's no real * image — Kd-only `Mesh` materials, solid-color quad fills, etc.) * should use this rather than allocating their own. * * Lazily created on first call; shared across every caller; uses * `OffscreenCanvas` where supported (worker-safe). Static so it's * accessible without a renderer instance (e.g. from a `Mesh` * constructor that runs before the active renderer is set). * @returns {HTMLCanvasElement|OffscreenCanvas} the shared 1×1 white canvas */ static getWhitePixel(): HTMLCanvasElement | OffscreenCanvas; /** * @param {ApplicationSettings} [options] - optional parameters for the renderer */ constructor(options?: ApplicationSettings); /** * The renderer renderTarget * @type {CanvasRenderTarget} */ renderTarget: CanvasRenderTarget; /** * The given constructor options * @public * @type {object} */ public settings: object; /** * the requested video size ratio * @public * @type {number} */ public designRatio: number; /** * the scaling ratio to be applied to the main canvas * @type {Vector2d} * @default <1,1> */ scaleRatio: Vector2d; /** * true if the current rendering context is valid * @default true * @type {boolean} */ isContextValid: boolean; /** * The GPU device identifier string (set by GPU renderers — WebGL today, * WebGPU once it lands; undefined for Canvas). * @type {string|undefined} */ GPURenderer: string | undefined; /** * The Path2D instance used by the renderer to draw primitives * @type {Path2D} */ path2D: Path2D; /** * The renderer backend identity — the built-in renderers report * `"CANVAS"`, `"WebGL2"` and `"WebGPU"`. Use it for identity * checks (code coupled to one backend's machinery); prefer the * capability flags (`shaderLanguage`, `supportsDepthBuffer`, * `supportsRetainedMesh`, `supportsShaderTileLayers`) when the * requirement is a capability rather than a specific backend. * (override this property with a specific value when implementing * a custom renderer) * @type {string} */ type: string; /** * The {@link Application} this renderer belongs to, set by * `Application.init()` — engine code holding a renderer reference * must use this rather than the global game instance. * @type {Application|undefined} */ parentApplication: Application | undefined; /** * Whether this renderer backend can draw TMX tile layers through a * GPU shader path (see the `gpuTilemap` application setting). * `false` here on the base/Canvas renderer; GPU backends flip it. * A capability flag rather than a version/class check so future * backends advertise support without consumers growing type checks. * @type {boolean} * @default false */ supportsShaderTileLayers: boolean; /** * Whether this renderer backend can keep mesh geometry resident on the * GPU, letting a mesh supply a model matrix instead of vertices it has * already positioned itself. `false` here on the base/Canvas renderer. * @type {boolean} * @default false */ supportsRetainedMesh: boolean; /** * Whether this renderer backend can draw one geometry many times in a * single call from per-instance data — what {@link InstancedMesh} * needs. `false` here on the base/Canvas renderer, which falls back to * drawing each instance individually. * @type {boolean} * @default false */ supportsInstancing: boolean; /** * The source language this backend accepts for user-supplied shaders, * or `null` when it has no programmable pipeline at all (the Canvas * backend). `"glsl"` on the WebGL backend, `"wgsl"` on the WebGPU * backend. * * Consumers that need a *specific* language — `ShaderEffect` and the * loader's `{vertex, fragment}` shader assets both hand GLSL source * straight to the driver — must compare against the language rather * than test for a GPU backend, or they would accept a backend that * cannot read what they are about to give it. * @type {"glsl"|"wgsl"|null} * @default null */ shaderLanguage: "glsl" | "wgsl" | null; /** * Whether this backend has a depth buffer, and with it the 3D * projection and mesh paths a depth-sorted scene needs (`Camera3d` * and any camera declaring `defaultSortOn = "depth"`). `false` here * on the base/Canvas renderer. * @type {boolean} * @default false */ supportsDepthBuffer: boolean; /** * The background color used to clear the main framebuffer. * Note: alpha value will be set based on the transparent property of the renderer settings. * @default black * @type {Color} */ backgroundColor: Color; /** * The renderer state container (color, tint, transform, scissor, blend mode) * with a zero-allocation save/restore stack. * @type {RenderState} */ renderState: RenderState; currentColor: Color; currentTint: Color; currentScissor: Int32Array; /** * The thickness of lines for shape drawing operations like * {@link Renderer#strokeRect}, {@link Renderer#strokeEllipse} * and {@link Renderer#strokeLine}. Subclasses override the * storage — `CanvasRenderer` proxies it to the underlying 2D * context via a getter/setter, while `WebGLRenderer` treats it * as a regular field consumed by its shape-stroke routines. * @type {number} * @default 1 */ lineWidth: number; projectionMatrix: Matrix3d; uvOffset: number; /** * The normal-map texture associated with the next `drawImage` call, * if any. Set by `Sprite.draw` (and any other normal-map-aware * renderable) just before calling `drawImage`, then cleared back * to `null` after. The WebGL renderer reads this state and routes * lit quads through the shader's lighting path; the Canvas * renderer ignores it entirely. * @type {HTMLImageElement|HTMLCanvasElement|OffscreenCanvas|ImageBitmap|null} */ currentNormalMap: HTMLImageElement | HTMLCanvasElement | OffscreenCanvas | ImageBitmap | null; /** * Number of active `Light2d` instances uploaded to the lit batcher * for the current frame. Set by `setLightUniforms`. The WebGL * renderer's `drawImage` reads this to decide between the unlit * fast-path batcher (default) and the lit batcher (only when * lights AND a normal map are both in play). * @type {number} */ activeLightCount: number; set currentBlendMode(value: string); /** * @type {string} */ get currentBlendMode(): string; set currentDepth(value: number); /** * Current per-renderable depth value. The GPU batchers (WebGL and * WebGPU) push it into the vertex stream as the `z` * component of each vertex — a no-op under the default orthographic * projection, used by perspective (Camera3d) to * scale and parallax sprites by distance. Mirrors `renderable.depth`, * set automatically by `Renderable.preDraw` via {@link Renderer#setDepth}. * @type {number} * @default 0 */ get currentDepth(): number; set height(value: number); /** * return the height of the canvas which this renderer draws to * @returns {number} height of the system Canvas */ get height(): number; set width(value: number); /** * return the width of the canvas which this renderer draws to * @returns {number} width of the system Canvas */ get width(): number; /** * Acquire whatever the backend cannot acquire synchronously — awaited by * {@link Application#init} right after the renderer is constructed, and * the reason `Application#init` is asynchronous at all. The Canvas and * WebGL backends have their context by the end of the constructor and * resolve immediately (this default); the WebGPU backend performs its * adapter/device negotiation here. * @returns {Promise} resolves once the renderer is ready to draw */ init(): Promise; /** * prepare the framebuffer for drawing a new frame */ clear(): void; /** * render the main framebuffer on screen */ flush(): void; /** * Run the transparent pass: draw everything the CURRENT render target has * queued since its last drain, back-to-front, then empty that queue. * * Called at the three points where the world draw is genuinely finished — * `Container.draw` just before a floating child, `Camera2d.draw` once the * container is down, and `Application.draw` at end of frame. Deliberately * NOT on a batcher transition: anything non-mesh sorting mid-scene raises * one, and every mesh still to come would then paint over what was just * replayed. * * Only the current target's queue is touched — see * {@link Renderer#transparentQueue}. A post effect binds an offscreen * target part-way through a scene, and a drain fired in there must not * reach the world's queued geometry; each pass drains its own on the way * out. * * Inert on a backend that never queues — the Canvas renderer has no depth * buffer, and composites through the 2D context instead. */ flushTransparent(): void; /** * Run the transparent pass. * @deprecated since 20.4.0, use {@link Renderer#flushTransparent} */ flushGroundShadows(): void; /** * Draw a textured triangle mesh. * The mesh object must provide: `vertices` (Float32Array, x/y/z triplets), * `uvs` (Float32Array, u/v pairs), `indices` (Uint16Array, triangle indices), * `texture` (TextureAtlas), `vertexCount` (number), and optionally * `cullBackFaces` (boolean, default true). * * On the GPU backends (WebGL and WebGPU — hardware depth testing), * passing a `modelMatrix` selects the **retained** path: the mesh's * model-space geometry stays resident on the GPU and the matrix * places it, so redrawing never re-uploads vertices (see * {@link Renderer#supportsRetainedMesh}). Without a matrix the * vertices are taken as already CPU-projected (the 2D-camera path — * the only path the Canvas renderer supports, using painter's * algorithm). `Mesh.draw` selects the right form automatically. * @param {Mesh} mesh - a Mesh renderable or compatible object * @param {Matrix3d} [modelMatrix] - the mesh's placement, for the retained path (GPU backends) */ drawMesh(mesh: Mesh, modelMatrix?: Matrix3d): void; /** * Reset context state */ reset(): void; /** * Release any renderer-owned resources. Default is a no-op; * subclasses override to tear down batchers, FBO pools, GL * programs, etc. Called by {@link Application#destroy}. */ destroy(): void; /** * return a reference to the current render target corresponding canvas which this renderer draws to * @returns {HTMLCanvasElement} */ getCanvas(): HTMLCanvasElement; /** * Create and return a new Canvas element, sized as requested. * * The instance form of {@link Renderer.createCanvas}. `app.renderer` is * the renderer entry point, and a static is not reachable through an * instance — so this is what user code actually calls. * @param {number} width - width in pixels * @param {number} height - height in pixels * @param {boolean} [returnOffscreenCanvas=false] - return an OffscreenCanvas where supported * @returns {HTMLCanvasElement|OffscreenCanvas} the new canvas */ createCanvas(width: number, height: number, returnOffscreenCanvas?: boolean): HTMLCanvasElement | OffscreenCanvas; /** * return a reference to the current render target corresponding Context * @returns {CanvasRenderingContext2D|WebGLRenderingContext|GPUCanvasContext} */ getContext(): CanvasRenderingContext2D | WebGLRenderingContext | GPUCanvasContext; /** * return the list of supported compressed texture formats. * The base implementation returns null for all formats (no GPU * compressed texture support). GPU renderers (WebGL today, WebGPU * once it lands) override this with the backend-specific extension / * feature query. * @returns {Object} an object with one key per extension family, each value is the backend's compressed-texture handle or null */ getSupportedCompressedTextureFormats(): Object; /** * return true if the given compressed texture format is supported * @param {number} format - a WebGL compressed texture format constant * @returns {boolean} */ hasSupportedCompressedFormats(format: number): boolean; /** * Blit a texture to the screen through a shader effect. * Draws a screen-aligned quad using the given texture as source * and the given shader for post-processing (e.g. scanlines, desaturation). * No-op on Canvas renderer. * @param {WebGLTexture} source - the source texture to blit * @param {number} x - destination x position * @param {number} y - destination y position * @param {number} width - destination width * @param {number} height - destination height * @param {ShaderEffect} shader - the shader effect to apply * @param {boolean} [keepBlend=false] - if true, keep current blend mode (for sprite compositing) */ blitEffect(source: WebGLTexture, x: number, y: number, width: number, height: number, shader: ShaderEffect, keepBlend?: boolean): void; /** * Sets the viewport for the renderer. * Defines the affine transformation from normalized device coordinates to window coordinates. * No-op on Canvas renderer. * @param {number} [x=0] - x coordinate of the viewport origin * @param {number} [y=0] - y coordinate of the viewport origin * @param {number} [w] - width of the viewport (defaults to canvas width) * @param {number} [h] - height of the viewport (defaults to canvas height) */ setViewport(x?: number, y?: number, w?: number, h?: number): void; /** * Clear the current render target to transparent black (color + stencil). * Used to prepare FBOs for post-effect capture. * No-op on Canvas renderer. */ clearRenderTarget(): void; /** * Enable the scissor test with the given rectangle. * No-op on Canvas renderer. * @param {number} x - x coordinate of the scissor rectangle * @param {number} y - y coordinate of the scissor rectangle * @param {number} width - width of the scissor rectangle * @param {number} height - height of the scissor rectangle */ enableScissor(x: number, y: number, width: number, height: number): void; /** * Disable the scissor test, allowing rendering to the full viewport. * No-op on Canvas renderer. */ disableScissor(): void; /** * Enable or disable alpha blending. * No-op on Canvas renderer (Canvas always blends). * @param {boolean} enable - true to enable blending, false to disable */ setBlendEnabled(enable: boolean): void; /** * returns the current blend mode for this renderer * @returns {string} blend mode */ getBlendMode(): string; /** * set the current blend mode. Every renderer supports the same set — * see {@link CanvasRenderer#setBlendMode} for the list and what each does. * @param {string} [mode="normal"] - blend mode */ setBlendMode(mode?: string): void; setLightUniforms(lights: any, ambient: any, translateX: any, translateY: any): void; /** * Render a `Light2d` instance. * * Each renderer implements its own strategy: the WebGL renderer * draws lights as quads through a shared procedural radial-falloff * fragment shader (no per-light texture, color and intensity * encoded in the per-vertex tint so consecutive draws batch); the * Canvas renderer caches a small `Gradient` config object per * light in a `WeakMap` (rebuilt only when the light's radii / * color / intensity change), rasterizes it with `Gradient.toCanvas()` * into a single shared `CanvasRenderTarget`, and composites the * result via `drawImage`. The base implementation is a no-op so * renderers without a lighting path can be polymorphically * substituted. * * Light2d itself is renderer-agnostic — it just calls * `renderer.drawLight(this)` and relies on the renderer to pick * the right machinery. * @param {object} light - the Light2d instance to render * @see Light2d */ drawLight(light: object): void; /** * Draw a TMX tile layer. Default behavior: * - if `layer.canvasRenderer` is set (preRender bake), blit the cached * offscreen canvas in a single `drawImage` call; * - otherwise delegate to the layer's TMX orientation renderer for * the per-tile loop. * * `WebGLRenderer` overrides this to add the procedural shader fast * path on top (when `layer.renderMode === "shader"`) and fall through * to this base behavior for all other layers. * @param {object} layer - the TMXLayer to draw * @param {Rect} rect - the visible region in world coords */ drawTileLayer(layer: object, rect: Rect): void; /** * Set the current fill & stroke style color. * By default, or upon reset, the value is set to #000000. * @param {Color|string|Gradient} color - css color value or a Gradient object */ setColor(color: Color | string | Gradient): void; /** * get the current fill & stroke style color. * @returns {Color} current global color */ getColor(): Color; /** * Create a linear gradient that can be used with {@link Renderer#setColor}. * @param {number} x0 - x-axis coordinate of the start point * @param {number} y0 - y-axis coordinate of the start point * @param {number} x1 - x-axis coordinate of the end point * @param {number} y1 - y-axis coordinate of the end point * @returns {Gradient} a Gradient object */ createLinearGradient(x0: number, y0: number, x1: number, y1: number): Gradient; /** * Create a radial gradient that can be used with {@link Renderer#setColor}. * @param {number} x0 - x-axis coordinate of the start circle * @param {number} y0 - y-axis coordinate of the start circle * @param {number} r0 - radius of the start circle * @param {number} x1 - x-axis coordinate of the end circle * @param {number} y1 - y-axis coordinate of the end circle * @param {number} r1 - radius of the end circle * @returns {Gradient} a Gradient object */ createRadialGradient(x0: number, y0: number, r0: number, x1: number, y1: number, r1: number): Gradient; /** * Set the line dash pattern for stroke operations. * @param {number[]} segments - an array of numbers specifying distances to alternately draw a line and a gap. An empty array clears the dash pattern (solid lines). * @example * // draw a dashed line * renderer.setLineDash([10, 5]); * renderer.strokeLine(0, 0, 100, 0); * // clear the dash pattern * renderer.setLineDash([]); */ setLineDash(segments: number[]): void; /** * Get the current line dash pattern. * @returns {number[]} the current dash pattern */ getLineDash(): number[]; /** * return the current global alpha * @returns {number} */ globalAlpha(): number; /** * check if the given rect or bounds overlaps with the renderer screen coordinates * @param {Rect|Bounds} bounds * @returns {boolean} true if overlaps */ overlaps(bounds: Rect | Bounds): boolean; /** * resizes the system canvas * @param {number} width - new width of the canvas * @param {number} height - new height of the canvas */ resize(width: number, height: number): void; /** * enable/disable image smoothing (scaling interpolation) for the current render target * @param {boolean} [enable=false] */ setAntiAlias(enable?: boolean): void; /** * Resolve the default texture filter **mode** for this renderer, decoupled * from {@link Renderer#setAntiAlias} (which controls polygon-edge MSAA on GPU * backends). Honors the `textureFilter` setting (`"nearest"` / `"linear"`), * falling back to the `antiAlias` setting when it's `"auto"` (the default). * * Backend-neutral on purpose: it returns the mode as a string so each GPU * backend maps it to its own enum (WebGL `gl.LINEAR` / `gl.NEAREST`, a future * WebGPU renderer `GPUFilterMode`). The Canvas renderer has no per-texture * filtering, so this is informational there. * @returns {"linear"|"nearest"} the resolved default filter mode */ getDefaultTextureFilter(): "linear" | "nearest"; /** * Set the default texture magnification/minification filter at runtime, * decoupled from {@link Renderer#setAntiAlias}. The base implementation just * records the setting (the Canvas renderer has no per-texture filtering); * GPU backends override this to re-apply the filter to live textures. * @param {"auto"|"nearest"|"linear"} [mode="auto"] - `"auto"` follows `antiAlias` */ setTextureFilter(mode?: "auto" | "nearest" | "linear"): void; /** * set/change the current projection matrix (GPU renderers only — * the Canvas renderer applies projection via the 2D context's transform stack). * @param {Matrix3d} matrix */ setProjection(matrix: Matrix3d): void; /** * stroke the given shape * @param {Rect|RoundRect|Polygon|Line|Ellipse|Bounds} shape - a shape object to stroke * @param {boolean} [fill=false] - fill the shape with the current color if true */ stroke(shape: Rect | RoundRect | Polygon | Line | Ellipse | Bounds, fill?: boolean): void; /** * fill the given shape * @param {Rect|RoundRect|Polygon|Line|Ellipse|Bounds} shape - a shape object to fill */ fill(shape: Rect | RoundRect | Polygon | Line | Ellipse | Bounds): void; /** * tint the given image or canvas using the given color * @param {HTMLImageElement|HTMLCanvasElement|OffscreenCanvas} src - the source image to be tinted * @param {Color|string} color - the color that will be used to tint the image * @param {string} [mode="multiply"] - the composition mode used to tint the image * @returns {HTMLCanvasElement|OffscreenCanvas} a new canvas or offscreencanvas (if supported) element representing the tinted image */ tint(src: HTMLImageElement | HTMLCanvasElement | OffscreenCanvas, color: Color | string, mode?: string): HTMLCanvasElement | OffscreenCanvas; /** * Clip the region anything drawn afterwards is confined to. * Implemented by subclasses. * @param {number} x - x position of the clipping rectangle * @param {number} y - y position of the clipping rectangle * @param {number} width - width of the clipping rectangle * @param {number} height - height of the clipping rectangle */ clipRect(x: number, y: number, width: number, height: number): void; /** * Reset the current transform back to the identity matrix. * Implemented by subclasses. */ resetTransform(): void; /** * Push the current transform / alpha / clip state onto an internal * stack. Pair with {@link Renderer#restore}. Implemented by subclasses. */ save(): void; /** * Pop the topmost saved state from the stack, restoring transform, * alpha and clip. Pair with {@link Renderer#save}. Implemented by * subclasses. */ restore(): void; /** * Translate the current transform by `(x, y)`. Implemented by subclasses. * @param {number} x - horizontal translation in pixels * @param {number} y - vertical translation in pixels */ translate(x: number, y: number): void; /** * Rotate the current transform by `angle` (radians). Implemented by subclasses. * @param {number} angle - rotation angle in radians */ rotate(angle: number): void; /** * Scale the current transform by `(x, y)`. Implemented by subclasses. * @param {number} x - horizontal scale factor * @param {number} y - vertical scale factor */ scale(x: number, y: number): void; /** * Set the renderer global alpha (0..1) for subsequent draw calls. * Implemented by subclasses. * @param {number} alpha - opacity value in the [0..1] range */ setGlobalAlpha(alpha: number): void; /** * Fill an axis-aligned rectangle with the current color. * Implemented by subclasses. * @param {number} x - left edge in viewport pixels * @param {number} y - top edge in viewport pixels * @param {number} width - rectangle width * @param {number} height - rectangle height */ fillRect(x: number, y: number, width: number, height: number): void; /** * Stroke (outline) an axis-aligned rectangle with the current color * at the current {@link Renderer#lineWidth}. Implemented by subclasses. * @param {number} x - left edge in viewport pixels * @param {number} y - top edge in viewport pixels * @param {number} width - rectangle width * @param {number} height - rectangle height * @param {boolean} [fill=false] - also fill the rectangle */ strokeRect(x: number, y: number, width: number, height: number, fill?: boolean): void; /** * Fill an axis-aligned ellipse with the current color. * Implemented by subclasses. * @param {number} x - ellipse center X in viewport pixels * @param {number} y - ellipse center Y in viewport pixels * @param {number} w - horizontal radius * @param {number} h - vertical radius */ fillEllipse(x: number, y: number, w: number, h: number): void; /** * Stroke (outline) an axis-aligned ellipse with the current color * at the current {@link Renderer#lineWidth}. Implemented by subclasses. * @param {number} x - ellipse center X in viewport pixels * @param {number} y - ellipse center Y in viewport pixels * @param {number} w - horizontal radius * @param {number} h - vertical radius * @param {boolean} [fill=false] - also fill the ellipse */ strokeEllipse(x: number, y: number, w: number, h: number, fill?: boolean): void; /** * Draw a straight line between two points with the current color * at the current {@link Renderer#lineWidth}. Implemented by subclasses. * @param {number} startX - start X in viewport pixels * @param {number} startY - start Y in viewport pixels * @param {number} endX - end X in viewport pixels * @param {number} endY - end Y in viewport pixels */ strokeLine(startX: number, startY: number, endX: number, endY: number): void; /** * Draw an image or sub-image into the framebuffer. * Implemented by subclasses (`CanvasRenderer` / `WebGLRenderer` / * future `WebGPURenderer`). * * The 9-argument signature shown here is the canonical form used * throughout the engine; the concrete renderers also accept the * shorter `drawImage(image, dx, dy)` and `drawImage(image, dx, dy, * dWidth, dHeight)` variants from the HTML Canvas2D spec. * @param {HTMLImageElement|SVGImageElement|HTMLVideoElement|HTMLCanvasElement|ImageBitmap|OffscreenCanvas|VideoFrame} image - the source image * @param {number} sx - source rectangle left * @param {number} sy - source rectangle top * @param {number} sw - source rectangle width * @param {number} sh - source rectangle height * @param {number} dx - destination left * @param {number} dy - destination top * @param {number} dw - destination width * @param {number} dh - destination height */ drawImage(image: HTMLImageElement | SVGImageElement | HTMLVideoElement | HTMLCanvasElement | ImageBitmap | OffscreenCanvas | VideoFrame, sx: number, sy: number, sw: number, sh: number, dx: number, dy: number, dw: number, dh: number): void; /** * A mask limits rendering elements to the shape and position of the given mask object. * So, if the renderable is larger than the mask, only the intersecting part of the renderable will be visible. * Mask are not preserved through renderer context save and restore. * @param {Rect|RoundRect|Polygon|Line|Ellipse} [mask] - the shape defining the mask to be applied * @param {boolean} [invert=false] - either the given shape should define what is visible (default) or the opposite */ setMask(mask?: Rect | RoundRect | Polygon | Line | Ellipse, invert?: boolean): void; /** * disable (remove) the rendering mask set through setMask. * @see Renderer#setMask */ clearMask(): void; /** * set a coloring tint for sprite based renderables * @param {Color} tint - the tint color * @param {number} [alpha] - an alpha value to be applied to the tint */ setTint(tint: Color, alpha?: number): void; /** * clear the rendering tint set through setTint. * @see Renderer#setTint */ clearTint(): void; /** * Set the current per-renderable depth value. GPU batchers (WebGL * today, WebGPU once it lands) push it into the vertex stream as the * `z` component of each vertex — a no-op under the default * orthographic projection, used by perspective (Camera3d) to scale * and parallax sprites by distance. * * Typically called automatically by `Renderable.preDraw` from the * renderable's `depth` property. User code only needs to call this * directly when emitting draw calls outside of a `Renderable.draw()` * — e.g. from a custom `Container.draw()` override. * * Honored by the save/restore stack like `setTint` / `setColor`. * @param {number} depth - the depth value to set * @see Renderable#depth */ setDepth(depth: number): void; /** * creates a Blob object representing the last rendered frame * @param {string} [type="image/png"] - A string indicating the image format * @param {number} [quality] - A Number between 0 and 1 indicating the image quality to be used when creating images using file formats that support lossy compression (such as image/jpeg or image/webp). A user agent will use its default quality value if this option is not specified, or if the number is outside the allowed range. * @returns {Promise} A Promise returning a Blob object representing the last rendered frame * @example * renderer.convertToBlob().then((blob) => console.log(blob)); */ toBlob(type?: string, quality?: number): Promise; /** * creates an ImageBitmap object of the last frame rendered * (not supported by standard Canvas) * @param {string} [type="image/png"] - A string indicating the image format * @param {number} [quality] - A Number between 0 and 1 indicating the image quality to be used when creating images using file formats that support lossy compression (such as image/jpeg or image/webp). A user agent will use its default quality value if this option is not specified, or if the number is outside the allowed range. * @returns {Promise} A Promise returning an ImageBitmap. * @example * renderer.transferToImageBitmap().then((image) => console.log(image)); */ toImageBitmap(type?: string, quality?: number): Promise; /** * returns a data URL containing a representation of the last frame rendered * @param {string} [type="image/png"] - A string indicating the image format * @param {number} [quality] - A Number between 0 and 1 indicating the image quality to be used when creating images using file formats that support lossy compression (such as image/jpeg or image/webp). A user agent will use its default quality value if this option is not specified, or if the number is outside the allowed range. * @returns {Promise} A Promise returning a string containing the requested data URL. * @example * renderer.toDataURL().then((dataURL) => console.log(dataURL)); */ toDataURL(type?: string, quality?: number): Promise; /** * Capture the current frame — everything drawn to the active framebuffer / * canvas so far — into a {@link Texture2d}, on the GPU where possible (no * `readPixels` round-trip). The fourth member of the {@link Renderer#toDataURL} * / {@link Renderer#toBlob} / {@link Renderer#toImageBitmap} family — "the * current frame as X" — and the only one whose result can stay GPU-resident, * ready to feed a shader as a screen texture (water refraction, heat haze, * frosted glass). * * Abstract on the base renderer: the concrete backends implement it — * {@link WebGLRenderer#toFrameTexture} (a `copyTexImage2D` into a live GPU * texture, bound as an extra sampler via {@link ShaderEffect#setTexture}) and * {@link CanvasRenderer#toFrameTexture} (an offscreen-canvas copy, for family * parity — custom shaders don't run under Canvas). * @param {object} [options] * @param {Texture2d|null} [options.target] - controls the destination: omit * for the shared renderer slot (default); pass a capture previously * returned by this method to refresh it in place; pass `null` to mint a * fresh, caller-owned capture * @param {Bounds|{x: number, y: number, width: number, height: number}} [options.region] - capture * only this sub-region of the frame — a {@link Bounds} (or any * `{x, y, width, height}`); from a {@link Rect} pass `rect.getBounds()`. * NOTE the origin differs by backend: WebGL uses framebuffer coords * (**bottom-left** origin), Canvas uses **top-left** — relevant under * `video.AUTO`. * @returns {Texture2d} a texture holding the captured frame * @example * effect.setTexture("uScene", renderer.toFrameTexture()); */ toFrameTexture(options?: { target?: Texture2d | null | undefined; region?: Bounds | { x: number; y: number; width: number; height: number; } | undefined; }): Texture2d; } declare namespace Renderer { let _whitePixel: any; } export default Renderer; import CanvasRenderTarget from "./rendertarget/canvasrendertarget.js"; import { Vector2d } from "../math/vector2d.ts"; import type RenderTargetPool from "./rendertarget/render_target_pool.js"; import Path2D from "./../geometries/path2d.ts"; import { Color } from "./../math/color.ts"; import RenderState from "./renderstate.js"; import { Matrix3d } from "../math/matrix3d.ts"; import type { Rect } from "./../geometries/rectangle.ts"; import { Gradient } from "./gradient.js"; import type { Bounds } from "./../physics/bounds.ts"; import type { RoundRect } from "./../geometries/roundrect.ts"; import type { Polygon } from "../geometries/polygon.ts"; import type { Line } from "./../geometries/line.ts"; import type { Ellipse } from "./../geometries/ellipse.ts"; import type { default as Texture2d } from "./texture/texture2d.ts"; //# sourceMappingURL=renderer.d.ts.map