auricui-skill 0.0.0-stage → 0.1.2

package/skill/assets/upstream/packages/openfilm/studio/ui/src/lib/media-queue.ts

@@ -0,0 +1,107 @@
+/**
+ * Studio's background requests for media (a file's length and size, a waveform, and the pictures: the timeline's
+ * thumbnails, a clip's poster, the media pane's covers): a few at a time.
+ *
+ * A browser keeps six connections to Studio. Opening a project used to ask for every file's facts and every picture at
+ * once, and those requests held all six for half a minute: an edit made meanwhile (a sound dropped at the film's end)
+ * waited for a free one, and the person saw it not land. So they go in two lines: a web page's facts and pictures are
+ * found by drawing it in the headless browser, one at a time on the server, so one at a time here (more would only
+ * wait there, each holding a connection); a media file's come from ffmpeg, MEDIA_IN_FLIGHT at a time. The editor's own
+ * requests always find a connection. A media file's facts go before its pictures (a video's length decides which
+ * frames are asked for); a page's pictures go before its facts (they are what the person waits to see, and a page
+ * clip's length is in film.html already).
+ */
+import * as React from 'react';
+
+export const MEDIA_IN_FLIGHT = 2;
+export const PAGES_IN_FLIGHT = 1;
+
+/** `first`: what waits there goes before `then` */
+type Line = { running: number; most: number; first: Array<() => void>; then: Array<() => void>; picturesFirst: boolean };
+const files: Line = { running: 0, most: MEDIA_IN_FLIGHT, first: [], then: [], picturesFirst: false };
+const pages: Line = { running: 0, most: PAGES_IN_FLIGHT, first: [], then: [], picturesFirst: true };
+
+/** A request about a web page (its `path`) is drawn in the headless browser. */
+const lineOf = (url: string): Line => (/\.html?$/i.test(new URL(url, 'http://studio').searchParams.get('path') ?? '') ? pages : files);
+
+/** Wait for a turn, run, give the turn on. `still`: asked when the turn comes; false skips it (not wanted any more). */
+async function inTurn<T>(run: () => Promise<T>, line: Line, picture: boolean, still?: () => boolean): Promise<T | undefined> {
+  if (line.running >= line.most) await new Promise<void>((go) => (picture === line.picturesFirst ? line.first : line.then).push(go));
+  line.running += 1;
+  try {
+    if (still && !still()) return undefined;
+    return await run();
+  } finally {
+    line.running -= 1;
+    (line.first.shift() ?? line.then.shift())?.();
+  }
+}
+
+/** `fetch`, waiting its turn among the media requests. */
+export async function mediaFetch(url: string, init?: RequestInit): Promise<Response> {
+  return (await inTurn(() => fetch(url, init), lineOf(url), false))!;
+}
+
+/** Pictures loaded once: the browser has them, so they are shown again without waiting a turn. */
+const LOADED = new Set<string>();
+const LOADED_MAX = 2000;
+/** Pictures waiting their turn or loading, each asked for once. */
+const WAITING = new Map<string, { done: Promise<boolean | null>; stills: Array<() => boolean> }>();
+
+/**
+ * Load a picture into the browser's cache, waiting its turn; true when it loaded, false when it did not. `still` is
+ * asked when its turn comes: a picture not wanted any more by then (another zoom, a tile scrolled away) is not asked
+ * for at all (null).
+ */
+export async function mediaImage(url: string, still?: () => boolean): Promise<boolean | null> {
+  if (LOADED.has(url)) return true;
+  /* asked again while waiting (the timeline asks again on every change): one request, wanted while anyone wants it */
+  const queued = WAITING.get(url);
+  if (queued) { queued.stills.push(still ?? (() => true)); return queued.done; }
+  const stills = [still ?? (() => true)];
+  const done = inTurn(() => new Promise<boolean>((loaded) => {
+    const img = new Image();
+    img.onload = () => loaded(true);
+    img.onerror = () => loaded(false);
+    img.src = url;
+  }), lineOf(url), true, () => stills.some((s) => s())).then((ok) => {
+    WAITING.delete(url);
+    if (ok) {
+      LOADED.add(url);
+      if (LOADED.size > LOADED_MAX) LOADED.delete(LOADED.values().next().value!);
+    }
+    return ok ?? null;
+  });
+  WAITING.set(url, { done, stills });
+  return done;
+}
+
+/**
+ * A picture's address once it has had its turn (loaded or not: a failure is the `<img>`'s to show and retry), else
+ * the last one that had it, so a picture made again never flickers. `wanted` false: not asked for yet (off screen).
+ */
+export function useMediaImage(url: string | null | undefined, wanted = true): string | null {
+  const [ready, setReady] = React.useState<string | null>(() => (url && LOADED.has(url) ? url : null));
+  React.useEffect(() => {
+    if (!url || !wanted || ready === url) return undefined;
+    let live = true;
+    void mediaImage(url, () => live).then((had) => { if (live && had !== null) setReady(url); });
+    return () => { live = false; };
+  }, [url, wanted, ready]);
+  return url && LOADED.has(url) ? url : ready;
+}
+
+/** The pictures of `urls` (by any key) that have had their turn: what can be drawn now. */
+export function useMediaImages(urls: Readonly<Record<string, string>>): Readonly<Record<string, string>> {
+  const [ready, setReady] = React.useState<ReadonlySet<string>>(() => new Set());
+  const wanted = React.useRef(urls);
+  wanted.current = urls;
+  React.useEffect(() => {
+    for (const url of new Set(Object.values(urls))) {
+      if (ready.has(url)) continue;
+      void mediaImage(url, () => Object.values(wanted.current).includes(url))
+        .then((had) => { if (had !== null) setReady((cur) => (cur.has(url) ? cur : new Set(cur).add(url))); });
+    }
+  }, [urls]); // eslint-disable-line react-hooks/exhaustive-deps
+  return React.useMemo(() => Object.fromEntries(Object.entries(urls).filter(([, url]) => ready.has(url) || LOADED.has(url))), [urls, ready]);
+}

