Implement "tidy image" functionality

kettek · Jan 9, 2025 · e560206 · e560206
1 parent 1569e19
commit e560206
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 1 deletion.
diff --git a/frontend/src/App.svelte b/frontend/src/App.svelte
@@ -15,7 +15,7 @@
   import { logSettings } from './stores/log.js'
 
   import { LoadedFile } from './types/file'
-  import { ChangeColorModeUndoable, PixelsFlipUndoable, PixelsPlaceUndoable, PixelsRotateUndoable, ResizeSlicesUndoable, SelectionClearUndoable, SelectionReplacePixelIndicesUndoable, SelectionSetUndoable, ThreeDSelectionBoxClearUndoable, ThreeDSelectionBoxSetVoxelsUndoable } from './types/file/undoables'
+  import { ChangeColorModeUndoable, PixelsFlipUndoable, PixelsPlaceUndoable, PixelsRotateUndoable, ResizeSlicesUndoable, SelectionClearUndoable, SelectionReplacePixelIndicesUndoable, SelectionSetUndoable, ThreeDSelectionBoxClearUndoable, ThreeDSelectionBoxSetVoxelsUndoable, TidyCanvasUndoable } from './types/file/undoables'
 
   import 'carbon-components-svelte/css/all.css'
   import { Tabs, Tab, TabContent, NumberInput, Dropdown, Checkbox, Theme } from 'carbon-components-svelte'
@@ -408,6 +408,11 @@
     showColorMode = false
   }
 
+  function engageTidy() {
+    if (!$fileStates.focused) return
+    $fileStates.focused.push(new TidyCanvasUndoable())
+  }
+
   function closeFile(index: number, force: boolean = false) {
     if (!fileStates.getFile(index)?.saved() && !force) {
       savingFileName = fileStates.getFile(index)?.title || ''
@@ -543,6 +548,7 @@
       <div slot="menu">Image</div>
       <OverflowMenuItem text="Color Mode..." on:click={() => (showColorMode = true)} />
       <OverflowMenuItem hasDivider text="Duplicate" on:click={() => engageDuplicate()} />
+      <OverflowMenuItem hasDivider text="Tidy" on:click={() => engageTidy()} />
     </OverflowMenu>
     <OverflowMenu size="sm">
       <div slot="menu">View</div>

diff --git a/frontend/src/types/file/undoables.ts b/frontend/src/types/file/undoables.ts
@@ -2158,6 +2158,29 @@ export class MoveAnimationFrameSliceUndoable implements Undoable<LoadedFile> {
   }
 }
 
+export class TidyCanvasUndoable implements Undoable<LoadedFile> {
+  pixels: Uint8Array = new Uint8Array([])
+  constructor() {}
+  apply(t: LoadedFile): void {
+    this.pixels = t.canvas.getPixels(0, 0, t.canvas.width, t.canvas.height)
+    t.cacheSlicePositions() // Just in case.
+    type ClearArea = { x: number; y: number; width: number; height: number }
+    let clearAreas: ClearArea[] = []
+    for (let stack of t.stacks) {
+      let { x, y, width, height } = t.getStackAreaFromStack(stack)
+      if (width < t.canvas.width) {
+        clearAreas.push({ x: x + width, y, width: t.canvas.width - width, height })
+      }
+    }
+    for (let area of clearAreas) {
+      t.canvas.clearPixels(area.x, area.y, area.width, area.height)
+    }
+  }
+  unapply(t: LoadedFile): void {
+    t.canvas.setPixels(0, 0, t.canvas.width, t.canvas.height, this.pixels)
+  }
+}
+
 export class ThreeDSelectionBoxClearUndoable implements Undoable<LoadedFile> {
   //private selection: [[number, number, number], [number, number, number]] = [[0, 0, 0], [0, 0, 0]]
   private cursor1: [number, number, number] = [0, 0, 0]