@typeonce/ritmo-tools 0.17.0 → 0.19.0

package/dist/pixel/core/sheet.d.ts

@@ -48,18 +48,69 @@ export interface SheetFrame {
         readonly y: number;
     };
 }
-/** Everything that makes a sheet into an animation, beyond the recipe every frame shares. */
-export interface Sheet {
-    readonly frames: ReadonlyArray<SheetFrame>;
-    readonly anchor: Anchor;
+/**
+ * One animation on a sheet: a name a game plays it by, its frames (indices
+ * into the sheet's frames, in the order they play), whether it is exported,
+ * and how it plays.
+ */
+export interface SheetAnimation {
+    readonly name: string;
+    readonly frames: ReadonlyArray<number>;
+    readonly include: boolean;
     /** Frames per second. */
     readonly fps: number;
     readonly loop: Loop;
-    /** Empty pixels kept around the frames, on every side. */
+}
+/**
+ * Everything that makes a sheet into animations, beyond the recipe every
+ * frame shares. Every frame belongs to exactly one animation: change frames
+ * and animations with `withFrames`, `insertFrame`, `removeFrame`,
+ * `splitAnimation`, `joinAnimation`, and `renameAnimation`, which keep that so.
+ */
+export interface Sheet {
+    readonly frames: ReadonlyArray<SheetFrame>;
+    readonly animations: ReadonlyArray<SheetAnimation>;
+    readonly anchor: Anchor;
+    /** Empty pixels kept around each animation's frames, on every side. */
     readonly padding: number;
 }
+export declare const DEFAULT_FPS = 8;
 export declare const defaultSheet: Sheet;
 export declare const frameOf: (box: FrameBox) => SheetFrame;
+/** An animation of these frames, exported, at the default speed, looping. */
+export declare const animationOf: (name: string, frames: ReadonlyArray<number>) => SheetAnimation;
+/** Boxes in reading order: row by row, left to right, a row level with another after the one on its left. */
+export declare const readingOrder: (boxes: ReadonlyArray<FrameBox>) => Array<FrameBox>;
+/**
+ * The animations a sheet's frames make, by default: one per row. Image
+ * generators often put two blocks side by side (walking on the left,
+ * throwing on the right), and where their rows do not line up the blocks
+ * show; a row across both is split where the blocks meet, when its two
+ * parts hold as many frames as the blocks' rows (a row of a different count,
+ * like an explosion under both, stays whole). Named "animation-1", ... in
+ * reading order.
+ */
+export declare const groupFrames: (boxes: ReadonlyArray<FrameBox>) => Array<SheetAnimation>;
+/** The sheet with these frames, grouped into animations by `groupFrames` (anchor and margin kept). */
+export declare const withFrames: (sheet: Sheet, frames: ReadonlyArray<SheetFrame>) => Sheet;
+/**
+ * The sheet with a frame added at `index` (later frames move up one), in
+ * the animation of the frame before it, right after that frame; the first
+ * frame of all joins the first animation, and a sheet with none gets one.
+ */
+export declare const insertFrame: (sheet: Sheet, index: number, frame: SheetFrame) => Sheet;
+/** The sheet without the frame at `index` (later frames move down one); an animation left with no frames is dropped. */
+export declare const removeFrame: (sheet: Sheet, index: number) => Sheet;
+/** The animation at `animation` cut in two before its frame at position `at` (1 or more): the second part is a new animation after it. */
+export declare const splitAnimation: (sheet: Sheet, animation: number, at: number) => Sheet;
+/** The animation at `animation` and the one after it as one, keeping the first one's name and settings. */
+export declare const joinAnimation: (sheet: Sheet, animation: number) => Sheet;
+/** A name an animation can take: letters, digits, "-", "_", and ".", as games look it up. */
+export declare const isAnimationName: (name: string) => boolean;
+/** The animation renamed; a name that is taken gets a number, and a name that is not `isAnimationName` leaves it as it is. */
+export declare const renameAnimation: (sheet: Sheet, animation: number, name: string) => Sheet;
+/** The animation with some of its settings changed (whether it is exported, its speed, how it loops). */
+export declare const setAnimation: (sheet: Sheet, animation: number, change: Partial<Pick<SheetAnimation, "include" | "fps" | "loop">>) => Sheet;
 /**
  * The background's colors: those covering much of the picture's border (a
  * painted grid behind the frames gives two, its fill and its lines).
@@ -101,6 +152,13 @@ export declare const clearSheet: (image: RgbaImage, colors: ReadonlyArray<Rgb>,
  * per frame, row by row, left to right. Boxes reach halfway into the gaps
  * around them, so a frame's loose bits (sparks, dust) stay inside it.
  * Returns one box around everything when the sheet has a single frame.
+ *
+ * The sheet is cut into rows of art, each row into frames, and each frame's
+ * box is cut into rows again when it holds frames stacked one over another:
+ * a sheet made of blocks side by side whose rows do not line up (walking on
+ * the left, throwing on the right) has no empty row across its whole width
+ * between two of a block's rows. Every cut is judged at the sheet's size, so
+ * a gap inside a frame (a body and the bomb it throws) never splits it.
  */
 export declare const findFrames: (image: RgbaImage) => Array<FrameBox>;
 /** The part of a picture inside a box (clamped to the picture). */
@@ -143,9 +201,11 @@ export declare const layOut: (arts: ReadonlyArray<PixelArt>, offsets: ReadonlyAr
 /** The order frames play in: start to end, or there and back without repeating the ends. */
 export declare const playOrder: (count: number, loop: Loop) => Array<number>;
 /**
- * Whether boxes found in a sheet look like frames of one animation rather
- * than parts of one picture: at least two, holding about as much art each
- * (the least at least a fifth of the most) and about as wide.
+ * Whether boxes found in a sheet look like frames of an animation rather
+ * than parts of one picture: at least two, and most of them (three in four)
+ * alike, holding about as much art as the typical frame and about as wide.
+ * The rest may be faint (the sparks and smoke at the end of an explosion):
+ * one such frame does not make a sheet a picture.
  */
 export declare const looksAnimated: (image: RgbaImage, boxes: ReadonlyArray<FrameBox>) => boolean;
 //# sourceMappingURL=sheet.d.ts.map

package/dist/pixel/core/sheet.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sheet.d.ts","sourceRoot":"","sources":["../../../src/pixel/core/sheet.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AACH,OAAO,EAAqB,KAAK,GAAG,EAAE,MAAM,YAAY,CAAA;AACxD,OAAO,EAAe,KAAK,QAAQ,EAAE,MAAM,UAAU,CAAA;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,WAAW,CAAA;AAE1C,mEAAmE;AACnE,MAAM,WAAW,QAAQ;IACvB,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAA;CACxB;AAED;;;;;GAKG;AACH,MAAM,MAAM,MAAM,GAAG,QAAQ,GAAG,MAAM,GAAG,QAAQ,GAAG,KAAK,CAAA;AAEzD,eAAO,MAAM,OAAO,EAAE,aAAa,CAAC;IAAE,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAKzG,CAAA;AAED,yEAAyE;AACzE,MAAM,MAAM,IAAI,GAAG,SAAS,GAAG,UAAU,CAAA;AAEzC,yGAAyG;AACzG,MAAM,WAAW,UAAU;IACzB,QAAQ,CAAC,GAAG,EAAE,QAAQ,CAAA;IACtB,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAA;IACzB,QAAQ,CAAC,KAAK,EAAE;QAAE,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAA;CAC3D;AAED,6FAA6F;AAC7F,MAAM,WAAW,KAAK;IACpB,QAAQ,CAAC,MAAM,EAAE,aAAa,CAAC,UAAU,CAAC,CAAA;IAC1C,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAA;IACvB,yBAAyB;IACzB,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAA;IACnB,0DAA0D;IAC1D,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;CACzB;AAED,eAAO,MAAM,YAAY,EAAE,KAA6E,CAAA;AAExG,eAAO,MAAM,OAAO,QAAS,QAAQ,KAAG,UAA6D,CAAA;AAYrG;;;;GAIG;AACH,eAAO,MAAM,eAAe,UAAW,SAAS,KAAG,KAAK,CAAC,GAAG,CAgC3D,CAAA;AAED;;;;;GAKG;AACH,eAAO,MAAM,SAAS,UAAW,SAAS,QAAQ,GAAG,KAAG,MAqBvD,CAAA;AAUD;;;;;;;;;GASG;AACH,eAAO,MAAM,eAAe,UACnB,SAAS,UACR,aAAa,CAAC,GAAG,CAAC,aACf,MAAM,KAChB;IAAE,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAC;IAAC,QAAQ,CAAC,MAAM,EAAE,aAAa,CAAC,GAAG,CAAC,CAAA;CAqFlE,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,UAAU,UAAW,SAAS,UAAU,aAAa,CAAC,GAAG,CAAC,aAAa,MAAM,KAAG;IAAE,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAC;IAAC,QAAQ,CAAC,IAAI,EAAE,UAAU,CAAA;CA2ClJ,CAAA;AAyCD;;;;;GAKG;AACH,eAAO,MAAM,UAAU,UAAW,SAAS,KAAG,KAAK,CAAC,QAAQ,CA4E3D,CAAA;AA6BD,mEAAmE;AACnE,eAAO,MAAM,SAAS,UAAW,SAAS,OAAO,QAAQ,KAAG,SAY3D,CAAA;AAKD,6CAA6C;AAC7C,MAAM,WAAW,KAAK;IACpB,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;;GAGG;AACH,eAAO,MAAM,MAAM,QAAS,QAAQ,KAAG,KAAK,CAAC,MAAM,CAyBlD,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,QAAQ,QAAS,QAAQ,UAAU,MAAM,KAAG,KAAK,GAAG,SAehE,CAAA;AAED,iGAAiG;AACjG,eAAO,MAAM,YAAY,SAAU,aAAa,CAAC,QAAQ,CAAC,KAAG,KAAK,CAAC,QAAQ,CAiB1E,CAAA;AAED,2CAA2C;AAC3C,MAAM,WAAW,MAAM;IACrB,QAAQ,CAAC,GAAG,EAAE,QAAQ,CAAA;IACtB,2FAA2F;IAC3F,QAAQ,CAAC,MAAM,EAAE,KAAK,CAAA;CACvB;AAED;;;;;GAKG;AACH,eAAO,MAAM,MAAM,SACX,aAAa,CAAC,QAAQ,CAAC,WACpB,aAAa,CAAC,KAAK,CAAC,WACpB,MAAM,KACd;IAAE,QAAQ,CAAC,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IAAC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAA;CAwCnF,CAAA;AAED,4FAA4F;AAC5F,eAAO,MAAM,SAAS,UAAW,MAAM,QAAQ,IAAI,KAAG,KAAK,CAAC,MAAM,CAIjE,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,aAAa,UAAW,SAAS,SAAS,aAAa,CAAC,QAAQ,CAAC,KAAG,OAahF,CAAA"}
+{"version":3,"file":"sheet.d.ts","sourceRoot":"","sources":["../../../src/pixel/core/sheet.ts"],"names":[],"mappings":"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"}

package/dist/pixel/core/sheet.js

@@ -23,8 +23,170 @@ export const anchors = [
     { id: "center", label: "Center", hint: "Each frame's body is centered on the same spot: for flying or floating things." },
     { id: "box", label: "Box", hint: "Frames are placed as they sit in their boxes, unmoved." }
 ];
-export const defaultSheet = { frames: [], anchor: "ground", fps: 8, loop: "forward", padding: 1 };
+export const DEFAULT_FPS = 8;
+export const defaultSheet = { frames: [], animations: [], anchor: "ground", padding: 1 };
 export const frameOf = (box) => ({ box, include: true, nudge: { x: 0, y: 0 } });
+/** An animation of these frames, exported, at the default speed, looping. */
+export const animationOf = (name, frames) => ({ name, frames, include: true, fps: DEFAULT_FPS, loop: "forward" });
+/** Two boxes on one row: their middles at about one height and their heights alike (a quarter of the smaller apart). */
+const sameRow = (a, b) => {
+    const least = Math.min(a.height, b.height);
+    return Math.abs(a.y + a.height / 2 - (b.y + b.height / 2)) <= 0.25 * least && Math.max(a.height, b.height) <= 1.5 * least;
+};
+/** Boxes in rows: each row's indices left to right, the rows top to bottom (a row level with another, left first). */
+const rowsOf = (boxes) => {
+    const rows = [];
+    boxes.forEach((box, i) => {
+        const row = rows.find((other) => sameRow(boxes[other[0]], box));
+        if (row === undefined)
+            rows.push([i]);
+        else
+            row.push(i);
+    });
+    for (const row of rows)
+        row.sort((a, b) => boxes[a].x - boxes[b].x);
+    const top = (row) => boxes[row[0]];
+    return rows.sort((a, b) => {
+        const first = top(a);
+        const second = top(b);
+        return Math.abs(first.y - second.y) <= 0.25 * Math.min(first.height, second.height) ? first.x - second.x : first.y - second.y;
+    });
+};
+/** Boxes in reading order: row by row, left to right, a row level with another after the one on its left. */
+export const readingOrder = (boxes) => rowsOf(boxes).flatMap((row) => row.map((i) => boxes[i]));
+/**
+ * The animations a sheet's frames make, by default: one per row. Image
+ * generators often put two blocks side by side (walking on the left,
+ * throwing on the right), and where their rows do not line up the blocks
+ * show; a row across both is split where the blocks meet, when its two
+ * parts hold as many frames as the blocks' rows (a row of a different count,
+ * like an explosion under both, stays whole). Named "animation-1", ... in
+ * reading order.
+ */
+export const groupFrames = (boxes) => {
+    const rows = rowsOf(boxes);
+    const left = (row) => Math.min(...row.map((i) => boxes[i].x));
+    const right = (row) => Math.max(...row.map((i) => boxes[i].x + boxes[i].width));
+    const span = (row) => ({
+        top: Math.min(...row.map((i) => boxes[i].y)),
+        bottom: Math.max(...row.map((i) => boxes[i].y + boxes[i].height))
+    });
+    const widths = boxes.map((box) => box.width).sort((a, b) => a - b);
+    const reach = 0.5 * (widths[Math.floor(widths.length / 2)] ?? 0);
+    // Where two rows sit side by side: the blocks' meeting line, and how many frames each block's rows hold.
+    const seams = [];
+    for (const a of rows) {
+        for (const b of rows) {
+            if (a === b)
+                continue;
+            const sa = span(a);
+            const sb = span(b);
+            const overlap = Math.min(sa.bottom, sb.bottom) - Math.max(sa.top, sb.top);
+            if (overlap > 0.3 * Math.min(sa.bottom - sa.top, sb.bottom - sb.top) && right(a) <= left(b) + reach) {
+                seams.push({ x: (right(a) + left(b)) / 2, before: a.length, after: b.length });
+            }
+        }
+    }
+    const parts = rows.flatMap((row) => {
+        for (const seam of seams) {
+            const at = row.findIndex((i) => boxes[i].x + boxes[i].width / 2 > seam.x);
+            if (at !== seam.before || row.length - at !== seam.after)
+                continue;
+            const edge = boxes[row[at]].x;
+            if (Math.abs(edge - seam.x) <= reach)
+                return [row.slice(0, at), row.slice(at)];
+        }
+        return [row];
+    });
+    return parts.map((frames, i) => animationOf(`animation-${i + 1}`, frames));
+};
+/** The sheet with these frames, grouped into animations by `groupFrames` (anchor and margin kept). */
+export const withFrames = (sheet, frames) => ({
+    ...sheet,
+    frames,
+    animations: groupFrames(frames.map((frame) => frame.box))
+});
+/** A name no other animation has: `name`, or `name-2`, `name-3`, ... */
+const freeName = (animations, name, skip = -1) => {
+    const taken = new Set(animations.filter((_, i) => i !== skip).map((animation) => animation.name));
+    if (!taken.has(name))
+        return name;
+    let n = 2;
+    while (taken.has(`${name}-${n}`))
+        n++;
+    return `${name}-${n}`;
+};
+/**
+ * The sheet with a frame added at `index` (later frames move up one), in
+ * the animation of the frame before it, right after that frame; the first
+ * frame of all joins the first animation, and a sheet with none gets one.
+ */
+export const insertFrame = (sheet, index, frame) => {
+    const frames = [...sheet.frames];
+    frames.splice(index, 0, frame);
+    const shifted = sheet.animations.map((animation) => ({ ...animation, frames: animation.frames.map((i) => (i >= index ? i + 1 : i)) }));
+    if (shifted.length === 0)
+        return { ...sheet, frames, animations: [animationOf("animation-1", [index])] };
+    const before = index - 1;
+    const owner = shifted.findIndex((animation) => animation.frames.includes(before));
+    const animations = shifted.map((animation, a) => {
+        if (owner < 0 ? a !== 0 : a !== owner)
+            return animation;
+        const list = [...animation.frames];
+        list.splice(owner < 0 ? 0 : list.indexOf(before) + 1, 0, index);
+        return { ...animation, frames: list };
+    });
+    return { ...sheet, frames, animations };
+};
+/** The sheet without the frame at `index` (later frames move down one); an animation left with no frames is dropped. */
+export const removeFrame = (sheet, index) => ({
+    ...sheet,
+    frames: sheet.frames.filter((_, i) => i !== index),
+    animations: sheet.animations
+        .map((animation) => ({ ...animation, frames: animation.frames.filter((i) => i !== index).map((i) => (i > index ? i - 1 : i)) }))
+        .filter((animation) => animation.frames.length > 0)
+});
+/** The animation at `animation` cut in two before its frame at position `at` (1 or more): the second part is a new animation after it. */
+export const splitAnimation = (sheet, animation, at) => {
+    const current = sheet.animations[animation];
+    if (current === undefined || at < 1 || at >= current.frames.length)
+        return sheet;
+    const animations = [...sheet.animations];
+    const second = { ...current, frames: current.frames.slice(at), name: "" };
+    animations.splice(animation, 1, { ...current, frames: current.frames.slice(0, at) }, { ...second, name: freeName(animations, current.name) });
+    return { ...sheet, animations };
+};
+/** The animation at `animation` and the one after it as one, keeping the first one's name and settings. */
+export const joinAnimation = (sheet, animation) => {
+    const current = sheet.animations[animation];
+    const next = sheet.animations[animation + 1];
+    if (current === undefined || next === undefined)
+        return sheet;
+    const animations = [...sheet.animations];
+    animations.splice(animation, 2, { ...current, frames: [...current.frames, ...next.frames] });
+    return { ...sheet, animations };
+};
+/** A name an animation can take: letters, digits, "-", "_", and ".", as games look it up. */
+export const isAnimationName = (name) => /^[A-Za-z0-9_.-]+$/.test(name);
+/** The animation renamed; a name that is taken gets a number, and a name that is not `isAnimationName` leaves it as it is. */
+export const renameAnimation = (sheet, animation, name) => {
+    const current = sheet.animations[animation];
+    const wanted = name.trim().replace(/\s+/g, "-");
+    if (current === undefined || !isAnimationName(wanted))
+        return sheet;
+    const animations = [...sheet.animations];
+    animations[animation] = { ...current, name: freeName(sheet.animations, wanted, animation) };
+    return { ...sheet, animations };
+};
+/** The animation with some of its settings changed (whether it is exported, its speed, how it loops). */
+export const setAnimation = (sheet, animation, change) => {
+    const current = sheet.animations[animation];
+    if (current === undefined)
+        return sheet;
+    const animations = [...sheet.animations];
+    animations[animation] = { ...current, ...change, fps: Math.min(60, Math.max(0.5, change.fps ?? current.fps)) };
+    return { ...sheet, animations };
+};
 // ---------------------------------------------------------------------------
 // Clearing the background
 const distance = (x, y) => Math.hypot(x.l - y.l, x.a - y.a, x.b - y.b);
@@ -299,37 +461,70 @@ const LABEL_BAND = 0.4;
  * per frame, row by row, left to right. Boxes reach halfway into the gaps
  * around them, so a frame's loose bits (sparks, dust) stay inside it.
  * Returns one box around everything when the sheet has a single frame.
+ *
+ * The sheet is cut into rows of art, each row into frames, and each frame's
+ * box is cut into rows again when it holds frames stacked one over another:
+ * a sheet made of blocks side by side whose rows do not line up (walking on
+ * the left, throwing on the right) has no empty row across its whole width
+ * between two of a block's rows. Every cut is judged at the sheet's size, so
+ * a gap inside a frame (a body and the bomb it throws) never splits it.
  */
 export const findFrames = (image) => {
-    const { width, height } = image;
-    const whole = { x: 0, y: 0, width, height };
-    const { rows } = counts(image, whole);
+    const least = Math.max(2, 0.01 * image.width);
+    const spacing = [];
+    const top = framesIn(image, { x: 0, y: 0, width: image.width, height: image.height }, least, spacing);
+    // Below the top, frames split only at gaps not much narrower than the narrowest gap that
+    // already split two frames: one frame's own gaps (a body and its bomb) are narrower.
+    const usual = spacing.length === 0 ? least : Math.max(least, 0.6 * Math.min(...spacing));
+    const again = (box, depth) => {
+        if (depth >= DEPTH || bandsIn(image, box).kept.length < 2)
+            return [box];
+        const inner = framesIn(image, box, usual, []);
+        return inner.length > 1 ? inner.flatMap((part) => again(part, depth + 1)) : [box];
+    };
+    return readingOrder(top.flatMap((box) => again(box, 0)));
+};
+/** How many times a box is cut into rows again: blocks within blocks are rare. */
+const DEPTH = 3;
+/** The rows of art in one part of the sheet, and those tall enough to be frames (the rest are labels). */
+const bandsIn = (image, area) => {
+    const { rows } = counts(image, area);
     // A row with a pixel or two in it is noise left by the clearing, not art.
-    const noise = Math.max(1, Math.round(width * 0.001));
-    const bands = runsOf(rows.map((n) => n > noise), Math.max(2, Math.round(height * 0.01))).filter((band) => band.to - band.from >= 3);
+    const noise = Math.max(1, Math.round(image.width * 0.001));
+    const bands = runsOf(rows.map((n) => n > noise), Math.max(2, Math.round(image.height * 0.01)))
+        .filter((band) => band.to - band.from >= 3)
+        .map((band) => ({ from: band.from + area.y, to: band.to + area.y }));
+    const tallest = Math.max(0, ...bands.map((band) => band.to - band.from));
+    return { bands, kept: bands.filter((band) => band.to - band.from >= LABEL_BAND * tallest) };
+};
+/**
+ * The frames inside one part of the sheet, split only at gaps at least
+ * `least` wide. Adds the width of each gap it split frames at to `spacing`.
+ */
+const framesIn = (image, area, least, spacing) => {
+    const { bands, kept } = bandsIn(image, area);
     if (bands.length === 0)
         return [];
-    const tallest = Math.max(...bands.map((band) => band.to - band.from));
-    const kept = bands.filter((band) => band.to - band.from >= LABEL_BAND * tallest);
+    const bottomOf = area.y + area.height;
     const boxes = [];
-    kept.forEach((band, b) => {
+    kept.forEach((band) => {
         // The band's own space, halfway to the bands around it (labels included).
         const above = bands[bands.indexOf(band) - 1];
         const below = bands[bands.indexOf(band) + 1];
-        const marginTop = Math.round((band.from - (above?.to ?? Math.max(0, band.from - (band.to - band.from) * 0.1))) / 2);
-        const marginBottom = Math.round(((below?.from ?? Math.min(height, band.to + (band.to - band.from) * 0.1)) - band.to) / 2);
-        const top = Math.max(0, band.from - Math.min(marginTop, Math.round(0.15 * (band.to - band.from))));
-        const bottom = Math.min(height, band.to + Math.min(marginBottom, Math.round(0.15 * (band.to - band.from))));
-        void b;
-        const area = { x: 0, y: band.from, width, height: band.to - band.from };
-        const { columns } = counts(image, area);
-        const pieces = runsOf(columns.map((n) => n > 0), 1);
+        const marginTop = Math.round((band.from - (above?.to ?? Math.max(area.y, band.from - (band.to - band.from) * 0.1))) / 2);
+        const marginBottom = Math.round(((below?.from ?? Math.min(bottomOf, band.to + (band.to - band.from) * 0.1)) - band.to) / 2);
+        const top = Math.max(area.y, band.from - Math.min(marginTop, Math.round(0.15 * (band.to - band.from))));
+        const bottom = Math.min(bottomOf, band.to + Math.min(marginBottom, Math.round(0.15 * (band.to - band.from))));
+        const { columns } = counts(image, { x: area.x, y: band.from, width: area.width, height: band.to - band.from });
+        const pieces = runsOf(columns.map((n) => n > 0), 1).map((piece) => ({ from: piece.from + area.x, to: piece.to + area.x }));
         if (pieces.length === 0)
             return;
         // Gaps between the pieces; the frames are split at the widest ones.
         const gaps = pieces.slice(1).map((piece, i) => ({ at: i, size: piece.from - pieces[i].to }));
-        const splits = widestGaps(gaps.map((gap) => gap.size), width);
+        const splits = widestGaps(gaps.map((gap) => gap.size), least);
         const cuts = new Set(splits.map((i) => gaps[i].at));
+        for (const i of splits)
+            spacing.push(gaps[i].size);
         let start = pieces[0].from;
         const groups = [];
         pieces.forEach((piece, i) => {
@@ -354,18 +549,37 @@ export const findFrames = (image) => {
                 if (at < 0 || inside[i].from - inside[i - 1].to > inside[at].from - inside[at - 1].to)
                     at = i;
             }
-            if (at < 0 || inside[at].from - inside[at - 1].to < Math.max(2, 0.01 * width))
+            if (at < 0 || inside[at].from - inside[at - 1].to < least)
                 break;
             groups.splice(wide, 1, { from: run.from, to: inside[at - 1].to }, { from: inside[at].from, to: run.to });
         }
-        // A group with almost nothing in it is left-over noise: it joins its neighbour.
-        const mass = (run) => columns.slice(run.from, run.to).reduce((sum, n) => sum + n, 0);
+        // A group with almost nothing in it is noise when it sits against a frame, and joins
+        // it; set apart like a frame, it is one (the last wisp of smoke of an explosion).
+        const mass = (run) => columns.slice(run.from - area.x, run.to - area.x).reduce((sum, n) => sum + n, 0);
         const biggest = Math.max(...groups.map(mass));
-        const solid = groups.filter((run) => mass(run) >= 0.02 * biggest);
+        const spaced = groups.slice(1).map((run, i) => run.from - groups[i].to);
+        const usualGap = [...spaced].sort((a, b) => a - b)[Math.floor(spaced.length / 2)] ?? 0;
+        const solid = [];
+        groups.forEach((run, i) => {
+            const before = i > 0 ? run.from - groups[i - 1].to : Number.POSITIVE_INFINITY;
+            const after = i + 1 < groups.length ? groups[i + 1].from - run.to : Number.POSITIVE_INFINITY;
+            if (mass(run) >= 0.02 * biggest || Math.min(before, after) >= 0.5 * usualGap) {
+                solid.push(run);
+                return;
+            }
+            // Joins the nearer neighbour: the one before when it is already kept, else the next.
+            const last = solid[solid.length - 1];
+            if (last !== undefined && before <= after)
+                solid[solid.length - 1] = { from: last.from, to: run.to };
+            else if (i + 1 < groups.length)
+                groups[i + 1] = { from: run.from, to: groups[i + 1].to };
+            else if (last !== undefined)
+                solid[solid.length - 1] = { from: last.from, to: run.to };
+        });
         const typicalGap = solid.length > 1 ? solid.slice(1).reduce((sum, run, i) => sum + (run.from - solid[i].to), 0) / (solid.length - 1) : Math.round(0.05 * (band.to - band.from));
         solid.forEach((run, i) => {
-            const left = i === 0 ? Math.max(0, run.from - Math.round(typicalGap / 2)) : Math.round((solid[i - 1].to + run.from) / 2);
-            const right = i === solid.length - 1 ? Math.min(width, run.to + Math.round(typicalGap / 2)) : Math.round((run.to + solid[i + 1].from) / 2);
+            const left = i === 0 ? Math.max(area.x, run.from - Math.round(typicalGap / 2)) : Math.round((solid[i - 1].to + run.from) / 2);
+            const right = i === solid.length - 1 ? Math.min(area.x + area.width, run.to + Math.round(typicalGap / 2)) : Math.round((run.to + solid[i + 1].from) / 2);
             boxes.push({ x: left, y: top, width: right - left, height: bottom - top });
         });
     });
@@ -375,11 +589,10 @@ export const findFrames = (image) => {
  * Which gaps (by index) separate frames: the widest ones, down to the
  * biggest drop in width. Gaps inside a frame (between a body and its
  * sparks) are much narrower than the gaps between frames. A gap narrower
- * than 1% of the sheet never splits.
+ * than `least` (1% of the sheet at the top) never splits.
  */
-const widestGaps = (gaps, width) => {
+const widestGaps = (gaps, least) => {
     const order = gaps.map((size, i) => ({ size, i })).sort((a, b) => b.size - a.size);
-    const least = Math.max(2, 0.01 * width);
     const wide = order.filter((gap) => gap.size >= least);
     if (wide.length === 0)
         return [];
@@ -551,9 +764,11 @@ export const playOrder = (count, loop) => {
     return [...forward, ...forward.slice(1, -1).reverse()];
 };
 /**
- * Whether boxes found in a sheet look like frames of one animation rather
- * than parts of one picture: at least two, holding about as much art each
- * (the least at least a fifth of the most) and about as wide.
+ * Whether boxes found in a sheet look like frames of an animation rather
+ * than parts of one picture: at least two, and most of them (three in four)
+ * alike, holding about as much art as the typical frame and about as wide.
+ * The rest may be faint (the sparks and smoke at the end of an explosion):
+ * one such frame does not make a sheet a picture.
  */
 export const looksAnimated = (image, boxes) => {
     if (boxes.length < 2)
@@ -567,7 +782,10 @@ export const looksAnimated = (image, boxes) => {
         });
         return columns.reduce((sum, n) => sum + n, 0);
     });
-    const widths = boxes.map((box) => box.width);
-    return Math.min(...masses) >= 0.2 * Math.max(...masses) && Math.min(...widths) >= 0.4 * Math.max(...widths);
+    const median = (values) => [...values].sort((a, b) => a - b)[Math.floor(values.length / 2)];
+    const typicalMass = median(masses);
+    const typicalWidth = median(boxes.map((box) => box.width));
+    const alike = boxes.filter((box, i) => masses[i] >= 0.2 * typicalMass && masses[i] <= 5 * typicalMass && box.width >= 0.4 * typicalWidth && box.width <= 2.5 * typicalWidth).length;
+    return alike >= 2 && alike >= 0.75 * boxes.length;
 };
 //# sourceMappingURL=sheet.js.map