package/skill/assets/upstream/packages/openfilm/studio/ui/src/lib/media-selection.ts

@@ -0,0 +1,64 @@
+/**
+ * What is picked in the media pane, the way a file manager picks (Finder, File Explorer): a click picks one, ⌘ (Ctrl)
+ * adds one or takes it away, ⇧ picks the run from the one clicked last, and a box dragged over empty space picks what
+ * it touches (with ⌘ or ⇧ held, on top of what was picked). Items are named by their project-relative path, a
+ * folder's too, so a key is the path a move or a delete takes.
+ */
+
+export interface PickMods {
+  /** ⌘ or Ctrl held: add or take away. */
+  toggle: boolean;
+  /** ⇧ held: the run from the anchor. */
+  range: boolean;
+}
+
+/** What is picked after a click on `key`; `order` is the items as shown, `anchor` the one clicked last. */
+export function pickItem(
+  picked: readonly string[],
+  key: string,
+  order: readonly string[],
+  anchor: string | null,
+  mods: PickMods,
+): string[] {
+  const from = anchor == null ? -1 : order.indexOf(anchor);
+  const to = order.indexOf(key);
+  if (mods.range && from >= 0 && to >= 0) {
+    const run = order.slice(Math.min(from, to), Math.max(from, to) + 1);
+    return mods.toggle ? [...new Set([...picked, ...run])] : run;
+  }
+  if (mods.toggle) return picked.includes(key) ? picked.filter((k) => k !== key) : [...picked, key];
+  return [key];
+}
+
+export interface Box {
+  left: number;
+  top: number;
+  right: number;
+  bottom: number;
+}
+
+/** The box between two points, whichever way it was dragged. */
+export function boxBetween(a: { x: number; y: number }, b: { x: number; y: number }): Box {
+  return { left: Math.min(a.x, b.x), top: Math.min(a.y, b.y), right: Math.max(a.x, b.x), bottom: Math.max(a.y, b.y) };
+}
+
+/** The items a dragged box touches, in the order given. */
+export function boxHits(items: readonly { key: string; box: Box }[], box: Box): string[] {
+  return items
+    .filter(({ box: b }) => b.left < box.right && b.right > box.left && b.top < box.bottom && b.bottom > box.top)
+    .map(({ key }) => key);
+}
+
+/** What a box picks: what it touches, or that on top of what was picked before it (`add`). */
+export function boxPick(before: readonly string[], hits: readonly string[], add: boolean): string[] {
+  return add ? [...new Set([...before, ...hits])] : [...hits];
+}
+
+/**
+ * Where things can be moved: the top ('') and every folder (paths under assets/), less the folders being moved and
+ * the folders inside them (a folder cannot go into itself).
+ */
+export function moveTargets(folders: readonly string[], moving: readonly string[]): string[] {
+  const inside = (dir: string) => moving.some((m) => dir === m || dir.startsWith(`${m}/`));
+  return ['', ...folders.filter((dir) => !inside(dir)).sort((a, b) => a.localeCompare(b, undefined, { numeric: true }))];
+}

