Files
learn-languages/src/app/srt-player/UploadArea.tsx

47 lines
1.2 KiB
TypeScript

import LightButton from "@/components/buttons/LightButton";
import { useRef } from "react";
export default function UploadArea({
setVideoUrl,
setSrtUrl,
}: {
setVideoUrl: (url: string | null) => void;
setSrtUrl: (url: string | null) => void;
}) {
const inputRef = useRef<HTMLInputElement>(null);
const uploadVideo = () => {
const input = inputRef.current;
if (input) {
input.setAttribute("accept", "video/*");
input.click();
input.onchange = () => {
const file = input.files?.[0];
if (file) {
setVideoUrl(URL.createObjectURL(file));
}
};
}
};
const uploadSRT = () => {
const input = inputRef.current;
if (input) {
input.setAttribute("accept", ".srt");
input.click();
input.onchange = () => {
const file = input.files?.[0];
if (file) {
setSrtUrl(URL.createObjectURL(file));
}
};
}
};
return (
<div className="w-full flex flex-col gap-2 m-2">
<LightButton onClick={uploadVideo}></LightButton>
<LightButton onClick={uploadSRT}></LightButton>
<input type="file" className="hidden" ref={inputRef} />
</div>
);
}