Hermes/refboard-ayon
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

fix(sticky): bake scale into fontSize + width on sticky resize

Browse Source 
Sticky text was blurry after scaling because sx/sy stretched the
texture without re-rasterizing. Now bakes fontSize and card width
on drag-end (same as plain text), so StickySprite recomputes layout
at native resolution.
This commit is contained in:
Hiren Kangad
2026-03-12 23:44:43 +05:30
parent eb4591dca0
commit d9c1f4c600
1 changed files with 28 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/hooks/useCanvasSetup.ts
+18 -3
View File
@@ -14,6 +14,7 @@ import { AnnotationStore } from '../stores/annotationStore';
import { PinOverlay } from '../canvas/PinOverlay';
import { CropOverlay } from '../canvas/CropOverlay';
import { TextSprite } from '../canvas/sprites/TextSprite';
import { StickySprite } from '../canvas/sprites/StickySprite';
import { TextSharpnessManager } from '../canvas/textSharpness';
// PresenceOverlay removed — remote selection highlighting was too heavy for minimal benefit
import { connectSocket, disconnectSocket } from '../socket';
@@ -208,14 +209,15 @@ export function useCanvasSetup(deps: CanvasSetupDeps) {
onCanvasChange(itemIds); // broadcasts elements + saves + undo + spatial refresh
};
selection.transformBox.onDragEnd = (itemIds) => {
// Bake scale into fontSize for plain text items after resize
// Bake scale into fontSize for text/sticky items after resize
for (const id of itemIds) {
const item = scene.getById(id);
if (!item || item.type !== 'text') continue;
if (!item) continue;
const absSx = Math.abs(item.data.sx);
const absSy = Math.abs(item.data.sy);
if (absSx === 1 && absSy === 1) continue;
// Use average scale as font multiplier
if (item.type === 'text') {
const scale = (absSx + absSy) / 2;
const d = item.data as any;
d.fontSize = Math.round(d.fontSize * scale);
@@ -227,6 +229,19 @@ export function useCanvasSetup(deps: CanvasSetupDeps) {
d.h = item.displayObject.measuredHeight;
}
item.displayObject.scale.set(d.sx, d.sy);
} else if (item.type === 'sticky') {
const d = item.data as any;
// Scale card width and fontSize, then reset sx/sy so text re-rasterizes crisp
d.w = Math.round(d.w * absSx);
d.fontSize = Math.round((d.fontSize || 14) * ((absSx + absSy) / 2));
d.sx = item.data.sx > 0 ? 1 : -1;
d.sy = item.data.sy > 0 ? 1 : -1;
if (item.displayObject instanceof StickySprite) {
item.displayObject.updateFromData(d);
d.h = item.displayObject.computedHeight;
}
item.displayObject.scale.set(d.sx, d.sy);
}
}
onCanvasChange(itemIds);
};