feat: support grok reference video mode

This commit is contained in:
mac
2026-07-15 19:09:45 +08:00
parent 49892454f6
commit 5bf5457948
4 changed files with 43 additions and 4 deletions
+30 -1
View File
@@ -1775,6 +1775,7 @@ function cvNodeBody(kind) {
<select class="cv-field cv-field-vmode" title="模式">
<option value="text">文生视频</option>
<option value="first">首帧图生视频</option>
<option value="reference">多参考图</option>
</select>
<textarea class="cv-field cv-field-prompt" rows="3" placeholder="Grok 视频提示词(可连接上游文本节点)"></textarea>
<div class="cv-vmat cv-vmat-first hidden">
@@ -1785,6 +1786,14 @@ function cvNodeBody(kind) {
<button type="button" class="cv-vmat-clear hidden" data-slot="first" title="移除">✕</button>
<input class="cv-field cv-vmat-url" data-slot="first" placeholder="或手填公网图片URL;留空用上游图" />
</div>
<div class="cv-vmat cv-vmat-refs hidden">
<label class="cv-refimg-pick" title="批量上传参考图">📎 参考图
<input type="file" class="cv-vmat-file" data-slot="refs" accept="image/*" multiple hidden />
</label>
<button type="button" class="cv-vmat-clear hidden" data-slot="refs" title="清空">✕</button>
<div class="cv-vmat-refs-thumbs"></div>
<textarea class="cv-field cv-vmat-urls" data-slot="refs" rows="2" placeholder="可选:每行一个公网图片URL;会和上传图一起作为参考"></textarea>
</div>
<select class="cv-field cv-field-group" title="中转分组"></select>
<div class="cv-model-row">
<input class="cv-field cv-field-model" value="grok-imagine-video" placeholder="grok-imagine-video / grok-imagine-video-1.5" />
@@ -1804,7 +1813,7 @@ function cvNodeBody(kind) {
<option value="15">15s</option>
</select>
</div>
<div class="cv-node-hint cv-grok-hint">1.5 的 1080p/15s 需要首帧图;完成前可能在 94% 停留较久</div>
<div class="cv-node-hint cv-grok-hint">多参考图使用 grok-imagine-video + 720p;1.5 的 1080p/15s 需要首帧图</div>
<details class="cv-adv"><summary>⚙️ 高级</summary>
<input class="cv-field cv-field-endpoint" placeholder="/v1/videos/generations" />
</details>
@@ -2087,6 +2096,8 @@ function cvClearVideoMat(nodeEl, slot) {
if (slot === "refs") {
const box = nodeEl.querySelector(".cv-vmat-refs-thumbs");
if (box) box.innerHTML = "";
const urls = nodeEl.querySelector('.cv-vmat-urls[data-slot="refs"]');
if (urls) urls.value = "";
} else {
const thumb = nodeEl.querySelector(`.cv-vmat-thumb[data-slot="${slot}"]`);
if (thumb) {
@@ -2305,6 +2316,12 @@ function cvSyncVideoMode(nodeEl) {
const box = nodeEl.querySelector(".cv-vmat-" + slot);
if (box) box.classList.toggle("hidden", !show[slot]);
});
if (mode === "reference" && nodeEl.querySelector(".cv-node-grokVideo")) {
const model = nodeEl.querySelector(".cv-field-model");
const resolution = nodeEl.querySelector(".cv-field-vsize");
if (model) model.value = "grok-imagine-video";
if (resolution) resolution.value = "720p";
}
}
// 读取单个节点的「输出产物」:文本节点实时读 textarea,其它读运行后缓存的 dataUrl
@@ -2606,6 +2623,10 @@ async function cvRunNode(nodeId, btn) {
const el = nodeEl.querySelector(`.cv-vmat-url[data-slot="${slot}"]`);
return el ? el.value.trim() : "";
};
const matUrls = (slot) => {
const el = nodeEl.querySelector(`.cv-vmat-urls[data-slot="${slot}"]`);
return el ? el.value.split(/\s+/).map((s) => s.trim()).filter(Boolean) : [];
};
runKind = "grokVideo";
params = {
mode,
@@ -2627,6 +2648,14 @@ async function cvRunNode(nodeId, btn) {
if (!first) return cvSetErr(nodeEl, "首帧图生视频需要首帧:连上游『文生图』/ 上传 / 手填公网URL");
params.image = first;
}
if (mode === "reference") {
const refs = [up.image].concat(mats.refs || [], matUrls("refs")).filter(Boolean);
if (!refs.length) return cvSetErr(nodeEl, "多参考图模式请连接上游图片、上传参考图,或填写公网图片URL");
params.referenceImages = refs;
params.model = "grok-imagine-video";
params.resolution = "720p";
params.aspectRatio = "16:9";
}
if (duration) params.seconds = duration;
if (endpointPath) params.endpointPath = endpointPath;
} else if (kind === "tts") {
+1 -1
View File
@@ -584,7 +584,7 @@ select.cv-field { resize: none; cursor: pointer; }
width: 24px; height: 24px; font-size: 12px; line-height: 1; padding: 0; transition: .15s; }
.cv-refimg-clear:hover, .cv-vmat-clear:hover { border-color: var(--danger); color: var(--danger); }
/* URL 输入 / 提示 / 多图缩略图 各自独占一行 */
.cv-vmat-url { flex: 1 1 100%; }
.cv-vmat-url, .cv-vmat-urls { flex: 1 1 100%; }
.cv-refimg-row .cv-node-hint, .cv-vmat .cv-node-hint { flex: 1 1 100%; }
.cv-vmat-refs-thumbs { display: flex; flex-wrap: wrap; gap: 2px; flex: 1 1 100%; }
/* 复选标签(生成音频 / 水印 / 固定镜头)对齐 */