yoginth.com
Hey is a decentralized and permissionless social media app built with Lens Protocol 馃尶
1const generateVideoThumbnails = async (
2 file: File,
3 count: number
4): Promise<string[]> => {
5 if (!file.size) {
6 return [];
7 }
8
9 const url = URL.createObjectURL(file);
10 const video = document.createElement("video");
11 const canvas = document.createElement("canvas");
12 video.muted = true;
13 video.src = url;
14
15 try {
16 await new Promise<void>((resolve, reject) => {
17 video.onloadeddata = () => {
18 canvas.width = video.videoWidth;
19 canvas.height = video.videoHeight;
20 resolve();
21 };
22 video.onerror = () => reject();
23 });
24
25 let queue: Promise<void> = Promise.resolve();
26 const seekAndCapture = (time: number): Promise<string> => {
27 const result = queue.then(
28 () =>
29 new Promise<string>((resolve) => {
30 const handleSeeked = () => {
31 const ctx = canvas.getContext("2d");
32 ctx?.drawImage(video, 0, 0, video.videoWidth, video.videoHeight);
33 resolve(canvas.toDataURL("image/png"));
34 };
35 video.addEventListener("seeked", handleSeeked, { once: true });
36 video.currentTime = time;
37 })
38 );
39 queue = result.then(() => undefined);
40 return result;
41 };
42
43 const step = video.duration / count;
44 return await Promise.all(
45 Array.from({ length: count }).map((_, i) => seekAndCapture(step * i))
46 );
47 } catch {
48 return [];
49 } finally {
50 video.remove();
51 canvas.remove();
52 URL.revokeObjectURL(url);
53 }
54};
55
56export default generateVideoThumbnails;