add konva js to project + create some components with ai

2025-11-16 16:33:54 +03:30
parent c1c6b0ebf7
commit 1a0c869101
38 changed files with 1855 additions and 42 deletions
@@ -0,0 +1,38 @@
+import { useEditorStore, type ToolType } from "../../../store/editorStore";
+import Input from "@/components/Input";
+
+const VideoInput = () => {
+    return (
+        <div className="space-y-4">
+            <div>
+                <Input
+                    label="آدرس ویدیو"
+                    placeholder="https://example.com/video.mp4"
+                    onEnter={() => {
+                        const input = document.querySelector('input[placeholder="https://example.com/video.mp4"]') as HTMLInputElement;
+                        if (input?.value) {
+                            const newVideo = {
+                                id: `video-${Date.now()}`,
+                                type: "video" as ToolType,
+                                x: 100,
+                                y: 100,
+                                width: 400,
+                                height: 300,
+                                videoUrl: input.value,
+                            };
+                            const { addObject } = useEditorStore.getState();
+                            addObject(newVideo);
+                            input.value = "";
+                        }
+                    }}
+                />
+            </div>
+            <div className="text-sm text-gray-600">
+                <p>آدرس ویدیو را وارد کنید</p>
+            </div>
+        </div>
+    );
+};
+
+export default VideoInput;
+