Skip to content

Commit

Permalink
Merge pull request #38 from hayden-fr/next-ui
Browse files Browse the repository at this point in the history
Refactor the code structure and optimize the UI.
  • Loading branch information
hayden-fr authored Nov 2, 2024
2 parents 15a0fdd + 599ac92 commit 5b6e00b
Show file tree
Hide file tree
Showing 83 changed files with 10,153 additions and 10,434 deletions.
12 changes: 0 additions & 12 deletions .editorconfig

This file was deleted.

99 changes: 92 additions & 7 deletions .github/workflows/publish.yml
Original file line number Diff line number Diff line change
@@ -1,21 +1,106 @@
name: Publish to Comfy registry
name: Release and Publish to Comfy registry
on:
workflow_dispatch:
push:
branches:
- main
paths:
- "pyproject.toml"
- 'pyproject.toml'

jobs:
publish-node:
name: Publish Custom Node to registry
name: Release and Publish Custom Node to registry
runs-on: ubuntu-latest
steps:
- name: Check out code
uses: actions/checkout@v4
- name: Publish Custom Node
uses: Comfy-Org/publish-node-action@main

- name: Get current version
id: current_version
run: |
echo "version=$(cat pyproject.toml | grep 'version =' | cut -d'=' -f2 | xargs)" >> $GITHUB_OUTPUT
- name: Check if tag exists
id: check-tag
uses: actions/github-script@v7
with:
script: |
const tag = `v${{ steps.current_version.outputs.version }}`;
try {
await github.rest.repos.getReleaseByTag({
owner: context.repo.owner,
repo: context.repo.repo,
tag
});
return true
} catch (error) {
console.error(error)
return false
}
- name: Assert tag v${{ steps.current_version.outputs.version }} is not exist
run: |
if [ ${{ steps.check-tag.outputs.result }} == true ]; then
echo "Tag exists, skipping release"
exit 1
fi
- name: Install pnpm
uses: pnpm/action-setup@v4
with:
version: 9

