feuerwerk/src/editor/soundfx/SampleFace.ts

import { SetNodeParamCommand } from '../../core/commands/graphCommands';
import { InstrumentSample, type SamplePlay } from '../../core/instrument/nodes';
import { findSound } from '../../core/model/sound';
import { assetRefLabel, soundChoices } from '../../core/properties/assetRef';
import { playedSoundOf } from '../../core/properties/playedSound';
import { resolveAssetProps } from '../../core/properties/resolve';
import { volumeOf } from '../../core/properties/sounds';
import { Menu, type Widget } from '../../ui';
import { soundLibrary } from '../../viewport/SoundLibrary';
import type { NodeFace } from '../graph/nodeFace';
import type { EditorState } from '../state';
import { DeviceFace } from './deviceFace';
import { type SampleHost, SamplePanel, type SamplePicture } from './SamplePanel';
import { idleSampleKeys, sampleValues } from './sampleView';

const SOUND = 'sound';
const ROOT = 'root';
const PLAY = 'play';
const FOLLOW = 'followNote';

/**
 * A Sample node drawn as its device (#400): the waveform of the sound or clip it plays, drawn from
 * its peaks once they are loaded, and every setting worked right in the graph. Nothing on it moves
 * by itself, and it listens to nothing.
 */
export class SampleFace extends DeviceFace implements NodeFace, SampleHost {
  readonly widget: SamplePanel;

  constructor(state: EditorState, assetId: string, nodeId: string) {
    super(state, assetId, nodeId, InstrumentSample.type, 'sample-face');
    this.widget = new SamplePanel(this);
  }

  sync(): void {
    const node = this.node();
    if (!node) return;
    const values = sampleValues(node.params);
    const ref = values.sound ? findSound(this.state.project, values.sound) : null;
    const file = ref ? playedSoundOf(ref) : '';
    let picture: SamplePicture | null = null;
    let missing = '';
    // What the screen says without a sound to draw: what the instrument says of it, then the loading.
    if (!values.sound) missing = 'NO SOUND PICKED';
    else if (!ref) missing = 'THAT SOUND IS GONE';
    else if (!file) missing = 'THE SOUND HAS NO FILE';
    else {
      const peaks = soundLibrary.peaks(file);
      const seconds = soundLibrary.duration(file);
      if (peaks && seconds !== null)
        picture = { peaks, seconds, volume: volumeOf(resolveAssetProps(this.state.project, ref.asset)) };
      else if (soundLibrary.failedToLoad(file)) missing = 'CANNOT LOAD';
      else {
        missing = 'LOADING';
        this.load(file);
      }
    }
    this.widget.sync({
      values,
      idle: idleSampleKeys(node.params),
      picture,
      sound: values.sound ? assetRefLabel(this.state.project, values.sound) : '',
      missing,
    });
  }

  previewRoot(note: number): void {
    const node = this.node();
    if (node) this.drag.previewAll(node, { [ROOT]: String(note) });
  }

  commitRoot(note: number): void {
    const node = this.node();
    if (node) this.drag.commit(this.assetId, node, ROOT, String(note));
  }

  pickPlay(play: SamplePlay): void {
    const node = this.node();
    if (node && sampleValues(node.params).play !== play) this.set(PLAY, play);
  }

  switchFollow(on: boolean): void {
    this.set(FOLLOW, on);
  }

  /** The sounds of the project and their clips; picking one makes it what the Sample plays. */
  pickSound(button: Widget): void {
    const node = this.node();
    if (!node) return;
    const current = sampleValues(node.params).sound;
    const items = soundChoices(this.state.project).map((sound) => ({
      label: sound.label,
      current: sound.id === current,
      onSelect: () => {
        if (sound.id !== current)
          this.state.execute(new SetNodeParamCommand(this.assetId, this.nodeId, SOUND, sound.id));
      },
    }));
    if (items.length > 0) new Menu(items, { searchable: true }).openBelow(button);
  }
}