[FEAT] Clean code

src/composables/useLayers.ts

@@ -70,16 +70,13 @@ export const useLayers = () => {
     const l = activeLayer.value;
     if (!l || !l.sprites.length) return;
 
-    // Determine the cell dimensions to align within
     let cellWidth: number;
     let cellHeight: number;
 
     if (settingsStore.manualCellSizeEnabled) {
-      // Use manual cell size (without negative spacing)
       cellWidth = settingsStore.manualCellWidth;
       cellHeight = settingsStore.manualCellHeight;
     } else {
-      // Use auto-calculated dimensions based on ALL visible layers (not just active layer)
       const { maxWidth, maxHeight } = getMaxDimensionsAcrossLayers(visibleLayers.value);
       cellWidth = maxWidth;
       cellHeight = maxHeight;
@@ -120,60 +117,26 @@ export const useLayers = () => {
 
     const next = [...l.sprites];
 
-    // Remove the moving sprite first
     const [moving] = next.splice(currentIndex, 1);
 
-    // Determine the actual index to insert at, considering we removed one item
-    // If the target index was greater than current index, it shifts down by 1 in the original array perspective?
-    // Actually simpler: we just want to put 'moving' at 'newIndex' in the final array.
-
-    // If newIndex is beyond the current bounds (after removal), fill with placeholders
     while (next.length < newIndex) {
       next.push(createEmptySprite());
     }
 
-    // Now insert
-    // If newIndex is within bounds, we might be swapping if there was something there
-    // But the DragSprite logic implies we are "moving to this cell".
-    // If there is existing content at newIndex, we should swap or splice?
-    // The previous implementation did a swap if newIndex < length (before removal).
-
-    // Let's stick to the "swap" logic if there's a sprite there, or "move" if we are reordering.
-    // Wait, Drag and Drop usually implies "insert here" or "swap with this".
-    // useDragSprite says: "if allowCellSwap... updateSpriteCell".
-
-    // The original logic:
-    // if (newIndex < next.length) -> swap
-    // else -> splice (move)
-
-    // Re-evaluating original logic:
-    // next has NOT had the item removed yet in the original logic 'if' block.
-
-    // Let's implement robust swap/move logic.
-    // 1. If target is empty placeholder -> just move there (replace placeholder).
-    // 2. If target has sprite -> swap.
-    // 3. If target is out of bounds -> pad and move.
-
     if (newIndex < l.sprites.length) {
-      // Perform Swap
       const target = l.sprites[newIndex];
       const moving = l.sprites[currentIndex];
 
-      // Clone array
       const newSprites = [...l.sprites];
       newSprites[currentIndex] = target;
       newSprites[newIndex] = moving;
       l.sprites = newSprites;
     } else {
-      // Move to previously empty/non-existent cell
       const newSprites = [...l.sprites];
-      // Remove from old pos
       const [moved] = newSprites.splice(currentIndex, 1);
-      // Pad
       while (newSprites.length < newIndex) {
         newSprites.push(createEmptySprite());
       }
-      // Insert (or push if equal length)
       newSprites.splice(newIndex, 0, moved);
       l.sprites = newSprites;
     }
@@ -197,7 +160,6 @@ export const useLayers = () => {
     const l = activeLayer.value;
     if (!l) return;
 
-    // Sort indices in descending order to avoid shift issues when splicing
     const indicesToRemove: number[] = [];
     ids.forEach(id => {
       const i = l.sprites.findIndex(s => s.id === id);
@@ -291,21 +253,11 @@ export const useLayers = () => {
         const currentSprites = [...l.sprites];
 
         if (typeof index === 'number') {
-          // If index is provided, insert there (padding if needed)
           while (currentSprites.length < index) {
             currentSprites.push(createEmptySprite());
           }
-          // If valid index, replace if empty or splice?
-          // "Adds it not in the one I selected".
-          // If I select a cell, I expect it to go there.
-          // If the cell is empty (placeholder), replace it.
-          // If the cell has a sprite, maybe insert/shift?
-          // Usually "Add" implies append, but context menu "Add sprite" on a cell implies "Put it here".
-          // Let's Insert (Shift others) for safety, or check if empty.
-          // But simpler: just splice it in.
           currentSprites.splice(index, 0, next);
         } else {
-          // No index, append to end
           currentSprites.push(next);
         }
         l.sprites = currentSprites;
@@ -353,7 +305,6 @@ export const useLayers = () => {
   };
 
   const copySpriteToFrame = (spriteId: string, targetLayerId: string, targetFrameIndex: number) => {
-    // Find the source sprite in any layer
     let sourceSprite: Sprite | undefined;
     for (const layer of layers.value) {
       sourceSprite = layer.sprites.find(s => s.id === spriteId);
@@ -362,11 +313,9 @@ export const useLayers = () => {
 
     if (!sourceSprite) return;
 
-    // Find target layer
     const targetLayer = layers.value.find(l => l.id === targetLayerId);
     if (!targetLayer) return;
 
-    // Create a deep copy of the sprite with a new ID
     const copiedSprite: Sprite = {
       id: crypto.randomUUID(),
       file: sourceSprite.file,
@@ -381,14 +330,11 @@ export const useLayers = () => {
       flipY: sourceSprite.flipY,
     };
 
-    // Expand the sprites array if necessary with empty placeholder sprites
     while (targetLayer.sprites.length < targetFrameIndex) {
       targetLayer.sprites.push(createEmptySprite());
     }
 
-    // Replace or insert the sprite at the target index
     if (targetFrameIndex < targetLayer.sprites.length) {
-      // Replace existing sprite at this frame
       const old = targetLayer.sprites[targetFrameIndex];
       if (old.url && old.url.startsWith('blob:')) {
         try {
@@ -397,7 +343,6 @@ export const useLayers = () => {
       }
       targetLayer.sprites[targetFrameIndex] = copiedSprite;
     } else {
-      // Add at the end
       targetLayer.sprites.push(copiedSprite);
     }
   };
@@ -429,8 +374,6 @@ export const useLayers = () => {
 };
 
 export const getMaxDimensionsAcrossLayers = (layers: Layer[], visibleOnly: boolean = false) => {
-  // When visibleOnly is false (default), consider ALL layers to keep canvas size stable
-  // When visibleOnly is true (export), only consider visible layers
   const sprites = layers.flatMap(l => (visibleOnly ? (l.visible ? l.sprites : []) : l.sprites));
   return getMaxDimensionsSingle(sprites);
 };