vegard/synops
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Canvas: sist berørt boks forblir øverst (persistent z-order)

Browse source 
Hver gang en boks klikkes/dras økes en global z-teller og boksen
får høyeste verdi. Rekkefølgen bevares etter at boksen deselekteres.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
vegard 2026-03-19 07:21:51 +00:00
parent cf992b6f58
commit e520b8037c
1 changed files with 10 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
frontend/src/lib/components/canvas/Canvas.svelte
View file

@ -63,6 +63,8 @@
let isLassoing = $state(false); let isLassoing = $state(false);
let spaceHeld = $state(false); let spaceHeld = $state(false);
let dragTargetId: string | null = null; let dragTargetId: string | null = null;
let topZCounter = $state(1);
let zOrderMap = $state(new Map<string, number>());
let dragStartWorld = { x: 0, y: 0 }; let dragStartWorld = { x: 0, y: 0 };
let dragObjectStart = { x: 0, y: 0 }; let dragObjectStart = { x: 0, y: 0 };
let dragGroupStarts = new Map<string, { x: number; y: number }>(); let dragGroupStarts = new Map<string, { x: number; y: number }>();
@ -212,6 +214,13 @@
} }
onSelectionChange?.([...selectedIds]); onSelectionChange?.([...selectedIds]);
// Bring to front
topZCounter++;
zOrderMap = new Map(zOrderMap);
for (const sid of selectedIds) {
zOrderMap.set(sid, topZCounter);
}
// Record start positions for all selected objects (group drag) // Record start positions for all selected objects (group drag)
dragGroupStarts = new Map(); dragGroupStarts = new Map();
for (const sid of selectedIds) { for (const sid of selectedIds) {
@ -506,7 +515,7 @@
style:top="{obj.y}px" style:top="{obj.y}px"
style:width="{obj.width}px" style:width="{obj.width}px"
style:height="{obj.height}px" style:height="{obj.height}px"
style:z-index={selectedIds.has(obj.id) ? 10 : 1} style:z-index={zOrderMap.get(obj.id) ?? 1}
> >
{@render renderObject(obj)} {@render renderObject(obj)}
</div> </div>