package/skill/assets/upstream/packages/openfilm/studio/ui/src/lib/menu-position.ts

@@ -0,0 +1,77 @@
+/**
+ * Where a pointer-anchored menu should be placed.
+ *
+ * Kept as a pure function because it only goes wrong **near the edges**, which is rarely hit
+ * on a dev machine: the menu grows toward the bottom right by default and only overflows when
+ * you right-click near the bottom-right corner of the screen, and the blocks at the end of the
+ * timeline are exactly what gets right-clicked most often.
+ *
+ * Two steps: check whether there is room to grow in the preferred direction (flip to the
+ * opposite one if not), then clamp into the viewport regardless. Clamping is not just a
+ * fallback: when the menu is taller than the screen (small window + long menu), flipping fails
+ * on both sides and the only correct answer is to pin it to the top edge and let the user
+ * scroll the menu's own layer.
+ */
+
+/** Minimum distance between a menu and the viewport edge. A menu flush with the edge looks half cut off. */
+export const MENU_EDGE = 8;
+
+export interface MenuPlacement {
+  left: number;
+  top: number;
+  /** Grew in the opposite direction; the UI uses this to decide which end the animation starts from. */
+  flippedX: boolean;
+  flippedY: boolean;
+}
+
+export function menuPosition(opts: {
+  /** Pointer position (viewport coordinates); for a menu opened from a button, the corner it hangs from. */
+  at: { x: number; y: number };
+  /** Measured menu size. Pass 0 until measured: that frame is placed at the pointer, then corrected once measured. */
+  size: { width: number; height: number };
+  viewport: { width: number; height: number };
+  /**
+   * 'end': the menu's right edge sits at `at.x` (a "⋯" button at the right of a card), flipping to grow rightward
+   * when that would leave the left edge. Default 'start': its left edge at `at.x`.
+   */
+  align?: 'start' | 'end';
+  /**
+   * Where a menu that does not fit below ends when it flips up. A menu hanging under a button flips to sit above
+   * the button (its top), not above the point under it, or it would cover the button. Default `at.y`.
+   */
+  flipTo?: number;
+}): MenuPlacement {
+  const { at, size, viewport, align = 'start' } = opts;
+  const flipTo = opts.flipTo ?? at.y;
+  const flippedX = size.width > 0 && (align === 'end'
+    ? at.x - size.width < MENU_EDGE
+    : at.x + size.width > viewport.width - MENU_EDGE);
+  const growsLeft = (align === 'end') !== flippedX;
+  /* flip up only when there is more room above: a long menu near the middle stays below and is clamped */
+  const flippedY = size.height > 0 && at.y + size.height > viewport.height - MENU_EDGE && flipTo > viewport.height - at.y;
+  return {
+    left: Math.max(
+      MENU_EDGE,
+      Math.min(growsLeft ? at.x - size.width : at.x, viewport.width - size.width - MENU_EDGE),
+    ),
+    top: Math.max(
+      MENU_EDGE,
+      Math.min(flippedY ? flipTo - size.height : at.y, viewport.height - size.height - MENU_EDGE),
+    ),
+    flippedX,
+    flippedY,
+  };
+}
+
+/**
+ * Which item the arrow keys land on within a menu.
+ *
+ * `from < 0` means the keyboard has not been used yet: Down then lands on the **first** item
+ * and Up on the last. Navigation wraps around at the ends: menus are short and hitting an end
+ * is common, and "the key does nothing" would make the keyboard seem broken.
+ */
+export function menuStep(from: number, delta: number, count: number): number {
+  if (count <= 0) return -1;
+  if (from < 0) return delta > 0 ? 0 : count - 1;
+  return (from + delta + count) % count;
+}

