From 2f445de43ac42a2cc75d16995f810389d9025a45 Mon Sep 17 00:00:00 2001 From: Will Miao <13051207myq@gmail.com> Date: Sun, 2 Mar 2025 15:44:14 +0800 Subject: [PATCH] checkpoint --- web/comfyui/loras_widget.js | 24 --------- web/comfyui/tags_widget.js | 78 +++++------------------------- web/comfyui/trigger_word_toggle.js | 19 ++------ web/comfyui/utils.js | 15 ++++++ 4 files changed, 31 insertions(+), 105 deletions(-) diff --git a/web/comfyui/loras_widget.js b/web/comfyui/loras_widget.js index c634d51f..4743bf93 100644 --- a/web/comfyui/loras_widget.js +++ b/web/comfyui/loras_widget.js @@ -272,13 +272,8 @@ export function addLorasWidget(node, name, opts, callback) { const lorasData = parseLoraValue(widget.value); lorasData.forEach(lora => lora.active = active); - // Update value and trigger widget callback const newValue = formatLoraValue(lorasData); widget.value = newValue; - widget.callback?.(newValue); - - // Remove re-render call - this is causing double callback - // renderLoras(newValue, widget); }); // Add label to toggle all @@ -337,13 +332,8 @@ export function addLorasWidget(node, name, opts, callback) { if (loraIndex >= 0) { lorasData[loraIndex].active = newActive; - // Update value and trigger widget callback const newValue = formatLoraValue(lorasData); widget.value = newValue; - widget.callback?.(newValue); - - // Remove re-render call - this is causing double callback - // renderLoras(newValue, widget); } }); @@ -406,13 +396,8 @@ export function addLorasWidget(node, name, opts, callback) { if (loraIndex >= 0) { lorasData[loraIndex].strength = (lorasData[loraIndex].strength - 0.05).toFixed(2); - // Update value and trigger widget callback const newValue = formatLoraValue(lorasData); widget.value = newValue; - widget.callback?.(newValue); - - // Remove re-render call - this is causing double callback - // renderLoras(newValue, widget); } }); @@ -476,10 +461,6 @@ export function addLorasWidget(node, name, opts, callback) { // 更新值并触发回调 const newLorasValue = formatLoraValue(lorasData); widget.value = newLorasValue; - widget.callback?.(newLorasValue); - - // Remove re-render call - this is causing double callback - // renderLoras(newLorasValue, widget); } }); @@ -499,13 +480,8 @@ export function addLorasWidget(node, name, opts, callback) { if (loraIndex >= 0) { lorasData[loraIndex].strength = (parseFloat(lorasData[loraIndex].strength) + 0.05).toFixed(2); - // Update value and trigger widget callback const newValue = formatLoraValue(lorasData); widget.value = newValue; - widget.callback?.(newValue); - - // Remove re-render call - this is causing double callback - // renderLoras(newValue, widget); } }); diff --git a/web/comfyui/tags_widget.js b/web/comfyui/tags_widget.js index 7899457a..3e96c616 100644 --- a/web/comfyui/tags_widget.js +++ b/web/comfyui/tags_widget.js @@ -15,33 +15,19 @@ export function addTagsWidget(node, name, opts, callback) { // Initialize default value as array const defaultValue = opts?.defaultVal || []; - let initialTagsData = []; - - try { - // Convert string input to array if needed - initialTagsData = typeof defaultValue === 'string' ? - JSON.parse(defaultValue) : (Array.isArray(defaultValue) ? defaultValue : []); - } catch (e) { - console.warn("Invalid default tags data format", e); - } + let initialTagsData = Array.isArray(defaultValue) ? defaultValue : []; // Normalize tag data to ensure consistent format const normalizeTagData = (data) => { if (!Array.isArray(data)) return []; return data.map(item => { - // If it's already in the correct format, return as is if (item && typeof item === 'object' && 'text' in item) { return { text: item.text, active: item.active !== undefined ? item.active : true }; - } - // If it's just a string, convert to object - else if (typeof item === 'string') { - return { text: item, active: true }; } - // Default fallback return { text: String(item), active: true }; }); }; @@ -56,7 +42,7 @@ export function addTagsWidget(node, name, opts, callback) { // Ensure we're working with normalized data const normalizedTags = normalizeTagData(tagsData); - normalizedTags.forEach((tagData) => { + normalizedTags.forEach((tagData, index) => { const { text, active } = tagData; const tagEl = document.createElement("div"); tagEl.className = "comfy-tag"; @@ -70,18 +56,12 @@ export function addTagsWidget(node, name, opts, callback) { tagEl.addEventListener("click", (e) => { e.stopPropagation(); - // Toggle active state for this tag + // Toggle active state for this specific tag using its index const updatedTags = [...widget.value]; - const tagIndex = updatedTags.findIndex((t) => t.text === text); + updatedTags[index].active = !updatedTags[index].active; + updateTagStyle(tagEl, updatedTags[index].active); - if (tagIndex >= 0) { - updatedTags[tagIndex].active = !updatedTags[tagIndex].active; - updateTagStyle(tagEl, updatedTags[tagIndex].active); - - // Update widget value and trigger callback - widget.value = updatedTags; - widget.callback?.(updatedTags); - } + widget.value = updatedTags; }); container.appendChild(tagEl); @@ -104,6 +84,10 @@ export function addTagsWidget(node, name, opts, callback) { display: "inline-block", boxShadow: "0 1px 2px rgba(0,0,0,0.1)", margin: "4px", // 从6px减小到4px + userSelect: "none", // Add this line to prevent text selection + WebkitUserSelect: "none", // For Safari support + MozUserSelect: "none", // For Firefox support + msUserSelect: "none", // For IE/Edge support }; if (active) { @@ -140,46 +124,11 @@ export function addTagsWidget(node, name, opts, callback) { // Create widget with initial properties const widget = node.addDOMWidget(name, "tags", container, { getValue: function() { + console.log("Tags widget value:", widgetValue); return widgetValue; }, setValue: function(v) { - // Handle input formats but always normalize to array - try { - if (typeof v === "string") { - // If JSON string, parse it - if (v.startsWith("[") || v.startsWith("{")) { - const parsed = JSON.parse(v); - widgetValue = normalizeTagData(parsed); - } else { - // If it's a comma-separated string of tags - const tagStrings = v - .split(",") - .map((word) => word.trim()) - .filter((word) => word); - - // Preserve active states from existing tags where possible - const existingTagsMap = {}; - widgetValue.forEach((tag) => { - existingTagsMap[tag.text] = tag.active; - }); - - widgetValue = tagStrings.map((text) => ({ - text, - active: text in existingTagsMap ? existingTagsMap[text] : true, - })); - } - } else if (Array.isArray(v)) { - // Directly use array input but ensure proper format - widgetValue = normalizeTagData(v); - } else { - // Default to empty array for invalid inputs - widgetValue = []; - } - } catch (e) { - console.warn("Error formatting tags value:", e); - // Keep existing value if there's an error - } - + widgetValue = normalizeTagData(Array.isArray(v) ? v : []); renderTags(widgetValue, widget); }, getHeight: function() { @@ -194,8 +143,7 @@ export function addTagsWidget(node, name, opts, callback) { } }); - // Initialize widget value using options methods - widget.options.setValue(defaultValue); + widget.value = defaultValue; widget.callback = callback; diff --git a/web/comfyui/trigger_word_toggle.js b/web/comfyui/trigger_word_toggle.js index 1253b5f4..360f05b4 100644 --- a/web/comfyui/trigger_word_toggle.js +++ b/web/comfyui/trigger_word_toggle.js @@ -24,15 +24,13 @@ app.registerExtension({ // Get the widget object directly from the returned object const result = addTagsWidget(node, "toggle_trigger_words", { defaultVal: [] - }, (value) => { - }); node.tagWidget = result.widget; // Restore saved value if exists if (node.widgets_values && node.widgets_values.length > 0) { - // 0 is input, 1 is hidden widget, 2 is tag widget + // 0 is input, 1 is tag widget const savedValue = node.widgets_values[1]; if (savedValue) { result.widget.value = savedValue; @@ -42,12 +40,6 @@ app.registerExtension({ } }, - async nodeRemoved(node) { - if (node.comfyClass === "TriggerWord Toggle (LoraManager)") { - // TODO: Remove widget from node - } - }, - // Handle trigger word updates from Python handleTriggerWordUpdate(id, message) { const node = app.graph.getNodeById(+id); @@ -63,9 +55,7 @@ app.registerExtension({ const existingTags = node.tagWidget.value || []; const tempWidget = node.tagWidget; - console.log("height of node: ", node.size[1]); - // console.log("tempWidget: ", tempWidget); - console.log("tagWidget height: ", tempWidget.options.getHeight()); + const originalHeight = tempWidget.options.getHeight(); // Create a map of existing tags and their active states const existingTagMap = {}; @@ -85,10 +75,7 @@ app.registerExtension({ })); node.tagWidget.value = tagArray; - console.log("tagWidget new height: ", tempWidget.options.getHeight()); - const computed = node.computeSize(); - node.size[1] = computed[1]; - console.log("computed height: ", computed[1]); + node.size[1] = node.size[1] + (tempWidget.options.getHeight() - originalHeight); node.setDirtyCanvas(true, true); } } diff --git a/web/comfyui/utils.js b/web/comfyui/utils.js index d1cbbbd9..d7252a85 100644 --- a/web/comfyui/utils.js +++ b/web/comfyui/utils.js @@ -21,4 +21,19 @@ export function hideWidgetForGood(node, widget, suffix = "") { hideWidgetForGood(node, w, `:${widget.name}`); } } +} + +// Wrapper class to handle 'two element array bug' in LiteGraph or comfyui +export class DataWrapper { + constructor(data) { + this.data = data; + } + + getData() { + return this.data; + } + + setData(data) { + this.data = data; + } } \ No newline at end of file