Update README.md

Update Github Action for Publishing to Comfy Registry

.github/workflows/publish_action.yml

@@ -0,0 +1,25 @@
+name: Publish to Comfy registry
+on:
+  workflow_dispatch:
+  push:
+    branches:
+      - main
+    paths:
+      - "pyproject.toml"
+
+permissions:
+  issues: write
+
+jobs:
+  publish-node:
+    name: Publish Custom Node to registry
+    runs-on: ubuntu-latest
+    if: ${{ github.repository_owner == 'crystian' }}
+    steps:
+      - name: Check out code
+        uses: actions/checkout@v4
+      - name: Publish Custom Node
+        uses: Comfy-Org/publish-node-action@v1
+        with:
+          ## Add your own personal access token to your Github Repository secrets and reference it here.
+          personal_access_token: ${{ secrets.REGISTRY_ACCESS_TOKEN }}

.gitignore

@@ -153,3 +153,4 @@ cython_debug/
 *.pyc
 
 .idea
+/node.zip

.others/pre-commit

@@ -1,6 +1,6 @@
 #!/bin/bash
 python .others/version.py
 
-git add __init__.py
+git add __init__.py pyproject.toml version
 
 exit 0

.others/version.py

@@ -31,3 +31,24 @@ if not file1VersionFound:
 
 with open(file1, "w") as f2:
     f2.writelines(lines)
+
+
+# modify pyproject.toml file with @version
+file3 = os.path.join(os.path.dirname(__file__), "../pyproject.toml")
+print(f"> File3: {file3}")
+
+file3VersionFound = False
+# lines = None
+with open(file3, "r") as f:
+    lines = f.readlines()
+    for line in lines:
+
+        if "version = " in line:
+            file3VersionFound = True
+            lines[lines.index(line)] = f"version = \"{version}\"\n"
+
+if not file3VersionFound:
+    raise RuntimeError(f"Version label not found in file: {file3}")
+
+with open(file3, "w") as f3:
+    f3.writelines(lines)

README.md

@@ -1,4 +1,4 @@
-# ComfyUI-Crystools-save [![Hits](https://hits.seeyoufarm.com/api/count/incr/badge.svg?url=https%3A%2F%2Fgithub.com%2Fcrystian%2FComfyUI-Crystools-save&count_bg=%2379C83D&title_bg=%23555555&icon=&icon_color=%23E7E7E7&title=hits&edge_flat=false)](https://hits.seeyoufarm.com) [![Donate](https://img.shields.io/badge/Donate-PayPal-blue.svg)](https://paypal.me/crystian77)
+[deprecated] # ComfyUI-Crystools-save [![Hits](https://hits.seeyoufarm.com/api/count/incr/badge.svg?url=https%3A%2F%2Fgithub.com%2Fcrystian%2FComfyUI-Crystools-save&count_bg=%2379C83D&title_bg=%23555555&icon=&icon_color=%23E7E7E7&title=hits&edge_flat=false)](https://hits.seeyoufarm.com) [![Donate](https://img.shields.io/badge/Donate-PayPal-blue.svg)](https://paypal.me/crystian77)
 
 🪛 **_You can save your workflows with a particular file name (finally!), and save author info as metadata_** 🪛
 

__init__.py

@@ -2,7 +2,7 @@
 @author: Crystian
 @title: Crystools-save
 @nickname: Crystools-save