package/skill/assets/upstream/packages/openfilm/studio/ui/src/lib/mg-transform.ts

@@ -0,0 +1,111 @@
+/**
+ * A clip's box on the stage, as five numbers over the picture's own size (see stage-clip for film.html's `box`).
+ *
+ * x / y place the unrotated box's top-left corner from its origin (px). scaleX / scaleY scale the picture's own size.
+ * rotate turns it clockwise, in degrees, about its center. Resizing is stage-gesture's resizedFrame, on the part of the
+ * clip that shows (stage-crop).
+ *
+ * The origin is the box's `x` / `y` (default 0, 0 = the stage's top left).
+ */
+import type { MgBox, MgTransform } from '@/lib/stage-types';
+
+export type { MgBox, MgTransform };
+
+function originOf(box: MgBox): { x: number; y: number } {
+  return { x: box.x ?? 0, y: box.y ?? 0 };
+}
+
+/** Where the unrotated box's top-left corner is on the stage. */
+function topLeft(t: MgTransform, box: MgBox): { x: number; y: number } {
+  const o = originOf(box);
+  return { x: o.x + t.x, y: o.y + t.y };
+}
+
+export function mgSize(t: MgTransform, box: MgBox): { w: number; h: number } {
+  return { w: box.w * t.scaleX, h: box.h * t.scaleY };
+}
+
+export function moveTransform(t: MgTransform, dx: number, dy: number): MgTransform {
+  return { ...t, x: t.x + dx, y: t.y + dy };
+}
+
+/* ── snapping while dragging ── */
+
+/** A snap guide: `at` is its place on the stage; an `x` guide is vertical, a `y` guide horizontal. */
+export interface MgGuide {
+  axis: 'x' | 'y';
+  at: number;
+}
+
+/** The three places on an axis worth lining up: both edges and the middle. */
+function anchorsOf(start: number, size: number): [number, number, number] {
+  return [start, start + size / 2, start + size];
+}
+
+/**
+ * The nearest of the targets' anchors to any of `mine` (places on one axis), within `tolerance`: how far to go, and
+ * the anchor reached. Ties go to the target that comes first.
+ */
+export function nearestAnchor(
+  mine: readonly number[],
+  axis: 'x' | 'y',
+  targets: readonly { x: number; y: number; w: number; h: number }[],
+  tolerance: number,
+): { delta: number; at: number } | null {
+  let best: { delta: number; at: number } | null = null;
+  for (const target of targets) {
+    const theirs = axis === 'x' ? anchorsOf(target.x, target.w) : anchorsOf(target.y, target.h);
+    for (const a of mine) {
+      for (const b of theirs) {
+        const delta = b - a;
+        if (Math.abs(delta) > tolerance) continue;
+        if (!best || Math.abs(delta) < Math.abs(best.delta)) best = { delta, at: b };
+      }
+    }
+  }
+  return best;
+}
+
+/**
+ * Snap a move to the nearest anchor, and say which guides it snapped to.
+ *
+ * Each axis is judged on its own (lined up across, not down, is a normal half state). `tolerance` is in the units of
+ * the boxes; the caller converts its screen px. Returns the correction to add to the move, not a position. Ties go to
+ * the target that comes first: the stage is given first, and its middle is what people most want to hit.
+ */
+export function snapMove(
+  moved: { x: number; y: number; w: number; h: number },
+  targets: readonly { x: number; y: number; w: number; h: number }[],
+  tolerance: number,
+): { dx: number; dy: number; guides: MgGuide[] } {
+  if (!(tolerance > 0)) return { dx: 0, dy: 0, guides: [] };
+  const sx = nearestAnchor(anchorsOf(moved.x, moved.w), 'x', targets, tolerance);
+  const sy = nearestAnchor(anchorsOf(moved.y, moved.h), 'y', targets, tolerance);
+  const guides: MgGuide[] = [];
+  if (sx) guides.push({ axis: 'x', at: sx.at });
+  if (sy) guides.push({ axis: 'y', at: sy.at });
+  return { dx: sx?.delta ?? 0, dy: sy?.delta ?? 0, guides };
+}
+
+export function rotateTransform(
+  t: MgTransform,
+  box: MgBox,
+  from: { x: number; y: number },
+  to: { x: number; y: number },
+  snapDeg = 0,
+): MgTransform {
+  const { w, h } = mgSize(t, box);
+  const at = topLeft(t, box);
+  const cx = at.x + w / 2;
+  const cy = at.y + h / 2;
+  const a0 = Math.atan2(from.y - cy, from.x - cx);
+  const a1 = Math.atan2(to.y - cy, to.x - cx);
+  let rotate = t.rotate + ((a1 - a0) * 180) / Math.PI;
+  if (snapDeg > 0) rotate = Math.round(rotate / snapDeg) * snapDeg;
+  return { ...t, rotate };
+}
+
+export function sameMgTransform(a?: MgTransform | null, b?: MgTransform | null): boolean {
+  if (!a || !b) return a === b;
+  return a.x === b.x && a.y === b.y && a.scaleX === b.scaleX && a.scaleY === b.scaleY && a.rotate === b.rotate;
+}

