init

Bin

2025-12-16 9e0b2ba2c317b1a86212f24cbae3195ad1f3dbfa

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
import type { TimelineRegion, TimelineView } from "../../Types";
 
import { Frames } from "./Frames";
import { Minimap } from "./Minimap";
import { Controls } from "./Controls";
import { findClosestKeypoint } from "./Utils";
 
const getKeyframePosition = (position: number, regions: TimelineRegion[], direction: -1 | 1) => {
  const selectedRegion = regions.find((r) => r.selected);
  let frames: number[];
 
  if (selectedRegion) {
    frames = selectedRegion.sequence.map(({ frame }) => frame);
  } else {
    frames = Array.from(
      regions.reduce<Set<number>>((res, { sequence }) => {
        const sFrames = sequence.map(({ frame }) => frame);
 
        return new Set<number>([...res, ...sFrames]);
      }, new Set<number>()),
    ).sort((a, b) => a - b);
  }
 
  return findClosestKeypoint(frames, position, direction);
};
 
const View: TimelineView<typeof Controls> = {
  View: Frames,
  Minimap,
  Controls,
  settings: {
    stepSize(_, position, regions, direction) {
      return getKeyframePosition(position, regions, direction);
    },
    fastTravelSize() {
      return 10;
    },
    playpauseHotkey: "media:playpause",
    stepBackHotkey: "media:step-backward",
    stepForwardHotkey: "media:step-forward",
    stepAltBack: "video:keyframe-backward",
    stepAltForward: "video:keyframe-forward",
    leftOffset: 150,
    skipToBeginning: "video:rewind",
    skipToEnd: "video:fastforward",
    hopBackward: "video:hop-backward",
    hopForward: "video:hop-forward",
  },
};
 
export default View;