feat(canvas): 新增视频节点字幕体系与多轨时间线编辑(关联 #187) (#191)

* fix(ci): 后端测试 - 修复 responses 流式测试数据与 Grok 生图测试 SSRF 放行

* feat(canvas): 新增视频节点字幕体系与多轨时间线编辑(关联 #187)

---------

Co-authored-by: zhaoyue <zhaoyue@rongshantech.com>
This commit is contained in:
爱笑的毛毛虫
2026-08-08 18:28:28 +08:00
committed by GitHub
parent c75953f3c9
commit 43e65570a5
33 changed files with 3724 additions and 30 deletions

View File

@@ -10,7 +10,7 @@ export type MergeVideoProgress = { phase: "loading" | "reading" | "encoding"; pr
let ffmpegPromise: Promise<FFmpeg> | null = null;
// ffmpeg 只在用户明确合并视频时加载,避免把 wasm 和 worker 放进画布首屏包体。
async function loadFFmpeg(onProgress?: (progress: MergeVideoProgress) => void) {
export async function loadFFmpeg(onProgress?: (progress: MergeVideoProgress) => void) {
if (!ffmpegPromise) {
ffmpegPromise = (async () => {
const ffmpeg = new FFmpeg();

View File

@@ -1,4 +1,4 @@
import { Download, FolderPlus, GalleryHorizontalEnd, Image as ImageIcon, Info, LoaderCircle, Lock, Maximize2, MessageSquare, Minus, Music2, Plus, RefreshCw, Settings2, Trash2, Unlock, Upload, UserRound, Video } from "lucide-react";
import { Captions, Clapperboard, Download, FolderPlus, GalleryHorizontalEnd, Image as ImageIcon, Info, LoaderCircle, Lock, Maximize2, MessageSquare, Minus, Music2, Plus, RefreshCw, Settings2, Trash2, Unlock, Upload, UserRound, Video } from "lucide-react";
import { CONTENT_MODERATION_ERROR_CODE, isContentModerationError } from "@/lib/generation-error";
import { registerToolbarTools, type ToolContext, type ToolDefinition } from "@/lib/canvas/tool-registry";
@@ -193,6 +193,30 @@ export const nodeHoverToolbarTools: ToolDefinition[] = [
applicable: isVideo,
run: (ctx) => ctx.handlers.onNodeUpload(ctx.node!),
},
{
id: "subtitles",
toolbar: "node-hover",
category: "node-state",
label: "编辑字幕",
displayLabel: "字幕",
icon: <Captions className="size-3.5" />,
defaultVisible: true,
defaultOrder: 145,
applicable: (ctx) => hasVideo(ctx),
run: (ctx) => ctx.handlers.onNodeSubtitles(ctx.node!),
},
{
id: "timeline",
toolbar: "node-hover",
category: "node-state",
label: "时间线编辑",
displayLabel: "时间线",
icon: <Clapperboard className="size-3.5" />,
defaultVisible: true,
defaultOrder: 148,
applicable: (ctx) => hasVideo(ctx) || hasAudio(ctx),
run: (ctx) => ctx.handlers.onNodeTimeline(ctx.node!),
},
{
id: "uploadAudio",
toolbar: "node-hover",

View File

@@ -81,6 +81,8 @@ export type ToolbarHandlers = {
onNodeAngle: (node: CanvasNodeData) => void;
onNodeViewImage: (node: CanvasNodeData) => void;
onNodeExtractVideoLastFrame: (node: CanvasNodeData) => void;
onNodeSubtitles: (node: CanvasNodeData) => void;
onNodeTimeline: (node: CanvasNodeData) => void;
onNodeReversePrompt: (node: CanvasNodeData) => void;
onNodeToggleFreeResize: (node: CanvasNodeData) => void;
onNodeToggleLocked: (node: CanvasNodeData) => void;