{/if}
diff --git a/src/lib/components/ComfyApp.ts b/src/lib/components/ComfyApp.ts
index 72ac37c..132c74c 100644
--- a/src/lib/components/ComfyApp.ts
+++ b/src/lib/components/ComfyApp.ts
@@ -318,12 +318,12 @@ export default class ComfyApp {
}
// Distinguish frontend/backend connections
- const BACKEND_TYPES = ["CLIP", "CLIP_VISION", "CLIP_VISION_OUTPUT", "CONDITIONING", "CONTROL_NET", "IMAGE", "LATENT", "MASK", "MODEL", "STYLE_MODEL", "VAE"]
+ const BACKEND_TYPES = ["CLIP", "CLIP_VISION", "CLIP_VISION_OUTPUT", "CONDITIONING", "CONTROL_NET", "LATENT", "MASK", "MODEL", "STYLE_MODEL", "VAE"]
for (const type of BACKEND_TYPES) {
setColor(type, "orange")
}
- setColor("OUTPUT", "rebeccapurple")
+ setColor("IMAGE", "rebeccapurple")
setColor(BuiltInSlotType.EVENT, "lightseagreen")
setColor(BuiltInSlotType.ACTION, "lightseagreen")
}
diff --git a/src/lib/nodes/ComfyActionNodes.ts b/src/lib/nodes/ComfyActionNodes.ts
index 2110285..26cf24b 100644
--- a/src/lib/nodes/ComfyActionNodes.ts
+++ b/src/lib/nodes/ComfyActionNodes.ts
@@ -2,6 +2,7 @@ import { LiteGraph, type ContextMenuItem, type LGraphNode, type Vector2, LConnec
import ComfyGraphNode from "./ComfyGraphNode";
import { Watch } from "@litegraph-ts/nodes-basic";
import type { SerializedPrompt } from "$lib/components/ComfyApp";
+import { toast } from '@zerodevx/svelte-toast'
export interface ComfyAfterQueuedEventProperties extends Record
{
prompt: SerializedPrompt
@@ -47,6 +48,40 @@ LiteGraph.registerNodeType({
type: "actions/after_queued"
})
+export interface ComfyOnExecutedEventProperties extends Record {
+}
+
+export class ComfyOnExecutedEvent extends ComfyGraphNode {
+ override properties: ComfyOnExecutedEventProperties = {
+ }
+
+ static slotLayout: SlotLayout = {
+ inputs: [
+ { name: "images", type: "IMAGE" }
+ ],
+ outputs: [
+ { name: "onExecuted", type: BuiltInSlotType.EVENT },
+ ],
+ }
+
+ private _output: any = null;
+
+ override receiveOutput(output: any) {
+ if (this._output !== output) {
+ console.error(output)
+ this.triggerSlot(0, "bang")
+ this._output = output
+ }
+ }
+}
+
+LiteGraph.registerNodeType({
+ class: ComfyOnExecutedEvent,
+ title: "Comfy.OnExecutedEvent",
+ desc: "Triggers a 'bang' event when a prompt output is received.",
+ type: "actions/on_executed"
+})
+
export interface ComfyCopyActionProperties extends Record {
value: any
}
@@ -130,3 +165,34 @@ LiteGraph.registerNodeType({
desc: "Swaps two inputs when triggered",
type: "actions/swap"
})
+
+export interface ComfyNotifyActionProperties extends Record {
+ message: string
+}
+
+export class ComfyNotifyAction extends ComfyGraphNode {
+ override properties: ComfyNotifyActionProperties = {
+ message: "Nya."
+ }
+
+ static slotLayout: SlotLayout = {
+ inputs: [
+ { name: "message", type: "string" },
+ { name: "trigger", type: BuiltInSlotType.ACTION }
+ ],
+ }
+
+ override onAction(action: any, param: any) {
+ const message = this.getInputData(0);
+ if (message) {
+ toast.push(message);
+ }
+ };
+}
+
+LiteGraph.registerNodeType({
+ class: ComfyNotifyAction,
+ title: "Comfy.NotifyAction",
+ desc: "Displays a message.",
+ type: "actions/notify"
+})
diff --git a/src/lib/nodes/ComfyBackendNode.ts b/src/lib/nodes/ComfyBackendNode.ts
index 3cde566..0b462d0 100644
--- a/src/lib/nodes/ComfyBackendNode.ts
+++ b/src/lib/nodes/ComfyBackendNode.ts
@@ -25,7 +25,7 @@ export class ComfyBackendNode extends ComfyGraphNode {
// It just returns a hash like { "ui": { "images": results } } internally.
// So this will need to be hardcoded for now.
if (["PreviewImage", "SaveImage"].indexOf(comfyClass) !== -1) {
- this.addOutput("output", "OUTPUT");
+ this.addOutput("output", "IMAGE");
}
}
@@ -78,12 +78,13 @@ export class ComfyBackendNode extends ComfyGraphNode {
console.warn("onExecuted outputs", outputData)
for (let index = 0; index < this.outputs.length; index++) {
const output = this.outputs[index]
- if (output.type === "OUTPUT") {
+ if (output.type === "IMAGE") {
this.setOutputData(index, outputData)
for (const node of this.getOutputNodes(index)) {
+ console.warn(node)
if ("receiveOutput" in node) {
- const widgetNode = node as ComfyWidgetNode;
- widgetNode.receiveOutput();
+ const widgetNode = node as ComfyGraphNode;
+ widgetNode.receiveOutput(outputData);
}
}
}
diff --git a/src/lib/nodes/ComfyGraphNode.ts b/src/lib/nodes/ComfyGraphNode.ts
index acc8c24..17eb405 100644
--- a/src/lib/nodes/ComfyGraphNode.ts
+++ b/src/lib/nodes/ComfyGraphNode.ts
@@ -23,6 +23,10 @@ export default class ComfyGraphNode extends LGraphNode {
defaultWidgets?: DefaultWidgetLayout
+ /** Called when a backend node sends a ComfyUI output over a link */
+ receiveOutput(output: any) {
+ }
+
override onSerialize(o: SerializedLGraphNode) {
for (let index = 0; index < this.inputs.length; index++) {
const input = this.inputs[index]
diff --git a/src/lib/nodes/ComfyWidgetNodes.ts b/src/lib/nodes/ComfyWidgetNodes.ts
index 7c127a7..3df8e53 100644
--- a/src/lib/nodes/ComfyWidgetNodes.ts
+++ b/src/lib/nodes/ComfyWidgetNodes.ts
@@ -135,10 +135,6 @@ export abstract class ComfyWidgetNode extends ComfyGraphNode {
}
}
- /** Called when a backend node sends a ComfyUI output over a link */
- receiveOutput() {
- }
-
onConnectOutput(
outputIndex: number,
inputType: INodeInputSlot["type"],
@@ -411,7 +407,7 @@ export class ComfyGalleryNode extends ComfyWidgetNode {
static slotLayout: SlotLayout = {
inputs: [
- { name: "images", type: "OUTPUT" }
+ { name: "images", type: "IMAGE" }
]
}
diff --git a/src/lib/nodes/index.ts b/src/lib/nodes/index.ts
index c2777d1..087dbc5 100644
--- a/src/lib/nodes/index.ts
+++ b/src/lib/nodes/index.ts
@@ -1,5 +1,5 @@
export { default as ComfyReroute } from "./ComfyReroute"
export { ComfyWidgetNode, ComfySliderNode, ComfyComboNode, ComfyTextNode } from "./ComfyWidgetNodes"
-export { ComfyCopyAction, ComfySwapAction } from "./ComfyActionNodes"
+export { ComfyAfterQueuedEvent, ComfyCopyAction, ComfySwapAction, ComfyNotifyAction, ComfyOnExecutedEvent } from "./ComfyActionNodes"
export { default as ComfyValueControl } from "./ComfyValueControl"
export { default as ComfySelector } from "./ComfySelector"
diff --git a/src/scss/ux.scss b/src/scss/ux.scss
index 8df7a08..bbe1e10 100644
--- a/src/scss/ux.scss
+++ b/src/scss/ux.scss
@@ -113,6 +113,12 @@ body {
.v-pane {
gap: var(--ae-outside-gap-size) !important;
+
+ &.empty {
+ border-color: var(--ae-subpanel-border-color) !important;
+ border-radius: 0 !important;
+ background: var(--ae-subpanel-bg-color) !important;
+ }
}
.container {
@@ -133,13 +139,18 @@ body {
}
&.z-index1, &.z-index2 {
// padding: var(--ae-outside-gap-size);
- border: 1px solid var(--ae-panel-border-color);
+ // border: 1px solid var(--ae-panel-border-color);
> .block {
background: var(--ae-frame-bg-color) !important;
}
}
&:not(.edit) {
+ &.z-index1 > .block {
+ padding: calc(var(--ae-outside-gap-size) / 2) !important;
+ border-width: 0px !important;
+ }
+
> .block {
border: solid var(--ae-panel-border-width) var(--ae-panel-border-color) !important;
}
@@ -236,11 +247,11 @@ div.float {
}
.target-name {
- background: var(--ae-subpanel-bg-color);
- border-color: var(--ae-subpanel-border-color);
+ background: var(--ae-subpanel-bg-color) !important;
+ border-color: var(--ae-subpanel-border-color) !important;
.title, .type {
- color: var(--ae-label-color)
+ color: var(--ae-label-color) !important;
}
}