- name: Use Node.js
uses: actions/setup-node@v4
with:
node-version: lts/*
cache: 'pnpm'

- name: Build and Package
run: |
pnpm install
pnpm run build
tar -czf dist.tar.gz py/ web/ __init__.py LICENSE pyproject.toml
- name: Create release draft
uses: softprops/action-gh-release@v2
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
with:
files: |
dist.tar.gz
name: ${{ steps.current_version.outputs.version }}
tag_name: v${{ steps.current_version.outputs.version }}
draft: true
make_latest: true

- name: Prepare publish custom node to registry
run: |
find . -maxdepth 1 ! -name '.' ! -name 'dist.tar.gz' ! -name '.git' -exec rm -rf {} +
tar -xzf dist.tar.gz
rm -rf dist.tar.gz
# - name: Publish Custom Node
# uses: Comfy-Org/publish-node-action@main
# with:
# ## Add your own personal access token to your Github Repository secrets and reference it here.
# personal_access_token: ${{ secrets.REGISTRY_ACCESS_TOKEN }}
#
# Publish Custom Node
# Copy from Comfy-Org/publish-node-action@main

- name: Set up Python
uses: actions/setup-python@v5
with:
## Add your own personal access token to your Github Repository secrets and reference it here.
personal_access_token: ${{ secrets.REGISTRY_ACCESS_TOKEN }}
python-version: '3.10'

- name: Install comfy-cli
shell: bash
run: |
pip install comfy-cli
- name: Publish Node
shell: bash
run: |
comfy --skip-prompt --no-enable-telemetry env
comfy node publish --token ${{ secrets.REGISTRY_ACCESS_TOKEN }}
9 changes: 9 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -188,3 +188,12 @@ Icon
Network Trash Folder
Temporary Items
.apdisk

# dependencies
node_modules/

# dist
web/

# config
config/
1 change: 1 addition & 0 deletions .husky/pre-commit
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
pnpm exec lint-staged
13 changes: 13 additions & 0 deletions .prettierrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
{
"printWidth": 80,
"tabWidth": 2,
"useTabs": false,
"singleQuote": true,
"trailingComma": "all",
"endOfLine": "lf",
"semi": false,
"plugins": [
"prettier-plugin-organize-imports",
"prettier-plugin-tailwindcss"
]
}
7 changes: 0 additions & 7 deletions .prettierrc.json

This file was deleted.

64 changes: 46 additions & 18 deletions .vscode/settings.json
Original file line number Diff line number Diff line change
@@ -1,20 +1,48 @@
{
"cSpell.words": [
"apng",
"Civitai",
"ckpt",
"comfyui",
"FYUIKMNVB",
"gguf",
"gligen",
"jfif",
"locon",
"loras",
"noimage",
"onnx",
"rfilename",
"unet",
"upscaler"
],
"editor.defaultFormatter": "esbenp.prettier-vscode"
"cSpell.words": [
"tailwindcss",
"vnode",
"unref",
"civitai",
"huggingface",
"comfyui",
"ckpt",
"gligen",
"loras",
"safetensors",
"unet",
"controlnet",
"hypernetwork",
"hypernetworks",
"photomaker",
"upscaler",
"comfyorg",
"fullname",
"primevue",
"maximizable",
"inputgroup",
"inputgroupaddon",
"iconfield",
"inputicon",
"inputtext",
"overlaybadge",
"usetoast",
"toastservice",
"useconfirm",
"confirmationservice",
"confirmdialog",
"popupmenu",
"inplace",
"contentcontainer",
"itemlist",
"virtualscroller"
],
"editor.defaultFormatter": "esbenp.prettier-vscode",
"files.associations": {
"*.css": "tailwindcss"
},
"editor.quickSuggestions": {
"strings": "on"
},
"css.lint.unknownAtRules": "ignore"
}
50 changes: 23 additions & 27 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,64 +4,60 @@ Download, browse and delete models in ComfyUI.

Designed to support desktop, mobile and multi-screen devices.

<img src="demo/beta-menu-model-manager-button-settings-group.png" alt="Model Manager Demo Screenshot" width="65%"/>
# Usage

<img src="demo/tab-models.png" alt="Model Manager Demo Screenshot" width="65%"/>
```bash
cd /path/to/ComfyUI/custom_nodes
git clone https://github.com/hayden-fr/ComfyUI-Model-Manager.git
cd /path/to/ComfyUI/custom_nodes/ComfyUI-Model-Manager
npm install
npm run build
```

## Features

### Node Graph
## Freely adjust size and position

<img src="demo/tab-model-drag-add.gif" alt="Model Manager Demo Screenshot" width="65%"/>
<img src="demo/tab-models.gif" style="max-width: 100%; max-height: 300px" >

### Support Node Graph

<img src="demo/tab-model-node-graph.gif" style="max-width: 100%; max-height: 300px" >

- Drag a model thumbnail onto the graph to add a new node.
- Drag a model thumbnail onto an existing node to set the input field.
- If there are multiple valid possible fields, then the drag must be exact.
- Drag an embedding thumbnail onto a text area, or highlight any number of nodes, to append it onto the end of the text.
- Drag the preview image in a model's info view onto the graph to load the embedded workflow (if it exists).

<img src="demo/tab-model-preview-thumbnail-buttons-example.png" alt="Model Manager Demo Screenshot" width="65%"/>

- Press the "copy" button to copy a model to ComfyUI's clipboard or copy the embedding to the system clipboard. (Copying the embedding to the system clipboard requires a secure http connection.)
- Press the "add" button to add the model to the ComfyUI graph or append the embedding to one or more selected nodes.
- Press the "load workflow" button to try and load a workflow embedded in a model's preview image.

### Download Tab

<img src="demo/tab-download.png" alt="Model Manager Demo Screenshot" width="65%"/>
<img src="demo/tab-download.png" style="max-width: 100%; max-height: 300px" >

- View multiple models associated with a url.
- Select a save directory and input a filename.
- Optionally set a model's preview image.
- Optionally edit and save descriptions as a .txt note. (Default behavior can be set in the settings tab.)
- Add Civitai and HuggingFace API tokens in `server_settings.yaml`.
- Optionally edit and save descriptions as a .md note.
- Add Civitai and HuggingFace API tokens in ComfyUI's settings.

<img src="demo/tab-settings.png" style="max-width: 100%; max-height: 150px" >

### Models Tab

<img src="demo/tab-models-dropdown.png" alt="Model Manager Demo Screenshot" width="65%"/>
<img src="demo/tab-models.png" alt="Model Manager Demo Screenshot" style="max-width: 100%; max-height: 300px"/>

- Search in real-time for models using the search bar.
- Use advance keyword search by typing `"multiple words in quotes"` or a minus sign before to `-exclude` a word or phrase.
- Add `/` at the start of a search to view a dropdown list of subdirectories (for example, `/0/1.5/styles/clothing`).
- Any directory paths in ComfyUI's `extra_model_paths.yaml` or directories added in `ComfyUI/models/` will automatically be detected.
- Sort models by "Date Created", "Date Modified", "Name" and "File Size".
- Sort models by "Name", "File Size", "Date Created" and "Date Modified".

### Model Info View

<img src="demo/tab-model-info-overview.png" alt="Model Manager Demo Screenshot" width="65%"/>
<img src="demo/tab-model-info-overview.png" alt="Model Manager Demo Screenshot" style="max-width: 100%; max-height: 300px"/>

- View file info and metadata.
- Rename, move or **permanently** remove a model and all of it's related files.
- Read, edit and save notes. (Saved as a `.txt` file beside the model).
- `Ctrl+s` or `⌘+S` to save a note when the textarea is in focus.
- Autosave can be enabled in settings. (Note: Once the model info view is closed, the undo history is lost.)
- Read, edit and save notes. (Saved as a `.md` file beside the model).
- Change or remove a model's preview image.
- View training tags and use the random tag generator to generate prompt ideas. (Inspired by the one in A1111.)

### Settings Tab

<img src="demo/tab-settings.png" alt="Model Manager Demo Screenshot" width="65%"/>

- Settings are saved to `ui_settings.yaml`.
- Most settings should update immediately, but a few may require a page reload to take effect.
- Press the "Fix Extensions" button to correct all image file extensions in the model directories. (Note: This may take a minute or so to complete.)
Loading

0 comments on commit 5b6e00b

Please sign in to comment.