neuro_llc/ComfyBox
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

Better mode switching action

Browse Source
This commit is contained in:
space-nuko
2023-05-09 11:36:02 -05:00
parent 2df43c6b04
commit 30198c3808
6 changed files with 1070 additions and 848 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
litegraph

Submodule litegraph updated: a5e7911ae7...6ee800cc72

155
src/lib/nodes/ComfyActionNodes.ts
View File

@@ -1,8 +1,8 @@
import type { SerializedPrompt } from "$lib/components/ComfyApp";
import notify from "$lib/notify";
import layoutState from "$lib/stores/layoutState";
import layoutState, { type DragItemID } from "$lib/stores/layoutState";
import queueState from "$lib/stores/queueState";
import { BuiltInSlotType, LiteGraph, NodeMode, type ITextWidget, type IToggleWidget, type SerializedLGraphNode, type SlotLayout } from "@litegraph-ts/core";
import { BuiltInSlotType, LiteGraph, NodeMode, type ITextWidget, type IToggleWidget, type SerializedLGraphNode, type SlotLayout, type PropertyLayout } from "@litegraph-ts/core";
import { get } from "svelte/store";
import ComfyGraphNode, { type ComfyGraphNodeProperties } from "./ComfyGraphNode";
import type { ComfyWidgetNode, GalleryOutput } from "./ComfyWidgetNodes";
@@ -279,16 +279,21 @@ export class ComfySetNodeModeAction extends ComfyGraphNode {
constructor(title?: string) {
super(title)
this.displayWidget = this.addWidget("text", "Tags", this.properties.targetTags, "targetTags")
this.enableWidget = this.addWidget("toggle", "Enable", this.properties.enable, "enable");
}
override onPropertyChanged(property: any, value: any) {
if (property === "enabled") {
if (property === "enable") {
this.enableWidget.value = value
}
}
override onAction(action: any, param: any) {
let enabled = this.getInputData(0)
let input = this.getInputData(0)
if (input == null)
input = this.properties.enable
let enabled = Boolean(input)
if (typeof param === "object" && "enabled" in param)
enabled = param["enabled"]
@@ -332,3 +337,145 @@ LiteGraph.registerNodeType({
desc: "Sets a group of nodes/UI containers as enabled/disabled based on their tags (comma-separated)",
type: "actions/set_node_mode"
})
export type TagAction = {
tag: string,
enable: boolean
}
export interface ComfySetNodeModeAdvancedActionProperties extends ComfyGraphNodeProperties {
targetTags: TagAction[],
enable: boolean,
}
export class ComfySetNodeModeAdvancedAction extends ComfyGraphNode {
override properties: ComfySetNodeModeAdvancedActionProperties = {
targetTags: [{ tag: "myTag", enable: true }, { tag: "anotherTag", enable: false }],
enable: true,
tags: []
}
static slotLayout: SlotLayout = {
inputs: [
{ name: "enabled", type: "boolean" },
{ name: "set", type: BuiltInSlotType.ACTION },
],
}
static propertyLayout: PropertyLayout = [
{ name: "enable", defaultValue: true, type: "boolean", },
{ name: "targetTags", defaultValue: [{ tag: "myTag", enable: true }, { tag: "anotherTag", enable: false }], type: "array", options: { multiline: true, inputStyle: { fontFamily: "monospace" } } }
]
displayWidget: ITextWidget;
enableWidget: IToggleWidget;
constructor(title?: string) {
super(title)
this.displayWidget = this.addWidget("text", "Tags", this.formatTags(), null);
this.displayWidget.disabled = true;
this.enableWidget = this.addWidget("toggle", "Enable", this.properties.enable, "enable");
}
override onPropertyChanged(property: any, value: any) {
if (property === "enable") {
this.enableWidget.value = value
}
else if (property === "targetTags") {
this.displayWidget.value = this.formatTags()
}
}
private formatTags(): string {
if (!Array.isArray(this.properties.targetTags) || this.properties.targetTags.length === 0)
return "(No tags)";
return this.properties.targetTags.map(t => {
let s = t.tag
if (t.enable)
s = "+" + s
else
s = "!" + s
return s
}).join(", ")
}
private getModeChanges(action: TagAction, enable: boolean, nodeChanges: Record<string, NodeMode>, widgetChanges: Record<DragItemID, boolean>) {
for (const node of this.graph._nodes) {
if ("tags" in node.properties) {
const comfyNode = node as ComfyGraphNode;
const hasTag = comfyNode.properties.tags.indexOf(action.tag) != -1;
if (hasTag) {
let newMode: NodeMode;
if (enable && action.enable) {
newMode = NodeMode.ALWAYS;
} else {
newMode = NodeMode.NEVER;
}
nodeChanges[node.id] = newMode
node.changeMode(newMode);
if ("notifyPropsChanged" in node)
(node as ComfyWidgetNode).notifyPropsChanged();
}
}
}
for (const entry of Object.values(get(layoutState).allItems)) {
if (entry.dragItem.type === "container") {
const container = entry.dragItem;
const hasTag = container.attrs.tags.indexOf(action.tag) != -1;
if (hasTag) {
const hidden = !(enable && action.enable)
widgetChanges[container.id] = hidden
}
}
}
}
override onExecute() {
this.boxcolor = LiteGraph.NODE_DEFAULT_BOXCOLOR;
for (const action of this.properties.targetTags) {
if (typeof action !== "object" || !("tag" in action) || !("enable" in action)) {
this.boxcolor = "red";
break;
}
}
}
override onAction(action: any, param: any) {
let input = this.getInputData(0)
if (input == null)
input = this.properties.enable
let enabled = Boolean(input)
if (typeof param === "object" && "enabled" in param)
enabled = param["enabled"]
const nodeChanges: Record<string, NodeMode> = {} // nodeID => newState
const widgetChanges: Record<string, boolean> = {} // dragItemID => isHidden
for (const action of this.properties.targetTags) {
this.getModeChanges(action, enabled, nodeChanges, widgetChanges)
}
for (const [nodeId, newMode] of Object.entries(nodeChanges)) {
this.graph.getNodeById(parseInt(nodeId)).changeMode(newMode);
}
const layout = get(layoutState);
for (const [dragItemID, isHidden] of Object.entries(widgetChanges)) {
const container = layout.allItems[dragItemID].dragItem
container.attrs.hidden = isHidden;
container.attrsChanged.set(get(container.attrsChanged) + 1)
}
}
}
LiteGraph.registerNodeType({
class: ComfySetNodeModeAdvancedAction,
title: "Comfy.SetNodeModeAdvancedAction",
desc: "Turns multiple groups of nodes on/off at once based on an array of rules [{ tag: string, enable: boolean }, ...]",
type: "actions/set_node_mode_advanced"
})

56
src/lib/nodes/ComfyTriggerNewEventNode.ts Normal file
View File

@@ -0,0 +1,56 @@
import { BuiltInSlotType, LGraphNode, LiteGraph, type ITextWidget, type SlotLayout, type PropertyLayout } from "@litegraph-ts/core"
import type { ComfyGraphNodeProperties } from "./ComfyGraphNode";
import { Watch } from "@litegraph-ts/nodes-basic";
export interface ComfyTriggerNewEventNodeProperties extends ComfyGraphNodeProperties {
param: any,
}
export default class ComfyTriggerNewEventNode extends LGraphNode {
override properties: ComfyTriggerNewEventNodeProperties = {
param: true,
tags: []
}
static slotLayout: SlotLayout = {
inputs: [
{ name: "in", type: BuiltInSlotType.ACTION },
{ name: "param", type: "*" },
],
outputs: [
{ name: "out", type: BuiltInSlotType.EVENT },
],
}
paramWidget: ITextWidget;
constructor(title?: string) {
super(title)
this.paramWidget = this.addWidget("text", "Param", Watch.toString(this.properties.param), "param")
}
override onPropertyChanged(property: any, value: any) {
if (property === "param")
this.paramWidget.value = Watch.toString(value)
}
override onExecute() {
const newParam = this.getInputData(1);
if (newParam != null)
this.setProperty("param", newParam)
}
override onAction(action: any, param: any, options: { action_call?: string }) {
let newParam = this.getInputData(1);
if (newParam == null)
newParam = this.properties.param
this.triggerSlot(0, newParam, null, options);
}
}
LiteGraph.registerNodeType({
class: ComfyTriggerNewEventNode,
title: "Comfy.TriggerNewEvent",
desc: "Triggers a new event with the specified parameter when an event is received",
type: "events/trigger_new_event"
})

162
src/lib/nodes/ComfyWidgetNodes.ts
View File

@@ -67,6 +67,7 @@ export abstract class ComfyWidgetNode<T = any> extends ComfyGraphNode {
private _aboutToChange: number = 0;
private _aboutToChangeValue: any = null;
private _noChangedEvent: boolean = false;
abstract defaultValue: T;
@@ -84,6 +85,7 @@ export abstract class ComfyWidgetNode<T = any> extends ComfyGraphNode {
// TODO these are bad, create override methods instead
// input slots
inputIndex: number = 0;
storeActionName: string | null = "store";
// output slots
outputIndex: number | null = 0;
@@ -139,31 +141,44 @@ export abstract class ComfyWidgetNode<T = any> extends ComfyGraphNode {
this.setOutputData(this.outputIndex, get(this.value))
}
if (this.changedIndex !== null && this.outputs.length >= this.changedIndex) {
if (this.changedIndex !== null && this.outputs.length >= this.changedIndex && !this._noChangedEvent) {
if (!this.delayChangedEvent)
this.triggerChangeEvent(get(this.value))
else {
this._aboutToChange = 2; // wait 1.5-2 frames, in case we're already in the middle of one
console.debug("[Widget] queueChangeEvent", this, value)
this._aboutToChange = 2; // wait 1.5-2 frames, in case we're already in the middle of executing the graph
this._aboutToChangeValue = get(this.value);
}
}
this._noChangedEvent = false;
}
private triggerChangeEvent(value: any) {
console.debug("[Widget] trigger changed", this, value)
const changedOutput = this.outputs[this.changedIndex]
if (changedOutput.type === BuiltInSlotType.EVENT)
this.triggerSlot(this.changedIndex, value)
}
setValue(value: any) {
this.value.set(value)
parseValue(value: any): T { return value as T };
setValue(value: any, noChangedEvent: boolean = false) {
if (noChangedEvent)
this._noChangedEvent = true;
this.value.set(this.parseValue(value))
// In case value.set() does not trigger onValueUpdated, we need to reset
// the counter here also.
this._noChangedEvent = false;
}
override onPropertyChanged(property: string, value: any, prevValue?: any) {
if (this.shownOutputProperties != null) {
const data = this.shownOutputProperties[property]
if (data)
this.setOutputData(data.index, value)
}
}
/*
* Logic to run if this widget can be treated as output (slider, combo, text)
@@ -198,6 +213,21 @@ export abstract class ComfyWidgetNode<T = any> extends ComfyGraphNode {
}
}
override onAction(action: any, param: any, options: { action_call?: string }) {
if (action === this.storeActionName) {
let noChangedEvent = false;
let value = param;
if (param != null && typeof param === "object" && "value" in param) {
value = param.value
if ("noChangedEvent" in param)
noChangedEvent = Boolean(param.noChangedEvent)
}
value = this.parseValue(value);
console.warn("[Widget] Store!", param, "=>", value, noChangedEvent)
this.setValue(value, noChangedEvent)
}
}
onConnectOutput(
outputIndex: number,
inputType: INodeInputSlot["type"],
@@ -337,15 +367,10 @@ export class ComfySliderNode extends ComfyWidgetNode<number> {
super(name, 0)
}
override onAction(action: any, param: any) {
if (action === "store" && typeof param === "number")
this.setValue(param)
}
override setValue(value: any) {
override parseValue(value: any): number {
if (typeof value !== "number")
return;
super.setValue(clamp(value, this.properties.min, this.properties.max))
return this.properties.min;
return clamp(value, this.properties.min, this.properties.max)
}
override clampOneConfig(input: IComfyInputSlot) {
@@ -422,15 +447,10 @@ export class ComfyComboNode extends ComfyWidgetNode<string> {
return true;
}
override onAction(action: any, param: any) {
if (action === "store" && typeof param === "string")
this.setValue(param)
}
override setValue(value: any) {
override parseValue(value: any): string {
if (typeof value !== "string" || this.properties.values.indexOf(value) === -1)
return;
super.setValue(value)
return this.properties.values[0]
return value
}
override clampOneConfig(input: IComfyInputSlot) {
@@ -486,13 +506,8 @@ export class ComfyTextNode extends ComfyWidgetNode<string> {
super(name, "")
}
override onAction(action: any, param: any) {
if (action === "store")
this.setValue(param)
}
override setValue(value: any) {
override parseValue(value: any): string {
return `${value}`
}
}
@@ -578,49 +593,42 @@ export class ComfyGalleryNode extends ComfyWidgetNode<GradioFileData[]> {
}
override onAction(action: any, param: any, options: { action_call?: string }) {
super.onAction(action, param, options)
if (action === "clear") {
this.setValue([])
}
}
else if (action === "store") {
if (param && "images" in param) {
const data = param as GalleryOutput
console.debug("[ComfyGalleryNode] Received output!", data)
const galleryItems: GradioFileData[] = convertComfyOutputToGradio(data)
if (this.properties.updateMode === "append") {
const currentValue = get(this.value)
this.setValue(currentValue.concat(galleryItems))
}
else {
this.setValue(galleryItems)
}
}
this.setProperty("index", 0)
this.anyImageSelected = false;
}
override formatValue(value: GradioFileData[] | null): string {
return `Images: ${value?.length || 0}`
}
override setValue(value: any) {
console.warn("SETVALUE", value)
if (Array.isArray(value)) {
override parseValue(param: any): GradioFileData[] {
if (!(typeof param === "object" && "images" in param)) {
return []
}
const data = param as GalleryOutput
console.debug("[ComfyGalleryNode] Received output!", data)
const galleryItems: GradioFileData[] = convertComfyOutputToGradio(data)
if (this.properties.updateMode === "append") {
const currentValue = get(this.value)
return currentValue.concat(galleryItems)
}
else {
else {
return galleryItems;
}
}
if (!get(this.value))
override setValue(value: any, noChangedEvent: boolean = false) {
console.warn("SETVALUE", value)
super.setValue(value, noChangedEvent)
const len = get(this.value).length
if (this.properties.index < 0 || this.properties.index >= len) {
this.setProperty("index", clamp(this.properties.index, 0, len))
this.setProperty("index", 0)
this.anyImageSelected = false;
}
}
@@ -657,8 +665,8 @@ export class ComfyButtonNode extends ComfyWidgetNode<boolean> {
super(name, false)
}
override setValue(value: any) {
override parseValue(param: any): boolean {
return Boolean(param);
}
onClick() {
@@ -697,22 +705,14 @@ export class ComfyCheckboxNode extends ComfyWidgetNode<boolean> {
override svelteComponentType = CheckboxWidget;
override defaultValue = false;
override changedIndex = 1;
constructor(name?: string) {
super(name, false)
}
override setValue(value: any) {
value = Boolean(value)
const changed = value != get(this.value);
super.setValue(Boolean(value))
if (changed)
this.triggerSlot(1, value)
}
override onAction(action: any, param: any) {
if (action === "store")
override parseValue(param: any) {
return Boolean(param);
}
}
@@ -735,6 +735,10 @@ export class ComfyRadioNode extends ComfyWidgetNode<string> {
}
static slotLayout: SlotLayout = {
inputs: [
{ name: "value", type: "string,number" },
{ name: "store", type: BuiltInSlotType.ACTION }
],
outputs: [
{ name: "value", type: "string" },
{ name: "index", type: "number" },
@@ -761,16 +765,30 @@ export class ComfyRadioNode extends ComfyWidgetNode<string> {
this.setOutputData(1, this.index)
}
override setValue(value: string, noChangedEvent: boolean = false) {
super.setValue(value, noChangedEvent)
value = get(this.value);
const index = this.properties.choices.indexOf(value)
const index = this.properties.choices.indexOf(value)
if (index === -1)
return;
this.index = index;
this.indexWidget.value = index;
this.setOutputData(1, this.index)
}
override parseValue(param: any): string {
if (typeof param === "string") {
if (this.properties.choices.indexOf(param) === -1)
return this.properties.choices[0]
return param
}
else {
const index = clamp(parseInt(param), 0, this.properties.choices.length - 1)
return this.properties.choices[index] || this.properties.defaultValue
}
}
}

1
src/lib/nodes/index.ts
View File

@@ -5,3 +5,4 @@ export { default as ComfyPickFirstNode } from "./ComfyPickFirstNode"
export { default as ComfyValueControl } from "./ComfyValueControl"
export { default as ComfySelector } from "./ComfySelector"
export { default as ComfyImageCacheNode } from "./ComfyImageCacheNode"
export { default as ComfyTriggerNewEventNode } from "./ComfyTriggerNewEventNode"

2
src/lib/stores/layoutState.ts
View File

@@ -603,7 +603,7 @@ export interface WidgetLayout extends IDragItem {
node: ComfyWidgetNode
}
type DragItemID = string;
export type DragItemID = string;
type LayoutStateOps = {
addContainer: (parent: ContainerLayout | null, attrs: Partial<Attributes>, index?: number) => ContainerLayout,