+
Choose Background
+
+ {WALLPAPER_PATHS.map((path, idx) => (
+
onWallpaperChange(path)}
+ onKeyDown={e => { if (e.key === 'Enter' || e.key === ' ') onWallpaperChange(path); }}
+ role="button"
+ />
+ ))}
+
+
Settings
diff --git a/src/components/video-editor/VideoEditor.tsx b/src/components/video-editor/VideoEditor.tsx
index e61ec8b..ac57c61 100644
--- a/src/components/video-editor/VideoEditor.tsx
+++ b/src/components/video-editor/VideoEditor.tsx
@@ -1,11 +1,15 @@
import { useEffect, useRef, useState } from "react";
+
import VideoPlayback, { VideoPlaybackRef } from "./VideoPlayback";
import PlaybackControls from "./PlaybackControls";
import TimelineEditor from "./TimelineEditor";
import SettingsPanel from "./SettingsPanel";
+const WALLPAPER_COUNT = 12;
+const WALLPAPER_PATHS = Array.from({ length: WALLPAPER_COUNT }, (_, i) => `/wallpapers/wallpaper${i + 1}.jpg`);
+
export default function VideoEditor() {
const [videoPath, setVideoPath] = useState
(null);
const [loading, setLoading] = useState(true);
@@ -13,6 +17,7 @@ export default function VideoEditor() {
const [isPlaying, setIsPlaying] = useState(false);
const [currentTime, setCurrentTime] = useState(0);
const [duration, setDuration] = useState(0);
+ const [wallpaper, setWallpaper] = useState(WALLPAPER_PATHS[0]);
const videoPlaybackRef = useRef(null);
const isSeeking = useRef(false);
@@ -85,6 +90,7 @@ export default function VideoEditor() {
onTimeUpdate={setCurrentTime}
onPlayStateChange={setIsPlaying}
onError={setError}
+ wallpaper={wallpaper}
/>