fix afterChange may override other extensions (#15)

CHANGELOG.md

@@ -1,14 +1,47 @@
-# [](https://github.com/failfa-st/failfast-comfyui-extensions/compare/v1.3.0...v) (2023-08-01)
+# [1.7.0](https://github.com/failfa-st/failfast-comfyui-extensions/compare/v1.6.1...v1.7.0) (2023-08-26)
+
+
+### Features
+
+* add hidden to global LinkRenderModes ([#11](https://github.com/failfa-st/failfast-comfyui-extensions/issues/11)) ([18e74b6](https://github.com/failfa-st/failfast-comfyui-extensions/commit/18e74b627caeb5bafa0fbeb4264e2c092c73f59a))
+
+
+
+## [1.6.1](https://github.com/failfa-st/failfast-comfyui-extensions/compare/v1.6.0...v1.6.1) (2023-08-10)
+
+
+### Features
+
+* remove links render mode ([e0a4343](https://github.com/failfa-st/failfast-comfyui-extensions/commit/e0a4343965dec9c3d283d1c9cd281a85f95e1063))
+
+
+
+## [1.6.0](https://github.com/failfa-st/failfast-comfyui-extensions/compare/v1.6.0...v1.5.1) (2023-08-10)
+
+
+### Features
+
+* remove links render mode ([e0a4343](https://github.com/failfa-st/failfast-comfyui-extensions/commit/e0a4343965dec9c3d283d1c9cd281a85f95e1063))
+
+
+
+## [1.5.1](https://github.com/failfa-st/failfast-comfyui-extensions/compare/v1.5.0...v1.5.1) (2023-08-01)
+
+
+### Bug Fixes
+
+* **colors:** set default value of colorpicker ([c0e70fd](https://github.com/failfa-st/failfast-comfyui-extensions/commit/c0e70fd1ad8bf7b2e73450a276ab8ebd3277e86a))
+
+
+# [1.5.0](https://github.com/failfa-st/failfast-comfyui-extensions/compare/v1.4.0...v1.5.0) (2023-08-01)
 
 
 ### Features
 
-* **images:** allow copy image ([27eb284](https://github.com/failfa-st/failfast-comfyui-extensions/commit/27eb284229235e301496326d22cd3c48e16f6f23))
 * **reroute:** allow dot & microdot ([088f89d](https://github.com/failfa-st/failfast-comfyui-extensions/commit/088f89d41406b081d37e29c5601dc529997c6c33))
 
 
-
-# [](https://github.com/failfa-st/failfast-comfyui-extensions/compare/v1.3.0...v) (2023-08-01)
+# [1.4.0](https://github.com/failfa-st/failfast-comfyui-extensions/compare/v1.3.0...v1.4.0) (2023-08-01)
 
 
 ### Features
@@ -16,28 +49,23 @@
 * **images:** allow copy image ([27eb284](https://github.com/failfa-st/failfast-comfyui-extensions/commit/27eb284229235e301496326d22cd3c48e16f6f23))
 
 
-
-# [](https://github.com/failfa-st/failfast-comfyui-extensions/compare/v1.0.0...v) (2023-08-01)
-
+# [1.3.0](https://github.com/failfa-st/failfast-comfyui-extensions/compare/v1.2.0...v1.3.0) (2023-08-01)
 
 ### Features
 
 * allow Reroute as dot ([9cf412f](https://github.com/failfa-st/failfast-comfyui-extensions/commit/9cf412f4d7c05eaf4f958b8e0752cb75d764425a))
-* **reroutes:** allow showing title on reroute ([27e49f8](https://github.com/failfa-st/failfast-comfyui-extensions/commit/27e49f83d5c37a529638862132a40cd837a41127))
 
 
-
-# [](https://github.com/failfa-st/failfast-comfyui-extensions/compare/v1.0.0...v) (2023-08-01)
-
+# [1.2.0](https://github.com/failfa-st/failfast-comfyui-extensions/compare/v1.1.0...v1.2.0) (2023-08-01)
 
 ### Features
 
-* **reroutes:** al;low showing title on reroute ([27e49f8](https://github.com/failfa-st/failfast-comfyui-extensions/commit/27e49f83d5c37a529638862132a40cd837a41127))
+* **reroutes:** allow showing title on reroute ([27e49f8](https://github.com/failfa-st/failfast-comfyui-extensions/commit/27e49f83d5c37a529638862132a40cd837a41127))
+
+# [1.1.0](https://github.com/failfa-st/failfast-comfyui-extensions/compare/v1.0.0...v1.1.0) (2023-08-01)
 
 
-
-#  (2023-08-01)
-
+#  [1.0.0] (2023-08-01)
 
 ### Bug Fixes
 

README.md

@@ -1,6 +1,10 @@
-# ComfyUI Extensions by Failfa.st
+# ComfyUI Extensions by Blibla
 
-ComfyUI Extensions by Failfa.st is a robust suite of enhancements, designed to optimize your ComfyUI experience. It
+![Screenshot 2023-08-02 004936](https://github.com/failfa-st/failfast-comfyui-extensions/assets/1148334/d1530160-3c77-4aac-952f-7b9f2cf37b8f)
+
+[![Discord](https://img.shields.io/discord/1091306623819059300?color=7289da&label=Discord&logo=discord&logoColor=fff&style=for-the-badge)](https://discord.com/invite/m3TBB9XEkb)
+
+ComfyUI Extensions by Blibla is a robust suite of enhancements, designed to optimize your ComfyUI experience. It
 provides a range of features, including customizable render modes, dynamic node coloring, and versatile management
 tools. Whether for individual use or team collaboration, our extensions aim to enhance productivity, readability, and
 personalization in your ComfyUI environment.
@@ -11,6 +15,7 @@ personalization in your ComfyUI environment.
 ### If you have an idea for a new extension, you can open a [Feature Request](https://github.com/failfa-st/failfast-comfyui-extensions/issues/new?assignees=&labels=enhancement&projects=&template=feature_request.md&title=)
 
 ## Table of Contents
+
 <!-- toc -->
 
 - [Installation](#installation)
@@ -20,7 +25,6 @@ personalization in your ComfyUI environment.
 - [Update](#update)
 - [Settings](#settings)
   * [Options](#options)
-  * [Links Render Mode](#links-render-mode)
   * [Colored Nodes](#colored-nodes)
     + [Positive/Negative](#positivenegative)
     + [Dynamic Colors](#dynamic-colors)
@@ -99,7 +103,6 @@ Different customization options available with their default settings and descri
 
 | Name               | Default   | Description                                                                         |
 | ------------------ | --------- | ----------------------------------------------------------------------------------- |
-| Links Render Mode  | `spline`  | Sets the render mode of connector lines (options: straight, angled, curved, hidden) |
 | Force Snap to Grid | `false`   | Forces nodes to snap to the grid                                                    |
 | Force Box Shape    | `false`   | Removes round corners from all nodes                                                |
 | Render Shadows     | `true`    | Toggles visibility of shadows                                                       |
@@ -108,20 +111,6 @@ Different customization options available with their default settings and descri
 | Colored Nodes      | `default` | Applies dynamic coloring to nodes                                                   |
 | Batch Resize       | `false`   | Resizes multiple selected nodes to the same size synchronously                      |
 
-### Links Render Mode
-
-Choose from four rendering modes for connector lines:
-
-- straight
-- linear
-- spline (default)
-- hidden
-
-<div align="center">
-    <img src="https://github.com/ltdrdata/ComfyUI-Manager/assets/1148334/af4b05ab-33b8-4cce-be3b-59765b7ea5a6" alt="Links Render Mode" height="300px">
-    <p>Links Render Mode Options</p>
-</div>
-
 ### Colored Nodes
 
 Apply automatic color coding to nodes using various modes.
@@ -245,9 +234,9 @@ Each extension is fully capable of functioning individually. This allows you to
 
 Simply download the desired file from the [`extensions`](extensions) directory and place it in the extensions folder of ComfyUI.
 
-1. Download the required file for example, [linksRenderMode](extensions/linksRenderMode.js).
+1. Download the required file for example, [reroute](extensions/reroute.js).
 2. Transfer the file to `path/to/your/ComfyUI/web/extensions`.
-3. The folder structure should appear as: `path/to/your/ComfyUI/web/extensions/linksRenderMode.js`.
+3. The folder structure should appear as: `path/to/your/ComfyUI/web/extensions/reroute.js`.
 
 ## Contribution
 

extensions/colors.js

@@ -184,45 +184,40 @@ function colorPositiveNegative(app) {
  * Colors
  */
 let afterChange;
+let colorModeValue;
+function invokeAfterChange() {
+  switch (colorModeValue) {
+    case 1:
+      uncolor(app);
+      break;
+    case 2:
+      rainbowify(app);
+      break;
+    case 3:
+      colorByType(app);
+      break;
+    default:
+      break;
+  }
+  if (getPosNegValue()) {
+    colorPositiveNegative(app);
+  }
+  return afterChange?.apply(this, arguments);
+}
+
 function setColorMode(value, app) {
+  colorModeValue = value;
   switch (value) {
     case 1:
-      app.graph.afterChange = function () {
-        uncolor(app);
-        if (getPosNegValue()) {
-          colorPositiveNegative(app);
-        }
-        return afterChange?.apply(this, arguments);
-      };
       uncolor(app);
       break;
     case 2:
-      app.graph.afterChange = function () {
-        rainbowify(app);
-        if (getPosNegValue()) {
-          colorPositiveNegative(app);
-        }
-        return afterChange?.apply(this, arguments);
-      };
       rainbowify(app);
       break;
     case 3:
-      app.graph.afterChange = function () {
-        colorByType(app);
-        if (getPosNegValue()) {
-          colorPositiveNegative(app);
-        }
-        return afterChange?.apply(this, arguments);
-      };
       colorByType(app);
       break;
     default:
-      app.graph.afterChange = function () {
-        if (getPosNegValue()) {
-          colorPositiveNegative(app);
-        }
-        return afterChange?.apply(this, arguments);
-      };
       app.graph._nodes.forEach((node) => {
         node.bgcolor = node._bgcolor ?? node.bgcolor;
         node.color = node._color ?? node.color;
@@ -275,6 +270,7 @@ app.registerExtension({
   },
   async init(app) {
     afterChange = app.graph.afterChange;
+    app.graph.afterChange = invokeAfterChange;
     const onMenuNodeColors = LGraphCanvas.onMenuNodeColors;
     LGraphCanvas.onMenuNodeColors = function (value, options, e, menu, node) {
       const response = onMenuNodeColors.apply(this, arguments);
@@ -298,6 +294,7 @@ app.registerExtension({
               "Custom",
               $el("input", {
                 type: "color",
+                value: node.bgcolor,
                 style: {
                   position: "absolute",
                   right: "200%",
@@ -311,9 +308,9 @@ app.registerExtension({
                   node.setDirtyCanvas(true, true);
                 },
               }),
-            ]
+            ],
           ),
-        ])
+        ]),
       );
       if (isGroup) {
         menuRoot.append(
@@ -333,6 +330,7 @@ app.registerExtension({
                 "Color all",
                 $el("input", {
                   type: "color",
+                  value: node.bgcolor,
                   style: {
                     position: "absolute",
                     right: "200%",
@@ -351,9 +349,9 @@ app.registerExtension({
                     node.setDirtyCanvas(true, true);
                   },
                 }),
-              ]
+              ],
             ),
-          ])
+          ]),
         );
       }
       return response;
@@ -385,7 +383,7 @@ app.registerExtension({
                   value: index,
                   selected: index === +value,
                 });
-              })
+              }),
             ),
             $el(
               "label",
@@ -398,19 +396,19 @@ app.registerExtension({
                   type: "checkbox",
                   checked:
                     window.localStorage.getItem(
-                      `Comfy.Settings.${colorsName}-posneg`
+                      `Comfy.Settings.${colorsName}-posneg`,
                     ) === "true",
                   onchange: (event) => {
                     window.localStorage.setItem(
                       `Comfy.Settings.${colorsName}-posneg`,
-                      event.target.checked.toString()
+                      event.target.checked.toString(),
                     );
                     if (event.target.checked) {
                       colorPositiveNegative(app);
                     }
                   },
                 }),
-              ]
+              ],
             ),
           ]),
         ]);

extensions/linkRenderModes.js

@@ -0,0 +1,27 @@
+/**
+ * Coded with love by Failfa.st
+ * LICENSE: AGPL 3.0
+ * https://github.com/failfa-st/failfast-comfyui-extensions/blob/main/LICENSE
+ *
+ * Visit https://github.com/failfa-st/failfast-comfyui-extensions for more info
+ *
+ * Homepage:  https://failfa.st
+ * GitHub: https://github.com/failfa-st
+ * Discord: https://discord.com/invite/m3TBB9XEkb
+ */
+import { app } from "/scripts/app.js";
+
+/**
+ * Render Shadow
+ */
+
+const linkRenderModesName = "Failfast.linkRenderModes";
+
+app.registerExtension({
+  name: linkRenderModesName,
+  async init() {
+    if (LiteGraph?.LINK_RENDER_MODES) {
+      LiteGraph.LINK_RENDER_MODES[3] = "Hidden";
+    }
+  },
+});

extensions/linksRenderMode.js

@@ -1,66 +0,0 @@
-/**
- * Coded with love by Failfa.st
- * LICENSE: AGPL 3.0
- * https://github.com/failfa-st/failfast-comfyui-extensions/blob/main/LICENSE
- *
- * Visit https://github.com/failfa-st/failfast-comfyui-extensions for more info
- *
- * Homepage:  https://failfa.st
- * GitHub: https://github.com/failfa-st
- * Discord: https://discord.com/invite/m3TBB9XEkb
- */
-
-import { app } from "/scripts/app.js";
-import { $el } from "/scripts/ui.js";
-
-/**
- * Toggle links render mode
- */
-
-const linksRenderModeName = "Failfast.linksRenderMode";
-const renderModes = [...LiteGraph.LINK_RENDER_MODES, "hidden"];
-
-app.registerExtension({
-  name: linksRenderModeName,
-  async init(app) {
-    app.ui.settings.addSetting({
-      id: linksRenderModeName,
-      name: "Links Render Mode",
-      type(name, setter, value) {
-        return $el("tr", [
-          $el("td", [
-            $el("label", {
-              for: linksRenderModeName.replaceAll(".", "-"),
-              textContent: "Links Render Mode",
-            }),
-          ]),
-
-          $el("td", [
-            $el(
-              "select",
-              {
-                id: linksRenderModeName.replaceAll(".", "-"),
-                onchange: (event) => {
-                  setter(+event.target.value);
-                },
-              },
-              renderModes.map((mode, index) => {
-                return $el("option", {
-                  textContent: mode,
-                  value: index,
-                  selected: index === +value,
-                });
-              })
-            ),
-          ]),
-        ]);
-      },
-      tooltip: "Render mode of connector lines",
-      defaultValue: 2,
-      onChange(value) {
-        app.canvas.links_render_mode = +value;
-        app.graph.setDirtyCanvas(true, true);
-      },
-    });
-  },
-});

package.json

@@ -1,5 +1,6 @@
 {
   "name": "failfast-comfyui-extensions",
+  "version": "1.7.0",
   "scripts": {
     "changelog": "npx conventional-changelog-cli -p angular -i CHANGELOG.md -s",
     "toc": "npx markdown-toc README.md -i "