package/skill/assets/upstream/packages/openfilm/studio/ui/src/lib/mixed.ts

@@ -0,0 +1,3 @@
+/** Several things selected that differ in a value. */
+export const MIXED: unique symbol = Symbol('mixed');
+export type Mixed = typeof MIXED;

package/skill/assets/upstream/packages/openfilm/studio/ui/src/lib/page-changes.ts

@@ -0,0 +1,45 @@
+/**
+ * A page clip's "Changes inside the page" (the inspector's list of its film.html `overrides`), with the ones whose
+ * element the page no longer has. Only the film's page can tell which those are (studio/server/stage.js
+ * `lostOverrides`); the editor keeps its last answer per clip.
+ */
+import type { FilmOverride } from './film';
+
+/** What of film.html this reads: each clip's id and changes. */
+export type FilmParts = { tracks: readonly { clips: readonly { id?: string; overrides?: readonly unknown[] }[] }[] };
+
+/**
+ * The stage's answer (per page clip with changes, `{ clip, lost }`: the selectors of the changes its page no longer
+ * has) as a map from clip id to its lost selectors; anything malformed is left out.
+ */
+export function lostByClip(answer: unknown): Map<string, readonly string[]> {
+  const out = new Map<string, readonly string[]>();
+  if (!Array.isArray(answer)) return out;
+  for (const entry of answer) {
+    if (!entry || typeof entry !== 'object') continue;
+    const { clip, lost } = entry as { clip?: unknown; lost?: unknown };
+    if (typeof clip !== 'string' || !Array.isArray(lost)) continue;
+    out.set(clip, lost.filter((at): at is string => typeof at === 'string'));
+  }
+  return out;
+}
+
+/**
+ * The changes of the clip at `loc` (`film.html#<track>.<clip>`) and the lost ones among them; null when it has none.
+ * A selector reported lost that the clip no longer has a change for (removed since) is dropped.
+ */
+export function pageChangesAt(
+  film: FilmParts | null | undefined,
+  loc: string,
+  lost: ReadonlyMap<string, readonly string[]>,
+): { list: readonly FilmOverride[]; lost: readonly string[]; own: readonly FilmOverride[] } | null {
+  const m = /^film\.html#(\d+)\.(\d+)$/.exec(loc);
+  const clip = m ? film?.tracks[Number(m[1])]?.clips[Number(m[2])] : undefined;
+  const all = (clip?.overrides ?? []) as readonly FilmOverride[];
+  /* the clip's own entry (its fades, without `at`) is not a change inside the page: kept apart, and kept */
+  const list = all.filter((o) => o.at !== undefined);
+  const own = all.filter((o) => o.at === undefined);
+  if (!list.length) return null;
+  const gone = clip?.id ? lost.get(clip.id) ?? [] : [];
+  return { list, lost: gone.filter((at) => list.some((o) => o.at === at)), own };
+}

package/skill/assets/upstream/packages/openfilm/studio/ui/src/lib/picture-files.ts

