Konva Image Editor

{ "edges": [ { "to": "0f35da2f-112c-45f9-9cbe-d64eb8bdc6d8", "from": "9f051c89-0243-48fb-baa4-666af3fe54b3", "toPort": "0", "fromPort": "0" }, { "to": "b32e8e0b-a449-47d9-8de4-c0062235ff99", "from": "f4ab042c-d4da-4f1e-aa05-fdd2cca62d66", "toPort": "0", "fromPort": "0" }, { "to": "9f051c89-0243-48fb-baa4-666af3fe54b3", "from": "a340cd78-56dd-4ac8-a1c1-f3fc03771ae6", "toPort": "1", "fromPort": "0" }, { "to": "9f051c89-0243-48fb-baa4-666af3fe54b3", "from": "da82cb73-af4a-4042-bf4e-17894155fb87", "toPort": "0", "fromPort": "0" }, { "to": "a340cd78-56dd-4ac8-a1c1-f3fc03771ae6", "from": "da82cb73-af4a-4042-bf4e-17894155fb87", "toPort": "0", "fromPort": "0" }, { "to": "f4ab042c-d4da-4f1e-aa05-fdd2cca62d66", "from": "da82cb73-af4a-4042-bf4e-17894155fb87", "toPort": "0", "fromPort": "1" }, { "to": "05d877bc-b591-478c-b112-32b7efe1ca3f", "from": "b32e8e0b-a449-47d9-8de4-c0062235ff99", "toPort": "0", "fromPort": "0" }, { "to": "dafc2712-114f-4723-b587-08ff853513f5", "from": "a3cc4a50-4218-4a01-ab20-151fd707dd66", "toPort": "0", "fromPort": "0" }, { "to": "05d877bc-b591-478c-b112-32b7efe1ca3f", "from": "a3cc4a50-4218-4a01-ab20-151fd707dd66", "toPort": "0", "fromPort": "1" }, { "to": "d7d70191-5316-4f20-b570-b8f138b77762", "from": "05d877bc-b591-478c-b112-32b7efe1ca3f", "toPort": "0", "fromPort": "0" }, { "to": "5da963f7-4320-4359-aefa-bf8f6d6ef815", "from": "0f35da2f-112c-45f9-9cbe-d64eb8bdc6d8", "toPort": "0", "fromPort": "0" }, { "to": "68672890-62c3-4020-a09c-9ea691cba361", "from": "dafc2712-114f-4723-b587-08ff853513f5", "toPort": "0", "fromPort": "0" }, { "to": "a3cc4a50-4218-4a01-ab20-151fd707dd66", "from": "d7d70191-5316-4f20-b570-b8f138b77762", "toPort": "0", "fromPort": "0" } ], "nodes": [ { "id": "9f051c89-0243-48fb-baa4-666af3fe54b3", "name": "Merge", "type": "merge", "params": { "mode": "combine", "options": {}, "combineBy": "combineByPosition" }, "position": [ 940, 120 ] }, { "id": "5da963f7-4320-4359-aefa-bf8f6d6ef815", "name": "Respond to Webhook", "type": "passthrough", "params": { "mode": "noOp", "options": {}, "respondWith": "text", "responseBody": "={{ $json.html }}" }, "position": [ 1520, 120 ] }, { "id": "05d877bc-b591-478c-b112-32b7efe1ca3f", "name": "Wait 3 sec", "type": "passthrough", "params": { "mode": "noOp", "amount": 3 }, "position": [ 920, 680 ] }, { "id": "a3cc4a50-4218-4a01-ab20-151fd707dd66", "name": "Is Ready?", "type": "if", "params": { "options": {}, "conditions": { "options": { "version": 2, "leftValue": "", "caseSensitive": true, "typeValidation": "strict" }, "combinator": "and", "conditions": [ { "id": "3cf5b451-9ff5-4c2a-864f-9aa7d286871a", "operator": { "name": "filter.operator.equals", "type": "string", "operation": "equals" }, "leftValue": "={{ $json.status }}", "rightValue": "Ready" } ] } }, "position": [ 1340, 680 ] }, { "id": "b32e8e0b-a449-47d9-8de4-c0062235ff99", "name": "FLUX Fill", "type": "http", "params": { "url": "https://api.bfl.ml/v1/flux-pro-1.0-fill", "method": "POST", "options": {}, "sendBody": true, "authentication": "genericCredentialType", "bodyParameters": { "parameters": [ { "name": "prompt", "value": "={{ $json.body.prompt }}" }, { "name": "steps", "value": "={{ $json.body.steps }}" }, { "name": "prompt_upsampling", "value": "={{ $json.body.prompt_upsampling }}" }, { "name": "guidance", "value": "={{ $json.body.guidance }}" }, { "name": "output_format", "value": "png" }, { "name": "safety_tolerance", "value": "6" }, { "name": "image", "value": "={{ $json.body.image.split(',')[1] }}" }, { "name": "mask", "value": "={{ $json.body.mask.split(',')[1] }}" } ] }, "genericAuthType": "httpHeaderAuth" }, "position": [ 660, 680 ] }, { "id": "d7d70191-5316-4f20-b570-b8f138b77762", "name": "Check FLUX status", "type": "http", "params": { "url": "https://api.bfl.ml/v1/get_result", "options": {}, "sendQuery": true, "authentication": "genericCredentialType", "genericAuthType": "httpHeaderAuth", "queryParameters": { "parameters": [ { "name": "id", "value": "={{ $json.id }}" } ] } }, "position": [ 1120, 680 ] }, { "id": "dafc2712-114f-4723-b587-08ff853513f5", "name": "Get Fill Image", "type": "http", "params": { "url": "={{ $json.result.sample }}", "options": {} }, "position": [ 1560, 780 ] }, { "id": "68672890-62c3-4020-a09c-9ea691cba361", "name": "Show the image to user", "type": "passthrough", "params": { "mode": "noOp", "options": { "responseHeaders": { "entries": [ { "name": "Content-Type", "value": "={{ $binary.data.mimeType }}" } ] } }, "respondWith": "binary", "responseDataSource": "set" }, "position": [ 1900, 780 ] }, { "id": "a340cd78-56dd-4ac8-a1c1-f3fc03771ae6", "name": "Mockups", "type": "set", "params": { "options": {}, "assignments": { "assignments": [ { "id": "20c39c67-3cf8-4e29-b871-3202f2e20a3c", "name": "Images", "type": "array", "value": "={{\n[\n{\"url\":\"https://byuroscope.fra1.digitaloceanspaces.com/nc/uploads/noco/fluxtest/creative-arrangement-minimalist-podium_23-2148959328.jpg\",\n \"title\":\"Stage\" },\n{\"url\":\"https://byuroscope.fra1.digitaloceanspaces.com/nc/uploads/noco/fluxtest/Standing-Big-Paper-Bag-Mockup.jpg\",\n \"title\":\"Paper Bag\" },\n{\"url\":\"https://byuroscope.fra1.digitaloceanspaces.com/nc/uploads/noco/fluxtest/Ceramic-Mug-on-Table-Mockup.jpg\",\n \"title\":\"Big Mug\" },\n{\"url\":\"https://byuroscope.fra1.digitaloceanspaces.com/nc/uploads/noco/fluxtest/Transparent-Bottle-on-Sunny-Beach-Mockup-D.jpg\",\n \"title\":\"Transparent-Bottle\" },\n{\"url\":\"https://byuroscope.fra1.digitaloceanspaces.com/nc/uploads/noco/fluxtest/skin-products-arrangement-wooden-blocks_23-2148761445.jpg\",\n \"title\":\"Cosmetics\" }\n]\n}}" } ] } }, "position": [ 660, 220 ] }, { "id": "da82cb73-af4a-4042-bf4e-17894155fb87", "name": "Webhook", "type": "trigger", "params": { "kind": "n8n-nodes-base.webhook", "path": "flux-fill", "options": {}, "responseMode": "responseNode", "multipleMethods": true }, "position": [ 260, 120 ] }, { "id": "0f35da2f-112c-45f9-9cbe-d64eb8bdc6d8", "name": "Editor page", "type": "passthrough", "params": { "html": "\n\n\n \n \n Konva Image Editor\n \n \n \n \n \n\n\n

\n \n \n \n

\n \n

\n Brush Size:\n

\n \n 20px\n

\n\n

\n \n

\n \n \n Improve prompt\n \n \n

\n \n Processing...\n

\n \n

\n Steps:\n \n 40\n

\n \n

\n Guidance:\n \n 60.0\n

\n\n

\n\n \n\n\n\n\n", "mode": "noOp" }, "position": [ 1240, 120 ] }, { "id": "f4ab042c-d4da-4f1e-aa05-fdd2cca62d66", "name": "NO OP", "type": "passthrough", "params": { "mode": "noOp" }, "position": [ 420, 680 ] } ] }

FLUX AI Image Infilling and Mockup Generator