diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..b0340f4 --- /dev/null +++ b/LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2023 Haoming + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/README.md b/README.md index 56bfdc1..63d91b2 100644 --- a/README.md +++ b/README.md @@ -1,2 +1,14 @@ # ComfyUI Node Beautify -W.I.P \ No newline at end of file +A simple Extension to format the workflow + +## Features +Round the **size** and the **position** of each node and group in a workflow by a preset value + +## How to Use +- Clone this repo into the `~/ComfyUI/custom_nodes` folder +- This will add a button, **Beautify**, to the menu. Simply click it to format the workflow~ + +## Configs +You can edit the `configs.js` file to change some settings. +- **GRID_SIZE:** Change the values to round to +- **FIXED_SIZE:** Set a constant size for nodes of specified type diff --git a/__init__.py b/__init__.py new file mode 100644 index 0000000..dbf261d --- /dev/null +++ b/__init__.py @@ -0,0 +1,3 @@ +WEB_DIRECTORY = "js" +NODE_CLASS_MAPPINGS = {} +NODE_DISPLAY_NAME_MAPPINGS = {} diff --git a/js/configs.js b/js/configs.js new file mode 100644 index 0000000..2f7dbe9 --- /dev/null +++ b/js/configs.js @@ -0,0 +1,10 @@ +// Round to the cloest multiples of this value +export const GRID_SIZE = 10; + +// NodeType, (Width, Height) +export const FIXED_SIZE = { + + "CLIPTextEncode": [400.0, 160.0], + "PreviewImage": [420.0, 420.0], + +}; diff --git a/js/functions.js b/js/functions.js new file mode 100644 index 0000000..239b4c4 --- /dev/null +++ b/js/functions.js @@ -0,0 +1,30 @@ +import { GRID_SIZE, FIXED_SIZE } from "./configs.js"; + +function round(value) { + return value - value % GRID_SIZE; +} + +export function Process(graph) { + graph["nodes"].forEach((node) => { + + if (node["type"] in FIXED_SIZE) { + node["size"] = FIXED_SIZE[node["type"]]; + } + + ["pos", "size"].forEach((mode) => { + [0, 1].forEach((index) => { + node[mode][index] = round(node[mode][index]); + }); + }); + + }); + + graph["groups"].forEach((group) => { + + for (let i = 0; i < 4; i++) + group["bounding"][i] = round(group["bounding"][i]); + + }); + + return graph; +} diff --git a/js/node_beautify.js b/js/node_beautify.js new file mode 100644 index 0000000..dfd68a9 --- /dev/null +++ b/js/node_beautify.js @@ -0,0 +1,18 @@ +import { app } from "../../scripts/app.js"; +import { Process } from "./functions.js"; + +app.registerExtension({ + name: "Comfy.NodeBeautify", + async setup() { + const menu = document.querySelector(".comfy-menu"); + + const beautifyButton = document.createElement("button"); + beautifyButton.textContent = "Beautify"; + beautifyButton.addEventListener("click", () => { + app.loadGraphData(Process(app.graph.serialize())); + }); + + const refreshButton = document.getElementById("comfy-refresh-button"); + menu.insertBefore(beautifyButton, refreshButton); + } +});