From 03ced76b8c6aad04f8a06b3af9fae4b9d4012d33 Mon Sep 17 00:00:00 2001 From: rgthree Date: Sun, 4 Aug 2024 15:00:05 -0400 Subject: [PATCH] Add a menu item for Queuing a single Group. --- src_web/comfyui/menu_queue_node.ts | 86 ++++++++++++++++---------- src_web/comfyui/rgthree.ts | 1 + web/comfyui/menu_queue_node.js | 72 +++++++++++++-------- web/comfyui/rgthree.js | 1 + web/comfyui/services/config_service.js | 2 +- 5 files changed, 104 insertions(+), 58 deletions(-) diff --git a/src_web/comfyui/menu_queue_node.ts b/src_web/comfyui/menu_queue_node.ts index 87f94d5..a87c9e5 100644 --- a/src_web/comfyui/menu_queue_node.ts +++ b/src_web/comfyui/menu_queue_node.ts @@ -8,41 +8,63 @@ import type { ComfyNodeConstructor, ComfyObjectInfo } from "typings/comfy.js"; import { rgthree } from "./rgthree.js"; import { SERVICE as CONFIG_SERVICE } from "./services/config_service.js"; -function getOutputNodesFromSelected(canvas: TLGraphCanvas) { +function getOutputNodes(nodes: LGraphNode[]) { return ( - (canvas.selected_nodes && - Object.values(canvas.selected_nodes).filter((n) => { - return ( - n.mode != LiteGraph.NEVER && - ((n.constructor as any).nodeData as ComfyObjectInfo)?.output_node - ); - })) || - [] + nodes?.filter((n) => { + return ( + n.mode != LiteGraph.NEVER && + ((n.constructor as any).nodeData as ComfyObjectInfo)?.output_node + ); + }) || [] ); } -function showQueueNodesMenuIfOutputNodesAreSelected( - existingOptions: ContextMenuItem[], - node?: LGraphNode, -) { - if (CONFIG_SERVICE.getConfigValue("features.menu_queue_selected_nodes") != false) { - const canvas = app.canvas as TLGraphCanvas; - const outputNodes = getOutputNodesFromSelected(canvas); - const menuItem = { - content: `Queue Selected Output Nodes (rgthree)  `, - className: "rgthree-contextmenu-item", - callback: () => { - rgthree.queueOutputNodes(outputNodes.map((n) => n.id)); - }, - disabled: !outputNodes.length, - }; - - let idx = existingOptions.findIndex((o) => o?.content === "Outputs") + 1; - idx = idx || existingOptions.findIndex((o) => o?.content === "Align") + 1; - idx = idx || 3; - existingOptions.splice(idx, 0, menuItem); +function showQueueNodesMenuIfOutputNodesAreSelected(existingOptions: ContextMenuItem[]) { + if (CONFIG_SERVICE.getConfigValue("features.menu_queue_selected_nodes") === false) { + return; } - return existingOptions; + const outputNodes = getOutputNodes(Object.values(app.canvas.selected_nodes)); + const menuItem = { + content: `Queue Selected Output Nodes (rgthree)  `, + className: "rgthree-contextmenu-item", + callback: () => { + rgthree.queueOutputNodes(outputNodes.map((n) => n.id)); + }, + disabled: !outputNodes.length, + }; + + let idx = existingOptions.findIndex((o) => o?.content === "Outputs") + 1; + idx = idx || existingOptions.findIndex((o) => o?.content === "Align") + 1; + idx = idx || 3; + existingOptions.splice(idx, 0, menuItem); +} + +function showQueueGroupNodesMenuIfGroupIsSelected(existingOptions: ContextMenuItem[]) { + if (CONFIG_SERVICE.getConfigValue("features.menu_queue_selected_nodes") === false) { + return; + } + const group = + rgthree.lastAdjustedMouseEvent && + app.graph.getGroupOnPos( + rgthree.lastAdjustedMouseEvent.canvasX, + rgthree.lastAdjustedMouseEvent.canvasY, + ); + + const outputNodes = group && getOutputNodes(group._nodes); + const menuItem = { + content: `Queue Group Output Nodes (rgthree)  `, + className: "rgthree-contextmenu-item", + callback: () => { + outputNodes && rgthree.queueOutputNodes(outputNodes.map((n) => n.id)); + }, + disabled: !outputNodes?.length, + }; + + let idx = existingOptions.findIndex((o) => o?.content.startsWith("Queue Selected ")) + 1; + idx = idx || existingOptions.findIndex((o) => o?.content === "Outputs") + 1; + idx = idx || existingOptions.findIndex((o) => o?.content === "Align") + 1; + idx = idx || 3; + existingOptions.splice(idx, 0, menuItem); } /** @@ -58,7 +80,8 @@ app.registerExtension({ options: ContextMenuItem[], ) { getExtraMenuOptions ? getExtraMenuOptions.apply(this, arguments) : undefined; - showQueueNodesMenuIfOutputNodesAreSelected(options, this); + showQueueNodesMenuIfOutputNodesAreSelected(options); + showQueueGroupNodesMenuIfGroupIsSelected(options); }; }, @@ -67,6 +90,7 @@ app.registerExtension({ LGraphCanvas.prototype.getCanvasMenuOptions = function (...args: any[]) { const options = getCanvasMenuOptions.apply(this, [...args] as any); showQueueNodesMenuIfOutputNodesAreSelected(options); + showQueueGroupNodesMenuIfGroupIsSelected(options); return options; }; }, diff --git a/src_web/comfyui/rgthree.ts b/src_web/comfyui/rgthree.ts index 1f57bc0..21c081c 100644 --- a/src_web/comfyui/rgthree.ts +++ b/src_web/comfyui/rgthree.ts @@ -483,6 +483,7 @@ class Rgthree extends EventTarget { options.push(null); // Divider let idx = null; + idx = idx || existingOptions.findIndex((o) => o?.content?.startsWith?.("Queue Group")) + 1; idx = idx || existingOptions.findIndex((o) => o?.content?.startsWith?.("Queue Selected")) + 1; idx = idx || existingOptions.findIndex((o) => o?.content?.startsWith?.("Convert to Group")); diff --git a/web/comfyui/menu_queue_node.js b/web/comfyui/menu_queue_node.js index 2eabf4a..e857f70 100644 --- a/web/comfyui/menu_queue_node.js +++ b/web/comfyui/menu_queue_node.js @@ -1,33 +1,51 @@ import { app } from "../../scripts/app.js"; import { rgthree } from "./rgthree.js"; import { SERVICE as CONFIG_SERVICE } from "./services/config_service.js"; -function getOutputNodesFromSelected(canvas) { - return ((canvas.selected_nodes && - Object.values(canvas.selected_nodes).filter((n) => { - var _a; - return (n.mode != LiteGraph.NEVER && - ((_a = n.constructor.nodeData) === null || _a === void 0 ? void 0 : _a.output_node)); - })) || - []); +function getOutputNodes(nodes) { + return ((nodes === null || nodes === void 0 ? void 0 : nodes.filter((n) => { + var _a; + return (n.mode != LiteGraph.NEVER && + ((_a = n.constructor.nodeData) === null || _a === void 0 ? void 0 : _a.output_node)); + })) || []); } -function showQueueNodesMenuIfOutputNodesAreSelected(existingOptions, node) { - if (CONFIG_SERVICE.getConfigValue("features.menu_queue_selected_nodes") != false) { - const canvas = app.canvas; - const outputNodes = getOutputNodesFromSelected(canvas); - const menuItem = { - content: `Queue Selected Output Nodes (rgthree)  `, - className: "rgthree-contextmenu-item", - callback: () => { - rgthree.queueOutputNodes(outputNodes.map((n) => n.id)); - }, - disabled: !outputNodes.length, - }; - let idx = existingOptions.findIndex((o) => (o === null || o === void 0 ? void 0 : o.content) === "Outputs") + 1; - idx = idx || existingOptions.findIndex((o) => (o === null || o === void 0 ? void 0 : o.content) === "Align") + 1; - idx = idx || 3; - existingOptions.splice(idx, 0, menuItem); +function showQueueNodesMenuIfOutputNodesAreSelected(existingOptions) { + if (CONFIG_SERVICE.getConfigValue("features.menu_queue_selected_nodes") === false) { + return; } - return existingOptions; + const outputNodes = getOutputNodes(Object.values(app.canvas.selected_nodes)); + const menuItem = { + content: `Queue Selected Output Nodes (rgthree)  `, + className: "rgthree-contextmenu-item", + callback: () => { + rgthree.queueOutputNodes(outputNodes.map((n) => n.id)); + }, + disabled: !outputNodes.length, + }; + let idx = existingOptions.findIndex((o) => (o === null || o === void 0 ? void 0 : o.content) === "Outputs") + 1; + idx = idx || existingOptions.findIndex((o) => (o === null || o === void 0 ? void 0 : o.content) === "Align") + 1; + idx = idx || 3; + existingOptions.splice(idx, 0, menuItem); +} +function showQueueGroupNodesMenuIfGroupIsSelected(existingOptions) { + if (CONFIG_SERVICE.getConfigValue("features.menu_queue_selected_nodes") === false) { + return; + } + const group = rgthree.lastAdjustedMouseEvent && + app.graph.getGroupOnPos(rgthree.lastAdjustedMouseEvent.canvasX, rgthree.lastAdjustedMouseEvent.canvasY); + const outputNodes = group && getOutputNodes(group._nodes); + const menuItem = { + content: `Queue Group Output Nodes (rgthree)  `, + className: "rgthree-contextmenu-item", + callback: () => { + outputNodes && rgthree.queueOutputNodes(outputNodes.map((n) => n.id)); + }, + disabled: !(outputNodes === null || outputNodes === void 0 ? void 0 : outputNodes.length), + }; + let idx = existingOptions.findIndex((o) => o === null || o === void 0 ? void 0 : o.content.startsWith("Queue Selected ")) + 1; + idx = idx || existingOptions.findIndex((o) => (o === null || o === void 0 ? void 0 : o.content) === "Outputs") + 1; + idx = idx || existingOptions.findIndex((o) => (o === null || o === void 0 ? void 0 : o.content) === "Align") + 1; + idx = idx || 3; + existingOptions.splice(idx, 0, menuItem); } app.registerExtension({ name: "rgthree.QueueNode", @@ -35,7 +53,8 @@ app.registerExtension({ const getExtraMenuOptions = nodeType.prototype.getExtraMenuOptions; nodeType.prototype.getExtraMenuOptions = function (canvas, options) { getExtraMenuOptions ? getExtraMenuOptions.apply(this, arguments) : undefined; - showQueueNodesMenuIfOutputNodesAreSelected(options, this); + showQueueNodesMenuIfOutputNodesAreSelected(options); + showQueueGroupNodesMenuIfGroupIsSelected(options); }; }, async setup() { @@ -43,6 +62,7 @@ app.registerExtension({ LGraphCanvas.prototype.getCanvasMenuOptions = function (...args) { const options = getCanvasMenuOptions.apply(this, [...args]); showQueueNodesMenuIfOutputNodesAreSelected(options); + showQueueGroupNodesMenuIfGroupIsSelected(options); return options; }; }, diff --git a/web/comfyui/rgthree.js b/web/comfyui/rgthree.js index 5420688..2ce9a39 100644 --- a/web/comfyui/rgthree.js +++ b/web/comfyui/rgthree.js @@ -300,6 +300,7 @@ class Rgthree extends EventTarget { options.push(null); options.push(null); let idx = null; + idx = idx || existingOptions.findIndex((o) => { var _a, _b; return (_b = (_a = o === null || o === void 0 ? void 0 : o.content) === null || _a === void 0 ? void 0 : _a.startsWith) === null || _b === void 0 ? void 0 : _b.call(_a, "Queue Group"); }) + 1; idx = idx || existingOptions.findIndex((o) => { var _a, _b; return (_b = (_a = o === null || o === void 0 ? void 0 : o.content) === null || _a === void 0 ? void 0 : _a.startsWith) === null || _b === void 0 ? void 0 : _b.call(_a, "Queue Selected"); }) + 1; idx = idx || existingOptions.findIndex((o) => { var _a, _b; return (_b = (_a = o === null || o === void 0 ? void 0 : o.content) === null || _a === void 0 ? void 0 : _a.startsWith) === null || _b === void 0 ? void 0 : _b.call(_a, "Convert to Group"); }); diff --git a/web/comfyui/services/config_service.js b/web/comfyui/services/config_service.js index 14f2ee0..34f1087 100644 --- a/web/comfyui/services/config_service.js +++ b/web/comfyui/services/config_service.js @@ -6,7 +6,7 @@ class ConfigService extends EventTarget { return getObjectValue(rgthreeConfig, key, def); } getFeatureValue(key, def) { - key = 'features.' + key.replace(/^features\./, ''); + key = "features." + key.replace(/^features\./, ""); return getObjectValue(rgthreeConfig, key, def); } async setConfigValues(changed) {