-@version: 1.1.0
+@version: 1.4.2
 @project: "https://github.com/crystian/ComfyUI-Crystools-save",
 @description: With this quality of life extension, you can save your workflow with a specific name and include additional details such as the author, a description, and the version (in metadata/json) IG: https://www.instagram.com/crystian.ia
 """

pyproject.toml

@@ -0,0 +1,14 @@
+[project]
+name = "comfyui-crystools-save"
+description = "[Deprecated in favor of the new saving system] With this quality of life extension, you can save your workflow with a specific name and include additional details such as the author, a description, and the version (in metadata/json). Important: When you share your workflow (via png/json), others will be able to see your information!"
+version = "1.4.2"
+license = { file = "LICENSE" }
+
+[project.urls]
+Repository = "https://github.com/crystian/ComfyUI-Crystools-save"
+#  Used by Comfy Registry https://comfyregistry.org
+
+[tool.comfy]
+PublisherId = "crystian"
+DisplayName = "ComfyUI-Crystools-save"
+Icon = "https://raw.githubusercontent.com/crystian/ComfyUI-Crystools/main/docs/screwdriver.png"

version

@@ -1 +1 @@
-1.1.0
+1.4.2

web/common.js

@@ -0,0 +1,19 @@
+export const commonPrefix = '🪛';
+
+export function injectCss(href) {
+  if (document.querySelector(`link[href^='${href}']`)) {
+    return Promise.resolve();
+  }
+  return new Promise((resolve) => {
+    const link = document.createElement('link');
+    link.setAttribute('rel', 'stylesheet');
+    link.setAttribute('type', 'text/css');
+    const timeout = setTimeout(resolve, 1000);
+    link.addEventListener('load', (_e) => {
+      clearInterval(timeout);
+      resolve();
+    });
+    link.href = href;
+    document.head.appendChild(link);
+  });
+}

web/js/common.js

@@ -1 +0,0 @@
-export const commonPrefix = '🪛';

web/save.css

@@ -0,0 +1,32 @@
+.comfy-menu #crystools-root {
+	/*background-color: red;*/
+	display: flex;
+	width: 100%;
+	flex-direction: column;
+
+	#crystools-project-input-container{
+		margin: 6px;
+		width: 100%;
+		order: 5;
+
+		input{
+			width: 80%;
+		}
+	}
+}
+
+.comfyui-menu #crystools-root {
+	/*background-color: red;*/
+	/*display: flex;*/
+	/*min-width: 300px;*/
+
+	#crystools-project-input-container{
+		margin: 6px;
+		/*width: 100%;*/
+		order: 5;
+
+		input{
+			width: 80px;
+		}
+	}
+}

web/workflow.js

@@ -1,7 +1,10 @@
-import { app } from '../../../scripts/app.js';
-import { $el } from '../../../scripts/ui.js';
-import { commonPrefix } from './common.js';
+import { app } from '../../scripts/app.js';
+import { $el } from '../../scripts/ui.js';
+import { commonPrefix, injectCss } from './common.js';
 
+injectCss('extensions/ComfyUI-Crystools-save/save.css').then(() => {
+  // console.log('injectCss');
+});
 
 class CrystoolsSave {
   // common variables
@@ -37,49 +40,23 @@ class CrystoolsSave {
   createSettings = () => {
     /** Form on settings: (the order is important) */
 
-    // show the input on menu
+    // version
     app.ui.settings.addSetting({
-      id: this.idProjectNameShow,
-      name: this.menuPrefix + 'Show project name [menu]',
-      type: 'boolean',
-      defaultValue: this.defaultProjectNameShow,
-      onChange: this.showProjectName,
-    });
-
-    // use new save button
-    app.ui.settings.addSetting({
-      id: this.idNewSave,
-      name: this.menuPrefix + 'New save button (requires page reload) [save]',
-      type: 'boolean',
-      tooltip: 'This will replace the save button function and propose the name of project as filename!',
-      defaultValue: this.defaultNewSave,
-      onChange: this.saveFunctionSwitch,
-    });
-
-    // project name
-    app.ui.settings.addSetting({
-      id: this.idProjectNameText,
-      name: this.menuPrefix + 'Project name [save]',
+      id: this.idVersion,
+      name: 'Version',
+      category: ['Crystools', this.menuPrefix + ' [Deprecated] Save', 'version' ],
       type: 'text',
-      defaultValue: this.defaultProjectNameText,
-      onChange: this.updateProjectName,
-    });
-
-    // author
-    app.ui.settings.addSetting({
-      id: this.idAuthor,
-      name: this.menuPrefix + 'Author [save]',
-      type: 'text',
-      defaultValue: this.defaultAuthor,
+      defaultValue: this.defaultVersion,
       onChange: (value) => {
-        this.updateInfoOnGraph({author: value});
+        this.updateInfoOnGraph({version: value});
       },
     });
 
     // description
     app.ui.settings.addSetting({
       id: this.idDescription,
-      name: this.menuPrefix + 'Description [save]',
+      name: 'Description',
+      category: ['Crystools', this.menuPrefix + ' [Deprecated] Save', 'desc' ],
       type: 'text',
       defaultValue: this.defaultDescription,
       onChange: (value) => {
@@ -87,29 +64,72 @@ class CrystoolsSave {
       },
     });
 
-    // version
+    // author
     app.ui.settings.addSetting({
-      id: this.idVersion,
-      name: this.menuPrefix + 'Version [save]',
+      id: this.idAuthor,
+      name: 'Author',
+      category: ['Crystools', this.menuPrefix + ' [Deprecated] Save', 'author' ],
       type: 'text',
-      defaultValue: this.defaultVersion,
+      defaultValue: this.defaultAuthor,
       onChange: (value) => {
-        this.updateInfoOnGraph({version: value});
+        this.updateInfoOnGraph({author: value});
       },
     });
+
+    // project name
+    app.ui.settings.addSetting({
+      id: this.idProjectNameText,
+      name: 'Project name',
+      category: ['Crystools', this.menuPrefix + ' [Deprecated] Save', 'name' ],
+      type: 'text',
+      defaultValue: this.defaultProjectNameText,
+      onChange: this.updateProjectName,
+    });
+
+    // use new save button
+    app.ui.settings.addSetting({
+      id: this.idNewSave,
+      name: 'New save button',
+      category: ['Crystools', this.menuPrefix + ' [Deprecated] Save', 'new button' ],
+      type: 'boolean',
+      tooltip: 'This will replace the save button function and propose the name of project as filename! (requires page reload)',
+      defaultValue: this.defaultNewSave,
+      onChange: this.saveFunctionSwitch,
+    });
+
+    // show the input on menu
+    app.ui.settings.addSetting({
+      id: this.idProjectNameShow,
+      name: 'Show project name on menu',
+      category: ['Crystools', this.menuPrefix + ' [Deprecated] Save', 'menu' ],
+      type: 'boolean',
+      defaultValue: this.defaultProjectNameShow,
+      onChange: this.showProjectName,
+    });
   };
 
   setup() {
-    app.graph.onConfigure = (a) => {
+    // save the original onConfigure event
+    const onConfigure = app.graph.onConfigure;
+
+    app.graph.onConfigure = () => {
+      // when load a workflow from file pass here!
       // on drops a file on the canvas
-      this.getInfoOnGraph().then((p) => {
+      onConfigure?.bind(this); // recall the original event
 
-        if (!p.workflow.extra.info) {
-          p.workflow.extra.info = {};
-        }
+      // this is a hack to wait the rerouters nodes created
+      setTimeout(() => {
+        this.getInfoOnGraph().then((p) => {
+          if (!p.workflow.extra.info) {
+            p.workflow.extra.info = {
+              name: this.defaultProjectNameText,
+            };
+          }
 
-        this.setInfoOnGraph(p.workflow.extra.info);
-      });
+          app.ui.settings.setSettingValue(this.idProjectNameText, p.workflow.extra.info.name);
+          this.setInfoOnGraph(p.workflow.extra.info);
+        });
+      }, 100);
     };
 
     const parentElement = document.getElementById('queue-button');
@@ -118,28 +138,21 @@ class CrystoolsSave {
     if(!ctoolsRoot){
       ctoolsRoot = document.createElement('div');
       ctoolsRoot.setAttribute('id', this.htmlIdCrystoolsRoot);
-      ctoolsRoot.style.display = 'flex';
-      ctoolsRoot.style.width = '100%';
-      ctoolsRoot.style.flexDirection = 'column';
       parentElement.insertAdjacentElement('afterend', ctoolsRoot);
     }
 
     const htmlContainer = document.createElement('div');
     htmlContainer.setAttribute('id', this.htmlIdCrystoolsInputContainer);
-    htmlContainer.style.margin = '6px 0';
-    htmlContainer.style.width = '100%';
-    htmlContainer.style.order = '5';
     ctoolsRoot.append(htmlContainer);
 
     const projectNameInput = document.createElement('input');
     projectNameInput.setAttribute('placeholder', 'Project name');
-    projectNameInput.style.width = '80%';
     htmlContainer.append(projectNameInput);
     this.inputRefProjectNameText = projectNameInput;
 
     // events for the input to persist the data on workflow
     projectNameInput.addEventListener('keyup', (event) => {
-      this.updateProjectName(event.target.value);
+      app.ui.settings.setSettingValue(this.idProjectNameText, event.target.value);
     });
 
     // this boolean does not save the value on workflow
@@ -166,21 +179,20 @@ class CrystoolsSave {
   // just persist the data on workflow reference
   setInfoOnGraph = (values) => {
     // create the info object if not exists on workflow
-
     let name = values?.name || this.defaultProjectNameText;
-    app.ui.settings.setSettingValue(this.idProjectNameText, name);
+    // app.ui.settings.setSettingValue(this.idProjectNameText, name);
     values.name = name;
 
     let author = values?.author || this.defaultAuthor;
-    app.ui.settings.setSettingValue(this.idAuthor, author);
+    // app.ui.settings.setSettingValue(this.idAuthor, author);
     values.author = author;
 
     let description = values?.description || this.defaultDescription;
-    app.ui.settings.setSettingValue(this.idDescription, description);
+    // app.ui.settings.setSettingValue(this.idDescription, description);
     values.description = description;
 
     let version = values?.version || this.defaultVersion;
-    app.ui.settings.setSettingValue(this.idVersion, version);
+    // app.ui.settings.setSettingValue(this.idVersion, version);
     values.version = version;
 
     if (!(values?.created)) {
@@ -219,7 +231,9 @@ class CrystoolsSave {
         if (!p.workflow.extra.info) {
           p.workflow.extra.info = {};
         }
-        this.setInfoOnGraph(Object.assign(p.workflow.extra.info, {name: value}));
+        const finalValue = Object.assign(p.workflow.extra.info, {name: value});
+        // console.log(finalValue);
+        this.setInfoOnGraph(finalValue);
       });
     }
   };