[dyad] Add reset button for video trimming - wrote 1 file(s)
This commit is contained in:
@@ -7,7 +7,7 @@ import { Input } from "@/components/ui/input";
|
|||||||
import { Label } from "@/components/ui/label";
|
import { Label } from "@/components/ui/label";
|
||||||
import { Slider } from "@/components/ui/slider";
|
import { Slider } from "@/components/ui/slider";
|
||||||
import { Progress } from "@/components/ui/progress";
|
import { Progress } from "@/components/ui/progress";
|
||||||
import { UploadCloud, Scissors, Download, Loader2 } from "lucide-react";
|
import { UploadCloud, Scissors, Download, Loader2, RotateCcw } from "lucide-react";
|
||||||
import { getFFmpeg } from "@/lib/ffmpeg";
|
import { getFFmpeg } from "@/lib/ffmpeg";
|
||||||
import { fetchFile } from "@ffmpeg/util";
|
import { fetchFile } from "@ffmpeg/util";
|
||||||
|
|
||||||
@@ -101,6 +101,12 @@ export function VideoEditor() {
|
|||||||
setIsTrimming(false);
|
setIsTrimming(false);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const handleUntrim = () => {
|
||||||
|
setTrimmedVideoUrl(null);
|
||||||
|
setTrimValues([0, duration]);
|
||||||
|
setProgress(0);
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Card className="w-full shadow-lg rounded-2xl border">
|
<Card className="w-full shadow-lg rounded-2xl border">
|
||||||
<CardHeader className="text-center">
|
<CardHeader className="text-center">
|
||||||
@@ -175,6 +181,12 @@ export function VideoEditor() {
|
|||||||
</CardContent>
|
</CardContent>
|
||||||
{videoSrc && (
|
{videoSrc && (
|
||||||
<CardFooter className="flex justify-end space-x-4 p-6">
|
<CardFooter className="flex justify-end space-x-4 p-6">
|
||||||
|
{trimmedVideoUrl && (
|
||||||
|
<Button variant="ghost" size="lg" onClick={handleUntrim} disabled={isTrimming}>
|
||||||
|
<RotateCcw className="mr-2 h-5 w-5" />
|
||||||
|
Reset
|
||||||
|
</Button>
|
||||||
|
)}
|
||||||
<Button variant="outline" size="lg" onClick={handleCutVideo} disabled={isTrimming}>
|
<Button variant="outline" size="lg" onClick={handleCutVideo} disabled={isTrimming}>
|
||||||
{isTrimming ? (
|
{isTrimming ? (
|
||||||
<Loader2 className="mr-2 h-5 w-5 animate-spin" />
|
<Loader2 className="mr-2 h-5 w-5 animate-spin" />
|
||||||
|
|||||||
Reference in New Issue
Block a user