diff --git a/README.md b/README.md index 1399dfa..e4bfd82 100644 --- a/README.md +++ b/README.md @@ -28,7 +28,7 @@ Combining the "Preview Image" and "Save Image" nodes of comfyUI. ### Video Result -Same as ComfyUI’s Save Video, plus a toggle to preview without saving. +Same as ComfyUI’s Save Video, plus a toggle to preview without saving and a slider to set the preview volume. ![Video Result](./examples/video_result_node.png) diff --git a/examples/video_result_node.png b/examples/video_result_node.png index e39ebea..ba677c6 100644 Binary files a/examples/video_result_node.png and b/examples/video_result_node.png differ diff --git a/pyproject.toml b/pyproject.toml index b31add3..1ad369f 100644 --- a/pyproject.toml +++ b/pyproject.toml @@ -1,7 +1,7 @@ [project] name = "comfyui-astrocorp-nodes" description = "A collection of personal ComfyUI nodes designed to enhance and automate workflows." -version = "1.6.1" +version = "1.6.2" license = {file = "LICENSE"} dependencies = [] diff --git a/web/VideoResultWidget.js b/web/VideoResultWidget.js new file mode 100644 index 0000000..8923251 --- /dev/null +++ b/web/VideoResultWidget.js @@ -0,0 +1,90 @@ +import { app } from "../../scripts/app.js"; + +const _NODE = "VideoResultNode"; +const _WIDGET = "volume"; +const _DEFAULT = 50; + +const nodes = new Set(); + +const getVolume = (node) => { + const percent = node.widgets?.find((x) => x.name === _WIDGET)?.value; + + if (typeof percent !== "number") return null; + + return Math.min(Math.max(percent, 0), 100) / 100; +}; + +// El reproductor cuelga del DOM widget (nodos de canvas) o del elemento del nodo (nodos Vue). +const getRoot = (node) => node.videoContainer ?? document.querySelector(`[data-node-id="${node.id}"]`); + +const findNode = (video) => { + const nodeId = video.closest("[data-node-id]")?.dataset?.nodeId; + + for (const node of nodes) { + if (node.videoContainer?.contains(video)) return node; + + if (nodeId !== undefined && String(node.id) === nodeId) return node; + } + + return null; +}; + +const setVolume = (video, node) => { + const volume = getVolume(node); + + if (volume !== null) video.volume = volume; +}; + +app.registerExtension({ + name: "AstroCorp.VideoResultWidget", + setup() { + // Cada generación monta un