From c043f4ff0046af2b7ebf3b690e411b15f3fa441a Mon Sep 17 00:00:00 2001
From: fujammy <467918@qq.com>
Date: Thu, 26 Dec 2024 04:21:11 +0800
Subject: [PATCH] =?UTF-8?q?Enhance=20TextCombiner=20with=20improved=20UI?=
 =?UTF-8?q?=20and=20styling.=20Added=20custom=20CSS=20for=20node=20appeara?=
 =?UTF-8?q?nce,=20including=20background=20and=20title=20bar=20colors.=20U?=
 =?UTF-8?q?pdated=20JavaScript=20to=20manage=20node=20creation=20and=20con?=
 =?UTF-8?q?nections=20more=20effectively.=20This=20update=20aims=20to=20im?=
 =?UTF-8?q?prove=20the=20user=20experience=20and=20visual=20integration=20?=
 =?UTF-8?q?of=20the=20TextCombiner=20node.=20=E5=A2=9E=E5=BC=BA=E4=BA=86Te?=
 =?UTF-8?q?xtCombiner=E7=9A=84UI=E5=92=8C=E6=A0=B7=E5=BC=8F=EF=BC=8C?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E4=BA=86=E8=87=AA=E5=AE=9A=E4=B9=89CSS?=
 =?UTF-8?q?=E4=BB=A5=E8=B0=83=E6=95=B4=E8=8A=82=E7=82=B9=E5=A4=96=E8=A7=82?=
 =?UTF-8?q?=EF=BC=8C=E5=8C=85=E6=8B=AC=E8=83=8C=E6=99=AF=E5=92=8C=E6=A0=87?=
 =?UTF-8?q?=E9=A2=98=E6=A0=8F=E9=A2=9C=E8=89=B2=E3=80=82=E6=9B=B4=E6=96=B0?=
 =?UTF-8?q?=E4=BA=86JavaScript=E4=BB=A5=E6=9B=B4=E6=9C=89=E6=95=88?=
 =?UTF-8?q?=E5=9C=B0=E7=AE=A1=E7=90=86=E8=8A=82=E7=82=B9=E5=88=9B=E5=BB=BA?=
 =?UTF-8?q?=E5=92=8C=E8=BF=9E=E6=8E=A5=E3=80=82=E6=9C=AC=E6=AC=A1=E6=9B=B4?=
 =?UTF-8?q?=E6=96=B0=E6=97=A8=E5=9C=A8=E6=8F=90=E5=8D=87=E7=94=A8=E6=88=B7?=
 =?UTF-8?q?=E4=BD=93=E9=AA=8C=E5=92=8CTextCombiner=E8=8A=82=E7=82=B9?=
 =?UTF-8?q?=E7=9A=84=E8=A7=86=E8=A7=89=E6=95=B4=E5=90=88=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 __pycache__/text_combiner.cpython-311.pyc | Bin 4197 -> 4386 bytes
 text_combiner.py                          |  14 +++++++-
 web/js/text_combiner.js                   |  40 ++++++++++++++++------
 3 files changed, 42 insertions(+), 12 deletions(-)

