From cb9e8540a0f54875b9280644ef2559c5f95317a4 Mon Sep 17 00:00:00 2001 From: space-nuko <24979496+space-nuko@users.noreply.github.com> Date: Sat, 27 May 2023 20:37:22 -0500 Subject: [PATCH] Mask canvas for masked img2img --- public/workflows/img2imgMasked.json | 4466 +++++++++++++++++ src/lib/components/ComfyApp.ts | 1 + src/lib/components/ImageUpload.svelte | 55 +- src/lib/components/MaskCanvas.svelte | 635 +++ src/lib/nodes/ComfyPickImageNode.ts | 59 +- src/lib/nodes/widgets/ComfyImageUploadNode.ts | 12 +- src/lib/stores/layoutStates.ts | 13 + src/lib/utils.ts | 78 + src/lib/widgets/ImageUploadWidget.svelte | 331 +- 9 files changed, 5415 insertions(+), 235 deletions(-) create mode 100644 public/workflows/img2imgMasked.json create mode 100644 src/lib/components/MaskCanvas.svelte diff --git a/public/workflows/img2imgMasked.json b/public/workflows/img2imgMasked.json new file mode 100644 index 0000000..a8c4ed5 --- /dev/null +++ b/public/workflows/img2imgMasked.json @@ -0,0 +1,4466 @@ +{ + "comfyBoxWorkflow": true, + "createdBy": "ComfyBox", + "version": 1, + "commitHash": "1da8dc35ec2f9c61015fd4bd060d3b8fe675df63\n", + "workflow": { + "last_node_id": 0, + "last_link_id": 0, + "nodes": [ + { + "id": "4ffeedc6-5002-4136-9a00-4122b788d02b", + "type": "ui/image_upload", + "pos": [ + 412, + 210 + ], + "size": [ + 210, + 78 + ], + "flags": {}, + "order": 0, + "mode": 0, + "inputs": [ + { + "name": "store", + "type": -1, + "link": null, + "properties": {}, + "shape": 1 + } + ], + "outputs": [ + { + "name": "images", + "type": "COMFYBOX_IMAGES", + "links": [ + "4b48e8f9-7777-417c-bcff-4c5bf18aff66" + ], + "properties": {}, + "slot_index": 0 + }, + { + "name": "changed", + "type": -2, + "links": [], + "properties": {}, + "shape": 1 + } + ], + "title": "UI.ImageUpload", + "properties": { + "defaultValue": [], + "tags": [], + "maskCount": 1 + }, + "widgets_values": [], + "color": "#223", + "bgColor": "#335", + "comfyValue": [], + "shownOutputProperties": {}, + "saveUserState": false + }, + { + "id": "68c152ef-6774-435a-a5c5-3f728ee172fd", + "type": "ui/combo", + "pos": [ + 1335, + 358.33331298828125 + ], + "size": [ + 210, + 78 + ], + "flags": { + "collapsed": true + }, + "order": 1, + "mode": 0, + "inputs": [ + { + "name": "store", + "type": -1, + "link": null, + "properties": {}, + "shape": 1 + } + ], + "outputs": [ + { + "name": "value", + "type": "string", + "links": [ + "1b348801-caaa-4403-a5d0-601e996cc216" + ], + "properties": {} + }, + { + "name": "changed", + "type": -2, + "links": [], + "properties": {}, + "shape": 1 + } + ], + "title": "UI.Combo", + "properties": { + "tags": [], + "defaultValue": null, + "values": [], + "convertValueToLabelCode": "" + }, + "widgets_values": [], + "color": "#223", + "bgColor": "#335", + "comfyValue": null, + "shownOutputProperties": {}, + "saveUserState": false + }, + { + "id": "646a2487-2873-4d81-873f-d4819c3152e5", + "type": "LoadImageMask", + "pos": [ + 1465, + 314 + ], + "size": [ + 168, + 46 + ], + "flags": {}, + "order": 19, + "mode": 0, + "inputs": [ + { + "name": "image", + "type": "string", + "link": "5a47d229-4b97-493d-b56d-897b3a33d08b", + "properties": {}, + "config": {}, + "defaultWidgetNode": null, + "widgetNodeType": "ui/combo", + "serialize": true + }, + { + "name": "channel", + "type": "string", + "link": "1b348801-caaa-4403-a5d0-601e996cc216", + "properties": {}, + "config": {}, + "defaultWidgetNode": null, + "widgetNodeType": "ui/combo", + "serialize": true + } + ], + "outputs": [ + { + "name": "MASK", + "type": "MASK", + "links": [ + "75fb525e-e2b8-4c75-bedf-63b53717b3cd" + ], + "properties": {}, + "shape": 3, + "slot_index": 0 + } + ], + "title": "Load Image (as Mask)", + "properties": { + "tags": [] + }, + "color": "#432", + "bgColor": "#653", + "saveUserState": true + }, + { + "id": "c6c39c9a-6909-4fc1-aaf2-0bc125ac6dd2", + "type": "ui/number", + "pos": [ + 2120.233000000003, + 318.24931298828125 + ], + "size": [ + 210, + 158 + ], + "flags": { + "collapsed": true + }, + "order": 2, + "mode": 0, + "inputs": [ + { + "name": "store", + "type": -1, + "link": null, + "properties": {}, + "shape": 1 + } + ], + "outputs": [ + { + "name": "value", + "type": "number", + "links": [ + "ddbad630-d27b-43a0-bbd7-9a5619168c6a" + ], + "properties": {} + }, + { + "name": "changed", + "type": -2, + "links": [], + "properties": {}, + "shape": 1 + }, + { + "name": "@min", + "type": "number", + "links": [], + "properties": {} + }, + { + "name": "@max", + "type": "number", + "links": [], + "properties": {} + }, + { + "name": "@step", + "type": "number", + "links": [], + "properties": {} + }, + { + "name": "@precision", + "type": "number", + "links": [], + "properties": {} + } + ], + "title": "UI.Number", + "properties": { + "tags": [], + "defaultValue": 20, + "min": 1, + "max": 10000, + "step": 1, + "precision": 0 + }, + "widgets_values": [ + "20.000" + ], + "color": "#223", + "bgColor": "#335", + "comfyValue": 20, + "shownOutputProperties": { + "min": { + "type": "number", + "outputName": "@min" + }, + "max": { + "type": "number", + "outputName": "@max" + }, + "step": { + "type": "number", + "outputName": "@step" + }, + "precision": { + "type": "number", + "outputName": "@precision" + } + }, + "saveUserState": true + }, + { + "id": "0e1a7eac-27d3-42e5-9a8b-afbd937b0d02", + "type": "ui/number", + "pos": [ + 2120.233000000003, + 338.24931298828125 + ], + "size": [ + 210, + 158 + ], + "flags": { + "collapsed": true + }, + "order": 3, + "mode": 0, + "inputs": [ + { + "name": "store", + "type": -1, + "link": null, + "properties": {}, + "shape": 1 + } + ], + "outputs": [ + { + "name": "value", + "type": "number", + "links": [ + "6f32600d-8401-4635-b0e7-9b4528a62798" + ], + "properties": {} + }, + { + "name": "changed", + "type": -2, + "links": [], + "properties": {}, + "shape": 1 + }, + { + "name": "@min", + "type": "number", + "links": [], + "properties": {} + }, + { + "name": "@max", + "type": "number", + "links": [], + "properties": {} + }, + { + "name": "@step", + "type": "number", + "links": [], + "properties": {} + }, + { + "name": "@precision", + "type": "number", + "links": [], + "properties": {} + } + ], + "title": "UI.Number", + "properties": { + "tags": [], + "defaultValue": 8, + "min": 0, + "max": 100, + "step": 0.5, + "precision": 0 + }, + "widgets_values": [ + "8.000" + ], + "color": "#223", + "bgColor": "#335", + "comfyValue": 8, + "shownOutputProperties": { + "min": { + "type": "number", + "outputName": "@min" + }, + "max": { + "type": "number", + "outputName": "@max" + }, + "step": { + "type": "number", + "outputName": "@step" + }, + "precision": { + "type": "number", + "outputName": "@precision" + } + }, + "saveUserState": true + }, + { + "id": "869b9e12-e3ab-4657-a1a3-7cbc27f08986", + "type": "ui/combo", + "pos": [ + 2120.233000000003, + 358.24931298828125 + ], + "size": [ + 210, + 78 + ], + "flags": { + "collapsed": true + }, + "order": 4, + "mode": 0, + "inputs": [ + { + "name": "store", + "type": -1, + "link": null, + "properties": {}, + "shape": 1 + } + ], + "outputs": [ + { + "name": "value", + "type": "string", + "links": [ + "0769ad17-ef05-4763-a059-726c5f9d4e64" + ], + "properties": {} + }, + { + "name": "changed", + "type": -2, + "links": [], + "properties": {}, + "shape": 1 + } + ], + "title": "UI.Combo", + "properties": { + "tags": [], + "defaultValue": null, + "values": [], + "convertValueToLabelCode": "" + }, + "widgets_values": [], + "color": "#223", + "bgColor": "#335", + "comfyValue": null, + "shownOutputProperties": {}, + "saveUserState": false + }, + { + "id": "5955645b-ede2-46c7-805b-b7f4f17aeada", + "type": "ui/combo", + "pos": [ + 2120.233000000003, + 378.24931298828125 + ], + "size": [ + 210, + 78 + ], + "flags": { + "collapsed": true + }, + "order": 5, + "mode": 0, + "inputs": [ + { + "name": "store", + "type": -1, + "link": null, + "properties": {}, + "shape": 1 + } + ], + "outputs": [ + { + "name": "value", + "type": "string", + "links": [ + "a73abe86-8d1a-4bbd-a41b-bec286cb2d39" + ], + "properties": {} + }, + { + "name": "changed", + "type": -2, + "links": [], + "properties": {}, + "shape": 1 + } + ], + "title": "UI.Combo", + "properties": { + "tags": [], + "defaultValue": null, + "values": [], + "convertValueToLabelCode": "" + }, + "widgets_values": [], + "color": "#223", + "bgColor": "#335", + "comfyValue": null, + "shownOutputProperties": {}, + "saveUserState": false + }, + { + "id": "8563b0f7-b748-486d-911b-be3979e64f6c", + "type": "ui/number", + "pos": [ + 2120.233000000003, + 458.24931298828125 + ], + "size": [ + 210, + 158 + ], + "flags": { + "collapsed": true + }, + "order": 6, + "mode": 0, + "inputs": [ + { + "name": "store", + "type": -1, + "link": null, + "properties": {}, + "shape": 1 + } + ], + "outputs": [ + { + "name": "value", + "type": "number", + "links": [ + "0fb89474-9c3f-4a87-9274-38f195c7789e" + ], + "properties": {} + }, + { + "name": "changed", + "type": -2, + "links": [], + "properties": {}, + "shape": 1 + }, + { + "name": "@min", + "type": "number", + "links": [], + "properties": {} + }, + { + "name": "@max", + "type": "number", + "links": [], + "properties": {} + }, + { + "name": "@step", + "type": "number", + "links": [], + "properties": {} + }, + { + "name": "@precision", + "type": "number", + "links": [], + "properties": {} + } + ], + "title": "UI.Number", + "properties": { + "tags": [], + "defaultValue": 1, + "min": 0, + "max": 1, + "step": 0.01, + "precision": 0 + }, + "widgets_values": [ + "1.000" + ], + "color": "#223", + "bgColor": "#335", + "comfyValue": 1, + "shownOutputProperties": { + "min": { + "type": "number", + "outputName": "@min" + }, + "max": { + "type": "number", + "outputName": "@max" + }, + "step": { + "type": "number", + "outputName": "@step" + }, + "precision": { + "type": "number", + "outputName": "@precision" + } + }, + "saveUserState": true + }, + { + "id": "fd70bb52-01d0-4861-9570-d1d606ed923d", + "type": "RepeatLatentBatch", + "pos": [ + 1836.33715649414, + 289.2493129882812 + ], + "size": [ + 159.6, + 46 + ], + "flags": {}, + "order": 12, + "mode": 0, + "inputs": [ + { + "name": "samples", + "type": "LATENT", + "link": null, + "properties": {}, + "config": {} + }, + { + "name": "amount", + "type": "number", + "link": "881e1f37-318f-4d62-bc11-92e19bde7ad6", + "properties": {}, + "config": {}, + "defaultWidgetNode": null, + "widgetNodeType": "ui/number", + "serialize": true + } + ], + "outputs": [ + { + "name": "LATENT", + "type": "LATENT", + "links": [], + "properties": {}, + "shape": 3, + "slot_index": 0 + } + ], + "title": "Repeat Latent Batch", + "properties": { + "tags": [] + }, + "color": "#432", + "bgColor": "#653", + "saveUserState": true + }, + { + "id": "3ae7ecb1-8b72-4b80-9599-7ef855b0eb0f", + "type": "ui/number", + "pos": [ + 1696.2329999999993, + 241.91599999999994 + ], + "size": [ + 210, + 158 + ], + "flags": { + "collapsed": true + }, + "order": 7, + "mode": 0, + "inputs": [ + { + "name": "store", + "type": -1, + "link": null, + "properties": {}, + "shape": 1 + } + ], + "outputs": [ + { + "name": "value", + "type": "number", + "links": [ + "07daddb3-52c4-4fbb-9bd0-decc114c1ba4", + "881e1f37-318f-4d62-bc11-92e19bde7ad6" + ], + "properties": {}, + "slot_index": 0 + }, + { + "name": "changed", + "type": -2, + "links": [], + "properties": {}, + "shape": 1 + }, + { + "name": "@min", + "type": "number", + "links": [], + "properties": {} + }, + { + "name": "@max", + "type": "number", + "links": [], + "properties": {} + }, + { + "name": "@step", + "type": "number", + "links": [], + "properties": {} + }, + { + "name": "@precision", + "type": "number", + "links": [], + "properties": {} + } + ], + "title": "UI.Number", + "properties": { + "tags": [], + "defaultValue": 1, + "min": 1, + "max": 16, + "step": 1, + "precision": 1 + }, + "widgets_values": [ + "1.000" + ], + "color": "#223", + "bgColor": "#335", + "comfyValue": 1, + "shownOutputProperties": { + "min": { + "type": "number", + "outputName": "@min" + }, + "max": { + "type": "number", + "outputName": "@max" + }, + "step": { + "type": "number", + "outputName": "@step" + }, + "precision": { + "type": "number", + "outputName": "@precision" + } + }, + "saveUserState": true + }, + { + "id": "7e8ed93c-6292-4f17-9f5c-c64ca41b6ec0", + "type": "graph/subgraph", + "pos": [ + 1899.2329999999993, + 222.91599999999994 + ], + "size": [ + 200, + 30 + ], + "flags": { + "collapsed": false + }, + "order": 11, + "mode": 0, + "inputs": [ + { + "name": "batch_size", + "type": "number", + "link": "07daddb3-52c4-4fbb-9bd0-decc114c1ba4", + "properties": {}, + "slot_index": 0 + } + ], + "outputs": [ + { + "name": "seed", + "type": "number", + "links": [ + "b2a6d7f1-62bf-472f-82a3-75b1befe3788" + ], + "properties": {}, + "slot_index": 0 + } + ], + "title": "Seed Randomizer", + "properties": { + "enabled": true, + "tags": [] + }, + "color": "#2a363b", + "bgColor": "#3f5159", + "subgraph": { + "last_node_id": 0, + "last_link_id": 0, + "nodes": [ + { + "id": "927c2234-e442-4ed0-9e9c-0d2c612e4f73", + "type": "utils/value_control", + "pos": [ + 123.90625, + -214.16668701171875 + ], + "size": [ + 151.2, + 126 + ], + "flags": {}, + "order": 5, + "mode": 0, + "inputs": [ + { + "name": "value", + "type": "number", + "link": "96baf290-de79-442d-bd0b-c6fd13aaba95", + "properties": {} + }, + { + "name": "trigger", + "type": -1, + "link": "df2066d2-f343-48bf-b33b-f0b906294790", + "properties": {}, + "shape": 1 + }, + { + "name": "action", + "type": "string", + "link": "f53a4169-2c30-497b-b707-adc84b43536e", + "properties": {}, + "defaultWidgetNode": null, + "config": { + "defaultValue": "randomize", + "values": [ + "fixed", + "increment", + "decrement", + "randomize" + ] + }, + "slot_index": 2, + "widgetNodeType": "ui/combo" + }, + { + "name": "min", + "type": "number", + "link": "fd3715c0-348e-4af5-9343-120a5fff6d9c", + "properties": {} + }, + { + "name": "max", + "type": "number", + "link": "81fba9dd-0e06-4ba3-9d42-259417a2ebfe", + "properties": {} + }, + { + "name": "step", + "type": "number", + "link": "b3ed501d-c2f3-438c-9399-1fe88fd40468", + "properties": {} + } + ], + "outputs": [ + { + "name": "value", + "type": "*", + "links": [], + "properties": {} + }, + { + "name": "changed", + "type": -2, + "links": [ + "1656cec6-e30a-4ab7-a479-f9a82ea9b703" + ], + "properties": {}, + "shape": 1, + "slot_index": 1 + } + ], + "title": "Comfy.ValueControl", + "properties": { + "tags": [], + "value": 179023062263126, + "action": "randomize", + "min": 0, + "max": 18446744073709552000, + "step": 1, + "ignoreStepWhenRandom": false + }, + "saveUserState": true + }, + { + "id": "3bc4cbf3-8d35-43de-b383-b3cf0c3fa4cf", + "type": "ui/number", + "pos": [ + 12, + -7 + ], + "size": [ + 210, + 158 + ], + "flags": { + "collapsed": true + }, + "order": 4, + "mode": 0, + "inputs": [ + { + "name": "store", + "type": -1, + "link": "1656cec6-e30a-4ab7-a479-f9a82ea9b703", + "properties": {}, + "shape": 1 + } + ], + "outputs": [ + { + "name": "value", + "type": "number", + "links": [ + "a759623d-7f81-41a7-b83e-e0764d3e0c94", + "96baf290-de79-442d-bd0b-c6fd13aaba95" + ], + "properties": {}, + "slot_index": 0 + }, + { + "name": "changed", + "type": -2, + "links": [], + "properties": {}, + "shape": 1 + }, + { + "name": "@min", + "type": "number", + "links": [ + "fd3715c0-348e-4af5-9343-120a5fff6d9c" + ], + "properties": {}, + "slot_index": 2 + }, + { + "name": "@max", + "type": "number", + "links": [ + "81fba9dd-0e06-4ba3-9d42-259417a2ebfe" + ], + "properties": {}, + "slot_index": 3 + }, + { + "name": "@step", + "type": "number", + "links": [], + "properties": {} + }, + { + "name": "@precision", + "type": "number", + "links": [], + "properties": {} + } + ], + "title": "UI.Number", + "properties": { + "tags": [], + "defaultValue": 179023062263126, + "min": 0, + "max": 18446744073709552000, + "step": 1, + "precision": 0 + }, + "widgets_values": [ + "179023062263126.000" + ], + "color": "#223", + "bgColor": "#335", + "comfyValue": 179023062263126, + "shownOutputProperties": { + "min": { + "type": "number", + "outputName": "@min" + }, + "max": { + "type": "number", + "outputName": "@max" + }, + "step": { + "type": "number", + "outputName": "@step" + }, + "precision": { + "type": "number", + "outputName": "@precision" + } + }, + "saveUserState": true + }, + { + "id": "e5c139e7-e69d-4edb-ba95-f2a9eab30f0c", + "type": "ui/combo", + "pos": [ + -8, + -147 + ], + "size": [ + 210, + 78 + ], + "flags": { + "collapsed": true + }, + "order": 0, + "mode": 0, + "inputs": [ + { + "name": "store", + "type": -1, + "link": null, + "properties": {}, + "shape": 1 + } + ], + "outputs": [ + { + "name": "value", + "type": "string", + "links": [ + "f53a4169-2c30-497b-b707-adc84b43536e" + ], + "properties": {}, + "slot_index": 0 + }, + { + "name": "changed", + "type": -2, + "links": [], + "properties": {}, + "shape": 1 + } + ], + "title": "UI.Combo", + "properties": { + "tags": [], + "defaultValue": null, + "values": [], + "convertValueToLabelCode": "" + }, + "widgets_values": [], + "color": "#223", + "bgColor": "#335", + "comfyValue": null, + "shownOutputProperties": {}, + "saveUserState": false + }, + { + "id": "26db6040-c325-4ecc-86ac-4e25d4dffa39", + "type": "events/queue_events", + "pos": [ + -203, + -213 + ], + "size": [ + 178, + 66 + ], + "flags": { + "collapsed": false + }, + "order": 1, + "mode": 0, + "inputs": [], + "outputs": [ + { + "name": "beforeQueued", + "type": -2, + "links": [], + "properties": {}, + "shape": 1 + }, + { + "name": "afterQueued", + "type": -2, + "links": [ + "df2066d2-f343-48bf-b33b-f0b906294790" + ], + "properties": {}, + "shape": 1, + "slot_index": 1 + }, + { + "name": "onDefaultQueueAction", + "type": -2, + "links": [], + "properties": {}, + "shape": 1 + } + ], + "title": "Comfy.QueueEvents", + "properties": { + "tags": [] + }, + "saveUserState": true + }, + { + "id": "009c5aa6-8dfa-4a5a-8b89-587132359b95", + "type": "graph/output", + "pos": [ + 196, + -8 + ], + "size": [ + 210, + 62 + ], + "flags": { + "collapsed": true + }, + "order": 3, + "mode": 0, + "inputs": [ + { + "name": "", + "type": "number", + "link": "a759623d-7f81-41a7-b83e-e0764d3e0c94", + "properties": {}, + "shape": 0 + } + ], + "outputs": [], + "title": "Output", + "properties": { + "name": "seed", + "type": "number", + "subgraphID": "7e8ed93c-6292-4f17-9f5c-c64ca41b6ec0", + "tags": [] + } + }, + { + "id": "b8720438-fe61-4a8f-9da7-48aadeba139e", + "type": "graph/input", + "pos": [ + -74, + -86 + ], + "size": [ + 210, + 86 + ], + "flags": { + "collapsed": true + }, + "order": 2, + "mode": 0, + "inputs": [], + "outputs": [ + { + "name": "", + "type": "number", + "links": [ + "b3ed501d-c2f3-438c-9399-1fe88fd40468" + ], + "properties": {}, + "slot_index": 0, + "shape": 0 + } + ], + "title": "Input", + "properties": { + "name": "batch_size", + "type": "number", + "value": 0, + "subgraphID": "7e8ed93c-6292-4f17-9f5c-c64ca41b6ec0", + "tags": [] + } + } + ], + "links": [ + [ + "a759623d-7f81-41a7-b83e-e0764d3e0c94", + "3bc4cbf3-8d35-43de-b383-b3cf0c3fa4cf", + 0, + "009c5aa6-8dfa-4a5a-8b89-587132359b95", + 0, + "number" + ], + [ + "f53a4169-2c30-497b-b707-adc84b43536e", + "e5c139e7-e69d-4edb-ba95-f2a9eab30f0c", + 0, + "927c2234-e442-4ed0-9e9c-0d2c612e4f73", + 2, + "string" + ], + [ + "fd3715c0-348e-4af5-9343-120a5fff6d9c", + "3bc4cbf3-8d35-43de-b383-b3cf0c3fa4cf", + 2, + "927c2234-e442-4ed0-9e9c-0d2c612e4f73", + 3, + "number" + ], + [ + "81fba9dd-0e06-4ba3-9d42-259417a2ebfe", + "3bc4cbf3-8d35-43de-b383-b3cf0c3fa4cf", + 3, + "927c2234-e442-4ed0-9e9c-0d2c612e4f73", + 4, + "number" + ], + [ + "96baf290-de79-442d-bd0b-c6fd13aaba95", + "3bc4cbf3-8d35-43de-b383-b3cf0c3fa4cf", + 0, + "927c2234-e442-4ed0-9e9c-0d2c612e4f73", + 0, + "number" + ], + [ + "1656cec6-e30a-4ab7-a479-f9a82ea9b703", + "927c2234-e442-4ed0-9e9c-0d2c612e4f73", + 1, + "3bc4cbf3-8d35-43de-b383-b3cf0c3fa4cf", + 0, + -1 + ], + [ + "df2066d2-f343-48bf-b33b-f0b906294790", + "26db6040-c325-4ecc-86ac-4e25d4dffa39", + 1, + "927c2234-e442-4ed0-9e9c-0d2c612e4f73", + 1, + -1 + ], + [ + "b3ed501d-c2f3-438c-9399-1fe88fd40468", + "b8720438-fe61-4a8f-9da7-48aadeba139e", + 0, + "927c2234-e442-4ed0-9e9c-0d2c612e4f73", + 5, + "number" + ] + ], + "groups": [], + "config": {}, + "extra": {}, + "version": 10 + } + }, + { + "id": "fa6296b1-ff5c-4789-b379-2e5fbad67f0f", + "type": "graph/subgraph", + "pos": [ + 1987.2330000000013, + 92.91600000000007 + ], + "size": [ + 200, + 50 + ], + "flags": { + "collapsed": false + }, + "order": 13, + "mode": 0, + "inputs": [ + { + "name": "clip", + "type": "CLIP", + "link": "d2de2711-f0e6-4cce-9cc1-85a8a70d1b71", + "properties": {}, + "slot_index": 0 + } + ], + "outputs": [ + { + "name": "positive", + "type": "CONDITIONING", + "links": [ + "539da2d1-af79-4240-9c52-8ab52c007ea0" + ], + "properties": {}, + "slot_index": 0 + }, + { + "name": "negative", + "type": "CONDITIONING", + "links": [ + "107278fe-75d9-4b40-b2bd-ea5ece56891d" + ], + "properties": {}, + "slot_index": 1 + } + ], + "title": "Positive/Negative", + "properties": { + "enabled": true, + "tags": [] + }, + "color": "#2a363b", + "bgColor": "#3f5159", + "subgraph": { + "last_node_id": 0, + "last_link_id": 0, + "nodes": [ + { + "id": "6d7e8dde-91af-4b57-8d78-36c516f65510", + "type": "CLIPTextEncode", + "pos": [ + 133, + -37 + ], + "size": [ + 210, + 46 + ], + "flags": { + "collapsed": false + }, + "order": 3, + "mode": 0, + "inputs": [ + { + "name": "text", + "type": "string", + "link": "e746de23-e735-494b-89fc-49893b81fd28", + "properties": {}, + "config": {}, + "defaultWidgetNode": null, + "widgetNodeType": "ui/text", + "serialize": true, + "slot_index": 0 + }, + { + "name": "clip", + "type": "CLIP", + "link": "4988b0f1-a71c-4af0-b2d5-2f63f8887b7b", + "properties": {}, + "slot_index": 1, + "config": {} + } + ], + "outputs": [ + { + "name": "CONDITIONING", + "type": "CONDITIONING", + "links": [ + "691f7e71-5981-4b18-bb22-3a09a972f8cb" + ], + "properties": {}, + "shape": 3, + "slot_index": 0 + } + ], + "title": "CLIP Text Encode (Prompt)", + "properties": { + "tags": [] + }, + "color": "#432", + "bgColor": "#653", + "saveUserState": true + }, + { + "id": "3011d2c8-7234-4d07-9956-4e3246ada737", + "type": "CLIPTextEncode", + "pos": [ + 131, + 49 + ], + "size": [ + 210, + 46 + ], + "flags": { + "collapsed": false + }, + "order": 4, + "mode": 0, + "inputs": [ + { + "name": "text", + "type": "string", + "link": "f8dc398f-6df2-418d-ac5c-663da1104f7d", + "properties": {}, + "config": {}, + "defaultWidgetNode": null, + "widgetNodeType": "ui/text", + "serialize": true, + "slot_index": 0 + }, + { + "name": "clip", + "type": "CLIP", + "link": "3cc7ab4a-fc02-4d34-89e3-84ae43c6c66e", + "properties": {}, + "config": {} + } + ], + "outputs": [ + { + "name": "CONDITIONING", + "type": "CONDITIONING", + "links": [ + "b87c4dc0-2658-41f7-b55e-17519cb3d335" + ], + "properties": {}, + "shape": 3, + "slot_index": 0 + } + ], + "title": "CLIP Text Encode (Prompt)", + "properties": { + "tags": [] + }, + "color": "#432", + "bgColor": "#653", + "saveUserState": true + }, + { + "id": "3fcd6ce4-5af4-484f-ac5e-69f59ff72586", + "type": "graph/output", + "pos": [ + 383, + 75 + ], + "size": [ + 210, + 62 + ], + "flags": { + "collapsed": true + }, + "order": 6, + "mode": 0, + "inputs": [ + { + "name": "", + "type": "CONDITIONING", + "link": "b87c4dc0-2658-41f7-b55e-17519cb3d335", + "properties": {}, + "shape": 0 + } + ], + "outputs": [], + "title": "Output", + "properties": { + "name": "negative", + "type": "CONDITIONING", + "subgraphID": "fa6296b1-ff5c-4789-b379-2e5fbad67f0f", + "tags": [] + } + }, + { + "id": "5ff58ea1-73e2-41bf-aeef-c44497177d59", + "type": "graph/output", + "pos": [ + 395, + -12 + ], + "size": [ + 210, + 62 + ], + "flags": { + "collapsed": true + }, + "order": 5, + "mode": 0, + "inputs": [ + { + "name": "", + "type": "CONDITIONING", + "link": "691f7e71-5981-4b18-bb22-3a09a972f8cb", + "properties": {}, + "shape": 0 + } + ], + "outputs": [], + "title": "Output", + "properties": { + "name": "positive", + "type": "CONDITIONING", + "subgraphID": "fa6296b1-ff5c-4789-b379-2e5fbad67f0f", + "tags": [] + } + }, + { + "id": "2db73403-fc0a-4fda-8ef3-c385216ad7ab", + "type": "ui/text", + "pos": [ + 27, + -12 + ], + "size": [ + 210, + 78 + ], + "flags": { + "collapsed": true + }, + "order": 0, + "mode": 0, + "inputs": [ + { + "name": "value", + "type": "string", + "link": null, + "properties": {} + }, + { + "name": "store", + "type": -1, + "link": null, + "properties": {}, + "shape": 1 + } + ], + "outputs": [ + { + "name": "value", + "type": "string", + "links": [ + "e746de23-e735-494b-89fc-49893b81fd28" + ], + "properties": {}, + "slot_index": 0 + }, + { + "name": "changed", + "type": -2, + "links": [], + "properties": {}, + "shape": 1 + } + ], + "title": "UI.Text", + "properties": { + "tags": [], + "defaultValue": "(solid red jacket, red clothing:1.4)", + "multiline": true, + "lines": 5, + "maxLines": 5 + }, + "widgets_values": [ + "(solid red jacket, red clothing:1.4)" + ], + "color": "#223", + "bgColor": "#335", + "comfyValue": "(solid red jacket, red clothing:1.4)", + "shownOutputProperties": {}, + "saveUserState": true + }, + { + "id": "684041a6-f4ca-4419-9fe0-b4dd1f0d1b04", + "type": "graph/input", + "pos": [ + -301, + 41 + ], + "size": [ + 210, + 86 + ], + "flags": { + "collapsed": true + }, + "order": 1, + "mode": 0, + "inputs": [], + "outputs": [ + { + "name": "", + "type": "CLIP", + "links": [ + "4988b0f1-a71c-4af0-b2d5-2f63f8887b7b", + "3cc7ab4a-fc02-4d34-89e3-84ae43c6c66e" + ], + "properties": {}, + "shape": 0 + } + ], + "title": "Input", + "properties": { + "name": "clip", + "type": "CLIP", + "value": null, + "subgraphID": "fa6296b1-ff5c-4789-b379-2e5fbad67f0f", + "tags": [] + } + }, + { + "id": "c63fcd7b-2e95-4c46-9247-73a6107781dd", + "type": "ui/text", + "pos": [ + 27, + 73 + ], + "size": [ + 210, + 78 + ], + "flags": { + "collapsed": true + }, + "order": 2, + "mode": 0, + "inputs": [ + { + "name": "value", + "type": "string", + "link": null, + "properties": {} + }, + { + "name": "store", + "type": -1, + "link": null, + "properties": {}, + "shape": 1 + } + ], + "outputs": [ + { + "name": "value", + "type": "string", + "links": [ + "f8dc398f-6df2-418d-ac5c-663da1104f7d" + ], + "properties": {} + }, + { + "name": "changed", + "type": -2, + "links": [], + "properties": {}, + "shape": 1 + } + ], + "title": "UI.Text", + "properties": { + "tags": [], + "defaultValue": "lowres, bad anatomy, bad hands, text, error, missing fingers, extra digit, fewer digits, worst quality, low quality, normal quality, wide shot, jpeg artifacts, signature, watermark, username, blurry, deformed, disfigured, poorly drawn face, mutation, mutated, extra limb, poorly drawn hands, missing limb, floating limbs, disconnected limbs, malformed hands, out of focus, long neck, long body, fuzzy, abstract", + "multiline": true, + "lines": 5, + "maxLines": 5 + }, + "widgets_values": [ + "lowres, bad anatomy, bad hands, text, error, missing fingers, extra digit, fewer digits, worst quality, low quality, normal quality, wide shot, jpeg artifacts, signature, watermark, username, blurry, deformed, disfigured, poorly drawn face, mutation, mutated, extra limb, poorly drawn hands, missing limb, floating limbs, disconnected limbs, malformed hands, out of focus, long neck, long body, fuzzy, abstract" + ], + "color": "#223", + "bgColor": "#335", + "comfyValue": "lowres, bad anatomy, bad hands, text, error, missing fingers, extra digit, fewer digits, worst quality, low quality, normal quality, wide shot, jpeg artifacts, signature, watermark, username, blurry, deformed, disfigured, poorly drawn face, mutation, mutated, extra limb, poorly drawn hands, missing limb, floating limbs, disconnected limbs, malformed hands, out of focus, long neck, long body, fuzzy, abstract", + "shownOutputProperties": {}, + "saveUserState": true + } + ], + "links": [ + [ + "4988b0f1-a71c-4af0-b2d5-2f63f8887b7b", + "684041a6-f4ca-4419-9fe0-b4dd1f0d1b04", + 0, + "6d7e8dde-91af-4b57-8d78-36c516f65510", + 1, + "CLIP" + ], + [ + "3cc7ab4a-fc02-4d34-89e3-84ae43c6c66e", + "684041a6-f4ca-4419-9fe0-b4dd1f0d1b04", + 0, + "3011d2c8-7234-4d07-9956-4e3246ada737", + 1, + "CLIP" + ], + [ + "691f7e71-5981-4b18-bb22-3a09a972f8cb", + "6d7e8dde-91af-4b57-8d78-36c516f65510", + 0, + "5ff58ea1-73e2-41bf-aeef-c44497177d59", + 0, + "CONDITIONING" + ], + [ + "b87c4dc0-2658-41f7-b55e-17519cb3d335", + "3011d2c8-7234-4d07-9956-4e3246ada737", + 0, + "3fcd6ce4-5af4-484f-ac5e-69f59ff72586", + 0, + "CONDITIONING" + ], + [ + "e746de23-e735-494b-89fc-49893b81fd28", + "2db73403-fc0a-4fda-8ef3-c385216ad7ab", + 0, + "6d7e8dde-91af-4b57-8d78-36c516f65510", + 0, + "string" + ], + [ + "f8dc398f-6df2-418d-ac5c-663da1104f7d", + "c63fcd7b-2e95-4c46-9247-73a6107781dd", + 0, + "3011d2c8-7234-4d07-9956-4e3246ada737", + 0, + "string" + ] + ], + "groups": [], + "config": {}, + "extra": {}, + "version": 10 + } + }, + { + "id": "567fb9e4-5007-4bad-9265-9e405bfb2216", + "type": "KSampler", + "pos": [ + 2250.233000000003, + 253.91599999999988 + ], + "size": [ + 161.2, + 206 + ], + "flags": {}, + "order": 22, + "mode": 0, + "inputs": [ + { + "name": "model", + "type": "MODEL", + "link": "96cb3752-7a70-4b23-ada2-1cd18062d10b", + "properties": {}, + "config": {} + }, + { + "name": "seed", + "type": "number", + "link": "b2a6d7f1-62bf-472f-82a3-75b1befe3788", + "properties": {}, + "config": {}, + "defaultWidgetNode": null, + "widgetNodeType": "ui/number", + "serialize": true + }, + { + "name": "steps", + "type": "number", + "link": "ddbad630-d27b-43a0-bbd7-9a5619168c6a", + "properties": {}, + "config": {}, + "defaultWidgetNode": null, + "widgetNodeType": "ui/number", + "serialize": true + }, + { + "name": "cfg", + "type": "number", + "link": "6f32600d-8401-4635-b0e7-9b4528a62798", + "properties": {}, + "config": {}, + "defaultWidgetNode": null, + "widgetNodeType": "ui/number", + "serialize": true + }, + { + "name": "sampler_name", + "type": "string", + "link": "0769ad17-ef05-4763-a059-726c5f9d4e64", + "properties": {}, + "config": {}, + "defaultWidgetNode": null, + "widgetNodeType": "ui/combo", + "serialize": true + }, + { + "name": "scheduler", + "type": "string", + "link": "a73abe86-8d1a-4bbd-a41b-bec286cb2d39", + "properties": {}, + "config": {}, + "defaultWidgetNode": null, + "widgetNodeType": "ui/combo", + "serialize": true + }, + { + "name": "positive", + "type": "CONDITIONING", + "link": "539da2d1-af79-4240-9c52-8ab52c007ea0", + "properties": {}, + "config": {} + }, + { + "name": "negative", + "type": "CONDITIONING", + "link": "107278fe-75d9-4b40-b2bd-ea5ece56891d", + "properties": {}, + "config": {} + }, + { + "name": "latent_image", + "type": "LATENT", + "link": "ced427c7-3b57-4900-8563-16eaf82b2c2f", + "properties": {}, + "config": {} + }, + { + "name": "denoise", + "type": "number", + "link": "0fb89474-9c3f-4a87-9274-38f195c7789e", + "properties": {}, + "config": {}, + "defaultWidgetNode": null, + "widgetNodeType": "ui/number", + "serialize": true + } + ], + "outputs": [ + { + "name": "LATENT", + "type": "LATENT", + "links": [ + "4af51cfd-4adb-46f4-bc35-f0814a59b8bc" + ], + "properties": {}, + "shape": 3, + "slot_index": 0 + } + ], + "title": "KSampler", + "properties": { + "tags": [] + }, + "color": "#432", + "bgColor": "#653", + "saveUserState": true + }, + { + "id": "b58210a1-5a89-4a13-bb05-6409a1748278", + "type": "VAEDecode", + "pos": [ + 2534.233000000003, + 246.91599999999994 + ], + "size": [ + 140, + 46 + ], + "flags": {}, + "order": 23, + "mode": 0, + "inputs": [ + { + "name": "samples", + "type": "LATENT", + "link": "4af51cfd-4adb-46f4-bc35-f0814a59b8bc", + "properties": {}, + "config": {} + }, + { + "name": "vae", + "type": "VAE", + "link": "d60b6342-e39a-4eda-b60d-7c47a624f3a7", + "properties": {}, + "config": {} + } + ], + "outputs": [ + { + "name": "IMAGE", + "type": "IMAGE", + "links": [ + "50d36f9c-e68a-49d7-a22e-b4d08d0f19d3" + ], + "properties": {}, + "shape": 3, + "slot_index": 0 + } + ], + "title": "VAE Decode", + "properties": { + "tags": [] + }, + "color": "#432", + "bgColor": "#653", + "saveUserState": true + }, + { + "id": "7e155083-1731-4942-aead-197dffe07804", + "type": "ui/text", + "pos": [ + 2706.3371564941435, + 279.24931298828113 + ], + "size": [ + 210, + 78 + ], + "flags": { + "collapsed": true + }, + "order": 8, + "mode": 0, + "inputs": [ + { + "name": "value", + "type": "string", + "link": null, + "properties": {} + }, + { + "name": "store", + "type": -1, + "link": null, + "properties": {}, + "shape": 1 + } + ], + "outputs": [ + { + "name": "value", + "type": "string", + "links": [ + "6a9c9913-ebdf-4841-b03a-05a856b88731" + ], + "properties": {} + }, + { + "name": "changed", + "type": -2, + "links": [], + "properties": {}, + "shape": 1 + } + ], + "title": "UI.Text", + "properties": { + "tags": [], + "defaultValue": "ComfyUI", + "multiline": false, + "lines": 5, + "maxLines": 5 + }, + "widgets_values": [ + "ComfyUI" + ], + "color": "#223", + "bgColor": "#335", + "comfyValue": "ComfyUI", + "shownOutputProperties": {}, + "saveUserState": true + }, + { + "id": "7f21bd8f-06d9-4a1a-bb18-cc7aa6edc5bc", + "type": "SaveImage", + "pos": [ + 2836.233000000003, + 234.91599999999994 + ], + "size": [ + 186.4, + 46 + ], + "flags": {}, + "order": 24, + "mode": 0, + "inputs": [ + { + "name": "images", + "type": "IMAGE", + "link": "50d36f9c-e68a-49d7-a22e-b4d08d0f19d3", + "properties": {}, + "config": {} + }, + { + "name": "filename_prefix", + "type": "string", + "link": "6a9c9913-ebdf-4841-b03a-05a856b88731", + "properties": {}, + "config": {}, + "defaultWidgetNode": null, + "widgetNodeType": "ui/text", + "serialize": true + } + ], + "outputs": [ + { + "name": "OUTPUT", + "type": -2, + "links": [ + "0c33a3f7-f274-480d-b78f-850bb946074b" + ], + "properties": {}, + "color_off": "rebeccapurple", + "color_on": "rebeccapurple", + "shape": 1 + } + ], + "title": "Save Image", + "properties": { + "tags": [] + }, + "color": "#432", + "bgColor": "#653", + "saveUserState": true + }, + { + "id": "917148f0-7de9-4cf2-a051-066f84f442cb", + "type": "ui/gallery", + "pos": [ + 3074.233000000003, + 213.91599999999994 + ], + "size": [ + 210, + 126 + ], + "flags": {}, + "order": 25, + "mode": 0, + "inputs": [ + { + "name": "images", + "type": "OUTPUT", + "link": null, + "properties": {} + }, + { + "name": "store", + "type": -1, + "link": "0c33a3f7-f274-480d-b78f-850bb946074b", + "properties": {}, + "color_off": "rebeccapurple", + "color_on": "rebeccapurple", + "shape": 1, + "slot_index": 1 + } + ], + "outputs": [ + { + "name": "images", + "type": "COMFYBOX_IMAGES", + "links": [], + "properties": {} + }, + { + "name": "selected_index", + "type": "number", + "links": [], + "properties": {} + } + ], + "title": "UI.Gallery", + "properties": { + "tags": [], + "defaultValue": [], + "index": 0, + "updateMode": "replace", + "autoSelectOnUpdate": true + }, + "widgets_values": [], + "color": "#223", + "bgColor": "#335", + "comfyValue": [], + "shownOutputProperties": {}, + "saveUserState": false + }, + { + "id": "9a859825-7f35-4309-b8a2-c331ff05322d", + "type": "InvertMask", + "pos": [ + 1472, + 393 + ], + "size": [ + 140, + 26 + ], + "flags": {}, + "order": 20, + "mode": 0, + "inputs": [ + { + "name": "mask", + "type": "MASK", + "link": "75fb525e-e2b8-4c75-bedf-63b53717b3cd", + "properties": {}, + "slot_index": 0, + "config": {} + } + ], + "outputs": [ + { + "name": "MASK", + "type": "MASK", + "links": [ + "b71474cc-9cdb-40a6-9f1c-356beb2f704c" + ], + "properties": {}, + "shape": 3, + "slot_index": 0 + } + ], + "title": "InvertMask", + "properties": { + "tags": [] + }, + "color": "#432", + "bgColor": "#653", + "saveUserState": true + }, + { + "id": "72487c07-5276-46d7-9290-3c729fda0cc0", + "type": "LoadImage", + "pos": [ + 1233, + 203 + ], + "size": [ + 140, + 46 + ], + "flags": {}, + "order": 15, + "mode": 0, + "inputs": [ + { + "name": "image", + "type": "string", + "link": "a2dfa5b7-8f14-4871-b36b-59872c13f23b", + "properties": {}, + "config": {}, + "defaultWidgetNode": null, + "widgetNodeType": "ui/combo", + "serialize": true, + "slot_index": 0 + } + ], + "outputs": [ + { + "name": "IMAGE", + "type": "IMAGE", + "links": [ + "37206fef-d833-42b8-95f7-e47952d1f564" + ], + "properties": {}, + "shape": 3, + "slot_index": 0 + }, + { + "name": "MASK", + "type": "MASK", + "links": [], + "properties": {}, + "shape": 3 + } + ], + "title": "Load Image", + "properties": { + "tags": [] + }, + "color": "#432", + "bgColor": "#653", + "saveUserState": true + }, + { + "id": "871b78ae-2a13-468e-9acb-39f58fcdf6dd", + "type": "graph/subgraph", + "pos": [ + 1682, + 57 + ], + "size": [ + 200, + 70 + ], + "flags": {}, + "order": 9, + "mode": 0, + "inputs": [], + "outputs": [ + { + "name": "MODEL", + "type": "MODEL", + "links": [ + "96cb3752-7a70-4b23-ada2-1cd18062d10b" + ], + "properties": {}, + "slot_index": 0 + }, + { + "name": "CLIP", + "type": "CLIP", + "links": [ + "d2de2711-f0e6-4cce-9cc1-85a8a70d1b71" + ], + "properties": {}, + "slot_index": 1 + }, + { + "name": "VAE", + "type": "VAE", + "links": [ + "d60b6342-e39a-4eda-b60d-7c47a624f3a7", + "267dd718-3c77-41e7-a19b-88257649aa2b" + ], + "properties": {}, + "slot_index": 2 + } + ], + "title": "Model Loader", + "properties": { + "enabled": true, + "tags": [] + }, + "color": "#2a363b", + "bgColor": "#3f5159", + "subgraph": { + "last_node_id": 0, + "last_link_id": 0, + "nodes": [ + { + "id": "d0edca44-d673-4208-adea-88199654dbf7", + "type": "ui/combo", + "pos": [ + 0, + 24 + ], + "size": [ + 210, + 78 + ], + "flags": { + "collapsed": true + }, + "order": 0, + "mode": 0, + "inputs": [ + { + "name": "store", + "type": -1, + "link": null, + "properties": {}, + "shape": 1 + } + ], + "outputs": [ + { + "name": "value", + "type": "string", + "links": [ + "eba40f6c-42f1-4afb-9e2b-2a73a12c957e" + ], + "properties": {} + }, + { + "name": "changed", + "type": -2, + "links": [], + "properties": {}, + "shape": 1 + } + ], + "title": "UI.Combo", + "properties": { + "tags": [], + "defaultValue": null, + "values": [], + "convertValueToLabelCode": "" + }, + "widgets_values": [], + "color": "#223", + "bgColor": "#335", + "comfyValue": null, + "shownOutputProperties": {}, + "saveUserState": false + }, + { + "id": "9efe4b0d-ca73-4fd6-9adc-3c92d1bc8914", + "type": "graph/output", + "pos": [ + 739.19, + -31 + ], + "size": [ + 210, + 62 + ], + "flags": {}, + "order": 6, + "mode": 0, + "inputs": [ + { + "name": "", + "type": "MODEL", + "link": "1cc5382e-0c0f-455a-86da-fa230307c30d", + "properties": {}, + "shape": 0 + } + ], + "outputs": [], + "title": "Output", + "properties": { + "name": "MODEL", + "type": "MODEL", + "subgraphID": "871b78ae-2a13-468e-9acb-39f58fcdf6dd", + "tags": [] + } + }, + { + "id": "3b395e63-2776-40d9-8949-ed0bc539ecce", + "type": "graph/output", + "pos": [ + 739.19, + 51 + ], + "size": [ + 210, + 62 + ], + "flags": {}, + "order": 7, + "mode": 0, + "inputs": [ + { + "name": "", + "type": "CLIP", + "link": "3cd34eea-961b-4758-90a7-4e335c822638", + "properties": {}, + "shape": 0 + } + ], + "outputs": [], + "title": "Output", + "properties": { + "name": "CLIP", + "type": "CLIP", + "subgraphID": "871b78ae-2a13-468e-9acb-39f58fcdf6dd", + "tags": [] + } + }, + { + "id": "f80d4f12-5082-4534-b5be-0bcd92a6ccfa", + "type": "graph/output", + "pos": [ + 740, + 138 + ], + "size": [ + 210, + 62 + ], + "flags": {}, + "order": 10, + "mode": 0, + "inputs": [ + { + "name": "", + "type": "VAE", + "link": "3834fce2-d88b-44e7-92c5-2b703745c5e3", + "properties": {}, + "shape": 0 + } + ], + "outputs": [], + "title": "Output", + "properties": { + "name": "VAE", + "type": "VAE", + "subgraphID": "871b78ae-2a13-468e-9acb-39f58fcdf6dd", + "tags": [] + } + }, + { + "id": "91cba5df-6058-4e67-bdde-0e2b1dcad616", + "type": "ui/combo", + "pos": [ + 4, + -47 + ], + "size": [ + 210, + 78 + ], + "flags": { + "collapsed": true + }, + "order": 1, + "mode": 0, + "inputs": [ + { + "name": "store", + "type": -1, + "link": null, + "properties": {}, + "shape": 1 + } + ], + "outputs": [ + { + "name": "value", + "type": "string", + "links": [ + "193a640c-f946-4352-9787-c8285808bb5b" + ], + "properties": {} + }, + { + "name": "changed", + "type": -2, + "links": [], + "properties": {}, + "shape": 1 + } + ], + "title": "UI.Combo", + "properties": { + "tags": [ + "useInternalVae" + ], + "defaultValue": null, + "values": [], + "convertValueToLabelCode": "" + }, + "widgets_values": [], + "color": "#223", + "bgColor": "#335", + "comfyValue": null, + "shownOutputProperties": {}, + "saveUserState": false + }, + { + "id": "9734a060-1951-4892-86d7-300c6047202e", + "type": "ui/checkbox", + "pos": [ + -301, + 122 + ], + "size": [ + 210, + 78 + ], + "flags": { + "collapsed": false + }, + "order": 2, + "mode": 0, + "inputs": [ + { + "name": "store", + "type": -1, + "link": null, + "properties": {}, + "shape": 1 + } + ], + "outputs": [ + { + "name": "value", + "type": "boolean", + "links": [ + "3685877f-a647-4870-b1ae-0cd8420c1303" + ], + "properties": {} + }, + { + "name": "changed", + "type": -2, + "links": [ + "3bd29d74-65a1-4c7d-b0aa-fadf1ed339e8" + ], + "properties": {}, + "shape": 1, + "slot_index": 1 + } + ], + "title": "UI.Checkbox", + "properties": { + "tags": [], + "defaultValue": false + }, + "widgets_values": [ + "false" + ], + "color": "#223", + "bgColor": "#335", + "comfyValue": false, + "shownOutputProperties": {}, + "saveUserState": true + }, + { + "id": "0f445096-c876-4cd0-bff1-296836dad959", + "type": "actions/set_node_mode", + "pos": [ + 58, + 122 + ], + "size": [ + 210, + 102 + ], + "flags": {}, + "order": 9, + "mode": 0, + "inputs": [ + { + "name": "enabled", + "type": "boolean", + "link": "6bddf9cf-53c1-4b02-b332-90794832d96f", + "properties": {}, + "slot_index": 0 + }, + { + "name": "set", + "type": -1, + "link": "3bd29d74-65a1-4c7d-b0aa-fadf1ed339e8", + "properties": {}, + "shape": 1 + } + ], + "outputs": [], + "title": "Comfy.SetNodeModeAction", + "properties": { + "targetTags": "useInternalVae", + "enable": false, + "tags": [] + }, + "saveUserState": true + }, + { + "id": "41cd5c99-b761-4c3f-accb-8bffdfc40763", + "type": "logic/NOT", + "pos": [ + -52, + 144 + ], + "size": [ + 140, + 26 + ], + "flags": { + "collapsed": true + }, + "order": 5, + "mode": 0, + "inputs": [ + { + "name": "in", + "type": "boolean", + "link": "3685877f-a647-4870-b1ae-0cd8420c1303", + "properties": {} + } + ], + "outputs": [ + { + "name": "out", + "type": "boolean", + "links": [ + "6bddf9cf-53c1-4b02-b332-90794832d96f" + ], + "properties": {}, + "slot_index": 0 + } + ], + "title": "NOT", + "properties": { + "tags": [] + } + }, + { + "id": "f561d4ae-9198-499f-8247-8523579582e8", + "type": "utils/pick_first", + "pos": [ + 322, + -6 + ], + "size": [ + 210, + 122 + ], + "flags": {}, + "order": 8, + "mode": 0, + "inputs": [ + { + "name": "A", + "type": "*", + "link": "4a675efd-5b37-46a8-be21-e142d90f3077", + "properties": {}, + "slot_index": 0 + }, + { + "name": "B", + "type": "*", + "link": "99059959-431f-4ef0-afce-77de4aba1e03", + "properties": {} + }, + { + "name": "C", + "type": "*", + "link": null, + "properties": {} + } + ], + "outputs": [ + { + "name": "", + "type": "VAE", + "links": [ + "3834fce2-d88b-44e7-92c5-2b703745c5e3" + ], + "properties": {}, + "slot_index": 0 + } + ], + "title": "Comfy.PickFirst", + "properties": { + "tags": [], + "mode": "dataNonNull" + }, + "color": "#232", + "bgColor": "#353", + "saveUserState": true + }, + { + "id": "99a8e340-c306-4dee-94a2-8913f4622227", + "type": "VAELoader", + "pos": [ + 134, + -72 + ], + "size": [ + 140, + 26 + ], + "flags": {}, + "order": 4, + "mode": 0, + "inputs": [ + { + "name": "vae_name", + "type": "string", + "link": "193a640c-f946-4352-9787-c8285808bb5b", + "properties": {}, + "config": {}, + "defaultWidgetNode": null, + "widgetNodeType": "ui/combo", + "serialize": true + } + ], + "outputs": [ + { + "name": "VAE", + "type": "VAE", + "links": [ + "4a675efd-5b37-46a8-be21-e142d90f3077" + ], + "properties": {}, + "shape": 3, + "slot_index": 0 + } + ], + "title": "Load VAE", + "properties": { + "tags": [ + "useInternalVae" + ] + }, + "color": "#432", + "bgColor": "#653", + "saveUserState": true + }, + { + "id": "e4107934-5b11-416c-af50-fc17ff6d49ff", + "type": "CheckpointLoaderSimple", + "pos": [ + 130, + 0 + ], + "size": [ + 140, + 66 + ], + "flags": {}, + "order": 3, + "mode": 0, + "inputs": [ + { + "name": "ckpt_name", + "type": "string", + "link": "eba40f6c-42f1-4afb-9e2b-2a73a12c957e", + "properties": {}, + "config": {}, + "defaultWidgetNode": null, + "widgetNodeType": "ui/combo", + "serialize": true + } + ], + "outputs": [ + { + "name": "MODEL", + "type": "MODEL", + "links": [ + "1cc5382e-0c0f-455a-86da-fa230307c30d" + ], + "properties": {}, + "shape": 3, + "slot_index": 0 + }, + { + "name": "CLIP", + "type": "CLIP", + "links": [ + "3cd34eea-961b-4758-90a7-4e335c822638" + ], + "properties": {}, + "shape": 3, + "slot_index": 1 + }, + { + "name": "VAE", + "type": "VAE", + "links": [ + "99059959-431f-4ef0-afce-77de4aba1e03" + ], + "properties": {}, + "shape": 3, + "slot_index": 2 + } + ], + "title": "Load Checkpoint", + "properties": { + "tags": [] + }, + "color": "#432", + "bgColor": "#653", + "saveUserState": true + } + ], + "links": [ + [ + "1cc5382e-0c0f-455a-86da-fa230307c30d", + "e4107934-5b11-416c-af50-fc17ff6d49ff", + 0, + "9efe4b0d-ca73-4fd6-9adc-3c92d1bc8914", + 0, + "MODEL" + ], + [ + "eba40f6c-42f1-4afb-9e2b-2a73a12c957e", + "d0edca44-d673-4208-adea-88199654dbf7", + 0, + "e4107934-5b11-416c-af50-fc17ff6d49ff", + 0, + "string" + ], + [ + "193a640c-f946-4352-9787-c8285808bb5b", + "91cba5df-6058-4e67-bdde-0e2b1dcad616", + 0, + "99a8e340-c306-4dee-94a2-8913f4622227", + 0, + "string" + ], + [ + "4a675efd-5b37-46a8-be21-e142d90f3077", + "99a8e340-c306-4dee-94a2-8913f4622227", + 0, + "f561d4ae-9198-499f-8247-8523579582e8", + 0, + "*" + ], + [ + "99059959-431f-4ef0-afce-77de4aba1e03", + "e4107934-5b11-416c-af50-fc17ff6d49ff", + 2, + "f561d4ae-9198-499f-8247-8523579582e8", + 1, + "*" + ], + [ + "3cd34eea-961b-4758-90a7-4e335c822638", + "e4107934-5b11-416c-af50-fc17ff6d49ff", + 1, + "3b395e63-2776-40d9-8949-ed0bc539ecce", + 0, + "CLIP" + ], + [ + "3834fce2-d88b-44e7-92c5-2b703745c5e3", + "f561d4ae-9198-499f-8247-8523579582e8", + 0, + "f80d4f12-5082-4534-b5be-0bcd92a6ccfa", + 0, + "VAE" + ], + [ + "3bd29d74-65a1-4c7d-b0aa-fadf1ed339e8", + "9734a060-1951-4892-86d7-300c6047202e", + 1, + "0f445096-c876-4cd0-bff1-296836dad959", + 1, + -1 + ], + [ + "3685877f-a647-4870-b1ae-0cd8420c1303", + "9734a060-1951-4892-86d7-300c6047202e", + 0, + "41cd5c99-b761-4c3f-accb-8bffdfc40763", + 0, + "boolean" + ], + [ + "6bddf9cf-53c1-4b02-b332-90794832d96f", + "41cd5c99-b761-4c3f-accb-8bffdfc40763", + 0, + "0f445096-c876-4cd0-bff1-296836dad959", + 0, + "boolean" + ] + ], + "groups": [], + "config": {}, + "extra": {}, + "version": 10 + } + }, + { + "id": "5f51f4b8-6eb9-4576-bb29-99bd33a06438", + "type": "VAEEncode", + "pos": [ + 1822, + 414 + ], + "size": [ + 140, + 46 + ], + "flags": {}, + "order": 17, + "mode": 0, + "inputs": [ + { + "name": "pixels", + "type": "IMAGE", + "link": "37206fef-d833-42b8-95f7-e47952d1f564", + "properties": {}, + "config": {} + }, + { + "name": "vae", + "type": "VAE", + "link": "267dd718-3c77-41e7-a19b-88257649aa2b", + "properties": {}, + "config": {} + } + ], + "outputs": [ + { + "name": "LATENT", + "type": "LATENT", + "links": [ + "ac9b243e-6424-441b-b232-d4bd7865681d" + ], + "properties": {}, + "shape": 3, + "slot_index": 0 + } + ], + "title": "VAE Encode", + "properties": { + "tags": [] + }, + "color": "#432", + "bgColor": "#653", + "saveUserState": true + }, + { + "id": "1116c2af-2a65-47dc-a7bf-1e7478835313", + "type": "SetLatentNoiseMask", + "pos": [ + 1805, + 508 + ], + "size": [ + 176.4, + 46 + ], + "flags": {}, + "order": 21, + "mode": 0, + "inputs": [ + { + "name": "samples", + "type": "LATENT", + "link": "ac9b243e-6424-441b-b232-d4bd7865681d", + "properties": {}, + "config": {} + }, + { + "name": "mask", + "type": "MASK", + "link": "b71474cc-9cdb-40a6-9f1c-356beb2f704c", + "properties": {}, + "slot_index": 1, + "config": {} + } + ], + "outputs": [ + { + "name": "LATENT", + "type": "LATENT", + "links": [ + "ced427c7-3b57-4900-8563-16eaf82b2c2f" + ], + "properties": {}, + "shape": 3, + "slot_index": 0 + } + ], + "title": "Set Latent Noise Mask", + "properties": { + "tags": [] + }, + "color": "#432", + "bgColor": "#653", + "saveUserState": true + }, + { + "id": "8e8b8719-949c-4409-b026-6317969595af", + "type": "actions/set_prompt_thumbnails", + "pos": [ + 810, + 579 + ], + "size": [ + 260.4, + 26 + ], + "flags": {}, + "order": 14, + "mode": 0, + "inputs": [ + { + "name": "filenames", + "type": "*", + "link": "6f092673-b64b-4c70-a986-62daa3b958f5", + "properties": {}, + "slot_index": 0 + } + ], + "outputs": [], + "title": "Comfy.SetPromptThumbnailsAction", + "properties": { + "tags": [], + "defaultFolderType": "input" + }, + "saveUserState": true + }, + { + "id": "cef242bb-7aa8-4275-94e0-3f3dc4425b68", + "type": "image/pick_image", + "pos": [ + 794, + 214 + ], + "size": [ + 210, + 282 + ], + "flags": {}, + "order": 10, + "mode": 0, + "inputs": [ + { + "name": "images", + "type": "COMFYBOX_IMAGES,COMFYBOX_IMAGE", + "link": "4b48e8f9-7777-417c-bcff-4c5bf18aff66", + "properties": {} + }, + { + "name": "index", + "type": "number", + "link": null, + "properties": {} + } + ], + "outputs": [ + { + "name": "image", + "type": "COMFYBOX_IMAGE", + "links": [ + "6f092673-b64b-4c70-a986-62daa3b958f5" + ], + "properties": {}, + "slot_index": 0 + }, + { + "name": "filename", + "type": "string", + "links": [ + "a2dfa5b7-8f14-4871-b36b-59872c13f23b" + ], + "properties": {}, + "slot_index": 1 + }, + { + "name": "width", + "type": "number", + "links": [], + "properties": {} + }, + { + "name": "height", + "type": "number", + "links": [], + "properties": {} + }, + { + "name": "children", + "type": "COMFYBOX_IMAGES", + "links": [ + "5669f5bf-a6eb-4ba2-b9fe-0158412cba17" + ], + "properties": {}, + "slot_index": 4 + } + ], + "title": "Comfy.PickImage", + "properties": { + "tags": [], + "imageTagFilter": "" + }, + "saveUserState": true + }, + { + "id": "df5b532f-5722-491b-966d-e862ba536cf5", + "type": "actions/set_prompt_thumbnails", + "pos": [ + 1323, + 638 + ], + "size": [ + 260.4, + 26 + ], + "flags": {}, + "order": 18, + "mode": 0, + "inputs": [ + { + "name": "filenames", + "type": "*", + "link": "495d9035-8d19-4344-94f7-3e76736db838", + "properties": {}, + "slot_index": 0 + } + ], + "outputs": [], + "title": "Comfy.SetPromptThumbnailsAction", + "properties": { + "tags": [], + "defaultFolderType": "input" + }, + "saveUserState": true + }, + { + "id": "11305768-d316-49e6-9658-e8ca6253cc88", + "type": "image/pick_image", + "pos": [ + 1103, + 293 + ], + "size": [ + 210, + 282 + ], + "flags": {}, + "order": 16, + "mode": 0, + "inputs": [ + { + "name": "images", + "type": "COMFYBOX_IMAGES,COMFYBOX_IMAGE", + "link": "5669f5bf-a6eb-4ba2-b9fe-0158412cba17", + "properties": {} + }, + { + "name": "index", + "type": "number", + "link": null, + "properties": {} + } + ], + "outputs": [ + { + "name": "image", + "type": "COMFYBOX_IMAGE", + "links": [ + "495d9035-8d19-4344-94f7-3e76736db838" + ], + "properties": {}, + "slot_index": 0 + }, + { + "name": "filename", + "type": "string", + "links": [ + "5a47d229-4b97-493d-b56d-897b3a33d08b" + ], + "properties": {}, + "slot_index": 1 + }, + { + "name": "width", + "type": "number", + "links": [], + "properties": {} + }, + { + "name": "height", + "type": "number", + "links": [], + "properties": {} + }, + { + "name": "children", + "type": "COMFYBOX_IMAGES", + "links": [], + "properties": {} + } + ], + "title": "Comfy.PickImage", + "properties": { + "tags": [], + "imageTagFilter": "mask" + }, + "saveUserState": true + } + ], + "links": [ + [ + "4b48e8f9-7777-417c-bcff-4c5bf18aff66", + "4ffeedc6-5002-4136-9a00-4122b788d02b", + 0, + "cef242bb-7aa8-4275-94e0-3f3dc4425b68", + 0, + "COMFYBOX_IMAGES,COMFYBOX_IMAGE" + ], + [ + "5669f5bf-a6eb-4ba2-b9fe-0158412cba17", + "cef242bb-7aa8-4275-94e0-3f3dc4425b68", + 4, + "11305768-d316-49e6-9658-e8ca6253cc88", + 0, + "COMFYBOX_IMAGES,COMFYBOX_IMAGE" + ], + [ + "1b348801-caaa-4403-a5d0-601e996cc216", + "68c152ef-6774-435a-a5c5-3f728ee172fd", + 0, + "646a2487-2873-4d81-873f-d4819c3152e5", + 1, + "string" + ], + [ + "5a47d229-4b97-493d-b56d-897b3a33d08b", + "11305768-d316-49e6-9658-e8ca6253cc88", + 1, + "646a2487-2873-4d81-873f-d4819c3152e5", + 0, + "string" + ], + [ + "a2dfa5b7-8f14-4871-b36b-59872c13f23b", + "cef242bb-7aa8-4275-94e0-3f3dc4425b68", + 1, + "72487c07-5276-46d7-9290-3c729fda0cc0", + 0, + "string" + ], + [ + "ddbad630-d27b-43a0-bbd7-9a5619168c6a", + "c6c39c9a-6909-4fc1-aaf2-0bc125ac6dd2", + 0, + "567fb9e4-5007-4bad-9265-9e405bfb2216", + 2, + "number" + ], + [ + "6f32600d-8401-4635-b0e7-9b4528a62798", + "0e1a7eac-27d3-42e5-9a8b-afbd937b0d02", + 0, + "567fb9e4-5007-4bad-9265-9e405bfb2216", + 3, + "number" + ], + [ + "0769ad17-ef05-4763-a059-726c5f9d4e64", + "869b9e12-e3ab-4657-a1a3-7cbc27f08986", + 0, + "567fb9e4-5007-4bad-9265-9e405bfb2216", + 4, + "string" + ], + [ + "a73abe86-8d1a-4bbd-a41b-bec286cb2d39", + "5955645b-ede2-46c7-805b-b7f4f17aeada", + 0, + "567fb9e4-5007-4bad-9265-9e405bfb2216", + 5, + "string" + ], + [ + "0fb89474-9c3f-4a87-9274-38f195c7789e", + "8563b0f7-b748-486d-911b-be3979e64f6c", + 0, + "567fb9e4-5007-4bad-9265-9e405bfb2216", + 9, + "number" + ], + [ + "b2a6d7f1-62bf-472f-82a3-75b1befe3788", + "7e8ed93c-6292-4f17-9f5c-c64ca41b6ec0", + 0, + "567fb9e4-5007-4bad-9265-9e405bfb2216", + 1, + "number" + ], + [ + "07daddb3-52c4-4fbb-9bd0-decc114c1ba4", + "3ae7ecb1-8b72-4b80-9599-7ef855b0eb0f", + 0, + "7e8ed93c-6292-4f17-9f5c-c64ca41b6ec0", + 0, + "number" + ], + [ + "881e1f37-318f-4d62-bc11-92e19bde7ad6", + "3ae7ecb1-8b72-4b80-9599-7ef855b0eb0f", + 0, + "fd70bb52-01d0-4861-9570-d1d606ed923d", + 1, + "number" + ], + [ + "d2de2711-f0e6-4cce-9cc1-85a8a70d1b71", + "871b78ae-2a13-468e-9acb-39f58fcdf6dd", + 1, + "fa6296b1-ff5c-4789-b379-2e5fbad67f0f", + 0, + "CLIP" + ], + [ + "96cb3752-7a70-4b23-ada2-1cd18062d10b", + "871b78ae-2a13-468e-9acb-39f58fcdf6dd", + 0, + "567fb9e4-5007-4bad-9265-9e405bfb2216", + 0, + "MODEL" + ], + [ + "539da2d1-af79-4240-9c52-8ab52c007ea0", + "fa6296b1-ff5c-4789-b379-2e5fbad67f0f", + 0, + "567fb9e4-5007-4bad-9265-9e405bfb2216", + 6, + "CONDITIONING" + ], + [ + "107278fe-75d9-4b40-b2bd-ea5ece56891d", + "fa6296b1-ff5c-4789-b379-2e5fbad67f0f", + 1, + "567fb9e4-5007-4bad-9265-9e405bfb2216", + 7, + "CONDITIONING" + ], + [ + "4af51cfd-4adb-46f4-bc35-f0814a59b8bc", + "567fb9e4-5007-4bad-9265-9e405bfb2216", + 0, + "b58210a1-5a89-4a13-bb05-6409a1748278", + 0, + "LATENT" + ], + [ + "d60b6342-e39a-4eda-b60d-7c47a624f3a7", + "871b78ae-2a13-468e-9acb-39f58fcdf6dd", + 2, + "b58210a1-5a89-4a13-bb05-6409a1748278", + 1, + "VAE" + ], + [ + "6a9c9913-ebdf-4841-b03a-05a856b88731", + "7e155083-1731-4942-aead-197dffe07804", + 0, + "7f21bd8f-06d9-4a1a-bb18-cc7aa6edc5bc", + 1, + "string" + ], + [ + "50d36f9c-e68a-49d7-a22e-b4d08d0f19d3", + "b58210a1-5a89-4a13-bb05-6409a1748278", + 0, + "7f21bd8f-06d9-4a1a-bb18-cc7aa6edc5bc", + 0, + "IMAGE" + ], + [ + "0c33a3f7-f274-480d-b78f-850bb946074b", + "7f21bd8f-06d9-4a1a-bb18-cc7aa6edc5bc", + 0, + "917148f0-7de9-4cf2-a051-066f84f442cb", + 1, + -1 + ], + [ + "75fb525e-e2b8-4c75-bedf-63b53717b3cd", + "646a2487-2873-4d81-873f-d4819c3152e5", + 0, + "9a859825-7f35-4309-b8a2-c331ff05322d", + 0, + "MASK" + ], + [ + "b71474cc-9cdb-40a6-9f1c-356beb2f704c", + "9a859825-7f35-4309-b8a2-c331ff05322d", + 0, + "1116c2af-2a65-47dc-a7bf-1e7478835313", + 1, + "MASK" + ], + [ + "37206fef-d833-42b8-95f7-e47952d1f564", + "72487c07-5276-46d7-9290-3c729fda0cc0", + 0, + "5f51f4b8-6eb9-4576-bb29-99bd33a06438", + 0, + "IMAGE" + ], + [ + "267dd718-3c77-41e7-a19b-88257649aa2b", + "871b78ae-2a13-468e-9acb-39f58fcdf6dd", + 2, + "5f51f4b8-6eb9-4576-bb29-99bd33a06438", + 1, + "VAE" + ], + [ + "ac9b243e-6424-441b-b232-d4bd7865681d", + "5f51f4b8-6eb9-4576-bb29-99bd33a06438", + 0, + "1116c2af-2a65-47dc-a7bf-1e7478835313", + 0, + "LATENT" + ], + [ + "ced427c7-3b57-4900-8563-16eaf82b2c2f", + "1116c2af-2a65-47dc-a7bf-1e7478835313", + 0, + "567fb9e4-5007-4bad-9265-9e405bfb2216", + 8, + "LATENT" + ], + [ + "6f092673-b64b-4c70-a986-62daa3b958f5", + "cef242bb-7aa8-4275-94e0-3f3dc4425b68", + 0, + "8e8b8719-949c-4409-b026-6317969595af", + 0, + "*" + ], + [ + "495d9035-8d19-4344-94f7-3e76736db838", + "11305768-d316-49e6-9658-e8ca6253cc88", + 0, + "df5b532f-5722-491b-966d-e862ba536cf5", + 0, + "*" + ] + ], + "groups": [], + "config": {}, + "extra": {}, + "version": 10 + }, + "attrs": { + "title": "img2img Masked", + "queuePromptButtonName": "Queue Prompt", + "queuePromptButtonRunWorkflow": true, + "showDefaultNotifications": true + }, + "layout": { + "root": "23381c06-9186-4089-9d79-ec1d40916142", + "allItems": { + "23381c06-9186-4089-9d79-ec1d40916142": { + "dragItem": { + "type": "container", + "id": "23381c06-9186-4089-9d79-ec1d40916142", + "attrs": { + "title": "", + "hidden": false, + "disabled": false, + "direction": "horizontal", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "text", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [ + "21253224-4378-49e9-afa9-b41a534f299e", + "18f069ae-1a93-4778-8c7a-4b94589c4cf6" + ] + }, + "21253224-4378-49e9-afa9-b41a534f299e": { + "dragItem": { + "type": "container", + "id": "21253224-4378-49e9-afa9-b41a534f299e", + "attrs": { + "title": "", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "text", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [ + "f6887a13-6b19-4b0c-9c1f-a38c0295182a", + "555d0208-5386-471a-9ece-77176f836109", + "105a9688-7734-4e03-82c9-44a919a30a24", + "d9aed3b6-98eb-45e2-b5c1-8e38170bbf35", + "f93fe138-2ecc-4c09-9569-b484dec41f5e" + ], + "parent": "23381c06-9186-4089-9d79-ec1d40916142" + }, + "18f069ae-1a93-4778-8c7a-4b94589c4cf6": { + "dragItem": { + "type": "container", + "id": "18f069ae-1a93-4778-8c7a-4b94589c4cf6", + "attrs": { + "title": "", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "text", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [ + "5ccba998-8269-4559-baa8-a094008a5483", + "0a72a76f-8cf7-47bf-bc4d-5b7f246745d1" + ], + "parent": "23381c06-9186-4089-9d79-ec1d40916142" + }, + "555d0208-5386-471a-9ece-77176f836109": { + "dragItem": { + "type": "widget", + "id": "555d0208-5386-471a-9ece-77176f836109", + "nodeId": "4ffeedc6-5002-4136-9a00-4122b788d02b", + "attrs": { + "title": "UI.ImageUpload", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "text", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [], + "parent": "21253224-4378-49e9-afa9-b41a534f299e" + }, + "71af87fd-382f-439b-a45c-b99d0e6217b3": { + "dragItem": { + "type": "widget", + "id": "71af87fd-382f-439b-a45c-b99d0e6217b3", + "nodeId": "68c152ef-6774-435a-a5c5-3f728ee172fd", + "attrs": { + "title": "channel", + "hidden": true, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "text", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [], + "parent": "105a9688-7734-4e03-82c9-44a919a30a24" + }, + "105a9688-7734-4e03-82c9-44a919a30a24": { + "dragItem": { + "type": "container", + "id": "105a9688-7734-4e03-82c9-44a919a30a24", + "attrs": { + "title": "Load Image (as Mask)", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "accordion", + "containerVariant": "block", + "openOnStartup": true, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [ + "3e005099-97d8-4aa3-8c24-4af2946c05d0", + "71af87fd-382f-439b-a45c-b99d0e6217b3" + ], + "parent": "21253224-4378-49e9-afa9-b41a534f299e" + }, + "908f192a-ea05-4fff-9771-94f5a0ba80db": { + "dragItem": { + "type": "widget", + "id": "908f192a-ea05-4fff-9771-94f5a0ba80db", + "nodeId": "c6c39c9a-6909-4fc1-aaf2-0bc125ac6dd2", + "attrs": { + "title": "steps", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "text", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [], + "parent": "f282553e-25e8-43b7-b93a-5edf1f9bec8d" + }, + "6592dcf9-2e49-4907-9430-bf2988254f2b": { + "dragItem": { + "type": "widget", + "id": "6592dcf9-2e49-4907-9430-bf2988254f2b", + "nodeId": "0e1a7eac-27d3-42e5-9a8b-afbd937b0d02", + "attrs": { + "title": "cfg", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "text", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [], + "parent": "f282553e-25e8-43b7-b93a-5edf1f9bec8d" + }, + "576a9c4e-57ab-4319-b2ad-3dffae243d16": { + "dragItem": { + "type": "widget", + "id": "576a9c4e-57ab-4319-b2ad-3dffae243d16", + "nodeId": "869b9e12-e3ab-4657-a1a3-7cbc27f08986", + "attrs": { + "title": "sampler_name", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "text", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [], + "parent": "b3253810-4503-46cf-a1b2-8c47efd89f95" + }, + "731fbc58-b52d-4077-b3b0-ba0df04c166f": { + "dragItem": { + "type": "widget", + "id": "731fbc58-b52d-4077-b3b0-ba0df04c166f", + "nodeId": "5955645b-ede2-46c7-805b-b7f4f17aeada", + "attrs": { + "title": "scheduler", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "text", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [], + "parent": "b3253810-4503-46cf-a1b2-8c47efd89f95" + }, + "cba63289-2e5b-4826-ae1b-e22388b20304": { + "dragItem": { + "type": "widget", + "id": "cba63289-2e5b-4826-ae1b-e22388b20304", + "nodeId": "8563b0f7-b748-486d-911b-be3979e64f6c", + "attrs": { + "title": "denoise", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "text", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [], + "parent": "3e005099-97d8-4aa3-8c24-4af2946c05d0" + }, + "f93fe138-2ecc-4c09-9569-b484dec41f5e": { + "dragItem": { + "type": "container", + "id": "f93fe138-2ecc-4c09-9569-b484dec41f5e", + "attrs": { + "title": "KSampler", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "accordion", + "containerVariant": "block", + "openOnStartup": true, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [ + "6d696c5e-4d05-492a-97cb-fa86e6b87a78", + "f282553e-25e8-43b7-b93a-5edf1f9bec8d", + "116f57b2-8449-4fe2-a666-2710cae36ba0", + "b3253810-4503-46cf-a1b2-8c47efd89f95" + ], + "parent": "21253224-4378-49e9-afa9-b41a534f299e" + }, + "d3a5e1ee-88f2-4dc8-be17-a3edb966522b": { + "dragItem": { + "type": "container", + "id": "6d696c5e-4d05-492a-97cb-fa86e6b87a78", + "attrs": { + "title": "", + "hidden": false, + "disabled": false, + "direction": "horizontal", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "gallery", + "containerVariant": "block", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [ + "e5d36592-f491-4d6c-8b13-0668383b23a8", + "146d636b-f6e0-4cc3-b0fe-aa3856f36a9e" + ] + }, + "d698a64e-0206-4692-807e-1ffcbf68e066": { + "dragItem": { + "type": "widget", + "id": "e5d36592-f491-4d6c-8b13-0668383b23a8", + "nodeId": "3bc4cbf3-8d35-43de-b383-b3cf0c3fa4cf", + "attrs": { + "title": "Seed", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "gallery", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [], + "parent": "6d696c5e-4d05-492a-97cb-fa86e6b87a78" + }, + "4ed77669-8a9a-4523-8977-f3666c3e01ca": { + "dragItem": { + "type": "widget", + "id": "146d636b-f6e0-4cc3-b0fe-aa3856f36a9e", + "nodeId": "e5c139e7-e69d-4edb-ba95-f2a9eab30f0c", + "attrs": { + "title": "Seed Action", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "gallery", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [], + "parent": "6d696c5e-4d05-492a-97cb-fa86e6b87a78" + }, + "6d696c5e-4d05-492a-97cb-fa86e6b87a78": { + "dragItem": { + "type": "container", + "id": "6d696c5e-4d05-492a-97cb-fa86e6b87a78", + "attrs": { + "title": "", + "hidden": false, + "disabled": false, + "direction": "horizontal", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "gallery", + "containerVariant": "block", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [ + "e5d36592-f491-4d6c-8b13-0668383b23a8", + "146d636b-f6e0-4cc3-b0fe-aa3856f36a9e" + ], + "parent": "f93fe138-2ecc-4c09-9569-b484dec41f5e" + }, + "e5d36592-f491-4d6c-8b13-0668383b23a8": { + "dragItem": { + "type": "widget", + "id": "e5d36592-f491-4d6c-8b13-0668383b23a8", + "nodeId": "3bc4cbf3-8d35-43de-b383-b3cf0c3fa4cf", + "attrs": { + "title": "Seed", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "gallery", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [], + "parent": "6d696c5e-4d05-492a-97cb-fa86e6b87a78" + }, + "146d636b-f6e0-4cc3-b0fe-aa3856f36a9e": { + "dragItem": { + "type": "widget", + "id": "146d636b-f6e0-4cc3-b0fe-aa3856f36a9e", + "nodeId": "e5c139e7-e69d-4edb-ba95-f2a9eab30f0c", + "attrs": { + "title": "Seed Action", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "gallery", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [], + "parent": "6d696c5e-4d05-492a-97cb-fa86e6b87a78" + }, + "3998f3d7-9b09-4dd7-a656-6f2e0b326891": { + "dragItem": { + "type": "widget", + "id": "3998f3d7-9b09-4dd7-a656-6f2e0b326891", + "nodeId": "3ae7ecb1-8b72-4b80-9599-7ef855b0eb0f", + "attrs": { + "title": "Batch Size", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "text", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [], + "parent": "116f57b2-8449-4fe2-a666-2710cae36ba0" + }, + "6b258844-4787-465b-8b6f-38b169b3b639": { + "dragItem": { + "type": "container", + "id": "d9aed3b6-98eb-45e2-b5c1-8e38170bbf35", + "attrs": { + "title": "Prompt", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "accordion", + "containerVariant": "block", + "openOnStartup": true, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [ + "fd78155a-a0f2-4fa3-b409-f1d8d424cff4", + "63ef6eb6-b886-432d-83da-bb26e5dff8ea" + ] + }, + "77aacb49-8211-4500-9466-3580583aa1a1": { + "dragItem": { + "type": "widget", + "id": "fd78155a-a0f2-4fa3-b409-f1d8d424cff4", + "nodeId": "2db73403-fc0a-4fda-8ef3-c385216ad7ab", + "attrs": { + "title": "Positive", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "code", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [], + "parent": "d9aed3b6-98eb-45e2-b5c1-8e38170bbf35" + }, + "f9e0eb67-3165-46a2-b28f-6dcb4dde07aa": { + "dragItem": { + "type": "widget", + "id": "63ef6eb6-b886-432d-83da-bb26e5dff8ea", + "nodeId": "c63fcd7b-2e95-4c46-9247-73a6107781dd", + "attrs": { + "title": "Negative", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "code", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [], + "parent": "d9aed3b6-98eb-45e2-b5c1-8e38170bbf35" + }, + "d9aed3b6-98eb-45e2-b5c1-8e38170bbf35": { + "dragItem": { + "type": "container", + "id": "d9aed3b6-98eb-45e2-b5c1-8e38170bbf35", + "attrs": { + "title": "Prompt", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "accordion", + "containerVariant": "block", + "openOnStartup": true, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [ + "fd78155a-a0f2-4fa3-b409-f1d8d424cff4", + "63ef6eb6-b886-432d-83da-bb26e5dff8ea" + ], + "parent": "21253224-4378-49e9-afa9-b41a534f299e" + }, + "fd78155a-a0f2-4fa3-b409-f1d8d424cff4": { + "dragItem": { + "type": "widget", + "id": "fd78155a-a0f2-4fa3-b409-f1d8d424cff4", + "nodeId": "2db73403-fc0a-4fda-8ef3-c385216ad7ab", + "attrs": { + "title": "Positive", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "code", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [], + "parent": "d9aed3b6-98eb-45e2-b5c1-8e38170bbf35" + }, + "63ef6eb6-b886-432d-83da-bb26e5dff8ea": { + "dragItem": { + "type": "widget", + "id": "63ef6eb6-b886-432d-83da-bb26e5dff8ea", + "nodeId": "c63fcd7b-2e95-4c46-9247-73a6107781dd", + "attrs": { + "title": "Negative", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "code", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [], + "parent": "d9aed3b6-98eb-45e2-b5c1-8e38170bbf35" + }, + "3ef335f4-9cbc-4914-846f-b71104da1ef1": { + "dragItem": { + "type": "container", + "id": "f6887a13-6b19-4b0c-9c1f-a38c0295182a", + "attrs": { + "title": "Model", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "accordion", + "containerVariant": "block", + "openOnStartup": true, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [ + "e2a0063c-e941-469c-9798-2b8f7a8e7cc9", + "294b827f-202a-4e62-ab94-928ec0df717d" + ] + }, + "0d5ae12f-6024-45ea-ad3e-53b48bd9c66b": { + "dragItem": { + "type": "container", + "id": "e2a0063c-e941-469c-9798-2b8f7a8e7cc9", + "attrs": { + "title": "", + "hidden": false, + "disabled": false, + "direction": "horizontal", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "gallery", + "containerVariant": "block", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [ + "62c4b0f5-999d-4a41-b16d-0a6a961caf67", + "641996c2-201c-4f3f-8d48-71bbeb7ac4a7" + ], + "parent": "f6887a13-6b19-4b0c-9c1f-a38c0295182a" + }, + "18871f76-9d1f-4f40-92d8-23bca3501d1d": { + "dragItem": { + "type": "widget", + "id": "294b827f-202a-4e62-ab94-928ec0df717d", + "nodeId": "9734a060-1951-4892-86d7-300c6047202e", + "attrs": { + "title": "Use Internal VAE", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "gallery", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [], + "parent": "f6887a13-6b19-4b0c-9c1f-a38c0295182a" + }, + "e665ac4e-9f0a-4001-92ee-52ffabfb5939": { + "dragItem": { + "type": "widget", + "id": "62c4b0f5-999d-4a41-b16d-0a6a961caf67", + "nodeId": "d0edca44-d673-4208-adea-88199654dbf7", + "attrs": { + "title": "Checkpoint", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "gallery", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [], + "parent": "e2a0063c-e941-469c-9798-2b8f7a8e7cc9" + }, + "128ab0d0-735e-4b6e-aaee-7528a31f3590": { + "dragItem": { + "type": "widget", + "id": "641996c2-201c-4f3f-8d48-71bbeb7ac4a7", + "nodeId": "91cba5df-6058-4e67-bdde-0e2b1dcad616", + "attrs": { + "title": "VAE", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "gallery", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [], + "parent": "e2a0063c-e941-469c-9798-2b8f7a8e7cc9" + }, + "f6887a13-6b19-4b0c-9c1f-a38c0295182a": { + "dragItem": { + "type": "container", + "id": "f6887a13-6b19-4b0c-9c1f-a38c0295182a", + "attrs": { + "title": "Model", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "accordion", + "containerVariant": "block", + "openOnStartup": true, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [ + "e2a0063c-e941-469c-9798-2b8f7a8e7cc9", + "294b827f-202a-4e62-ab94-928ec0df717d" + ], + "parent": "21253224-4378-49e9-afa9-b41a534f299e" + }, + "e2a0063c-e941-469c-9798-2b8f7a8e7cc9": { + "dragItem": { + "type": "container", + "id": "e2a0063c-e941-469c-9798-2b8f7a8e7cc9", + "attrs": { + "title": "", + "hidden": false, + "disabled": false, + "direction": "horizontal", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "gallery", + "containerVariant": "block", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [ + "62c4b0f5-999d-4a41-b16d-0a6a961caf67", + "641996c2-201c-4f3f-8d48-71bbeb7ac4a7" + ], + "parent": "f6887a13-6b19-4b0c-9c1f-a38c0295182a" + }, + "294b827f-202a-4e62-ab94-928ec0df717d": { + "dragItem": { + "type": "widget", + "id": "294b827f-202a-4e62-ab94-928ec0df717d", + "nodeId": "9734a060-1951-4892-86d7-300c6047202e", + "attrs": { + "title": "Use Internal VAE", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "gallery", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [], + "parent": "f6887a13-6b19-4b0c-9c1f-a38c0295182a" + }, + "62c4b0f5-999d-4a41-b16d-0a6a961caf67": { + "dragItem": { + "type": "widget", + "id": "62c4b0f5-999d-4a41-b16d-0a6a961caf67", + "nodeId": "d0edca44-d673-4208-adea-88199654dbf7", + "attrs": { + "title": "Checkpoint", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "gallery", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [], + "parent": "e2a0063c-e941-469c-9798-2b8f7a8e7cc9" + }, + "641996c2-201c-4f3f-8d48-71bbeb7ac4a7": { + "dragItem": { + "type": "widget", + "id": "641996c2-201c-4f3f-8d48-71bbeb7ac4a7", + "nodeId": "91cba5df-6058-4e67-bdde-0e2b1dcad616", + "attrs": { + "title": "VAE", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "gallery", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [], + "destroyChildOnCLose": false + } + }, + "children": [], + "parent": "e2a0063c-e941-469c-9798-2b8f7a8e7cc9" + }, + "e390accf-871e-484b-93e4-23e760058b43": { + "dragItem": { + "type": "widget", + "id": "e390accf-871e-484b-93e4-23e760058b43", + "nodeId": "7e155083-1731-4942-aead-197dffe07804", + "attrs": { + "title": "filename_prefix", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "text", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [], + "parent": "0a72a76f-8cf7-47bf-bc4d-5b7f246745d1" + }, + "0a72a76f-8cf7-47bf-bc4d-5b7f246745d1": { + "dragItem": { + "type": "container", + "id": "0a72a76f-8cf7-47bf-bc4d-5b7f246745d1", + "attrs": { + "title": "Save Image", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "accordion", + "containerVariant": "block", + "openOnStartup": true, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [ + "e390accf-871e-484b-93e4-23e760058b43" + ], + "parent": "18f069ae-1a93-4778-8c7a-4b94589c4cf6" + }, + "5ccba998-8269-4559-baa8-a094008a5483": { + "dragItem": { + "type": "widget", + "id": "5ccba998-8269-4559-baa8-a094008a5483", + "nodeId": "917148f0-7de9-4cf2-a051-066f84f442cb", + "attrs": { + "title": "UI.Gallery", + "hidden": false, + "disabled": false, + "direction": "vertical", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "text", + "containerVariant": "hidden", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [], + "parent": "18f069ae-1a93-4778-8c7a-4b94589c4cf6" + }, + "f282553e-25e8-43b7-b93a-5edf1f9bec8d": { + "dragItem": { + "type": "container", + "id": "f282553e-25e8-43b7-b93a-5edf1f9bec8d", + "attrs": { + "title": "", + "hidden": false, + "disabled": false, + "direction": "horizontal", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "text", + "containerVariant": "block", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [ + "908f192a-ea05-4fff-9771-94f5a0ba80db", + "6592dcf9-2e49-4907-9430-bf2988254f2b" + ], + "parent": "f93fe138-2ecc-4c09-9569-b484dec41f5e" + }, + "b3253810-4503-46cf-a1b2-8c47efd89f95": { + "dragItem": { + "type": "container", + "id": "b3253810-4503-46cf-a1b2-8c47efd89f95", + "attrs": { + "title": "", + "hidden": false, + "disabled": false, + "direction": "horizontal", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "text", + "containerVariant": "block", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [ + "576a9c4e-57ab-4319-b2ad-3dffae243d16", + "731fbc58-b52d-4077-b3b0-ba0df04c166f" + ], + "parent": "f93fe138-2ecc-4c09-9569-b484dec41f5e" + }, + "116f57b2-8449-4fe2-a666-2710cae36ba0": { + "dragItem": { + "type": "container", + "id": "116f57b2-8449-4fe2-a666-2710cae36ba0", + "attrs": { + "title": "", + "hidden": false, + "disabled": false, + "direction": "horizontal", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "text", + "containerVariant": "block", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [ + "3998f3d7-9b09-4dd7-a656-6f2e0b326891" + ], + "parent": "f93fe138-2ecc-4c09-9569-b484dec41f5e" + }, + "3e005099-97d8-4aa3-8c24-4af2946c05d0": { + "dragItem": { + "type": "container", + "id": "3e005099-97d8-4aa3-8c24-4af2946c05d0", + "attrs": { + "title": "", + "hidden": false, + "disabled": false, + "direction": "horizontal", + "classes": "", + "style": "", + "nodeDisabledState": "hidden", + "variant": "text", + "containerVariant": "block", + "openOnStartup": false, + "buttonVariant": "primary", + "buttonSize": "large", + "tags": [] + } + }, + "children": [ + "cba63289-2e5b-4826-ae1b-e22388b20304" + ], + "parent": "105a9688-7734-4e03-82c9-44a919a30a24" + } + } + }, + "canvas": { + "offset": [ + -842.5, + -74.5 + ], + "scale": 1 + } +} \ No newline at end of file diff --git a/src/lib/components/ComfyApp.ts b/src/lib/components/ComfyApp.ts index 9f905be..a673558 100644 --- a/src/lib/components/ComfyApp.ts +++ b/src/lib/components/ComfyApp.ts @@ -997,6 +997,7 @@ export default class ComfyApp { if ("getPromptThumbnails" in node) { const thumbsToAdd = (node as ComfyGraphNode).getPromptThumbnails(); + console.warn("THUMBNAILS", thumbsToAdd) if (thumbsToAdd) thumbnails.push(...thumbsToAdd) } diff --git a/src/lib/components/ImageUpload.svelte b/src/lib/components/ImageUpload.svelte index 7934b08..224ad73 100644 --- a/src/lib/components/ImageUpload.svelte +++ b/src/lib/components/ImageUpload.svelte @@ -3,7 +3,7 @@ import type { ComfyImageLocation } from "$lib/nodes/ComfyWidgetNodes"; import notify from "$lib/notify"; import configState from "$lib/stores/configState"; - import { convertComfyOutputEntryToGradio, convertComfyOutputToComfyURL, type ComfyUploadImageAPIResponse } from "$lib/utils"; + import { batchUploadFilesToComfyUI, convertComfyOutputToComfyURL, type ComfyBatchUploadResult } from "$lib/utils"; import { Block, BlockLabel } from "@gradio/atoms"; import { File as FileIcon } from "@gradio/icons"; import type { FileData as GradioFileData } from "@gradio/upload"; @@ -59,55 +59,10 @@ dispatch("image_clicked") } - interface GradioUploadResponse { - error?: string; - files?: Array; - } - - async function upload_files(root: string, files: Array): Promise { - console.debug("UPLOADILFES", root, files); - + async function upload_files(files: Array): Promise { + console.debug("UPLOADFILES", files); dispatch("uploading") - - const url = configState.getBackendURL(); - - const requests = files.map(async (file) => { - const formData = new FormData(); - formData.append("image", file, file.name); - return fetch(new Request(url + "/upload/image", { - body: formData, - method: 'POST' - })) - .then(r => r.json()) - .catch(error => error); - }); - - return Promise.all(requests) - .then( (results) => { - const errors = [] - const files = [] - - for (const r of results) { - if (r instanceof Error) { - errors.push(r.toString()) - } - else { - // bare filename of image - const resp = r as ComfyUploadImageAPIResponse; - files.push({ - filename: resp.name, - subfolder: "", - type: "input" - }) - } - } - - let error = null; - if (errors && errors.length > 0) - error = "Upload error(s):\n" + errors.join("\n"); - - return { error, files } - }) + return batchUploadFilesToComfyUI(files); } $: { @@ -144,7 +99,7 @@ ); let upload_value = _value; pending_upload = true; - upload_files(root, files).then((response) => { + upload_files(files).then((response) => { if (JSON.stringify(upload_value) !== JSON.stringify(_value)) { // value has changed since upload started console.error("[ImageUpload] value has changed since upload started", upload_value, _value) diff --git a/src/lib/components/MaskCanvas.svelte b/src/lib/components/MaskCanvas.svelte new file mode 100644 index 0000000..6ad0cb6 --- /dev/null +++ b/src/lib/components/MaskCanvas.svelte @@ -0,0 +1,635 @@ + + + + + + +
+ {#if !isImageLoaded} +
+ (empty) +
+ {:else} +
+
+
+ {#if original} + {@const showOriginal = !clipMask} + + {/if} +
+ +
+
+ {/if} + {#if isImageLoaded && isBrushShowing && !isPanning} +
+ {/if} +
+ + + + + +
{clipMask = !clipMask; updateMaskImage()}}> + +
+
{toggleFullscreen()}}> + {#if fullscreen} + + {:else} + + {/if} +
+
+
+ + diff --git a/src/lib/nodes/ComfyPickImageNode.ts b/src/lib/nodes/ComfyPickImageNode.ts index 2253a28..c314a79 100644 --- a/src/lib/nodes/ComfyPickImageNode.ts +++ b/src/lib/nodes/ComfyPickImageNode.ts @@ -1,8 +1,17 @@ import { LiteGraph, type ITextWidget, type SlotLayout, type INumberWidget } from "@litegraph-ts/core"; -import ComfyGraphNode from "./ComfyGraphNode"; +import ComfyGraphNode, { type ComfyGraphNodeProperties } from "./ComfyGraphNode"; import { comfyFileToAnnotatedFilepath, type ComfyBoxImageMetadata } from "$lib/utils"; +export interface ComfyPickImageProperties extends ComfyGraphNodeProperties { + imageTagFilter: string +} + export default class ComfyPickImageNode extends ComfyGraphNode { + override properties: ComfyPickImageProperties = { + tags: [], + imageTagFilter: "" + } + static slotLayout: SlotLayout = { inputs: [ { name: "images", type: "COMFYBOX_IMAGES,COMFYBOX_IMAGE" }, @@ -13,57 +22,87 @@ export default class ComfyPickImageNode extends ComfyGraphNode { { name: "filename", type: "string" }, { name: "width", type: "number" }, { name: "height", type: "number" }, + { name: "children", type: "COMFYBOX_IMAGES" }, ] } + tagFilterWidget: ITextWidget; filepathWidget: ITextWidget; folderWidget: ITextWidget; widthWidget: INumberWidget; heightWidget: INumberWidget; + tagsWidget: ITextWidget; + childrenWidget: INumberWidget; constructor(title?: string) { super(title) + this.tagFilterWidget = this.addWidget("text", "Tag Filter", this.properties.imageTagFilter, "imageTagFilter") + this.filepathWidget = this.addWidget("text", "File", "") + this.filepathWidget.disabled = true; this.folderWidget = this.addWidget("text", "Folder", "") + this.folderWidget.disabled = true; this.widthWidget = this.addWidget("number", "Width", 0) + this.widthWidget.disabled = true; this.heightWidget = this.addWidget("number", "Height", 0) - for (const widget of this.widgets) - widget.disabled = true; + this.heightWidget.disabled = true; + this.tagsWidget = this.addWidget("text", "Tags", "") + this.tagsWidget.disabled = true; + this.childrenWidget = this.addWidget("number", "# of Children", 0) + this.childrenWidget.disabled = true; } _value: ComfyBoxImageMetadata[] | null = null; _image: ComfyBoxImageMetadata | null = null; _path: string | null = null; - _index: number = 0; + _index: number | null = null; private setValue(value: ComfyBoxImageMetadata[] | ComfyBoxImageMetadata | null, index: number) { if (value != null && !Array.isArray(value)) { value = [value] index = 0; } - const changed = this._value != value || this._index != index; this._value = value as ComfyBoxImageMetadata[]; this._index = index; + let image: ComfyBoxImageMetadata | null = null; + if (value && this._index != null && value[this._index] != null) { + image = value[this._index]; + } + + const changed = this._value != value || this._index != index || this._image != image; + if (changed) { - if (value && value[this._index] != null) { - this._image = value[this._index] + if (image) { + this._image = image + this._image.children ||= [] + this._image.tags ||= [] + this._path = comfyFileToAnnotatedFilepath(this._image.comfyUIFile); this.filepathWidget.value = this._image.comfyUIFile.filename this.folderWidget.value = this._image.comfyUIFile.type + this.childrenWidget.value = this._image.children.length + this.tagsWidget.value = this._image.tags.join(", ") } else { this._image = null; this._path = null; this.filepathWidget.value = "(None)" this.folderWidget.value = "" + this.childrenWidget.value = 0 + this.tagsWidget.value = "" } - console.log("SET", value, this._image, this._path) + + console.log("SET", value, this._image, this._path, this.properties.imageTagFilter) } } override onExecute() { const data = this.getInputData(0) - const index = this.getInputData(1) || 0 + let index = this.getInputData(1); + if (this.properties.imageTagFilter && Array.isArray(data)) + index = data.findIndex(i => i.tags?.includes(this.properties.imageTagFilter)) + else + index = 0; this.setValue(data, index); if (this._image == null) { @@ -71,6 +110,7 @@ export default class ComfyPickImageNode extends ComfyGraphNode { this.setOutputData(1, null) this.setOutputData(2, 0) this.setOutputData(3, 0) + this.setOutputData(4, null) this.widthWidget.value = 0 this.heightWidget.value = 0 @@ -80,6 +120,7 @@ export default class ComfyPickImageNode extends ComfyGraphNode { this.setOutputData(1, this._path); this.setOutputData(2, this._image.width); this.setOutputData(3, this._image.height); + this.setOutputData(4, this._image.children); // XXX: image size doesn't load until the element is ready on // the page so this can come after several frames' worth of diff --git a/src/lib/nodes/widgets/ComfyImageUploadNode.ts b/src/lib/nodes/widgets/ComfyImageUploadNode.ts index ea8e502..eee73b4 100644 --- a/src/lib/nodes/widgets/ComfyImageUploadNode.ts +++ b/src/lib/nodes/widgets/ComfyImageUploadNode.ts @@ -8,12 +8,14 @@ import ComfyWidgetNode from "./ComfyWidgetNode"; import { get, writable, type Writable } from "svelte/store"; export interface ComfyImageUploadNodeProperties extends ComfyWidgetProperties { + maskCount: number } export default class ComfyImageUploadNode extends ComfyWidgetNode { properties: ComfyImageUploadNodeProperties = { defaultValue: [], tags: [], + maskCount: 0 } static slotLayout: SlotLayout = { @@ -39,13 +41,21 @@ export default class ComfyImageUploadNode extends ComfyWidgetNode 0) { value[0].width = get(this.imgWidth) value[0].height = get(this.imgHeight) + + // NOTE: assumes masks will have the same image size as the parent image! + for (const child of value[0].children) { + child.width = get(this.imgWidth) + child.height = get(this.imgHeight) + } } + + super.onExecute(param, options); } override parseValue(value: any): ComfyBoxImageMetadata[] { diff --git a/src/lib/stores/layoutStates.ts b/src/lib/stores/layoutStates.ts index 1c21522..2149c19 100644 --- a/src/lib/stores/layoutStates.ts +++ b/src/lib/stores/layoutStates.ts @@ -616,6 +616,19 @@ const ALL_ATTRIBUTES: AttributesSpecList = [ defaultValue: true }, + // ImageUpload + { + name: "maskCount", + type: "number", + location: "nodeProps", + editable: true, + validNodeTypes: ["ui/image_upload"], + defaultValue: 0, + min: 0, + max: 8, + step: 1 + }, + // Radio { name: "defaultValue", diff --git a/src/lib/utils.ts b/src/lib/utils.ts index 87303df..559349d 100644 --- a/src/lib/utils.ts +++ b/src/lib/utils.ts @@ -75,6 +75,13 @@ export function download(filename: string, text: string, type: string = "text/pl }, 0); } +export function downloadCanvas(canvas: HTMLCanvasElement, filename: string, type: string = "image/png") { + var link = document.createElement('a'); + link.download = filename; + link.href = canvas.toDataURL(type); + link.click(); +} + export const MAX_LOCAL_STORAGE_MB = 5; export function getLocalStorageUsedMB(): number { @@ -434,6 +441,8 @@ export type ComfyBoxImageMetadata = { width?: number, /* Image height. */ height?: number, + /* Child images associated with this image, like masks. */ + children: ComfyBoxImageMetadata[] } export function isComfyBoxImageMetadata(value: any): value is ComfyBoxImageMetadata { @@ -458,6 +467,7 @@ export function filenameToComfyBoxMetadata(filename: string, type: ComfyUploadIm }, name: "Filename", tags: [], + children: [] } } @@ -467,6 +477,7 @@ export function comfyFileToComfyBoxMetadata(comfyUIFile: ComfyImageLocation): Co comfyUIFile, name: "File", tags: [], + children: [] } } @@ -628,3 +639,70 @@ export function playSound(sound: string) { const audio = new Audio(url); audio.play(); } + +export interface ComfyBatchUploadResult { + error?: string; + files: Array; +} + +export type ComfyBatchBlob = { + blob: Blob, + filename: string, + overwrite?: boolean +} + +export async function batchUploadFilesToComfyUI(files: Array): Promise { + const blobs = files.map(f => { return { blob: f, filename: f.name } }) + return batchUploadBlobsToComfyUI(blobs) +} + +export async function batchUploadBlobsToComfyUI(blobs: ComfyBatchBlob[]): Promise { + const url = configState.getBackendURL(); + + const requests = blobs.map(async (blob) => { + const formData = new FormData(); + formData.append("image", blob.blob, blob.filename); + if (blob.overwrite) { + formData.append("overwrite", "true") + } + return fetch(new Request(url + "/upload/image", { + body: formData, + method: 'POST' + })) + .then(r => r.json()) + .catch(error => error); + }); + + return Promise.all(requests) + .then((results) => { + const errors = [] + const files = [] + + for (const r of results) { + if (r instanceof Error) { + errors.push(r.toString()) + } + else { + // bare filename of image + const resp = r as ComfyUploadImageAPIResponse; + files.push({ + filename: resp.name, + subfolder: "", + type: "input" + }) + } + } + + let error = null; + if (errors && errors.length > 0) + error = "Upload error(s):\n" + errors.join("\n"); + + return { error, files } + }) +} + +export function canvasToBlob(canvas: HTMLCanvasElement): Promise { + return new Promise(function(resolve) { + canvas.toBlob(resolve); + }); +} diff --git a/src/lib/widgets/ImageUploadWidget.svelte b/src/lib/widgets/ImageUploadWidget.svelte index a16f96b..2bc6c6a 100644 --- a/src/lib/widgets/ImageUploadWidget.svelte +++ b/src/lib/widgets/ImageUploadWidget.svelte @@ -3,46 +3,143 @@ import { Block } from "@gradio/atoms"; import { TextBox } from "@gradio/form"; import Row from "$lib/components/gradio/app/Row.svelte"; - import { get, writable, type Writable } from "svelte/store"; - import Modal from "$lib/components/Modal.svelte"; + import { writable, type Writable } from "svelte/store"; import { Button } from "@gradio/button"; - import { type Embed as Klecks } from "klecks"; - import "klecks/style/style.scss"; import ImageUpload from "$lib/components/ImageUpload.svelte"; - import { uploadImageToComfyUI, type ComfyBoxImageMetadata, comfyFileToComfyBoxMetadata, comfyBoxImageToComfyURL, comfyBoxImageToComfyFile, type ComfyUploadImageType, type ComfyImageLocation } from "$lib/utils"; - import configState from "$lib/stores/configState"; + import { + type ComfyBoxImageMetadata, + comfyFileToComfyBoxMetadata, + comfyBoxImageToComfyFile, + type ComfyImageLocation, + comfyBoxImageToComfyURL, + convertComfyOutputToComfyURL, + batchUploadBlobsToComfyUI, + canvasToBlob, + + basename + + } from "$lib/utils"; import notify from "$lib/notify"; - import NumberInput from "$lib/components/NumberInput.svelte"; - import type { ComfyImageEditorNode } from "$lib/nodes/widgets"; - import { ImageViewer } from "$lib/ImageViewer"; - import { generateBlankCanvas, generateImageCanvas } from "./utils"; + import { ImageViewer } from "$lib/ImageViewer"; + import MaskCanvas, { type MaskCanvasData } from "$lib/components/MaskCanvas.svelte"; + import type { ComfyImageUploadNode } from "$lib/nodes/widgets"; + import { tick } from "svelte"; export let widget: WidgetLayout | null = null; export let isMobile: boolean = false; - let node: ComfyImageEditorNode | null = null; + let node: ComfyImageUploadNode | null = null; let nodeValue: Writable | null = null; - let attrsChanged: Writable | null = null; let imgWidth: Writable = writable(0); let imgHeight: Writable = writable(0); + let maskCanvasComp: MaskCanvas | null = null; + let editMask: boolean = false; + $: widget && setNodeValue(widget); + let canMask = false; + $: canMask = (node?.properties?.maskCount || 0) > 0; + $: if (!canMask) clearMask(); + + function setNodeValue(widget: WidgetLayout) { if (widget) { - node = widget.node as ComfyImageEditorNode + node = widget.node as ComfyImageUploadNode nodeValue = node.value; - attrsChanged = widget.attrsChanged; imgWidth = node.imgWidth imgHeight = node.imgHeight status = $nodeValue && $nodeValue.length > 0 ? "uploaded" : "empty" } }; + let hasImage = false; + + $: hasImage = $nodeValue && $nodeValue.length > 0; + $: if (!hasImage) { + editMask = false; + } + + const MASK_FILENAME: string = "ComfyBoxMask.png" + + async function onMaskReleased(e: CustomEvent) { + const data = e.detail; + if (data.maskCanvas && data.hasMask) { + await saveMask(data.maskCanvas) + } + } + + async function saveMask(maskCanvas: HTMLCanvasElement) { + if (!canMask) { + notify("Mask editing is disabled for this widget.", { type: "warning" }) + return; + } + if (!maskCanvas) { + notify("No mask canvas!", { type: "warning" }) + return + } + if (!$nodeValue || $nodeValue.length === 0) { + notify("No image uploaded to apply mask to.", { type: "warning" }) + return + } + + const hadNoMask = $nodeValue[0].children.findIndex(i => i.tags?.includes("mask")) === -1; + const existFilename = $nodeValue[0].comfyUIFile.filename + const filename = existFilename ? `${basename(existFilename)}_mask.png` : MASK_FILENAME + + console.warn("[ImageUpload] UPLOAD MASK", filename) + + await canvasToBlob(maskCanvas) + .then(blob => batchUploadBlobsToComfyUI([{ + blob, + filename, + overwrite: true + }])) + .then(result => { + const meta = result.files.map(f => { + const m = comfyFileToComfyBoxMetadata(f) + m.tags = ["mask"] + m.width = maskCanvas.width; + m.height = maskCanvas.height; + return m; + }); + if ($nodeValue.length > 0) { + // TODO support multiple images? + $nodeValue[0].children = meta; + if (hadNoMask) { + notify("Uploaded mask successfully!", { type: "success" }) + } + } + else { + throw new Error("No image was uploaded yet.") + } + }) + .catch(error => { + notify(`Failed to upload mask to ComfyUI: ${error}`, { type: "error", timeout: 10000 }) + }) + } + + function clearMask() { + for (const image of $nodeValue) { + // TODO other child image types preserved here? + image.children = []; + } + if (maskCanvasComp) { + maskCanvasComp.clearStrokes(); + } + } + + async function toggleEditMask() { + editMask = !editMask; + await tick(); + if (maskCanvasComp) { + maskCanvasComp.recenterImage(); + } + } + let editorRoot: HTMLDivElement | null = null; let showModal = false; - let kl: Klecks | null = null; function disposeEditor() { console.warn("[ImageEditorWidget] CLOSING", widget, $nodeValue) @@ -53,100 +150,9 @@ } } - kl = null; showModal = false; } - const FILENAME: string = "ComfyUITemp.png"; - const SUBFOLDER: string = "ComfyBox_Editor"; - const DIRECTORY: ComfyUploadImageType = "input"; - - async function submitKlecksToComfyUI(onSuccess: () => void, onError: () => void) { - const blob = kl.getPNG(); - - status = "uploading" - - await uploadImageToComfyUI(blob, FILENAME, DIRECTORY, SUBFOLDER) - .then((entry: ComfyImageLocation) => { - const meta: ComfyBoxImageMetadata = comfyFileToComfyBoxMetadata(entry); - $nodeValue = [meta] // TODO more than one image - status = "uploaded" - notify("Saved image to ComfyUI!", { type: "success" }) - onSuccess(); - }) - .catch(err => { - notify(`Failed to upload image from editor: ${err}`, { type: "error", timeout: 10000 }) - status = "error" - uploadError = err; - $nodeValue = [] - onError(); - }) - } - - let closeDialog = null; - - async function saveAndClose() { - console.log(closeDialog, kl) - if (!closeDialog || !kl) - return; - - submitKlecksToComfyUI(() => {}, () => {}); - closeDialog() - } - - let blankImageWidth = 512; - let blankImageHeight = 512; - - let klecks: typeof import("klecks") | null = null; - - async function openImageEditor() { - if (!editorRoot) - return; - - showModal = true; - - const url = configState.getBackendURL(); - - klecks ||= await import("klecks"); - - kl = new klecks.Embed({ - embedUrl: url, - onSubmit: submitKlecksToComfyUI, - targetEl: editorRoot, - warnOnPageClose: false - }); - - console.warn("[ImageEditorWidget] OPENING", widget, $nodeValue) - - let canvas = null; - let width = blankImageWidth; - let height = blankImageHeight; - - if ($nodeValue && $nodeValue.length > 0) { - const comfyImage = $nodeValue[0]; - const comfyURL = comfyBoxImageToComfyURL(comfyImage); - [canvas, width, height] = await generateImageCanvas(comfyURL); - } - else { - canvas = generateBlankCanvas(width, height); - } - - kl.openProject({ - width: width, - height: height, - layers: [{ - name: 'Image', - opacity: 1, - mixModeStr: 'source-over', - image: canvas - }] - }); - - setTimeout(function () { - kl?.klApp?.out("yo"); - }, 1000); - } - function openLightbox() { if (!$nodeValue || $nodeValue.length === 0) return; @@ -189,9 +195,6 @@ notify(`Failed to upload image to ComfyUI: ${uploadError}`, { type: "error", timeout: 10000 }) } - function onChange(e: CustomEvent) { - } - let _value: ComfyImageLocation[] = [] $: if ($nodeValue) _value = $nodeValue.map(comfyBoxImageToComfyFile) @@ -199,6 +202,10 @@ _value = [] $: canEdit = status === "empty" || status === "uploaded"; + + + function onChange(e: CustomEvent) { + }
@@ -219,64 +226,50 @@ /> {:else}
- - -
-
- -
-
+ {#if _value && canMask} + {@const comfyURL = convertComfyOutputToComfyURL(_value[0])} +
+
-
- - -
- + {/if} +
+ +
- {#if !$nodeValue || $nodeValue.length === 0} + {#if hasImage} + {@const maskCount = $nodeValue[0] ? $nodeValue[0].children.filter(f => f.tags?.includes("mask")).length : 0} - - + {#if canMask}
- + {#if editMask} + + {/if} +
- {#if uploadError} -
- Upload error: {uploadError} -
- {/if} -
- - - - -
- {:else} - - + {/if}
- +
{#if uploadError}
@@ -291,25 +284,13 @@