From 8db3bead13441a5882d8689dfc6a9f09c82375d9 Mon Sep 17 00:00:00 2001 From: Maze Winther Date: Wed, 25 Mar 2026 16:47:22 +0100 Subject: feat: masks, properties refactor, shaders, storage migrations, and more --- apps/web/src/services/renderer/nodes/sticker-node.ts | 20 ++++++++++++++------ 1 file changed, 14 insertions(+), 6 deletions(-) (limited to 'apps/web/src/services/renderer/nodes/sticker-node.ts') diff --git a/apps/web/src/services/renderer/nodes/sticker-node.ts b/apps/web/src/services/renderer/nodes/sticker-node.ts index da271685..71cb37b5 100644 --- a/apps/web/src/services/renderer/nodes/sticker-node.ts +++ b/apps/web/src/services/renderer/nodes/sticker-node.ts @@ -4,6 +4,8 @@ import { VisualNode, type VisualNodeParams } from "./visual-node"; export interface StickerNodeParams extends VisualNodeParams { stickerId: string; + intrinsicWidth?: number; + intrinsicHeight?: number; } interface CachedStickerSource { @@ -14,7 +16,7 @@ interface CachedStickerSource { const stickerSourceCache = new Map>(); -function loadStickerSource(stickerId: string): Promise { +function loadStickerSource({ stickerId }: { stickerId: string }): Promise { const cached = stickerSourceCache.get(stickerId); if (cached) return cached; @@ -33,7 +35,7 @@ function loadStickerSource(stickerId: string): Promise { image.src = url; }); - return { source: image, width: 200, height: 200 }; + return { source: image, width: image.naturalWidth, height: image.naturalHeight }; })(); stickerSourceCache.set(stickerId, promise); @@ -45,7 +47,7 @@ export class StickerNode extends VisualNode { constructor(params: StickerNodeParams) { super(params); - this.cachedSource = loadStickerSource(params.stickerId); + this.cachedSource = loadStickerSource({ stickerId: params.stickerId }); } async render({ renderer, time }: { renderer: CanvasRenderer; time: number }) { @@ -55,13 +57,19 @@ export class StickerNode extends VisualNode { return; } - const { source, width, height } = await this.cachedSource; + const { source, width: loadedWidth, height: loadedHeight } = + await this.cachedSource; + + // Prefer element-stored intrinsic dimensions as the geometry authority. + // The loaded image is only the drawable source. + const sourceWidth = this.params.intrinsicWidth ?? loadedWidth; + const sourceHeight = this.params.intrinsicHeight ?? loadedHeight; this.renderVisual({ renderer, source, - sourceWidth: width, - sourceHeight: height, + sourceWidth, + sourceHeight, timelineTime: time, }); } -- cgit v1.3.1