keep multiselections on top while dragging; don't reorder them when hovering
Hunter
Wednesday, July 29th, 2026 at 3:37 PM
377 highestZIndex++;
378 container.style.zIndex = highestZIndex;
379 }
380 +
381 +// Raise a whole group above everything else, keeping its members' order relative to one another
382 +function bringGroupToFront(group) {
383 + [...group]
384 + .sort((a, b) => (parseInt(a.container.style.zIndex, 10) || 0) - (parseInt(b.container.style.zIndex, 10) || 0))
385 + .forEach(img => bringToFront(img.container));
386 +}
3 function setupImageHandlers(imageData) {
4 const container = imageData.container;
5
- // Bring to front on hover
6 + // Bring to front on hover, except within a selection, where it would shuffle the group's paint order
7 container.addEventListener('mouseenter', () => {
8 + if (isSelected(imageData)) return;
9 bringToFront(container);
10 });
11
19
20 // Dragging a selected image moves the whole selection
21 const group = isSelected(imageData) ? Array.from(selectedImages) : [imageData];
22 + bringGroupToFront(group);
23 const bounds = selectionBounds(group);
24
25 dragState = {
72 container.addEventListener('touchstart', (e) => {
73 if (e.target.classList.contains('resize-handle')) return;
74
- // Bring to front on touch
- bringToFront(container);
-
- if (!isSelected(imageData)) clearSelection();
75 + // Bring to front on touch; a selected image is raised with its group instead
76 + if (isSelected(imageData)) {
77 + bringGroupToFront(Array.from(selectedImages));
78 + } else {
79 + bringToFront(container);
80 + clearSelection();
81 + }
82
83 if (e.touches.length === 1) {
84 // Single touch - start drag (or long press for pan)