The Stage: Sharing Mid-Talk

// Things shared mid-talk ride the next words; a pause is resumed only by whoever took it.
const MAX_SHARES = 10;

/** Dad's words, then each pasted text as a quote block after them. */
export function withPastedText(words: string, texts: string[]): string {
  const quotes = texts
    .map((text) => text.trim())
    .filter(Boolean)
    .map((text) => text.split('\n').map((line) => (line.trim() ? `> ${line}` : '>')).join('\n'));
  return [words.trim(), ...quotes].filter(Boolean).join('\n\n');
}

export class Stage {
  private files: File[] = [];
  private texts: string[] = [];
  /** Up to ten wait at once. Past that a new share is refused, and the screen
   *  says so; nothing already on the stage is ever pushed off. */
  addFiles(files: File[]): File[] {
    const room = Math.max(0, MAX_SHARES - this.files.length);
    this.files = [...this.files, ...files.slice(0, room)];
    return files.slice(room);
  }
  addTexts(texts: string[]): string[] {
    const kept = texts.map((text) => text.trim()).filter(Boolean);
    const room = Math.max(0, MAX_SHARES - this.texts.length);
    this.texts = [...this.texts, ...kept.slice(0, room)];
    return kept.slice(room);
  }
  get waiting() {
    return [...this.files.map((file) => file.name), ...this.texts.map((text) => `text: ${text.split('\n')[0]}`)];
  }

  /** The send takes everything waiting; a send that fails gives it all back. */
  async sendWith(words: string, send: (message: string, files: File[]) => Promise<void>) {
    const files = this.files;
    const texts = this.texts;
    this.files = [];
    this.texts = [];
    try {
      await send(withPastedText(words, texts), files);
    } catch {
      // Back in front of anything shared meanwhile, and never trimmed: the cap
      // refuses new shares, it never takes back what he already handed over.
      this.files = [...files, ...this.files];
      this.texts = [...texts, ...this.texts];
      throw new Error('Could not send: what he shared is back on the stage');
    }
  }
}

type Phase = 'listening' | 'speaking' | 'paused' | 'stopped';

/** The talk as a holder sees it: its phase, Pause and Resume, and a word
 *  whenever the phase moves (her reply starting or ending, a stop). Her reply
 *  moves only a live talk: a pause taken mid-reply stops the reading, so the
 *  reply's end leaves the talk paused instead of listening again. */
export class Talk {
  phase: Phase = 'listening';
  onChange: (from: Phase) => void = () => {};
  private go(next: Phase) { const from = this.phase; this.phase = next; this.onChange(from); }
  pause() { this.go('paused'); }
  resume() { this.go('listening'); }
  replyStarts() { if (this.phase === 'listening') this.go('speaking'); }
  replyEnds() { if (this.phase === 'speaking') this.go('listening'); }
  stopsOnItsOwn() { this.go('stopped'); }
}

/** Anything that pauses the talk for a while (the lightbox, a dialog) holds it
 *  by name. A hold pauses a live listen; while she is speaking it only shows,
 *  and if her reply ends while a hold stands, the pause is taken then. The talk
 *  resumes when the last holder lets go, and only if it is still in the pause
 *  they took: not after it stopped on its own, not after Dad paused it himself. */
export class PauseHolds {
  private holders = new Set<string>();
  private tookIt = false;
  private dadOwns = false;
  constructor(private talk: Talk) {
    talk.onChange = (from) => {
      if (talk.phase !== 'paused') this.tookIt = false;
      if (this.holders.size > 0 && !this.dadOwns && from === 'speaking') this.take();
    };
  }
  private take() {
    if (this.talk.phase !== 'listening') return;   // she is speaking: only show
    this.tookIt = true;
    this.talk.pause();
  }
  hold(who: string) {
    if (this.holders.size === 0) {
      this.dadOwns = false;
      this.take();
    }
    this.holders.add(who);
  }
  release(who: string) {
    if (!this.holders.delete(who) || this.holders.size > 0) return;
    const ours = this.tookIt;
    this.tookIt = false;
    this.dadOwns = false;
    if (ours && this.talk.phase === 'paused') this.talk.resume();
  }
  /** Dad pressed Pause or Resume himself: from now on the pause is his. */
  dadDecides() {
    this.tookIt = false;
    if (this.holders.size > 0) this.dadOwns = true;
  }
}

async function main() {
  const talk = new Talk();
  const stage = new Stage();
  stage.addFiles([new File(['<png bytes>'], 'screenshot.png')]);
  stage.addTexts(['https://example.com/news/42\nA headline Dad copied']);
  console.log('waiting:', stage.waiting);
  await stage.sendWith('what do you make of this?', async () => {
    stage.addFiles([new File(['<png bytes>'], 'shared-meanwhile.png')]);   // arrives mid-send
    throw new Error('offline');
  }).catch((error: Error) => console.log(error.message));
  console.log('after the failed send:', stage.waiting);
  await stage.sendWith('what do you make of this?', async (message, files) => {
    console.log(`sent, with ${files.map((file) => file.name).join(', ')}:\n${message}`);
  });
  console.log('after the send:', stage.waiting);
  const many = Array.from({ length: 11 }, (_, i) => new File(['x'], `photo-${i + 1}.jpg`));
  const refused = stage.addFiles(many);
  console.log('eleven at once: kept', stage.waiting.length, '| refused', refused.map((file) => file.name));

  const holds = new PauseHolds(talk);
  holds.hold('lightbox'); console.log('lightbox open while listening ->', talk.phase);
  holds.release('lightbox'); console.log('lightbox closed ->', talk.phase);

  talk.replyStarts(); holds.hold('lightbox');
  console.log('lightbox open while she speaks ->', talk.phase);
  talk.replyEnds(); console.log('her reply ends while it is open ->', talk.phase);
  holds.release('lightbox'); console.log('lightbox closed ->', talk.phase);

  talk.pause(); holds.hold('lightbox'); holds.release('lightbox');
  console.log('Dad paused first, then a screenshot opened and closed ->', talk.phase);
  talk.resume();

  holds.hold('lightbox'); talk.stopsOnItsOwn(); holds.release('lightbox');
  console.log('the talk stopped on its own while he looked ->', talk.phase);
  talk.resume();

  holds.hold('lightbox'); holds.hold('dialog'); holds.release('lightbox');
  console.log('lightbox closed, dialog still open ->', talk.phase);
  holds.release('dialog'); console.log('dialog closed too ->', talk.phase);

  holds.hold('lightbox'); holds.dadDecides(); holds.release('lightbox');
  console.log('Dad pressed Pause himself while he looked ->', talk.phase);
  talk.resume();

  talk.replyStarts(); holds.hold('lightbox');
  holds.dadDecides(); talk.pause();   // his Pause button, mid-reply
  talk.replyEnds(); holds.release('lightbox');
  console.log('Dad paused while she spoke, then her reply ended ->', talk.phase);
}

void main();