26 lines
778 B
TypeScript
26 lines
778 B
TypeScript
import React, { useContext } from 'react';
|
|
import { observer } from 'mobx-react-lite';
|
|
import DraggableCircle from 'Components/Session_/Player/Controls/components/DraggableCircle';
|
|
import { PlayerContext } from 'Components/Session/playerContext';
|
|
import TimeTracker from 'Components/Session/Player/ClipPlayer/TimeTracker';
|
|
|
|
function TimelineTracker({
|
|
scale,
|
|
onDragEnd,
|
|
}: {
|
|
scale: number;
|
|
onDragEnd: () => void;
|
|
}) {
|
|
const { store } = useContext(PlayerContext);
|
|
const { time, range } = store.get();
|
|
const adjustedTime = time - range[0];
|
|
|
|
return (
|
|
<>
|
|
<DraggableCircle left={adjustedTime * scale} onDrop={onDragEnd} />
|
|
<TimeTracker scale={scale} left={(adjustedTime - range[0]) * scale} />
|
|
</>
|
|
);
|
|
}
|
|
|
|
export default observer(TimelineTracker);
|