@@ -0,0 +1,19 @@
+/**
+ * Whether files that changed in the project's folder can change the picture, so the preview draws it again. A page
+ * draws from what it loads (styles, code, pictures, data, fonts), and a clip plays its media file; what no page loads
+ * (notes, scripts, logs, an agent's own working files) cannot change it, and redrawing the whole film for each of them
+ * would make the preview reload over and over while an agent writes them.
+ */
+
+/** files no page loads: words to read, programs to run, settings of tools */
+const NOT_PICTURE = /\.(md|markdown|txt|log|py|sh|bash|zsh|rb|go|rs|java|c|cc|cpp|h|hpp|swift|kt|toml|ya?ml|ini|cfg|env|lock|patch|diff|bak|tmp|swp)$/i;
+
+/**
+ * True when any of `paths` (in the project, with `/`) can change the picture: a page or anything a page may load, or a
+ * media file a clip plays (`used`), made again in place. Other media under assets/ are loaded as they are used. No
+ * paths (the watcher could not tell): true.
+ */
+export function changesPicture(paths: readonly string[] | undefined, used: ReadonlySet<string | undefined>): boolean {
+  if (!paths) return true;
+  return paths.some((path) => (path.startsWith('assets/') ? used.has(path) : !NOT_PICTURE.test(path)));
+}

package/skill/assets/upstream/packages/openfilm/studio/ui/src/lib/preview-prefs.ts

@@ -0,0 +1,46 @@
+/**
+ * The preview's switches, kept on this machine across projects:
+ *   · `fitPages` (on by default): pages draw their canvas and 3D at the size the viewer shows them (their
+ *     devicePixelRatio is the viewer's, see editor/Preview), not at the film's full size scaled down: the same picture
+ *     in the viewer, for a fraction of the drawing. Exports always draw at full size.
+ *   · `renders` (on by default): a stretch that plays late is rendered in the background once the film stops, and
+ *     played from that render from then on (studio/server/preview-cache.mjs, editor/use-preview-renders).
+ *   · `stats` (off by default, Settings → Developer): the viewer's corner says how playing goes.
+ */
+import { useSyncExternalStore } from 'react';
+
+export type PreviewPrefs = { fitPages: boolean; renders: boolean; stats: boolean };
+type Pref = keyof PreviewPrefs;
+
+const DEFAULTS: PreviewPrefs = { fitPages: true, renders: true, stats: false };
+const KEY: Record<Pref, string> = { fitPages: 'openfilm.preview.fitPages', renders: 'openfilm.preview.renders', stats: 'openfilm.preview.stats' };
+
+/** Without localStorage (private window), the choices last this session. */
+const memory: Partial<PreviewPrefs> = {};
+const listeners = new Set<() => void>();
+let current: PreviewPrefs | null = null;
+
+function read(pref: Pref): boolean {
+  try {
+    const raw = localStorage.getItem(KEY[pref]);
+    if (raw != null) return raw !== '0';
+  } catch { /* no localStorage: this session's choice */ }
+  return memory[pref] ?? DEFAULTS[pref];
+}
+
+export function readPreviewPrefs(): PreviewPrefs {
+  current ??= { fitPages: read('fitPages'), renders: read('renders'), stats: read('stats') };
+  return current;
+}
+
+export function writePreviewPref(pref: Pref, on: boolean): void {
+  memory[pref] = on;
+  try { localStorage.setItem(KEY[pref], on ? '1' : '0'); } catch { /* not stored: `memory` has it */ }
+  current = { ...readPreviewPrefs(), [pref]: on };
+  for (const fn of listeners) fn();
+}
+
+/** The switches, kept up to date wherever one is changed. */
+export function usePreviewPrefs(): PreviewPrefs {
+  return useSyncExternalStore((fn) => { listeners.add(fn); return () => { listeners.delete(fn); }; }, readPreviewPrefs, () => DEFAULTS);
+}

package/skill/assets/upstream/packages/openfilm/studio/ui/src/lib/preview-renders.ts