diff --git a/__pycache__/text_combiner.cpython-311.pyc b/__pycache__/text_combiner.cpython-311.pyc
index 8cbeaca11c530b2dd05c55b57620cfa287238b17..6dab7a4743b1b57b67e547332f5b8371eacf2d35 100644
GIT binary patch
delta 369
zcmaE=ut<q-IWI340}#Z;=cEhqPUMqd^q8n_Aj_P>lF1mwoWh*K3Zz+pG#ij+O<@dX
z&}82j)4;^|b@N@OrL02oK)uCGKte&GNC-$3DNUZsX*l^P#~v9K5LXpMU{!RPkOITW
zd%1cU)i!%`*RvRwf(#Eytte4&&d*KC%u6j&_%MI++#+$HuqN|MULf@{4@CS039uFE
zPd>*l>u^iT&)>y0-o-OGz{fE%-p|q3HQv`TAi&elJ@}RwSkBoo#MRwDC=wwq3=#MD
z@ei8(h+mn@4`?DI5Es`@<`?j``oP7&Dttji;{!939Mc5`DJb6r$d>~0#lZXten74`
MkSh#9MIt~00Nid`Qvd(}

delta 204
zcmZ3a^i+XwIWI340}%X+$VnICnaC%>XfRRTfR!<rL6c=;NdpsO>E^FYOId~FfNF}F
zfP{iVkr0q7Qk=Yo<E@M`h^Yc1uqrT|{ETxEVMSNDdKpzWCv(@cNN6$_>4A)60TQ=_
p{rp{A<DGpRgM%j*2q<&80|gm@xY%#<Tmf(H3k<?QR3riv0RTwUDvbaD

diff --git a/text_combiner.py b/text_combiner.py
index 71e4052..98b6477 100644
--- a/text_combiner.py
+++ b/text_combiner.py
@@ -17,7 +17,7 @@ class TextCombiner:
                 }),
                 "use_regex": ("BOOLEAN", {"default": False}),
             },
-            "optional": {}
+            "optional": {},
         }
     
     RETURN_TYPES = ("STRING",)
@@ -70,3 +70,15 @@ class TextCombiner:
 NODE_CLASS_MAPPINGS = {
     "TextCombiner": TextCombiner,
 }
+
+NODE_DISPLAY_NAME_MAPPINGS = {
+    "TextCombiner": "Text Combiner 📝",
+}
+
+NODE_CATEGORY_MAPPINGS = {
+    "TextCombiner": "🎨Painting👓Coder/📝Text",
+}
+
+NODE_COLOR_MAPPINGS = {
+    "TextCombiner": (13, 110, 253),  # Bootstrap 蓝色
+}
diff --git a/web/js/text_combiner.js b/web/js/text_combiner.js
index e1f7e9f..5acce7f 100644
--- a/web/js/text_combiner.js
+++ b/web/js/text_combiner.js
@@ -4,49 +4,67 @@ app.registerExtension({
     name: "Comfy.PaintingCoder.TextCombiner",
     async beforeRegisterNodeDef(nodeType, nodeData, app) {
         if (nodeData.name === "TextCombiner") {
+            // 添加 CSS 样式 - 使用更深的莫兰迪蓝
+            const style = document.createElement('style');
+            style.textContent = `
+                .comfy-node[data-type="TextCombiner"] {
+                    background-color: rgb(63, 77, 85) !important;
+                    color: rgb(255, 255, 255) !important;
+                }
+
+                .comfy-node[data-type="TextCombiner"] .title-box {
+                    background-color: rgb(45, 55, 65) !important;
+                    color: rgb(33, 37, 41) !important;
+                }
+
+                .comfy-node[data-type="TextCombiner"]:hover {
+                    background-color: rgba(63, 77, 85, 0.9) !important;
+                }
+            `;
+            document.head.appendChild(style);
+
             const onNodeCreated = nodeType.prototype.onNodeCreated;
             nodeType.prototype.onNodeCreated = function() {
                 const result = onNodeCreated ? onNodeCreated.apply(this, arguments) : undefined;
                 
                 // 初始化状态
                 this.lastConnectedCount = 0;
-                
-                // 添加第一个输入点
-                console.log("初始化：添加第一个输入点");
                 this.addInput("text_1", "STRING");
                 
+                // 直接设置节点颜色 - 使用更深的莫兰迪蓝
+                if (this.constructor.nodeData?.name === "TextCombiner") {
+                    this.bgcolor = "#2e414a";  //（面板）
+                    this.color = "#132832"; 
+                    if (this.title_box) {
+                        this.title_box.style.backgroundColor = "rgb(45, 55, 65)";  // 更深的标题栏颜色
+                        this.title_box.style.color = "#212529";  // 黑色文字
+                    }
+                }
+                
                 return result;
             };
 
             nodeType.prototype.onConnectionsChange = function(connectionType, slot, isConnected) {
                 if (connectionType === 1) {  // 输入连接
-                    console.log(`连接变化 - 槽位: ${slot}, 已连接: ${isConnected}`);
-                    
                     const connectedCount = this.inputs.reduce((count, input) => 
                         count + (input.link ? 1 : 0), 0);
-                    
-                    console.log(`当前连接数量: ${connectedCount}, 上次连接数量: ${this.lastConnectedCount}`);
 
                     if (connectedCount !== this.lastConnectedCount) {
                         this.lastConnectedCount = connectedCount;
                         const targetCount = connectedCount + 1;
-                        console.log(`目标输入点数量: ${targetCount}`);
 
                         while (this.inputs.length < targetCount) {
                             const newIndex = this.inputs.length + 1;
-                            console.log(`添加新输入点: text_${newIndex}`);
                             this.addInput(`text_${newIndex}`, "STRING");
                         }
 
                         while (this.inputs.length > Math.max(targetCount, 1)) {
                             const lastInput = this.inputs[this.inputs.length - 1];
                             if (!lastInput.link) {
-                                console.log(`移除输入点: ${this.inputs.length}`);
                                 this.removeInput(this.inputs.length - 1);
                             }
                         }
 
-                        console.log(`更新节点大小，当前输入点数量: ${this.inputs.length}`);
                         this.setSize(this.computeSize());
                         app.graph.setDirtyCanvas(true);
                     }