import { useEffect, useState } from 'react'; import { loopSlide } from '../timeline'; import { TimedVideoPlayer } from './present'; import AppBar from '@material-ui/core/AppBar'; import Button from '@material-ui/core/Button'; import ButtonGroup from '@material-ui/core/ButtonGroup'; import Fab from '@material-ui/core/Fab'; import Toolbar from '@material-ui/core/Toolbar'; import Icon from '@mdi/react'; import { PressureIcon, SlideKeyframe } from '../components/icons'; import Loop from '../components/loop'; import FullscreenRoundedIcon from '@material-ui/icons/FullscreenRounded'; import NavigateBeforeRoundedIcon from '@material-ui/icons/NavigateBeforeRounded'; import NavigateNextRoundedIcon from '@material-ui/icons/NavigateNextRounded'; import PauseRoundedIcon from '@material-ui/icons/PauseRounded'; import SkipPreviousRoundedIcon from '@material-ui/icons/SkipPreviousRounded'; import { mdiCursorDefault } from '@mdi/js'; function TimelineEditor(props: { player: TimedVideoPlayer; }) { var frames = [...new Array(props.player.timeline?.framecount || 0)].map((el, i) =>
{props.player?.frameToTimestampString(i + 1)}
{(() => { var slide = props.player?.timeline?.slides.find(slide => slide.frame == i + 1); if (slide) { if (slide.type == 'loop') { return ; } else { return ; } } })()}
); return
{frames}
; } export default function Index() { var [dummy, setDummy] = useState(false); var rerender = () => setDummy(!dummy); var [player, setPlayer] = useState(new TimedVideoPlayer()); useEffect(() => { var videoEL = document.getElementById('player') as HTMLVideoElement; player.registerPlayer(videoEL); }, []); return <>

pressure

{ var file = event.target.files[0]; if (!file) return; var reader = new FileReader(); reader.addEventListener('load', ev => { player.loadVideo(ev.target.result as string); }); reader.readAsDataURL(file); }} /> { var file = event.target.files[0]; if (!file) return; var reader = new FileReader(); reader.addEventListener('load', ev => { player.loadSlides(ev.target.result as string); rerender(); }); reader.readAsText(file); }} />
} /> } /> } /> } />
} />
@{player.framerate}fps

00:00:00:00f

; }