@@ -0,0 +1,71 @@
+/**
+ * Which stretches of a film play late in the preview, from how playing went (editor/Preview's `onPlayed`, about once a
+ * second while playing): the refreshes the screen had per half second of film, and how many of them got no new frame.
+ * A stretch where many did is rendered in the background (studio/server/preview-cache.mjs) and played from that
+ * render from then on. Kept free of React so it is tested as it is.
+ */
+
+/** Per half second of film (its start, s): refreshes seen there while playing, and how many got no new frame. */
+export type Heat = Map<number, { frames: number; late: number }>;
+
+/** Refreshes a half second keeps counting before older ones count less: what it does now outweighs what it did. */
+const HEAT_KEEP = 120;
+/** Late on this share of refreshes or more, a half second plays late. */
+export const LATE_SHARE = 0.12;
+/** Refreshes a half second needs before it is judged (a stretch only glimpsed says little). */
+const HEAT_SEEN = 20;
+/** A stretch is rendered with this much more on each side (s), and at least this long. */
+const PAD = 0.25;
+const SHORTEST = 1;
+
+/** Add how playing went (`spans`: [half second's start, refreshes, late]). */
+export function addHeat(heat: Heat, spans: readonly (readonly [number, number, number])[]): void {
+  for (const [t, frames, late] of spans) {
+    if (!(frames > 0) || !Number.isFinite(t)) continue;
+    const had = heat.get(t) ?? { frames: 0, late: 0 };
+    let next = { frames: had.frames + frames, late: had.late + Math.min(late, frames) };
+    if (next.frames > HEAT_KEEP) {
+      const k = HEAT_KEEP / next.frames;
+      next = { frames: next.frames * k, late: next.late * k };
+    }
+    heat.set(t, next);
+  }
+}
+
+/**
+ * The stretches that play late, film seconds [a, b): half seconds late on LATE_SHARE of their refreshes or more,
+ * joined across a gap of half a second, PAD more on each side, SHORTEST at least, in order.
+ */
+export function lateStretches(heat: Heat): [number, number][] {
+  const late = [...heat].filter(([, h]) => h.frames >= HEAT_SEEN && h.late / h.frames >= LATE_SHARE).map(([t]) => t).sort((a, b) => a - b);
+  const out: [number, number][] = [];
+  for (const t of late) {
+    const last = out.at(-1);
+    if (last && t <= last[1] + 0.5 + 1e-9) last[1] = t + 0.5;
+    else out.push([t, t + 0.5]);
+  }
+  return out.map(([a, b]) => {
+    let from = Math.max(0, a - PAD);
+    let to = b + PAD;
+    if (to - from < SHORTEST) { const mid = (from + to) / 2; from = Math.max(0, mid - SHORTEST / 2); to = from + SHORTEST; }
+    return [round(from), round(to)] as [number, number];
+  });
+}
+
+const round = (s: number) => Math.round(s * 1000) / 1000;
+
+/** Two lists of stretches the same. */
+export function sameStretches(a: readonly (readonly [number, number])[], b: readonly (readonly [number, number])[]): boolean {
+  return a.length === b.length && a.every(([x, y], i) => x === b[i][0] && y === b[i][1]);
+}
+
+/** Stretches as one list: in order, those that overlap or touch joined. */
+export function joinStretches(list: readonly (readonly [number, number])[]): [number, number][] {
+  const out: [number, number][] = [];
+  for (const [a, b] of [...list].sort((x, y) => x[0] - y[0])) {
+    const last = out.at(-1);
+    if (last && a <= last[1] + 1e-9) last[1] = Math.max(last[1], b);
+    else out.push([a, b]);
+  }
+  return out;
+}

package/skill/assets/upstream/packages/openfilm/studio/ui/src/lib/project-delete.ts

@@ -0,0 +1,20 @@
+/**
+ * Which of the projects whose delete seemed to fail are still there, by the list read again (`list`): one gone already
+ * was deleted, and one whose answer was lost (`lost`: the request was cut off, as when the page showing it leaves
+ * it) may still be on its way to the Trash, so the list is read again a few times (`wait` between) before it counts.
+ * A list that cannot be read changes nothing.
+ */
+export async function stillThere<F extends { id: string; lost: boolean }>(
+  failed: readonly F[],
+  list: () => Promise<readonly string[]>,
+  { tries = 6, wait = () => new Promise<void>((done) => setTimeout(done, 500)) }: { tries?: number; wait?: () => Promise<void> } = {},
+): Promise<F[]> {
+  let left = [...failed];
+  for (let i = 0; left.length && i < tries; i++) {
+    if (i) await wait();
+    const ids = await list().then((l) => new Set(l), () => null);
+    if (ids) left = left.filter((f) => ids.has(f.id));
+    if (!left.some((f) => f.lost)) break;
+  }
+  return left;
+}