feat: drop

Author: linxiaodong

main/background.ts

@@ -34,6 +34,10 @@ if (isProd) {
     },
   });
 
+  mainWindow.webContents.on('will-navigate', (e) => {
+    e.preventDefault();
+  });
+
   if (isProd) {
     await mainWindow.loadURL(`app://./${userLanguage}/home/`);
   } else {

main/helpers/ipcHandler.ts

@@ -1,4 +1,5 @@
 import { ipcMain, BrowserWindow, dialog, shell } from 'electron';
+import * as fs from 'fs';
 
 export function setupIpcHandlers(mainWindow: BrowserWindow) {
   ipcMain.on("message", async (event, arg) => {
@@ -36,4 +37,20 @@ export function setupIpcHandlers(mainWindow: BrowserWindow) {
   ipcMain.on("openUrl", (event, url) => {
     shell.openExternal(url);
   });
+
+  ipcMain.handle('getDroppedFiles', async (event, files) => {
+    // 验证文件是否存在和可访问
+    const validPaths = await Promise.all(
+      files.map(async (filePath) => {
+        try {
+          await fs.promises.access(filePath);
+          return filePath;
+        } catch {
+          return null;
+        }
+      })
+    );
+
+    return validPaths.filter(Boolean);
+  });
 }

main/helpers/whisper.ts

@@ -62,6 +62,7 @@ export const install = (event, source) => {
       url: repoUrl,
       singleBranch: true,
       depth: 1,
+      ref: 'v1.7.2',
       onProgress: (res) => {
         if (res.total) {
           event.sender.send("installWhisperProgress", res.phase, res.loaded / res.total);

package.json

@@ -2,7 +2,7 @@
   "private": true,
   "name": "video-subtitle-master",
   "description": "视频转字幕，字幕翻译软件",
-  "version": "1.3.0",
+  "version": "1.4.0",
   "author": "buxuku <[email protected]>",
   "main": "app/background.js",
   "scripts": {

renderer/lib/utils.ts

@@ -147,3 +147,24 @@ export const getModelDownloadUrl = (modelName: string, source: 'hf-mirror' | 'hu
   const domain = source === 'hf-mirror' ? 'hf-mirror.com' : 'huggingface.co';
   return `https://${domain}/ggerganov/whisper.cpp/resolve/main/ggml-${modelName.toLowerCase()}.bin?download=true`;
 };
+
+// 添加支持的文件扩展名常量
+export const SUPPORTED_FILE_EXTENSIONS = [
+  // 视频格式
+  'mp4', 'avi', 'mov', 'mkv', 'flv', 'wmv', 'webm',
+  // 音频格式
+  'mp3', 'wav', 'ogg', 'aac', 'wma', 'flac', 'm4a',
+  'aiff', 'ape', 'opus', 'ac3', 'amr', 'au', 'mid',
+  // 其他常见格式
+  '3gp', 'asf', 'rm', 'rmvb', 'vob', 'ts', 'mts', 'm2ts',
+  // 字幕格式
+  'srt', 'vtt', 'ass', 'ssa'
+] as const;
+
+// 添加文件过滤方法
+export const filterSupportedFiles = (files: File[]) => {
+  return Array.from(files).filter(file => {
+    const ext = file.name.toLowerCase().split('.').pop();
+    return SUPPORTED_FILE_EXTENSIONS.includes(ext as typeof SUPPORTED_FILE_EXTENSIONS[number]);
+  });
+};

renderer/pages/[locale]/home.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from 'react';
-
+import { cn } from "lib/utils";
 
 import { ScrollArea } from '@/components/ui/scroll-area';
 
@@ -13,6 +13,7 @@ import TaskList from '@/components/TaskList';
 import TaskConfigForm from '@/components/TaskConfigForm';
 import TaskListControl from '@/components/TaskListControl';
 import { getStaticPaths, makeStaticProperties } from '../../lib/get-static'
+import { filterSupportedFiles } from 'lib/utils';
 
 
 
@@ -37,6 +38,36 @@ export default function Component() {
     window.ipc.send('setTasks', files);
   }, [files]);
 
+  const [isDragging, setIsDragging] = useState(false);
+  
+  const handleDragOver = (e: React.DragEvent) => {
+    e.preventDefault();
+    setIsDragging(true);
+  };
+
+  const handleDragLeave = (e: React.DragEvent) => {
+    e.preventDefault();
+    setIsDragging(false);
+  };
+
+  const handleDrop = (e: React.DragEvent) => {
+    e.preventDefault();
+    setIsDragging(false);
+    
+    const droppedFiles = filterSupportedFiles(Array.from(e.dataTransfer.files));
+    
+    if (droppedFiles.length > 0) {
+      const fileList = droppedFiles.map(file => file.path);
+      window?.ipc?.invoke('getDroppedFiles', fileList).then((filePaths) => {
+        const newFiles = filePaths.map(filePath => ({
+          uuid: Math.random().toString(36).substring(2),
+          filePath
+        }));
+        setFiles(prevFiles => [...prevFiles, ...newFiles]);
+      });
+    }
+  };
+
   return (
     <div className="grid flex-1 gap-4 overflow-auto p-4 md:grid-cols-2 lg:grid-cols-3">
       <div className="relative hidden flex-col items-start gap-8 md:flex">
@@ -48,7 +79,15 @@ export default function Component() {
           isInstalledModel={isInstalledModel}
         />
       </div>
-      <div className="relative flex h-full min-h-[50vh] border flex-col rounded-xl p-4 lg:col-span-2">
+      <div 
+        className={cn(
+          "relative flex h-full min-h-[50vh] border flex-col rounded-xl p-4 lg:col-span-2",
+          isDragging && "border-2 border-dashed border-primary bg-muted/50"
+        )}
+        onDrop={handleDrop}
+        onDragOver={handleDragOver}
+        onDragLeave={handleDragLeave}
+      >
         <TaskListControl setFiles={setFiles} />
         <ScrollArea className="max-h-[780px]">
           <TaskList files={files} formData={formData} />