diff --git a/.github/workflows/build-and-publish.yml b/.github/workflows/build-and-publish.yml new file mode 100644 index 0000000..8ba851e --- /dev/null +++ b/.github/workflows/build-and-publish.yml @@ -0,0 +1,64 @@ +name: Build and Publish + +on: + - push + +jobs: + test_default_inputs: + name: Test with default inputs + + runs-on: ${{ matrix.os }} + + strategy: + fail-fast: false + matrix: + pnpm: + - 4.11.1 + os: + - ubuntu-latest + - macos-latest + - windows-latest + + steps: + - name: Checkout + uses: actions/checkout@v3 + + - name: Install Node.js + uses: actions/setup-node@v3 + with: + node-version: 18 + + - uses: pnpm/action-setup@v2 + name: Install pnpm + id: pnpm-install + with: + version: 7.26 + run_install: false + + - name: Get pnpm store directory + id: pnpm-cache + shell: bash + run: | + echo "STORE_PATH=$(pnpm store path)" >> $GITHUB_OUTPUT + + - uses: actions/cache@v3 + name: Setup pnpm cache + with: + path: ${{ steps.pnpm-cache.outputs.STORE_PATH }} + key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }} + restore-keys: | + ${{ runner.os }}-pnpm-store- + + - name: Install dependencies + run: pnpm install + + - name: Build + run: | + pnpm build:css + pnpm build + + - uses: actions/upload-artifact@v3 + with: + name: ComfyBox-dist + path: dist/ + if-no-files-found: error # 'warn' or 'ignore' are also available, defaults to `warn` diff --git a/.gitignore b/.gitignore index 6635cf5..702a941 100644 --- a/.gitignore +++ b/.gitignore @@ -8,3 +8,4 @@ node_modules !.env.example vite.config.js.timestamp-* vite.config.ts.timestamp-* +/dist diff --git a/litegraph b/litegraph index fd56d0c..115bef4 160000 --- a/litegraph +++ b/litegraph @@ -1 +1 @@ -Subproject commit fd56d0c4e698b7a5bfccb1aa86e15db0f16120df +Subproject commit 115bef46a58616395d7d3b54a1421472ac28e519 diff --git a/run.bat b/run.bat new file mode 100644 index 0000000..53da77d --- /dev/null +++ b/run.bat @@ -0,0 +1,4 @@ +@echo off + +pushd dist +python -m http.server 8000 diff --git a/run.sh b/run.sh new file mode 100644 index 0000000..c673001 --- /dev/null +++ b/run.sh @@ -0,0 +1,4 @@ +#!/usr/bin/env sh + +pushd dist/ +python -m http.server 8000 diff --git a/src/lib/components/ComfyApp.svelte b/src/lib/components/ComfyApp.svelte index db027f5..23296bc 100644 --- a/src/lib/components/ComfyApp.svelte +++ b/src/lib/components/ComfyApp.svelte @@ -11,6 +11,7 @@ import { ImageViewer } from "$lib/ImageViewer"; import type { ComfyAPIStatus } from "$lib/api"; import { SvelteToast, toast } from '@zerodevx/svelte-toast' + import defaultGraph from "$lib/defaultGraph" import { LGraph } from "@litegraph-ts/core"; import LightboxModal from "./LightboxModal.svelte"; @@ -95,6 +96,13 @@ } } + async function doLoadDefault(): void { + var confirmed = confirm("Are you sure you want to clear the current workflow and load the default graph?"); + if (confirmed) { + await app.deserialize(defaultGraph) + } + } + function doRecenter(): void { app.lCanvas.recenter(); } @@ -180,6 +188,9 @@ + diff --git a/src/lib/components/ComfyApp.ts b/src/lib/components/ComfyApp.ts index 56667d7..72ac37c 100644 --- a/src/lib/components/ComfyApp.ts +++ b/src/lib/components/ComfyApp.ts @@ -108,7 +108,7 @@ export default class ComfyApp { const json = localStorage.getItem("workflow"); if (json) { const state = JSON.parse(json) as SerializedAppState; - this.deserialize(state) + await this.deserialize(state) restored = true; } } catch (err) { @@ -117,7 +117,7 @@ export default class ComfyApp { // We failed to restore a workflow so load the default if (!restored) { - this.initDefaultGraph(); + await this.initDefaultGraph(); } // Save current workflow automatically @@ -344,7 +344,7 @@ export default class ComfyApp { } } - deserialize(data: SerializedAppState) { + async deserialize(data: SerializedAppState) { if (data.version !== COMFYBOX_SERIAL_VERSION) { throw `Invalid ComfyBox saved data format: ${data.version}` } @@ -363,11 +363,13 @@ export default class ComfyApp { // Restore canvas offset/zoom this.lCanvas.deserialize(data.canvas) + + await this.refreshComboInNodes(); } - initDefaultGraph() { + async initDefaultGraph() { const state = structuredClone(defaultGraph) - this.deserialize(state) + await this.deserialize(state) } /** diff --git a/src/lib/components/ComfyQueue.svelte b/src/lib/components/ComfyQueue.svelte index b844a12..de2af8e 100644 --- a/src/lib/components/ComfyQueue.svelte +++ b/src/lib/components/ComfyQueue.svelte @@ -10,9 +10,79 @@ const title = app.lGraph.getNodeById(nodeId)?.title || String(nodeId); return title + " (" + nodeId + ")" } + + const entries = [ + { + "outputs": { + 44: { + "images": [ + { + "filename": "ComfyUI_00052_.png", + "subfolder": "", + "type": "output" + } + ] + } + } + }, + { + "outputs": { + 44: { + "images": [ + { + "filename": "ComfyUI_00052_.png", + "subfolder": "", + "type": "output" + } + ] + } + } + }, + { + "outputs": { + 44: { + "images": [ + { + "filename": "ComfyUI_00052_.png", + "subfolder": "", + "type": "output" + } + ] + } + } + } + ] + + let _entries: any[] = [] + + $: if (entries) { + _entries = [] + for (const entry of entries) { + for (const outputs of Object.values(entry.outputs)) { + const allImages = outputs.images.map(r => { + // TODO configure backend URL + const url = "http://localhost:8188/view?" + const params = new URLSearchParams(r) + return url + params + }); + + _entries.push({ allImages, name: "Output" }) + } + } + }
+
+ {#each _entries as entry} +
+ thumbnail +
+ {entry.name} +
+
+ {/each} +
{#if $queueState.runningNodeId || $queueState.progress}
@@ -50,6 +120,20 @@ align-items: center; } + .queue-entry { + padding: 0.5rem 0.5rem 0 0.5rem; + display: flex; + flex-direction: row; + } + + .queue-entry-image { + width: var(--size-20) + } + + .queue-entry-details { + width: var(--size-20) + } + .node-name { border: 5px solid #CCC; background-color: var(--color-red-300); diff --git a/src/lib/defaultGraph.ts b/src/lib/defaultGraph.ts index 0ef7690..7b7f07b 100644 --- a/src/lib/defaultGraph.ts +++ b/src/lib/defaultGraph.ts @@ -11,8 +11,8 @@ const defaultGraph: SerializedAppState = { id: 19, type: "ui/slider", pos: [ - 77.09750000000287, - 235.9643000000003 + 21.195500000002912, + 238.6263000000003 ], size: [ 210, @@ -36,8 +36,7 @@ const defaultGraph: SerializedAppState = { type: "number", links: [ 18 - ], - _data: 8 + ] }, { name: "changed", @@ -48,26 +47,22 @@ const defaultGraph: SerializedAppState = { { name: "min", type: "number", - links: null, - _data: 0 + links: null }, { name: "max", type: "number", - links: null, - _data: 100 + links: null }, { name: "step", type: "number", - links: null, - _data: 0.5 + links: null }, { name: "precision", type: "number", - links: null, - _data: 0 + links: null } ], title: "UI.Slider", @@ -107,8 +102,8 @@ const defaultGraph: SerializedAppState = { id: 20, type: "ui/combo", pos: [ - 77.09750000000287, - 255.9643000000003 + 21.195500000002912, + 258.62630000000024 ], size: [ 210, @@ -132,8 +127,7 @@ const defaultGraph: SerializedAppState = { type: "string", links: [ 19 - ], - _data: "euler" + ] }, { name: "changed", @@ -174,8 +168,8 @@ const defaultGraph: SerializedAppState = { id: 21, type: "ui/combo", pos: [ - 77.09750000000287, - 275.9643000000003 + 21.195500000002912, + 278.6263000000003 ], size: [ 210, @@ -199,8 +193,7 @@ const defaultGraph: SerializedAppState = { type: "string", links: [ 20 - ], - _data: "karras" + ] }, { name: "changed", @@ -231,8 +224,8 @@ const defaultGraph: SerializedAppState = { id: 22, type: "ui/slider", pos: [ - 77.09750000000287, - 355.9643000000003 + 21.195500000002912, + 358.6263000000003 ], size: [ 210, @@ -256,8 +249,7 @@ const defaultGraph: SerializedAppState = { type: "number", links: [ 21 - ], - _data: 1 + ] }, { name: "changed", @@ -268,26 +260,22 @@ const defaultGraph: SerializedAppState = { { name: "min", type: "number", - links: null, - _data: 0 + links: null }, { name: "max", type: "number", - links: null, - _data: 1 + links: null }, { name: "step", type: "number", - links: null, - _data: 0.01 + links: null }, { name: "precision", type: "number", - links: null, - _data: 0 + links: null } ], title: "UI.Slider", @@ -352,8 +340,7 @@ const defaultGraph: SerializedAppState = { type: "string", links: [ 30 - ], - _data: "masterpiece, best quality, 1girl, dress, space opera, portrait, planet landscape, starry sky" + ] }, { name: "changed", @@ -404,8 +391,7 @@ const defaultGraph: SerializedAppState = { type: "string", links: [ 31 - ], - _data: "worst quality, bad quality, nsfw" + ] }, { name: "changed", @@ -427,59 +413,12 @@ const defaultGraph: SerializedAppState = { comfyValue: "worst quality, bad quality, nsfw", shownOutputProperties: {} }, - { - id: 40, - type: "VAEDecode", - pos: [ - 532.5875000000013, - 160.9183000000009 - ], - size: [ - 210, - 46 - ], - flags: {}, - order: 31, - mode: 0, - inputs: [ - { - name: "samples", - type: "LATENT", - link: 40, - color_off: "orange", - color_on: "orange" - }, - { - name: "vae", - type: "VAE", - link: 101, - color_off: "orange", - color_on: "orange" - } - ], - outputs: [ - { - name: "IMAGE", - type: "IMAGE", - links: [ - 44 - ], - color_off: "orange", - color_on: "orange", - slot_index: 0 - } - ], - title: "VAEDecode", - properties: {}, - color: "#432", - bgColor: "#653" - }, { id: 45, type: "ui/text", pos: [ - 779.2900000000001, - 208.44999999999965 + 537.2416, + 196.97919999999982 ], size: [ 210, @@ -503,8 +442,7 @@ const defaultGraph: SerializedAppState = { type: "string", links: [ 43 - ], - _data: "ComfyUI" + ] }, { name: "changed", @@ -526,56 +464,6 @@ const defaultGraph: SerializedAppState = { comfyValue: "ComfyUI", shownOutputProperties: {} }, - { - id: 32, - type: "CLIPTextEncode", - pos: [ - -218, - 285 - ], - size: [ - 216.60000000000002, - 46 - ], - flags: {}, - order: 24, - mode: 0, - inputs: [ - { - name: "text", - type: "string", - link: 30, - config: { - defaultValue: "", - multiline: true - }, - serialize: true - }, - { - name: "clip", - type: "CLIP", - link: 99, - color_off: "orange", - color_on: "orange" - } - ], - outputs: [ - { - name: "CONDITIONING", - type: "CONDITIONING", - links: [ - 33 - ], - color_off: "orange", - color_on: "orange", - slot_index: 0 - } - ], - title: "CLIPTextEncode", - properties: {}, - color: "#432", - bgColor: "#653" - }, { id: 34, type: "CLIPTextEncode", @@ -588,7 +476,7 @@ const defaultGraph: SerializedAppState = { 46 ], flags: {}, - order: 25, + order: 23, mode: 0, inputs: [ { @@ -626,300 +514,12 @@ const defaultGraph: SerializedAppState = { color: "#432", bgColor: "#653" }, - { - id: 47, - type: "ui/gallery", - pos: [ - 1284, - 165 - ], - size: [ - 210, - 58 - ], - flags: {}, - order: 33, - mode: 0, - inputs: [ - { - name: "images", - type: "OUTPUT", - link: 46 - } - ], - outputs: [], - title: "UI.Gallery", - properties: { - defaultValue: [] - }, - widgets_values: [ - "Images: 4" - ], - color: "#223", - bgColor: "#335", - comfyValue: [ - { - name: null, - data: "http://localhost:8188/view?filename=ComfyUI_00352_.png&subfolder=&type=output" - }, - { - name: null, - data: "http://localhost:8188/view?filename=ComfyUI_00353_.png&subfolder=&type=output" - }, - { - name: null, - data: "http://localhost:8188/view?filename=ComfyUI_00354_.png&subfolder=&type=output" - }, - { - name: null, - data: "http://localhost:8188/view?filename=ComfyUI_00355_.png&subfolder=&type=output" - } - ], - shownOutputProperties: {} - }, - { - id: 49, - type: "events/log", - pos: [ - 771, - 22 - ], - size: [ - 140, - 26 - ], - flags: {}, - order: 17, - mode: 0, - inputs: [ - { - name: "event", - type: -1, - link: 47, - shape: 1 - } - ], - outputs: [], - title: "Log Event", - properties: {} - }, - { - id: 52, - type: "basic/watch", - pos: [ - 1063.1426107321954, - -118.99396962098862 - ], - size: [ - 140, - 26 - ], - flags: {}, - order: 22, - mode: 0, - inputs: [ - { - name: "value", - type: 0, - link: 50, - label: "null", - slot_index: 0 - } - ], - outputs: [], - title: "Watch", - properties: { - value: 1 - } - }, - { - id: 54, - type: "ui/slider", - pos: [ - 1038, - -226 - ], - size: [ - 210, - 158 - ], - flags: {}, - order: 23, - mode: 0, - inputs: [ - { - name: "value", - type: "number", - link: 52 - } - ], - outputs: [ - { - name: "value", - type: "number", - links: null, - _data: 6 - }, - { - name: "changed", - type: -2, - links: null, - shape: 1 - }, - { - name: "min", - type: "number", - links: null, - _data: 0 - }, - { - name: "max", - type: "number", - links: null, - _data: 10 - }, - { - name: "step", - type: "number", - links: null, - _data: 1 - }, - { - name: "precision", - type: "number", - links: null, - _data: 1 - } - ], - title: "UI.Slider", - properties: { - defaultValue: 0, - min: 0, - max: 10, - step: 1, - precision: 1 - }, - widgets_values: [ - "6.000" - ], - color: "#223", - bgColor: "#335", - comfyValue: 6, - shownOutputProperties: { - min: { - type: "number", - index: 2 - }, - max: { - type: "number", - index: 3 - }, - step: { - type: "number", - index: 4 - }, - precision: { - type: "number", - index: 5 - } - } - }, - { - id: 48, - type: "ui/button", - pos: [ - 372, - 12 - ], - size: [ - 210, - 78 - ], - flags: {}, - order: 7, - mode: 0, - inputs: [], - outputs: [ - { - name: "event", - type: -2, - links: [ - 47, - 62 - ], - shape: 1, - slot_index: 0 - }, - { - name: "isClicked", - type: "boolean", - links: null, - slot_index: 1, - _data: false - } - ], - title: "UI.Button", - properties: { - defaultValue: false, - message: "bang" - }, - widgets_values: [ - "false" - ], - color: "#223", - bgColor: "#335", - comfyValue: false, - shownOutputProperties: {} - }, - { - id: 50, - type: "actions/copy", - pos: [ - 729, - -125 - ], - size: [ - 210, - 78 - ], - flags: {}, - order: 18, - mode: 0, - inputs: [ - { - name: "", - type: "*", - link: 66 - }, - { - name: "copy", - type: -1, - link: 62, - shape: 1 - } - ], - outputs: [ - { - name: "", - type: "*", - links: [ - 50, - 52 - ], - slot_index: 0 - } - ], - title: "Comfy.CopyAction", - properties: { - value: 6 - } - }, { id: 18, type: "ui/slider", pos: [ - 79, - 219 + 23.09800000000005, + 221.662 ], size: [ 210, @@ -928,7 +528,7 @@ const defaultGraph: SerializedAppState = { flags: { collapsed: true }, - order: 8, + order: 7, mode: 0, inputs: [ { @@ -943,8 +543,7 @@ const defaultGraph: SerializedAppState = { type: "number", links: [ 17 - ], - _data: 20 + ] }, { name: "changed", @@ -955,26 +554,22 @@ const defaultGraph: SerializedAppState = { { name: "min", type: "number", - links: null, - _data: 1 + links: null }, { name: "max", type: "number", - links: null, - _data: 10000 + links: null }, { name: "step", type: "number", - links: null, - _data: 1 + links: null }, { name: "precision", type: "number", - links: null, - _data: 0 + links: null } ], title: "UI.Slider", @@ -1010,159 +605,12 @@ const defaultGraph: SerializedAppState = { } } }, - { - id: 53, - type: "ui/slider", - pos: [ - 369, - -174 - ], - size: [ - 210, - 158 - ], - flags: {}, - order: 9, - mode: 0, - inputs: [ - { - name: "value", - type: "number", - link: null - } - ], - outputs: [ - { - name: "value", - type: "number", - links: [ - 66 - ], - slot_index: 0, - _data: 6 - }, - { - name: "changed", - type: -2, - links: [], - shape: 1, - slot_index: 1 - }, - { - name: "min", - type: "number", - links: null, - _data: 0 - }, - { - name: "max", - type: "number", - links: null, - _data: 10 - }, - { - name: "step", - type: "number", - links: null, - _data: 1 - }, - { - name: "precision", - type: "number", - links: null, - _data: 1 - } - ], - title: "UI.Slider", - properties: { - defaultValue: 0, - min: 0, - max: 10, - step: 1, - precision: 1 - }, - widgets_values: [ - "6.000" - ], - color: "#223", - bgColor: "#335", - comfyValue: 6, - shownOutputProperties: { - min: { - type: "number", - index: 2 - }, - max: { - type: "number", - index: 3 - }, - step: { - type: "number", - index: 4 - }, - precision: { - type: "number", - index: 5 - } - } - }, - { - id: 64, - type: "basic/CompareValues", - pos: [ - -131, - -587 - ], - size: [ - 210, - 78 - ], - flags: {}, - order: 19, - mode: 0, - inputs: [ - { - name: "A", - type: 0, - link: 78 - }, - { - name: "B", - type: 0, - link: 79 - } - ], - outputs: [ - { - name: "true", - type: "boolean", - links: [ - 74 - ], - slot_index: 0, - _data: true - }, - { - name: "false", - type: "boolean", - links: null, - _data: false - } - ], - title: "GenericCompare", - properties: { - A: "randomize", - B: "randomize", - OP: "==", - enabled: true - } - }, { id: 39, type: "ui/slider", pos: [ - -350, - 554 + -348.53590000000014, + 532.0385000000008 ], size: [ 210, @@ -1171,7 +619,7 @@ const defaultGraph: SerializedAppState = { flags: { collapsed: true }, - order: 10, + order: 8, mode: 0, inputs: [ { @@ -1187,8 +635,7 @@ const defaultGraph: SerializedAppState = { links: [ 38, 83 - ], - _data: 4 + ] }, { name: "changed", @@ -1199,26 +646,22 @@ const defaultGraph: SerializedAppState = { { name: "min", type: "number", - links: null, - _data: 1 + links: null }, { name: "max", type: "number", - links: null, - _data: 64 + links: null }, { name: "step", type: "number", - links: null, - _data: 1 + links: null }, { name: "precision", type: "number", - links: null, - _data: 0 + links: null } ], title: "UI.Slider", @@ -1258,15 +701,15 @@ const defaultGraph: SerializedAppState = { id: 66, type: "basic/string", pos: [ - -363, - -578 + -1159.8159275999997, + 161.70724299999867 ], size: [ 210, 38 ], flags: {}, - order: 11, + order: 9, mode: 0, inputs: [], outputs: [ @@ -1276,8 +719,7 @@ const defaultGraph: SerializedAppState = { links: [ 78 ], - slot_index: 0, - _data: "randomize" + slot_index: 0 } ], title: "Const String", @@ -1289,8 +731,8 @@ const defaultGraph: SerializedAppState = { id: 57, type: "ui/combo", pos: [ - -378, - -304 + -1213.4681676, + 392.2234730000002 ], size: [ 210, @@ -1299,7 +741,7 @@ const defaultGraph: SerializedAppState = { flags: { collapsed: true }, - order: 12, + order: 10, mode: 0, inputs: [ { @@ -1316,8 +758,7 @@ const defaultGraph: SerializedAppState = { 55, 79 ], - slot_index: 0, - _data: "randomize" + slot_index: 0 }, { name: "changed", @@ -1345,27 +786,221 @@ const defaultGraph: SerializedAppState = { shownOutputProperties: {} }, { - id: 17, + id: 56, + type: "utils/value_control", + pos: [ + -1087.4681676000018, + 324.22347300000024 + ], + size: [ + 151.2, + 126 + ], + flags: {}, + order: 34, + mode: 0, + inputs: [ + { + name: "value", + type: "number", + link: 68 + }, + { + name: "trigger", + type: -1, + link: 73, + shape: 1 + }, + { + name: "action", + type: "string", + link: 55, + config: { + defaultValue: "randomize", + values: [ + "fixed", + "increment", + "decrement", + "randomize" + ] + } + }, + { + name: "min", + type: "number", + link: 69 + }, + { + name: "max", + type: "number", + link: 70 + }, + { + name: "step", + type: "number", + link: 88 + } + ], + outputs: [ + { + name: "value", + type: "*", + links: [ + 67 + ], + slot_index: 0 + } + ], + title: "Comfy.ValueControl", + properties: { + value: 572904899609889, + action: "randomize", + min: 0, + max: 18446744073709552000, + step: 1 + } + }, + { + id: 63, + type: "utils/selector2", + pos: [ + -661.4681676000001, + 131.22347299999896 + ], + size: [ + 140, + 66 + ], + flags: {}, + order: 35, + mode: 0, + inputs: [ + { + name: "select", + type: "boolean", + link: 74 + }, + { + name: "true", + type: "*", + link: 75 + }, + { + name: "false", + type: "*", + link: 86, + slot_index: 2 + } + ], + outputs: [ + { + name: "out", + type: "*", + links: [ + 87, + 88 + ], + slot_index: 0 + } + ], + title: "Comfy.Selector2", + properties: { + value: null + } + }, + { + id: 36, + type: "EmptyLatentImage", + pos: [ + -218.53589999999943, + 468.03850000000097 + ], + size: [ + 216.60000000000002, + 66 + ], + flags: {}, + order: 28, + mode: 0, + inputs: [ + { + name: "width", + type: "number", + link: 93, + config: { + min: 64, + max: 8192, + step: 8, + precision: 0, + defaultValue: 512 + }, + serialize: true + }, + { + name: "height", + type: "number", + link: 94, + config: { + min: 64, + max: 8192, + step: 8, + precision: 0, + defaultValue: 512 + }, + serialize: true + }, + { + name: "batch_size", + type: "number", + link: 38, + config: { + min: 1, + max: 64, + step: 1, + precision: 0, + defaultValue: 1 + }, + serialize: true + } + ], + outputs: [ + { + name: "LATENT", + type: "LATENT", + links: [ + 39 + ], + color_off: "orange", + color_on: "orange", + slot_index: 0 + } + ], + title: "EmptyLatentImage", + properties: {}, + color: "#432", + bgColor: "#653" + }, + { + id: 38, type: "ui/slider", pos: [ - -48, - -291 + -349.5359000000001, + 510.0385000000006 ], size: [ 210, 158 ], flags: { - collapsed: false + collapsed: true }, - order: 27, + order: 30, mode: 0, inputs: [ { name: "value", type: "number", - link: 67, - slot_index: 0 + link: 91 } ], outputs: [ @@ -1373,11 +1008,10 @@ const defaultGraph: SerializedAppState = { name: "value", type: "number", links: [ - 68, - 80 + 90, + 94 ], - slot_index: 0, - _data: 572904899609889 + slot_index: 0 }, { name: "changed", @@ -1388,51 +1022,38 @@ const defaultGraph: SerializedAppState = { { name: "min", type: "number", - links: [ - 69 - ], - slot_index: 2, - _data: 0 + links: null }, { name: "max", type: "number", - links: [ - 70 - ], - slot_index: 3, - _data: 18446744073709552000 + links: null }, { name: "step", type: "number", - links: [ - 75 - ], - slot_index: 4, - _data: 1 + links: null }, { name: "precision", type: "number", - links: null, - _data: 0 + links: null } ], title: "UI.Slider", properties: { - defaultValue: 0, - min: 0, - max: 18446744073709552000, - step: 1, + defaultValue: 512, + min: 64, + max: 8192, + step: 8, precision: 0 }, widgets_values: [ - "572904899609889.000" + "512.000" ], color: "#223", bgColor: "#335", - comfyValue: 572904899609889, + comfyValue: 512, shownOutputProperties: { min: { type: "number", @@ -1452,15 +1073,312 @@ const defaultGraph: SerializedAppState = { } } }, + { + id: 37, + type: "ui/slider", + pos: [ + -350.5359000000001, + 487.0385000000008 + ], + size: [ + 210, + 158 + ], + flags: { + collapsed: true + }, + order: 29, + mode: 0, + inputs: [ + { + name: "value", + type: "number", + link: 92 + } + ], + outputs: [ + { + name: "value", + type: "number", + links: [ + 89, + 93 + ], + slot_index: 0 + }, + { + name: "changed", + type: -2, + links: null, + shape: 1 + }, + { + name: "min", + type: "number", + links: null + }, + { + name: "max", + type: "number", + links: null + }, + { + name: "step", + type: "number", + links: null + }, + { + name: "precision", + type: "number", + links: null + } + ], + title: "UI.Slider", + properties: { + defaultValue: 512, + min: 64, + max: 8192, + step: 8, + precision: 0 + }, + widgets_values: [ + "512.000" + ], + color: "#223", + bgColor: "#335", + comfyValue: 512, + shownOutputProperties: { + min: { + type: "number", + index: 2 + }, + max: { + type: "number", + index: 3 + }, + step: { + type: "number", + index: 4 + }, + precision: { + type: "number", + index: 5 + } + } + }, + { + id: 62, + type: "ui/button", + pos: [ + -646.5358999999994, + 528.0385000000008 + ], + size: [ + 210, + 78 + ], + flags: { + collapsed: true + }, + order: 11, + mode: 0, + inputs: [], + outputs: [ + { + name: "clicked", + type: -2, + links: [ + 95 + ], + shape: 1, + slot_index: 0 + }, + { + name: "isClicked", + type: "boolean", + links: null + } + ], + title: "UI.Button", + properties: { + defaultValue: false, + message: "bang" + }, + widgets_values: [ + "false" + ], + color: "#223", + bgColor: "#335", + comfyValue: false, + shownOutputProperties: {} + }, + { + id: 75, + type: "ui/combo", + pos: [ + -329.6916311399999, + 184.27962460075804 + ], + size: [ + 210, + 78 + ], + flags: { + collapsed: true + }, + order: 12, + mode: 0, + inputs: [ + { + name: "value", + type: "string", + link: null + } + ], + outputs: [ + { + name: "value", + type: "string", + links: [ + 97 + ] + }, + { + name: "changed", + type: -2, + links: null, + shape: 1 + } + ], + title: "UI.Combo", + properties: { + defaultValue: "AbyssOrangeMix2_nsfw.safetensors", + values: [ + "AbyssOrangeMix2_nsfw.safetensors", + "refslaveV2_v2.safetensors" + ] + }, + widgets_values: [ + "refslaveV2_v2.safetensors" + ], + color: "#223", + bgColor: "#335", + comfyValue: "refslaveV2_v2.safetensors", + shownOutputProperties: {} + }, + { + id: 70, + type: "basic/watch", + pos: [ + -494.46816760000047, + 153.2234729999992 + ], + size: [ + 140, + 26 + ], + flags: { + collapsed: true + }, + order: 36, + mode: 0, + inputs: [ + { + name: "value", + type: 0, + link: 87, + label: "1.000" + } + ], + outputs: [], + title: "Watch", + properties: { + value: 1 + } + }, + { + id: 67, + type: "math/operation", + pos: [ + -632.1603378, + 295.01834139999994 + ], + size: [ + 140, + 46 + ], + flags: {}, + order: 19, + mode: 0, + inputs: [ + { + name: "A", + type: "number,array,object", + link: 85 + }, + { + name: "B", + type: "number", + link: 83 + } + ], + outputs: [ + { + name: "=", + type: "number", + links: [ + 86 + ], + slot_index: 0 + } + ], + title: "Operation", + properties: { + A: 1, + B: 4, + OP: "+" + } + }, + { + id: 69, + type: "basic/integer", + pos: [ + -889.9041880999993, + 298.8132760000001 + ], + size: [ + 210, + 38 + ], + flags: {}, + order: 13, + mode: 0, + inputs: [], + outputs: [ + { + name: "value", + type: "number", + links: [ + 85 + ], + label: "1", + slot_index: 0 + } + ], + title: "Const Integer", + properties: { + value: 1 + } + }, { id: 16, type: "KSampler", pos: [ - 242, - 156 + 186.09800000000004, + 158.662 ], size: [ - 241.79999999999998, + 161.2, 206 ], flags: {}, @@ -1606,685 +1524,65 @@ const defaultGraph: SerializedAppState = { bgColor: "#653" }, { - id: 69, - type: "basic/integer", + id: 40, + type: "VAEDecode", pos: [ - 261, - -405 - ], - size: [ - 210, - 38 - ], - flags: {}, - order: 13, - mode: 0, - inputs: [], - outputs: [ - { - name: "value", - type: "number", - links: [ - 85 - ], - label: "1", - slot_index: 0, - _data: 1 - } - ], - title: "Const Integer", - properties: { - value: 1 - } - }, - { - id: 56, - type: "utils/value_control", - pos: [ - -252, - -372 - ], - size: [ - 151.2, - 126 - ], - flags: {}, - order: 34, - mode: 0, - inputs: [ - { - name: "value", - type: "number", - link: 68 - }, - { - name: "trigger", - type: -1, - link: 73, - shape: 1 - }, - { - name: "action", - type: "string", - link: 55, - config: { - defaultValue: "randomize", - values: [ - "fixed", - "increment", - "decrement", - "randomize" - ] - } - }, - { - name: "min", - type: "number", - link: 69 - }, - { - name: "max", - type: "number", - link: 70 - }, - { - name: "step", - type: "number", - link: 88 - } - ], - outputs: [ - { - name: "value", - type: "*", - links: [ - 67 - ], - slot_index: 0 - } - ], - title: "Comfy.ValueControl", - properties: { - value: 572904899609889, - action: "randomize", - min: 0, - max: 18446744073709552000, - step: 1 - } - }, - { - id: 63, - type: "utils/selector2", - pos: [ - 174, - -565 + 380.0980000000001, + 158.662 ], size: [ 140, - 66 - ], - flags: {}, - order: 35, - mode: 0, - inputs: [ - { - name: "select", - type: "boolean", - link: 74 - }, - { - name: "true", - type: "*", - link: 75 - }, - { - name: "false", - type: "*", - link: 86, - slot_index: 2 - } - ], - outputs: [ - { - name: "out", - type: "*", - links: [ - 87, - 88 - ], - slot_index: 0, - _data: 1 - } - ], - title: "Comfy.Selector2", - properties: { - value: null - } - }, - { - id: 36, - type: "EmptyLatentImage", - pos: [ - -220, - 490 - ], - size: [ - 216.60000000000002, - 66 - ], - flags: {}, - order: 28, - mode: 0, - inputs: [ - { - name: "width", - type: "number", - link: 93, - config: { - min: 64, - max: 8192, - step: 8, - precision: 0, - defaultValue: 512 - }, - serialize: true - }, - { - name: "height", - type: "number", - link: 94, - config: { - min: 64, - max: 8192, - step: 8, - precision: 0, - defaultValue: 512 - }, - serialize: true - }, - { - name: "batch_size", - type: "number", - link: 38, - config: { - min: 1, - max: 64, - step: 1, - precision: 0, - defaultValue: 1 - }, - serialize: true - } - ], - outputs: [ - { - name: "LATENT", - type: "LATENT", - links: [ - 39 - ], - color_off: "orange", - color_on: "orange", - slot_index: 0 - } - ], - title: "EmptyLatentImage", - properties: {}, - color: "#432", - bgColor: "#653" - }, - { - id: 38, - type: "ui/slider", - pos: [ - -351, - 532 - ], - size: [ - 210, - 158 - ], - flags: { - collapsed: true - }, - order: 30, - mode: 0, - inputs: [ - { - name: "value", - type: "number", - link: 91 - } - ], - outputs: [ - { - name: "value", - type: "number", - links: [ - 90, - 94 - ], - slot_index: 0, - _data: 512 - }, - { - name: "changed", - type: -2, - links: null, - shape: 1 - }, - { - name: "min", - type: "number", - links: null, - _data: 64 - }, - { - name: "max", - type: "number", - links: null, - _data: 8192 - }, - { - name: "step", - type: "number", - links: null, - _data: 8 - }, - { - name: "precision", - type: "number", - links: null, - _data: 0 - } - ], - title: "UI.Slider", - properties: { - defaultValue: 512, - min: 64, - max: 8192, - step: 8, - precision: 0 - }, - widgets_values: [ - "512.000" - ], - color: "#223", - bgColor: "#335", - comfyValue: 512, - shownOutputProperties: { - min: { - type: "number", - index: 2 - }, - max: { - type: "number", - index: 3 - }, - step: { - type: "number", - index: 4 - }, - precision: { - type: "number", - index: 5 - } - } - }, - { - id: 37, - type: "ui/slider", - pos: [ - -352, - 509 - ], - size: [ - 210, - 158 - ], - flags: { - collapsed: true - }, - order: 29, - mode: 0, - inputs: [ - { - name: "value", - type: "number", - link: 92 - } - ], - outputs: [ - { - name: "value", - type: "number", - links: [ - 89, - 93 - ], - slot_index: 0, - _data: 848 - }, - { - name: "changed", - type: -2, - links: null, - shape: 1 - }, - { - name: "min", - type: "number", - links: null, - _data: 64 - }, - { - name: "max", - type: "number", - links: null, - _data: 8192 - }, - { - name: "step", - type: "number", - links: null, - _data: 8 - }, - { - name: "precision", - type: "number", - links: null, - _data: 0 - } - ], - title: "UI.Slider", - properties: { - defaultValue: 512, - min: 64, - max: 8192, - step: 8, - precision: 0 - }, - widgets_values: [ - "848.000" - ], - color: "#223", - bgColor: "#335", - comfyValue: 848, - shownOutputProperties: { - min: { - type: "number", - index: 2 - }, - max: { - type: "number", - index: 3 - }, - step: { - type: "number", - index: 4 - }, - precision: { - type: "number", - index: 5 - } - } - }, - { - id: 71, - type: "actions/swap", - pos: [ - -527, - 486 - ], - size: [ - 140, - 66 - ], - flags: { - collapsed: false - }, - order: 37, - mode: 0, - inputs: [ - { - name: "A", - type: "*", - link: 89 - }, - { - name: "B", - type: "*", - link: 90 - }, - { - name: "swap", - type: -1, - link: 95, - shape: 1 - } - ], - outputs: [ - { - name: "B", - type: "*", - links: [ - 91 - ], - slot_index: 0 - }, - { - name: "A", - type: "*", - links: [ - 92 - ], - slot_index: 1 - } - ], - title: "Comfy.SwapAction", - properties: {} - }, - { - id: 62, - type: "ui/button", - pos: [ - -648, - 550 - ], - size: [ - 210, - 78 - ], - flags: { - collapsed: true - }, - order: 14, - mode: 0, - inputs: [], - outputs: [ - { - name: "clicked", - type: -2, - links: [ - 95 - ], - shape: 1, - slot_index: 0 - }, - { - name: "isClicked", - type: "boolean", - links: null, - _data: false - } - ], - title: "UI.Button", - properties: { - defaultValue: false, - message: "bang" - }, - widgets_values: [ - "false" - ], - color: "#223", - bgColor: "#335", - comfyValue: false, - shownOutputProperties: {} - }, - { - id: 44, - type: "SaveImage", - pos: [ - 888, - 164 - ], - size: [ - 315, - 78 - ], - flags: {}, - order: 32, - mode: 0, - inputs: [ - { - name: "images", - type: "IMAGE", - link: 44, - color_off: "orange", - color_on: "orange", - slot_index: 0 - }, - { - name: "filename_prefix", - type: "string", - link: 43, - config: { - defaultValue: "ComfyUI", - multiline: false - }, - serialize: true - } - ], - outputs: [ - { - name: "output", - type: "OUTPUT", - links: [ - 46 - ], - slot_index: 0 - } - ], - title: "SaveImage", - properties: {}, - color: "#432", - bgColor: "#653" - }, - { - id: 55, - type: "actions/after_queued", - pos: [ - -591, - -349 - ], - size: [ - 193.2, 46 ], flags: {}, - order: 15, - mode: 0, - inputs: [], - outputs: [ - { - name: "afterQueued", - type: -2, - links: [ - 73 - ], - shape: 1, - slot_index: 0, - _data: null - }, - { - name: "prompt", - type: "*", - links: null - } - ], - title: "Comfy.AfterQueuedAction", - properties: { - prompt: null - } - }, - { - id: 75, - type: "ui/combo", - pos: [ - -420.44163113999997, - 169.75962460075795 - ], - size: [ - 210, - 78 - ], - flags: { - collapsed: true - }, - order: 16, + order: 31, mode: 0, inputs: [ { - name: "value", - type: "string", - link: null + name: "samples", + type: "LATENT", + link: 40, + color_off: "orange", + color_on: "orange" + }, + { + name: "vae", + type: "VAE", + link: 101, + color_off: "orange", + color_on: "orange" } ], outputs: [ { - name: "value", - type: "string", + name: "IMAGE", + type: "IMAGE", links: [ - 97 + 44 ], - _data: "refslaveV2_v2.safetensors" - }, - { - name: "changed", - type: -2, - links: null, - shape: 1 + color_off: "orange", + color_on: "orange", + slot_index: 0 } ], - title: "UI.Combo", - properties: { - defaultValue: "AbyssOrangeMix2_nsfw.safetensors", - values: [ - "AbyssOrangeMix2_nsfw.safetensors", - "refslaveV2_v2.safetensors" - ] - }, - widgets_values: [ - "refslaveV2_v2.safetensors" - ], - color: "#223", - bgColor: "#335", - comfyValue: "refslaveV2_v2.safetensors", - shownOutputProperties: {} + title: "VAEDecode", + properties: {}, + color: "#432", + bgColor: "#653" }, { id: 74, type: "CheckpointLoaderSimple", pos: [ - -290, - 146 + -199, + 161 ], size: [ - 277.2, + 184.79999999999998, 66 ], flags: {}, - order: 21, + order: 18, mode: 0, inputs: [ { @@ -2336,27 +1634,677 @@ const defaultGraph: SerializedAppState = { bgColor: "#653" }, { - id: 70, + id: 32, + type: "CLIPTextEncode", + pos: [ + -218, + 285 + ], + size: [ + 212.10067125600108, + 46 + ], + flags: {}, + order: 22, + mode: 0, + inputs: [ + { + name: "text", + type: "string", + link: 30, + config: { + defaultValue: "", + multiline: true + }, + serialize: true + }, + { + name: "clip", + type: "CLIP", + link: 99, + color_off: "orange", + color_on: "orange" + } + ], + outputs: [ + { + name: "CONDITIONING", + type: "CONDITIONING", + links: [ + 33 + ], + color_off: "orange", + color_on: "orange", + slot_index: 0 + } + ], + title: "CLIPTextEncode", + properties: {}, + color: "#432", + bgColor: "#653" + }, + { + id: 71, + type: "actions/swap", + pos: [ + -526, + 464 + ], + size: [ + 140, + 66 + ], + flags: { + collapsed: false + }, + order: 37, + mode: 0, + inputs: [ + { + name: "A", + type: "*", + link: 89 + }, + { + name: "B", + type: "*", + link: 90 + }, + { + name: "swap", + type: -1, + link: 95, + shape: 1 + } + ], + outputs: [ + { + name: "B", + type: "*", + links: [ + 91 + ], + slot_index: 0 + }, + { + name: "A", + type: "*", + links: [ + 92 + ], + slot_index: 1 + } + ], + title: "Comfy.SwapAction", + properties: {} + }, + { + id: 53, + type: "ui/slider", + pos: [ + 295.11095999999947, + 515.1384599999993 + ], + size: [ + 210, + 158 + ], + flags: { + collapsed: true + }, + order: 14, + mode: 0, + inputs: [ + { + name: "value", + type: "number", + link: null + } + ], + outputs: [ + { + name: "value", + type: "number", + links: [ + 66 + ], + slot_index: 0 + }, + { + name: "changed", + type: -2, + links: [], + shape: 1, + slot_index: 1 + }, + { + name: "min", + type: "number", + links: null + }, + { + name: "max", + type: "number", + links: null + }, + { + name: "step", + type: "number", + links: null + }, + { + name: "precision", + type: "number", + links: null + } + ], + title: "UI.Slider", + properties: { + defaultValue: 0, + min: 0, + max: 10, + step: 1, + precision: 1 + }, + widgets_values: [ + "6.000" + ], + color: "#223", + bgColor: "#335", + comfyValue: 6, + shownOutputProperties: { + min: { + type: "number", + index: 2 + }, + max: { + type: "number", + index: 3 + }, + step: { + type: "number", + index: 4 + }, + precision: { + type: "number", + index: 5 + } + } + }, + { + id: 48, + type: "ui/button", + pos: [ + 300.11095999999947, + 548.1384599999991 + ], + size: [ + 210, + 78 + ], + flags: { + collapsed: true + }, + order: 15, + mode: 0, + inputs: [], + outputs: [ + { + name: "event", + type: -2, + links: [ + 47, + 62 + ], + shape: 1, + slot_index: 0 + }, + { + name: "isClicked", + type: "boolean", + links: null, + slot_index: 1 + } + ], + title: "UI.Button", + properties: { + defaultValue: false, + message: "bang" + }, + widgets_values: [ + "false" + ], + color: "#223", + bgColor: "#335", + comfyValue: false, + shownOutputProperties: {} + }, + { + id: 54, + type: "ui/slider", + pos: [ + 643.110959999998, + 508.1384599999991 + ], + size: [ + 210, + 158 + ], + flags: { + collapsed: true + }, + order: 25, + mode: 0, + inputs: [ + { + name: "value", + type: "number", + link: 52 + } + ], + outputs: [ + { + name: "value", + type: "number", + links: null + }, + { + name: "changed", + type: -2, + links: null, + shape: 1 + }, + { + name: "min", + type: "number", + links: null + }, + { + name: "max", + type: "number", + links: null + }, + { + name: "step", + type: "number", + links: null + }, + { + name: "precision", + type: "number", + links: null + } + ], + title: "UI.Slider", + properties: { + defaultValue: 0, + min: 0, + max: 10, + step: 1, + precision: 1 + }, + widgets_values: [ + "6.000" + ], + color: "#223", + bgColor: "#335", + comfyValue: 6, + shownOutputProperties: { + min: { + type: "number", + index: 2 + }, + max: { + type: "number", + index: 3 + }, + step: { + type: "number", + index: 4 + }, + precision: { + type: "number", + index: 5 + } + } + }, + { + id: 64, + type: "basic/CompareValues", + pos: [ + -927.8971031999996, + 152.4356894999996 + ], + size: [ + 210, + 78 + ], + flags: {}, + order: 17, + mode: 0, + inputs: [ + { + name: "A", + type: 0, + link: 78 + }, + { + name: "B", + type: 0, + link: 79 + } + ], + outputs: [ + { + name: "true", + type: "boolean", + links: [ + 74 + ], + slot_index: 0 + }, + { + name: "false", + type: "boolean", + links: null + } + ], + title: "GenericCompare", + properties: { + A: "randomize", + B: "randomize", + OP: "==", + enabled: true + } + }, + { + id: 17, + type: "ui/slider", + pos: [ + -884, + 405 + ], + size: [ + 210, + 158 + ], + flags: { + collapsed: false + }, + order: 27, + mode: 0, + inputs: [ + { + name: "value", + type: "number", + link: 67, + slot_index: 0 + } + ], + outputs: [ + { + name: "value", + type: "number", + links: [ + 68, + 80 + ], + slot_index: 0 + }, + { + name: "changed", + type: -2, + links: null, + shape: 1 + }, + { + name: "min", + type: "number", + links: [ + 69 + ], + slot_index: 2 + }, + { + name: "max", + type: "number", + links: [ + 70 + ], + slot_index: 3 + }, + { + name: "step", + type: "number", + links: [ + 75 + ], + slot_index: 4 + }, + { + name: "precision", + type: "number", + links: null + } + ], + title: "UI.Slider", + properties: { + defaultValue: 0, + min: 0, + max: 18446744073709552000, + step: 1, + precision: 0 + }, + widgets_values: [ + "572904899609889.000" + ], + color: "#223", + bgColor: "#335", + comfyValue: 572904899609889, + shownOutputProperties: { + min: { + type: "number", + index: 2 + }, + max: { + type: "number", + index: 3 + }, + step: { + type: "number", + index: 4 + }, + precision: { + type: "number", + index: 5 + } + } + }, + { + id: 55, + type: "actions/after_queued", + pos: [ + -1305, + 308 + ], + size: [ + 193.2, + 46 + ], + flags: {}, + order: 16, + mode: 0, + inputs: [], + outputs: [ + { + name: "afterQueued", + type: -2, + links: [ + 73 + ], + shape: 1, + slot_index: 0 + }, + { + name: "prompt", + type: "*", + links: null + } + ], + title: "Comfy.AfterQueuedAction", + properties: { + prompt: null + } + }, + { + id: 44, + type: "SaveImage", + pos: [ + 646.0979999999996, + 152.662 + ], + size: [ + 186.4, + 73.27554697882186 + ], + flags: {}, + order: 32, + mode: 0, + inputs: [ + { + name: "images", + type: "IMAGE", + link: 44, + color_off: "orange", + color_on: "orange", + slot_index: 0 + }, + { + name: "filename_prefix", + type: "string", + link: 43, + config: { + defaultValue: "ComfyUI", + multiline: false + }, + serialize: true + } + ], + outputs: [ + { + name: "output", + type: "OUTPUT", + links: [ + 46 + ], + slot_index: 0 + } + ], + title: "SaveImage", + properties: {}, + color: "#432", + bgColor: "#653" + }, + { + id: 50, + type: "actions/copy", + pos: [ + 409.0980000000001, + 485.662 + ], + size: [ + 210, + 78 + ], + flags: { + collapsed: false + }, + order: 21, + mode: 0, + inputs: [ + { + name: "", + type: "*", + link: 66 + }, + { + name: "copy", + type: -1, + link: 62, + shape: 1 + } + ], + outputs: [ + { + name: "", + type: "*", + links: [ + 50, + 52 + ], + slot_index: 0 + } + ], + title: "Comfy.CopyAction", + properties: { + value: 6 + } + }, + { + id: 47, + type: "ui/gallery", + pos: [ + 625.0979999999996, + 298.662 + ], + size: [ + 210, + 58 + ], + flags: {}, + order: 33, + mode: 0, + inputs: [ + { + name: "images", + type: "OUTPUT", + link: 46 + } + ], + outputs: [], + title: "UI.Gallery", + properties: { + defaultValue: [] + }, + widgets_values: [ + "Images: 4" + ], + color: "#223", + bgColor: "#335", + comfyValue: [], + shownOutputProperties: {} + }, + { + id: 52, type: "basic/watch", pos: [ - 341, - -543 + 637, + 551 ], size: [ 140, 26 ], - flags: { - collapsed: true - }, - order: 36, + flags: {}, + order: 24, mode: 0, inputs: [ { name: "value", type: 0, - link: 87, - label: "1.000" + link: 50, + label: "null", + slot_index: 0 } ], outputs: [], @@ -2366,48 +2314,32 @@ const defaultGraph: SerializedAppState = { } }, { - id: 67, - type: "math/operation", + id: 49, + type: "events/log", pos: [ - 519, - -409 + 374, + 612 ], size: [ 140, - 46 + 26 ], - flags: {}, + flags: { + collapsed: true + }, order: 20, mode: 0, inputs: [ { - name: "A", - type: "number,array,object", - link: 85 - }, - { - name: "B", - type: "number", - link: 83 + name: "event", + type: -1, + link: 47, + shape: 1 } ], - outputs: [ - { - name: "=", - type: "number", - links: [ - 86 - ], - slot_index: 0, - _data: 5 - } - ], - title: "Operation", - properties: { - A: 1, - B: 4, - OP: "+" - } + outputs: [], + title: "Log Event", + properties: {} } ], links: [ @@ -2885,7 +2817,7 @@ const defaultGraph: SerializedAppState = { } }, children: [], - parent: "16" + parent: "54" }, 12: { dragItem: { @@ -2900,7 +2832,7 @@ const defaultGraph: SerializedAppState = { } }, children: [], - parent: "16" + parent: "54" }, 13: { dragItem: { @@ -2915,7 +2847,7 @@ const defaultGraph: SerializedAppState = { } }, children: [], - parent: "16" + parent: "53" }, 14: { dragItem: { @@ -2930,7 +2862,7 @@ const defaultGraph: SerializedAppState = { } }, children: [], - parent: "16" + parent: "53" }, 15: { dragItem: { @@ -2945,7 +2877,7 @@ const defaultGraph: SerializedAppState = { } }, children: [], - parent: "16" + parent: "54" }, 16: { dragItem: { @@ -2960,11 +2892,8 @@ const defaultGraph: SerializedAppState = { }, children: [ "48", - "11", - "12", - "13", - "14", - "15" + "53", + "54" ], parent: "1" }, @@ -3207,7 +3136,7 @@ const defaultGraph: SerializedAppState = { id: "46", nodeId: 62, attrs: { - title: "trigger", + title: "Swap W/H", showTitle: true, direction: "horizontal", classes: "" @@ -3281,16 +3210,51 @@ const defaultGraph: SerializedAppState = { "51" ], parent: "1" + }, + 53: { + dragItem: { + type: "container", + id: "53", + attrs: { + title: "Sampler", + showTitle: true, + direction: "horizontal", + classes: "" + } + }, + children: [ + "13", + "14" + ], + parent: "16" + }, + 54: { + dragItem: { + type: "container", + id: "54", + attrs: { + title: "CFG/Steps", + showTitle: true, + direction: "horizontal", + classes: "" + } + }, + children: [ + "15", + "12", + "11" + ], + parent: "16" } }, - currentId: 53 + currentId: 55 }, canvas: { offset: [ - 0, - 0 + 1330.0317691440027, + -30.42057086300209 ], - scale: 1 + scale: 0.9090909090909101 } }