From a7a0035b0e8e0032fa5adf0de13eea3a3e065088 Mon Sep 17 00:00:00 2001
From: "Alex \"mcmonkey\" Goodwin"
 <4000772+mcmonkey4eva@users.noreply.github.com>
Date: Wed, 2 Oct 2024 07:49:59 -0700
Subject: [PATCH] allow custom bypass color (#993)

* allow custom bypass color

* shove the not-litegraph-color-def into litegraph

* prettier just does this to be funny i swear
---
 src/extensions/core/colorPalette.ts | 11 +++++++++++
 src/scripts/app.ts                  |  4 +++-
 src/types/colorPalette.ts           |  1 +
 3 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/src/extensions/core/colorPalette.ts b/src/extensions/core/colorPalette.ts
index fa67fca87..0db3ce95b 100644
--- a/src/extensions/core/colorPalette.ts
+++ b/src/extensions/core/colorPalette.ts
@@ -42,6 +42,7 @@ const colorPalettes: ColorPalettes = {
         NODE_DEFAULT_BOXCOLOR: '#666',
         NODE_DEFAULT_SHAPE: 'box',
         NODE_BOX_OUTLINE_COLOR: '#FFF',
+        NODE_BYPASS_BGCOLOR: '#FF00FF',
         DEFAULT_SHADOW_COLOR: 'rgba(0,0,0,0.5)',
         DEFAULT_GROUP_FONT: 24,
 
@@ -107,6 +108,7 @@ const colorPalettes: ColorPalettes = {
         NODE_DEFAULT_BOXCOLOR: '#CCC',
         NODE_DEFAULT_SHAPE: 'box',
         NODE_BOX_OUTLINE_COLOR: '#000',
+        NODE_BYPASS_BGCOLOR: '#FF00FF',
         DEFAULT_SHADOW_COLOR: 'rgba(0,0,0,0.1)',
         DEFAULT_GROUP_FONT: 24,
 
@@ -170,6 +172,7 @@ const colorPalettes: ColorPalettes = {
         NODE_DEFAULT_BOXCOLOR: '#839496', // Base0
         NODE_DEFAULT_SHAPE: 'box',
         NODE_BOX_OUTLINE_COLOR: '#fdf6e3', // Base3
+        NODE_BYPASS_BGCOLOR: '#FF00FF',
         DEFAULT_SHADOW_COLOR: 'rgba(0,0,0,0.5)',
         DEFAULT_GROUP_FONT: 24,
 
@@ -246,6 +249,7 @@ const colorPalettes: ColorPalettes = {
         NODE_DEFAULT_BOXCOLOR: '#6e7581',
         NODE_DEFAULT_SHAPE: 'box',
         NODE_BOX_OUTLINE_COLOR: '#FFF',
+        NODE_BYPASS_BGCOLOR: '#FF00FF',
         DEFAULT_SHADOW_COLOR: 'rgba(0,0,0,0.5)',
         DEFAULT_GROUP_FONT: 22,
         WIDGET_BGCOLOR: '#2b2f38',
@@ -320,6 +324,7 @@ const colorPalettes: ColorPalettes = {
         NODE_DEFAULT_BOXCOLOR: '#545d70',
         NODE_DEFAULT_SHAPE: 'box',
         NODE_BOX_OUTLINE_COLOR: '#e5eaf0',
+        NODE_BYPASS_BGCOLOR: '#FF00FF',
         DEFAULT_SHADOW_COLOR: 'rgba(0,0,0,0.5)',
         DEFAULT_GROUP_FONT: 24,
         WIDGET_BGCOLOR: '#2e3440',
@@ -394,6 +399,7 @@ const colorPalettes: ColorPalettes = {
         NODE_DEFAULT_BOXCOLOR: '#30363d',
         NODE_DEFAULT_SHAPE: 'box',
         NODE_BOX_OUTLINE_COLOR: '#e5eaf0',
+        NODE_BYPASS_BGCOLOR: '#FF00FF',
         DEFAULT_SHADOW_COLOR: 'rgba(0,0,0,0.5)',
         DEFAULT_GROUP_FONT: 24,
         WIDGET_BGCOLOR: '#161b22',
@@ -696,6 +702,11 @@ app.registerExtension({
             )
           }
         }
+        // Sets special case colors
+        if (colorPalette.colors.litegraph_base.NODE_BYPASS_BGCOLOR) {
+          app.bypassBgColor =
+            colorPalette.colors.litegraph_base.NODE_BYPASS_BGCOLOR
+        }
         app.canvas.draw(true, true)
       }
     }
diff --git a/src/scripts/app.ts b/src/scripts/app.ts
index 33e4646a2..2ff895b25 100644
--- a/src/scripts/app.ts
+++ b/src/scripts/app.ts
@@ -135,6 +135,7 @@ export class ComfyApp {
   bodyBottom: HTMLElement
   canvasContainer: HTMLElement
   menu: ComfyAppMenu
+  bypassBgColor: string
 
   // @deprecated
   // Use useExecutionStore().executingNodeId instead
@@ -155,6 +156,7 @@ export class ComfyApp {
       parent: document.body
     })
     this.menu = new ComfyAppMenu(this)
+    this.bypassBgColor = '#FF00FF'
 
     /**
      * List of extensions that are registered with the app
@@ -1566,7 +1568,7 @@ export class ComfyApp {
       // @ts-expect-error
       if (node.mode === 4) {
         // never
-        bgColor = '#FF00FF'
+        bgColor = app.bypassBgColor
         this.editor_alpha = 0.2
       } else {
         bgColor = old_bgcolor || LiteGraph.NODE_DEFAULT_BGCOLOR
diff --git a/src/types/colorPalette.ts b/src/types/colorPalette.ts
index 8e9af5ee9..e12aed9d0 100644
--- a/src/types/colorPalette.ts
+++ b/src/types/colorPalette.ts
@@ -44,6 +44,7 @@ const litegraphBaseSchema = z
     NODE_DEFAULT_BOXCOLOR: z.string(),
     NODE_DEFAULT_SHAPE: z.string(),
     NODE_BOX_OUTLINE_COLOR: z.string(),
+    NODE_BYPASS_BGCOLOR: z.string(),
     DEFAULT_SHADOW_COLOR: z.string(),
     DEFAULT_GROUP_FONT: z.number(),
     WIDGET_BGCOLOR: z.string(),