Files
feuerwerk/src/editor/debugHook.ts
T
adminandClaude Opus 5.5 7a952cb20d Start paused, step one frame and break from a behavior
Finding out what a game does in its first frames, or right at one
spot of a flow, needed a quick hand on the pause button. Now the
editor can start a play paused, step it frame by frame and let a
behavior pause it.

- The pause button can be pressed in edit mode. Then Play starts
  paused, and every further Play does too until it is released. A
  reload of the page clears it.
- A third button, Next frame, right of Pause, or Ctrl+Shift+Enter.
  It works only while paused and runs exactly one frame of 1/60 s,
  whatever the frame took on screen. Hierarchy and inspector follow.
- The Break node pauses the play like the button, at the end of the
  frame it ran in. The status line names the behavior's object. It
  is the editor's pause, not Pause game.
- Break reaches the editor through a service only the editor hands
  to a play. In play.html and Run in editor the node does nothing.
- Restart game keeps the running play's state. Start paused only
  counts when Play is pressed.
- Wiki Concepts, Behaviors, Keyboard: the buttons, the node and the
  shortcut.

Not tried: sound, free-running videos and a running recording while
stepping. Sound and videos stay held during the pause.

Tests:
- tsc, eslint and Prettier are clean.
- Unit pause, node-catalog, tooltip: 465 green. svg-icons now
  expects the step icon too.
- e2e 18 and 46 on stein2 (melektaus-atx was off): ALL PASSED,
  63 checks, 7 new in 18j. A step moves the box by 1.667 px at
  100 px/s, Break stops the play with "Break in Breaker".
- Counter-checks: a session that ignores the step turns 18j red. A
  Break that does not report its object turns the unit test red.
- Gate on stein2: tsc, eslint and Prettier clean, 305 files,
  4722 tests, 6 more than before. One was red at first, the icon
  list of the top bar did not know step yet. Fixed in
  svg-icons.test.ts and run again.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-13 06:02:35 +02:00

