Player timeline implemented in Funnel

player-timeline.ts

const model = (animation: Animation) => fgo(function* model({ playPauseS, replayS }: ToModel) {
  const playingB: Behavior<boolean> = yield sample(scan((_, b) => !b, false, playPauseS));
  const playingSpeedB = map((b) => b ? 1 : 0, playingB);
  const initialTimeB = yield sample(integrate(playingSpeedB));
  const positionB = yield sample(switcher(initialTimeB, snapshot(integrate(playingSpeedB), replayS)));
  return [{ positionB, playingB }, {}];
});

const view = ({ playingB, positionB }: ToView): any => [
  button({output: {click: "playPauseS"}}, icon(playingB.map((b) => b ? "pause" : "play_arrow"))),
  button({output: {click: "replayS"}}, icon("replay")),
  slider({ position: positionB })
];