From e5d8068a4e3301ea51ce427d6fd66f5f734bd370 Mon Sep 17 00:00:00 2001
From: lonkaars <loek@pipeframe.xyz>
Date: Sun, 18 Jul 2021 20:17:39 +0200
Subject: semi-working timecode input

---
 components/timeinput.tsx | 24 ++++++++++++++++++++++++
 1 file changed, 24 insertions(+)
 create mode 100644 components/timeinput.tsx

(limited to 'components')

diff --git a/components/timeinput.tsx b/components/timeinput.tsx
new file mode 100644
index 0000000..7232494
--- /dev/null
+++ b/components/timeinput.tsx
@@ -0,0 +1,24 @@
+import TextField from '@material-ui/core/TextField';
+import { TimedVideoPlayer } from '../pages/present';
+
+export default function TimecodeInput(props: {
+	value: number;
+	update: (newValue: number) => void;
+	player: TimedVideoPlayer;
+	label: string;
+}) {
+	return <TextField
+		variant='filled'
+		label={props.label}
+		value={props.player.frameToTimestampString(props.value, false)}
+		spellCheck={false}
+		onChange={e => e.preventDefault()}
+		onKeyDown={e => {
+			var mod = 1;
+			if (e.shiftKey) mod = 10;
+
+			if (e.key == 'ArrowUp') props.update(props.value + mod);
+			if (e.key == 'ArrowDown') props.update(props.value - mod);
+		}}
+	/>;
+}
-- 
cgit v1.2.3