169 lines
8.8 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
import type { Application } from 'pixi.js';
import { physicsStatus } from '../runtime/physics/engine';
import type { SchedulerOptions } from '../core/music/Scheduler';
import type { Sequence } from '../core/music/sequence';
import type { FxEnvelope, FxStage } from '../core/soundfx/nodes';
import { Music } from '../viewport/music';
import { bothAtCenter, envelopeDriver, followCurve, releaseEnvelope, stageNodes } from '../viewport/fxNodes';
import { soundLibrary } from '../viewport/SoundLibrary';
import { saturationAutoGain } from '../core/soundfx/saturation';
import { compressorMakeup } from '../core/soundfx/dynamics';
import { bakeHooks } from './debug/bakeHooks';
import { curveHooks } from './debug/curveHooks';
import { soundHooks } from './debug/soundHooks';
import { videoHooks } from './debug/videoHooks';
import { patternHooks } from './debug/patternHooks';
import { routingHooks } from './debug/routingHooks';
import { songHooks } from './debug/songHooks';
import { documentHooks } from './debug/documentHooks';
import { graphHooks } from './debug/graphHooks';
import { centreOf, type HookContext } from './debug/hookHelpers';
import { pixelArtHooks } from './debug/pixelArtHooks';
import { renderHooks } from './debug/renderHooks';
import { sceneHooks } from './debug/sceneHooks';
import { uiHooks } from './debug/uiHooks';
import { vectorArtHooks } from './debug/vectorArtHooks';
import type { DocumentId, Editor, TabId } from './Editor';
import { NodeBoard } from './plugins/NodeBoard';
import type { EditorState } from './state';
import { rectOf } from './textProbe';
/**
* Installs `window.__gm`, which the check scripts in tools/ use to find widgets by their
* visible text and to read editor state. The hooks of each area live in `debug/`.
*/
export function installDebugHook(app: Application, state: EditorState, editor: Editor): void {
const context: HookContext = { app, state, editor };
const music = new Music(() => state.project);
(window as unknown as { __gm: unknown }).__gm = {
state,
/** The Pixi application, for probes that need the renderer or the stage. */
app,
...uiHooks(context),
...sceneHooks(context),
...graphHooks(context),
...documentHooks(context),
...pixelArtHooks(context),
...vectorArtHooks(context),
...curveHooks(context),
...patternHooks(context),
...songHooks(context),
...routingHooks(context),
...soundHooks(context),
...videoHooks(context),
...bakeHooks(context),
...renderHooks(context),
/**
* Voices started, stopped and in flight. CI runs the browser with `--mute-audio`, so nothing
* is ever heard there: these counters are the only way a check can see that a graph played
* anything at all, the way `renderStats` is for a repaint that did not happen.
*/
sound: {
stats: () => soundLibrary.stats(),
duration: (file: string) => soundLibrary.duration(file),
/** Where the knobs of each voice of that file are now, oldest first, a pitch as its speed (#315). */
levels: (file: string) => soundLibrary.levels(file),
fxWorkletUrl: () => soundLibrary.fxWorkletUrl(),
/** Seconds on the audio clock: the time a voice really runs on. */
clock: () => soundLibrary.clock(),
/** Decodes ahead of a check, so a play can be asserted without racing the network. */
load: (file: string) => soundLibrary.load(file).then((buffer) => buffer?.duration ?? null),
stopAll: () => soundLibrary.stopAll(),
/** What Stop sound asks for: every voice of that file, its echoes cut or left to ring (#324). */
stop: (file: string, letRing: boolean) => soundLibrary.stop(file, letRing),
/** The patterns and songs a game plays, with the notes and clips last planned of each. */
playbacks: () => soundLibrary.playbacks(),
/** Every bus there is, the master and those of the project among them (#325), and how loud one is. */
buses: () => soundLibrary.busLevels(),
mixVolume: (name: string) => soundLibrary.mixVolume(name),
/** Whether the audio clock is held by the pause of the toolbar or runs. */
clockState: () => soundLibrary.clockState(),
/** The second of the audio clock a voice started at, and the rate that clock runs at (#346). */
startedAt: (voice: number) => soundLibrary.startedAt(voice),
playing: (voice: number) => soundLibrary.playing(voice),
sampleRate: () => soundLibrary.liveContext().sampleRate,
/**
* The nodes a stage of a voice becomes, in any context – an offline one renders what it does.
* `at` is when its voice starts, which a Flanger's sweep counts from (#341), `impulse` the
* sound a Reverb that takes one has (#328).
*/
stageNodes: (context: BaseAudioContext, stage: FxStage, at?: number, impulse?: AudioBuffer) =>
stageNodes(context, stage, undefined, at, impulse),
/** The gain in dB a Saturation's auto-gain gives at a drive (#323). */
saturationAutoGain,
/** The gain after a Compressor as a factor, from its makeup and auto-gain (#326, #378). */
compressorMakeup,
/** What drives the two shares of a Mix "Both at center", in any context (unstarted). */
bothAtCenter: (context: BaseAudioContext, mix: number, a: GainNode, b: GainNode) =>
bothAtCenter(context, mix, a, b),
/** The curve of an Envelope from `at` (unstarted), its release, and how it moves a number (#335). */
envelopeDriver: (context: BaseAudioContext, envelope: FxEnvelope, at: number) =>
envelopeDriver(context, envelope, at),
releaseEnvelope: (level: AudioParam, envelope: FxEnvelope, startedAt: number, at: number) =>
releaseEnvelope(level, envelope, startedAt, at),
stageWith: (context: BaseAudioContext, stage: FxStage, driver: ConstantSourceNode) =>
stageNodes(context, stage, (mod, param, ratio, map) =>
followCurve(context, driver, mod, param, ratio, map),
),
},
/**
* The scheduler (#332), which nothing in the editor plays yet: a check hands it a sequence of
* notes and reads back what was planned for which second of the audio clock.
*/
music: {
play: (sequence: Sequence, options?: SchedulerOptions & { from?: number }) =>
music.play(sequence, options),
edit: (sequence: Sequence) => music.edit(sequence),
stop: () => music.stop(),
position: () => music.current?.position() ?? null,
playing: () => music.current?.playing ?? false,
planned: () => [...music.planned],
latency: () => soundLibrary.latency(),
},
world: () => editor.worldSnapshot(),
playInfo: () => editor.playInfo(),
/** Which scene Play would start, and under which of the two rules (#183: set in the settings). */
playFrom: () => editor.playFromInfo(),
/** The run buttons of the top bar: the picture each wears, and whether it takes a click. */
runButtons: () => editor.runButtons(),
/** Where to click one of the icon buttons: menu, undo, redo, play, pause, step. */
toolbarAt: (name: keyof Editor['toolbarControls']) => centreOf(editor.toolbarControls[name]),
/** Behaviors running without Play (`Run in editor`), and how long they have been at it. */
editorRun: () => editor.editorRunInfo(),
physics: () => physicsStatus(),
tab: () => editor.tab,
showTab: (tab: TabId) => editor.showTab(tab),
/** The open documents in tab order and the one showing (#171); a document is `asset:<id>` or `list`. */
documents: () => editor.openDocuments(),
openDocument: (doc: DocumentId) => editor.openDocument(doc),
closeDocument: (doc: DocumentId) => editor.closeDocument(doc),
/** The tabs in windows of their own (#371): kind, document, box, and where to press. */
floatWindows: () => editor.floatWindows(),
floatDocument: (doc: DocumentId) => editor.floatDocument(doc),
/** The kind Delete, Copy and Paste go to: the window pressed last, else the tab showing. */
keyTarget: () => editor.keyTarget(),
plugins: {
/** Every file in `data/plugins/` and what became of it. */
records: () => [...(editor.plugins?.records ?? [])],
/** The plugins in the user management tab (#179): one row per file, with its switch. */
pane: () => ({ ...editor.pluginsPane.debugInfo(), visible: editor.tab === 'management' }),
/** Where to click the switch of one plugin; null when it has no row. */
switchAt: (file: string) => {
const box = editor.pluginsPane.switchOf(file);
return box ? centreOf(box) : null;
},
/** A plugin tab's node board as drawn, with its canvas and Fit button; null without one. */
board: (tabId: string) => {
const pane = editor.pluginPane(tabId);
if (!(pane instanceof NodeBoard)) return null;
return {
...pane.debugInfo(),
visible: pane.visible,
rect: rectOf(pane),
fit: centreOf(pane.fitButton),
};
},
},
};
}