Compare commits
@@ -1,5 +1,879 @@
|
||||
# DEVLOG - ComfyUI-Workflow-Studio
|
||||
|
||||
---
|
||||
|
||||
## v0.3.78
|
||||
|
||||
### 追加機能: Eagle自動保存のSVG対応
|
||||
|
||||
「画像管理ソフトEagleとの連携機能（Eagleへ自動保存）をSVGに対応させたい」という依頼を受けて実装。既存のEagle自動保存(`generate-tab.js`のEagle送信ループ)は`history.outputs`の`images`キーのみを走査しており、SVG出力ノードには2系統あってそれぞれ挙動が異なることが判明した。
|
||||
|
||||
- **標準`SaveSVGNode`（ComfyUI本体）**: 通常の`images`キー(`{filename, subfolder, type}`)で結果を返すため既存の収集ロジックに拾われるが、ComfyUIの`/view`エンドポイントはSVGをXSS対策として`Content-Type: application/octet-stream` + `Content-Disposition: attachment`で強制返却するため、`<img>`表示にもEagleの`addFromURL`にも正しく使えない。`comfyui-client.js`の`getImageBlob()`で拡張子`.svg`を検出し`blob.slice(0, blob.size, "image/svg+xml")`でMIMEタイプを付け替えることで`<img>`表示を解決し、Eagle送信は`eagle_routes.py`側でローカルファイルパスを解決して`addFromPath`を使うルートに切り替えた。
|
||||
- **`comfyui-tosvg`の`Save SVG String`ノード**: `images`キーではなく独自の`saved_svg`(ファイル名)/`path`(絶対パス)キーで返す。さらに、ComfyUIの実行エンジン(`execution.py`の`get_output_from_returns`)は`ui`辞書の各値をイテラブルとして連結する仕様のため、このノードが単一文字列を返すと1文字ずつ分解された配列になる(`"a.svg"` → `["a",".","s","v","g"]`)。`comfyui-client.js`側でこの文字配列を検出し`join("")`で復元する対応を追加。絶対パスが既知なため、Eagle送信は`_resolve_absolute_svg_path()`(output/temp/inputディレクトリ配下限定の検証つき)経由で直接`addFromPath`する。
|
||||
- **プレビュー用一時画像の除外**: `SVG String Preview`や`PreviewImage`など`type: "temp"`の画像は、Eagle自動保存からもGenerateUI結果表示からも除外(`outputImages = images.filter(img => img.type !== "temp")`に統一)。SVG出力があるワークフローでは、GenerateUIの結果プレビューを実際に保存されたSVGファイルに切り替え、`/view`が使えないためGalleryタブの配信エンドポイント(`/wfm/gallery/image/serve?path=...`、絶対パス指定・正しいContent-Type)を再利用した。
|
||||
|
||||
**セキュリティ**: `_resolve_absolute_svg_path()`は任意の絶対パスをそのまま信頼せず、ComfyUIのoutput/temp/inputディレクトリ配下の実在するファイルのみ許可する(外部からこのAPIを叩かれてローカル任意ファイルを送信させられるリスクの回避)。Windowsのパス比較は大文字小文字を区別しないため`os.path.normcase`で正規化してから比較。
|
||||
|
||||
**検証**: Node.jsスクリプトで`comfyui-client.js`/`eagle_routes.py`のロジックを直接テストし、両ノードタイプでファイルが正しい形式でEagleへ送信されることを確認。ユーザーが実際にComfyUI上で`svg_1.json`/`svg_5.json`/`svg_7.json`の3種類のワークフローを実行し、Eagle保存・プレビュー表示それぞれで動作確認。
|
||||
|
||||
**How to apply**: [[project_v0342_gallery_feeder]]のSVG関連対応と合わせ、SVGはComfyUI本体がXSS対策で`/view`から生配信しない前提で設計する必要がある。新しいSVG出力ノードに対応する際は、まず`ui`辞書がどのキー名で結果を返すか(`images` vs 独自キー)、絶対パスが取得できるか、を確認してから送信経路(`addFromURL` vs `addFromPath`)を選ぶ。
|
||||
|
||||
### 追加機能: GenerateUI/MetadataタブでComfyUIサブグラフワークフロー対応（Mage-Flow等）
|
||||
|
||||
「mageflow_1.jsonをGenerateUIタブ、メタデータタブに対応させたい」という依頼を受けて調査したところ、`comfyui-workflow.js`の`detectFormat()`が`definitions.subgraphs`を持つワークフロー全般を一律「App形式」と判定し、GenerateUIタブが読み込みを拒否する設計になっていたことが判明した(`generate-tab.js`の`loadWorkflowIntoEditor()`が`format === "app"`で即エラー)。サブグラフ展開自体は`_flattenSubgraphs()`に既に実装済みで`convertUiToApi()`から呼ばれていたが、GenerateUIの通常フローには到達しない状態だった。
|
||||
|
||||
- **`detectFormat()`の判定基準を訂正**: 「サブグラフを含む」ことと「真のApp形式(ComfyUIの簡略化Webアプリ風UI)」は別軸であるべきところ、後者の判定条件に前者が混入していた。`extra.linearMode === true`または`.app.json`拡張子の場合のみ"app"、それ以外(サブグラフを含むだけの通常ノードグラフ)は"ui"として扱うよう修正。`workflow_analyzer.py`(Python側、サイドパネルのAPI/APPバッジ表示に使われる)にも同じ判定基準の食い違いがあり、揃えて修正。
|
||||
- **サブグラフ外側ウィジェット値の内部ノードへの注入（`_flattenSubgraphs()`）**: 最大の落とし穴だった。サブグラフの「外側ノード」(折りたたみ表示、ユーザーが実際に編集する値)のwidgets_valuesと、`definitions.subgraphs[].nodes`内の「内部ノード」(サブグラフ編集画面を開いた時のテンプレート初期値)のwidgets_valuesは、ComfyUIが保存時に同期しない場合があり、実データで検証すると別内容のプロンプトが入っていた。既存の`_flattenSubgraphs()`はリンクのリダイレクトのみ行い、ウィジェット値の注入は一切していなかったため、そのままではGenerateUIが古いテンプレートのデフォルト値で生成してしまう。外側ノードのinputs配列(`widget`かつ`link`なしの要素)を走査し、サブグラフ入力ポート経由で対応する内部ノードのwidgets_values配列へ値を上書きするロジックを新設。内部ノードのwidgets_values配列がリンク済み入力の分もエントリを持つ「legacy full形式」の場合があり、`convertUiToApi()`本体が前提とする「リンク済みwidgetにはエントリがない」形式との食い違いでインデックスがずれるバグも合わせて修正(リダイレクトされた実リンク先スロットのみをエントリから除去する形に変更)。
|
||||
- **`analyzeWorkflow()`に`TextEncodeMageFlowEdit`対応**: 1ノードでprompt/negative_prompt両方を直接持つ複合ノードのため、SDXLPromptStylerパターンを参考にrole固定(positive/negative)で個別登録。width/height/batch_sizeも内包しているため`latent_nodes`にも登録(EmptyLatentImage相当)。
|
||||
- **DynamicCombo型(`COMFY_DYNAMICCOMBO_V3`)対応**: `SaveImageAdvanced`の`format`入力(選択値に応じて`bit_depth`/`input_color_space`等のサブフィールドが動的に変わる新しいComfyUI V3 API機能)が未対応で、`inputs`から丸ごと欠落し`TypeError: missing 1 required positional argument: 'format'`が発生した。最初は`{"format": "png", "bit_depth": ..., ...}`という単一辞書にまとめて渡す実装を試みたが実機で同じエラーが再現し、ComfyUI本体の`comfy_api/latest/_io.py`の`DynamicCombo._expand_schema_for_dynamic`を読んだところ、バックエンドは`"format"`/`"format.bit_depth"`のような**フラットなドット区切りキー**を`inputs`辞書に個別に期待しており、実行エンジン自身(`build_nested_inputs()`)が実行時にネストした辞書へ自動組み立てる設計だったため、辞書化をやめてフラットキーをそのまま`inputs`へ設定する実装に修正。
|
||||
- **`metadata-tab.js`のサブグラフ対応強化**: 既存の`collectAllNodes()`ベースの抽出(トップレベル+サブグラフ内nodesを単純結合)はモデル名・プロンプンとも「内部テンプレートの古い値」を拾ってしまう同じ問題を抱えていたため、サブグラフを検出した場合は`comfyWorkflow.convertUiToApi()`を経由してAPI形式(外側ウィジェット値が注入済み)に正規化してから抽出するよう変更。`extractPromptsAPI`/`extractPromptsFromNodeSet`双方に`TextEncodeMageFlowEdit`のpositive/negative個別抽出(1ノードにつき2つのwidgets_valuesスロット)対応を追加。
|
||||
|
||||
**検証**: Node.jsで`comfyui-workflow.js`をブラウザ実行と同一ロジックのままimportし(`/object_info`はローカルComfyUIサーバーへのfetchで取得)、`mageflow_1.json`の変換結果を全項目突き合わせ。外側と内部でテキストが異なる実データを使い、正しく外側の値が採用されることを確認。既存のFlux2/Qwen/Ernie/Krea2等、サブグラフを持つ8ワークフローで`git stash`によるビフォーアフター比較を実施し回帰なしを確認(変更前は全て"app"判定で一律ブロックされていたため、影響は純増)。ユーザーが実機でGenerateUI実行・Eagle送信・Metadata抽出それぞれ確認。
|
||||
|
||||
**How to apply**: ComfyUIのサブグラフは「外側の折りたたみ表示ウィジェット値」と「内部テンプレート定義のwidgets_values」が別データであり、保存時に同期される保証がないという前提を忘れないこと。サブグラフを扱うロジックを新設・修正する際は、実データ(必ずしもテンプレートそのままでない、ユーザーが値を変更済みのワークフローファイル)で外側/内部の値を突き合わせて検証する。またComfyUIの新しいV3 API機能(DynamicCombo等)に遭遇したら、まず`comfy_api/latest/_io.py`の該当実装を読んでバックエンドが実際に何を期待しているかを確認してから実装する方が、推測で実装してハマるより早い。
|
||||
|
||||
### 改善: Workflowタブ Summarize機能を構造化データベースに変更
|
||||
|
||||
上記のサブグラフ対応の流れで、「ワークフロータブの要約、解析ができるようにしたい」という依頼を受けた。調査の結果、既存の「AI要約」ボタン(`workflow-tab.js`)は生ワークフローJSON全体を`JSON.stringify(wf).substring(0, 4000)`で先頭4000文字に切り詰めてLLM(Ollama)へ渡すだけの実装で、`MarkdownNote`の長文説明やUI座標情報が先頭を占有し、複雑なワークフロー(特にサブグラフ入り)では肝心のノード構成情報が切り捨てられて有効な要約ができない状態だった。「要約機能の修正」「解析結果表示の新規UI追加」のどちらを優先するか確認し、前者を選択。
|
||||
|
||||
- `_buildSummarySourceText()`を新設。既存の`comfyWorkflow.detectFormat()`/`convertUiToApi()`/`analyzeWorkflow()`(上記のMage-Flow対応で強化済み)を再利用し、Checkpoint/Diffusion Model/Text Encoder/VAE/LoRA/ControlNet/Hypernetwork/Positive・Negative Prompt/Sampler設定/使用ノード種別一覧をコンパクトなテキストに整形してからLLMへ渡すよう変更。変換・解析に失敗した場合は従来の生JSON切り詰め方式へ自動フォールバック。
|
||||
|
||||
**検証**: Node.jsで`_buildStructuredSummaryText()`相当のロジックを`analyzeWorkflow()`の実出力に対して実行し、`mageflow_1.json`(1183文字)・`qwen-image-edit_controlnet.json`(694文字)など、旧実装の4000文字切り詰めより大幅にコンパクトかつ正確な出力になることを確認。サブグラフを持たない通常ワークフロー3件でも正しく動作することを確認。
|
||||
|
||||
**How to apply**: LLMへワークフロー情報を渡す用途では、生JSONダンプではなく既存の解析結果(`analyzeWorkflow()`)を再利用してテキスト化する方が、トークン数を抑えつつ精度も上がる。生JSONは`MarkdownNote`やUI座標などLLMにとってノイズになる情報を大量に含む。
|
||||
|
||||
### バグ修正: Workflowタブ詳細パネルのP:/I:/→カウントとフォーマットバッジ
|
||||
|
||||
上記のMage-Flow対応の実機確認中、Workflowタブのサイドパネルで新しいノードタイプを使うワークフローの入出力カウントが「P:0 I:0 → 0」と表示される問題が見つかった。原因は`workflow_analyzer.py`の`analyze_workflow()`がノードタイプ名の完全一致(`ntype == "CLIPTextEncode"`、`ntype == "SaveImage"`)でカウントしており、`TextEncodeMageFlowEdit`(プロンプト)や`SaveImageAdvanced`(画像出力)のような新しいノードタイプを認識できていなかったため。
|
||||
|
||||
- プロンプト検出を`_PROMPT_NODE_TYPES`集合(`TextEncodeMageFlowEdit`/`TextEncodeQwenImageEditPlus`/`SDXLPromptStyler`等)に、出力画像検出を`_OUTPUT_IMAGE_NODE_TYPES`集合(`SaveImageAdvanced`追加)にそれぞれ拡張。
|
||||
- 副次的に、この関数のフォーマット判定が上記で修正したJS側`detectFormat()`と食い違っていること(`"definitions" in workflow_data`だけで"app"と判定する古い基準のまま)を発見し、同じ基準(`linearMode`のみ"app")に統一。これはComfyUIキャンバスのサイドパネル(`node_sets_menu.js`)のAPI/APPバッジ表示に使われており、放置するとMage-Flow系ワークフローに誤って「APP」バッジが付き続ける状態だった。
|
||||
|
||||
**検証**: Pythonで`analyze_workflow()`を直接呼び出し、`mageflow_1.json`で`prompts: 1`/`outputs.images: 1`/`format: "ui"`が正しく出ることを確認。ユーザーからの追加確認依頼を受け、真にlinearModeを持つワークフロー(`wf_20260322113657.json`等、サブグラフを含むケースも含む)では引き続き"app"、Mage-Flow等のサブグラフのみのワークフローは"ui"と、両者が正しく区別されることをJS/Python両実装で突き合わせ検証。既存の複数ワークフローでリグレッションがないことも確認。
|
||||
|
||||
### 改善: Send to Canvasトーストメッセージの区別
|
||||
|
||||
「ワークフロータブでUI形式のワークフローをキャンバスへ送るボタン押下時、『ワークフロー準備完了 タイトルをキャンバスにドラッグ』のトーストは現在ドラッグの必要がないためメッセージを変えたい」という依頼。`workflow-tab.js`/`gallery-tab.js`の「キャンバスへ送る」処理は、`window.opener`経由で直接ロードされる場合(ドラッグ不要)と、`localStorage`+タイトルドラッグのフォールバック(ドラッグ必要)の2経路があるが、両方が同じ`workflowSentToCanvas`(「タイトルをドラッグ」)トーストを共有していたため、直接ロードされた場合にも実際には不要なドラッグ手順が案内されていた。
|
||||
|
||||
- 新しいi18nキー`workflowSentToCanvasDirect`(「ワークフローをキャンバスへ送信しました」)を英日中3言語で追加し、`window.opener`経由の成功時のみこちらを使うよう変更。ドラッグが実際に必要なフォールバック側は既存メッセージのまま維持。
|
||||
|
||||
**検証**: `node --check`で構文チェック。ユーザーがComfyUIツールバーから開いた状態で実機確認。
|
||||
|
||||
## v0.3.76
|
||||
|
||||
### 追加機能: Comic Creator向けI2I実行ブリッジ`_wfmReceiveI2IRunRequest`
|
||||
|
||||
Comic Creator（`comfyui-comic-creator`、本アプリをiframe埋め込みで連携する別アプリ）から、「マスク不要のI2I実行をその場で行い結果を受け取りたい」という依頼を受けて追加。既存のInpaint連携ブリッジ(`gallery-tab.js`の`_wfmReceiveInpaintRequest` → `image-edit-tab.js`の`runInpaintExternal`/`_runInpaintWithImages`)と対称的な、マスク版の無いI2I専用ルートを新設した。
|
||||
|
||||
- `image-edit-tab.js`: `_runI2IWithImage(imageBlob, {positive, negative, denoise, overrideOpts, onStatus})`を新規実装。`comfyEditor.applyImageToSlot(file, 0)`(マスクなし版アップロード)→`comfyEditor.setPromptText("positive"/"negative", ...)`→`comfyEditor.setInpaintParams({denoise, ...overrideOpts})`→`window._wfmGenerateTab.generate()`→`#wfm-gen-result-img`のsrcを返す、という`_runInpaintWithImages()`と同型の流れ。`setInpaintParams()`は`growMaskBy`未指定時に自動でスキップする既存実装だったため、denoise単体用の新規セッターは追加せずそのまま流用できた。外部エントリポイント`runI2IExternal(imageBlob, {positive, negative, denoise})`（多重実行ガード`_i2iExternalRunning`付き）を追加。
|
||||
- `gallery-tab.js`: `window._wfmReceiveI2IRunRequest = async (imageBlob, params, workflowData, workflowFilename) => {...}`を追加。`_wfmReceiveInpaintRequest`と同じく、`workflowData`が渡されれば実行前に`loadWorkflowIntoEditor()`でロードしてから`window._wfmImageEditTab.runI2IExternal(imageBlob, params)`を呼び、結果`{ok, url}`をそのまま返す。既存の`_wfmReceiveImageForI2I`（画像をI2Iスロットへセットするだけ、Comic Creatorのレイアウトタブが使用）は無改造。
|
||||
|
||||
**検証**: 変更した2ファイルを`node --check`で構文チェック。Comic Creator側（Imageタブの新規「Select I2I」パネル）からKapture経由で実際に呼び出し、Positive/Negative Prompt・Denoiseがワークフローへ反映された上でキュー実行され、結果画像URLが返ることを確認（Comic Creator側DEVLOG参照）。
|
||||
|
||||
**How to apply**: 「画像をComfyUIのワークフローに自動セットしてキュー実行し、結果を返す」という外部連携パターンを新設する際は、`comfyEditor.applyImageToSlot`/`setPromptText`/`setInpaintParams`/`window._wfmGenerateTab.generate`が既にマスクなし用途にも流用できる設計になっている（オプション引数は未指定なら書き込みをスキップする）。Inpaint版と重複する新規プリミティブをWorkflow Studio側に増やす必要は薄く、`_runInpaintWithImages`と同型の薄いラッパーを追加するだけで足りる。
|
||||
|
||||
## v0.3.77
|
||||
|
||||
### 追加機能: GalleryタブでSVGファイルの表示・管理に対応
|
||||
|
||||
「ギャラリータブでSVGファイル表示対応させたい」という依頼を受けて調査したところ、`gallery_service.py`の`IMAGE_EXTENSIONS = {".png", ".jpg", ".jpeg", ".webp", ".gif"}`にSVGが含まれておらず、フォルダスキャン・一覧取得・削除・移動・配信のすべてで一律に除外されていたことが原因だった。フロントエンド（`gallery-tab.js`）側は拡張子フィルタを一切持たず、サムネイル・詳細プレビュー・ライトボックスすべて`<img>`タグで描画する設計だったため、バックエンドの許可リストにSVGを追加するだけで表示系は無改造で対応できた。
|
||||
|
||||
- `gallery_service.py`: `IMAGE_EXTENSIONS`に`.svg`を追加。`serve_thumbnail()`にSVG分岐を新設し、GIF（アニメーション保持のため元ファイルを返す既存分岐）と同じ扱いで元ファイルをそのまま返すようにした。SVGはベクター画像でPillowが`Image.open()`できないため、そもそもラスタライズ縮小の意味がなく、`<img>`タグ側でブラウザが任意サイズにスケーリングして表示する前提。
|
||||
- `gallery_routes.py`: `serve_image`/`serve_thumb`のContent-Type判定は変更不要だった。Pythonの`mimetypes.guess_type()`が標準で`.svg`→`image/svg+xml`を解決するため、既存の`mimetypes.guess_type()`フォールバック分岐がそのまま機能する。
|
||||
|
||||
**セキュリティ**: `<img src="...">`によるSVG表示は、ブラウザが`<script>`要素の実行や外部リソース読み込みを無効化する仕様のため、悪意あるSVG（埋め込みJS等）が混入していてもXSSリスクはない。`<object>`/`<iframe>`/`iframe.srcdoc`のような埋め込み方式（スクリプトが実行され得る）は使っていない。
|
||||
|
||||
**検証**: 変更した`gallery_service.py`を`ast.parse()`で構文チェック。開発リポジトリと実行時`custom_nodes`フォルダへ同期し`__pycache__`をクリアした上でComfyUIを再起動し、実際にoutputフォルダへ配置したSVGファイルがGalleryタブでサムネイル・詳細プレビューとも正しく表示されることをユーザーが確認。
|
||||
|
||||
**How to apply**: [[project_next_release_docs]]のような「フォーマット追加」系の変更は、フロントエンドがフォーマット非依存の`<img>`/`<video>`等で描画する設計になっている場合、バックエンドの許可拡張子リスト（`IMAGE_EXTENSIONS`）に追加するだけで大半のUIパスに波及する。逆に言えば、新形式を追加する際はこのリストが唯一のゲートになっている前提を崩さないよう注意する。
|
||||
|
||||
### 追加機能: AI TOOL Chatでワークフロー不要のSVG生成・表示・Gallery保存
|
||||
|
||||
Gallery SVG対応の直後、「AI TOOLのチャット機能でワークフローを使用せずにSVGを作成することは可能か」と質問された。既存のChat画像生成（`generate_image`ツールコール→ComfyUIのT2I/I2Iワークフロー実行）とは別に、SVGはXMLテキストに過ぎずLLMのテキスト生成だけで完結するため、ComfyUIワークフローもTool Calling機能も不要である旨を回答した上で、「実装する（表示+Gallery保存）」の合意を得て実装した。
|
||||
|
||||
- `ai-tab.js`: `_extractSvgCode(text)`を新設。アシスタント応答からマークダウンのコードフェンスで囲まれたSVGコードブロック、または生の`<svg>...</svg>`タグを正規表現で抽出する。`appendChatBubble()`の`role === "assistant"`分岐に組み込み、検出時は`_appendSvgPreview()`を呼ぶ。抽出ロジックは`reply.content`（プレーンテキスト）のみを見ており、`reply.toolCalls`は一切参照しないため、モデルがtool calling（function calling）に対応していなくても動作する——「画像生成を許可する」トグルがONの場合のみ送信される`tools`パラメータとは完全に独立した経路。
|
||||
- `_appendSvgPreview()`: 抽出したSVGコードを`btoa(unescape(encodeURIComponent(svgCode)))`でBase64化し、`<img src="data:image/svg+xml;base64,...">`としてプレビュー表示（`<img>`経由のためスクリプト実行はブラウザ側で無効化され安全）。「Galleryに保存」ボタンを併設し、クリックで`/wfm/gallery/image/save`へ`{filename: "chat_svg_<timestamp>.svg", imageData: dataUrl}`をPOSTする。
|
||||
- `gallery_routes.py`の`save_image_to_gallery`: 従来は`imageData`を無条件にPNGとして扱い拡張子`.png`を強制していたが、data URLのヘッダ(`data:<mime>;base64,`)からMIMEタイプを判定し`_SAVE_EXT_BY_MIME`（png/jpeg/webp/gif/svg+xml）で拡張子を決定する汎用処理に変更。Image Edit Tabの既存呼び出し（`canvas.toDataURL("image/png")`）は引き続き`.png`として保存され後方互換。
|
||||
- CSS（`main.css`）に`.wfm-ai-chat-svg-wrapper`/`.wfm-ai-chat-svg-img`を追加（白背景パディング付きプレビュー枠、透過SVGでも視認できるように）。
|
||||
- i18n（`i18n.js`）に`aiChatSaveSvgToGallery`/`aiChatSvgSaved`/`aiChatSvgSaveFailed`を英日中3言語で追加。
|
||||
- ヘルプ文言3点セット（`templates/index.html`の`wfm-help-ai-7`、`i18n.js`の`helpAi7`英日中3言語、`app.js`の`helpIdMap`）でこの機能を追記。
|
||||
|
||||
**検証**: 変更した`ai-tab.js`/`i18n.js`/`app.js`を`node --check`で構文チェック、`gallery_routes.py`を`ast.parse()`で構文チェック。開発リポジトリと実行時`custom_nodes`フォルダへ全ファイル同期し`__pycache__`をクリア。ユーザーがComfyUI再起動後、Chatで実際にSVGを生成させてプレビュー表示とGallery保存を確認済み。
|
||||
|
||||
**How to apply**: LLMチャット機能に新しい出力形式（SVG、Mermaid図など、テキストとして表現できるフォーマット）を追加検討する際は、まず「ラスター画像生成のようにComfyUIワークフロー実行が本当に必要か、それともLLMのテキスト生成だけで完結するか」を切り分ける。後者であれば`reply.content`に対する検出・抽出ロジックのみで実装でき、Tool Calling対応可否に依存しない機能として提供できる。
|
||||
|
||||
## v0.3.75
|
||||
|
||||
### Lemonadeバックエンド追加(3つ目のAIバックエンド)
|
||||
|
||||
「LLMのバックエンドにlemonadeも追加したい」という依頼を受け、lemonade-server.ai のAPIドキュメント(OpenAI互換API・Ollama互換API等)を確認した上で実装。既存のバックエンド切替は`ai-tab.js`(SPA AI TOOLタブ)・`prompt-tab.js`/`settings-tab.js`(Promptタブ設定)・`node_sets_menu.js`(サイドパネル)の3箇所に独立実装されており、いずれも`if (backend === "ollama") {...} else {...}`という2値決め打ちで、elseがLM Studio(OpenAI互換API: `/v1/models`, `/v1/chat/completions`)を指す構造だった。Lemonadeのデフォルト(OpenAI互換モード)は`http://localhost:13305`でLM Studioと全く同じエンドポイント形状のため、fetch系関数(`fetchModels`/`callLLM`/`callChat`/`callVLM`等)は変更不要で、ラジオボタンの選択肢追加とデフォルトURL解決部分の3値対応のみで済んだ。
|
||||
|
||||
**対象範囲・接続方式は事前にユーザーに確認:** 3箇所すべてに追加するか/SPA AI TOOLタブのみ先行導入するか、接続方式はOpenAI互換モード既定かOllama互換モードも選択肢に含めるかを質問し、「3箇所すべて」「OpenAI互換モード既定」で合意して実装した。
|
||||
|
||||
**デフォルトURL解決の共通化:**
|
||||
- `static/js/util.js`に`AI_BACKEND_DEFAULT_URLS`(ollama/lmstudio/lemonade)と`getAiBackendDefaultUrl(backend)`を新設し、`ai-tab.js`・`prompt-tab.js`・`settings-tab.js`(いずれもESモジュールで`util.js`をimport済み)の計8箇所の三項演算子を置き換え
|
||||
- `web/comfyui/node_sets_menu.js`(ComfyUI拡張側、`static/js`とは別スコープのESモジュールでimport不可)は同名のヘルパーをローカルに複製(既存の重複実装パターンを踏襲)
|
||||
|
||||
**UI・ヘルプ更新:**
|
||||
- ラジオボタン`value="lemonade"`を`templates/index.html`(SPA)・`static/js/settings-tab.js`(Promptタブ設定)・`web/comfyui/node_sets_menu.js`(サイドパネル)の3箇所に追加
|
||||
- ヘルプ文言3点セット(`index.html`/`i18n.js`のEN・JA・ZH/`app.js`の`helpIdMap`)のうち、`helpIdMap`は既存キーへの追記のみで変更不要。「Ollama or/または/或 LM Studio」を列挙している9キー(`helpPrompt1`, `helpSettings5`, `helpSidepanel16`, `helpAi2`, `helpAi5`, `helpAi6`, `helpTrouble2` の各ロケール)すべてにLemonadeを追記
|
||||
- README.mdの現行機能セクション(Changelogではなくpresent-tense説明部分)とRequirementsセクションにLemonade関連の記載を追加。過去バージョンのChangelogエントリ(v0.3.40〜v0.3.74)は当時の実装を正しく記述しているため変更していない
|
||||
|
||||
**検証:** 変更した5つのJSファイル(`util.js`, `ai-tab.js`, `prompt-tab.js`, `settings-tab.js`, `node_sets_menu.js`)を`node --check`で構文チェック(全て成功)。実行中のComfyUIインスタンス(Kapture経由)で3箇所すべてを確認 — SPA AI TOOLタブSettings・SPA 設定タブ(Prompt tab AI Assistant)・サイドパネルAIタブのBackendラジオがいずれも`["ollama","lmstudio","lemonade"]`の3値で表示されることを確認、`getAiBackendDefaultUrl()`をブラウザ上で直接呼び出しollama/lmstudio/lemonade/未知の値それぞれで正しいデフォルトURL(`lemonade`→`http://localhost:13305`)を返すことを確認した。
|
||||
|
||||
### 追加修正: バックエンド切替時にURLを常にデフォルト値へ切り替え
|
||||
|
||||
上記の初回実装では、URL欄は「未保存の場合のみ」デフォルト値を補完する仕様(ラジオ切替時に`if (!saved.backendUrl) urlInput.value = defaultUrl`)だったため、一度どれかのURLを保存済みのユーザーがバックエンドを切り替えても欄が変わらなかった。「LMStudio、Lemonadeに切り替えた際それぞれデフォルトのURLに変更したい」というフィードバックを受け、3箇所すべてで無条件にデフォルトURLへ切り替える仕様に変更:
|
||||
|
||||
- `ai-tab.js`: `change`ハンドラの`if (!saved.backendUrl)`ガードを削除し、常に`urlInput.value = getAiBackendDefaultUrl(r.value)`
|
||||
- `settings-tab.js`: 従来`change`時に`placeholder`のみ更新していた(欄に既存の値があると効果が見えない実質バグ)のを、`value`を直接書き換えるよう修正
|
||||
- `node_sets_menu.js`: `change`リスナー自体が存在しなかった(バックエンド切替時にURLを更新する仕組みがそもそも未実装)ため新規追加
|
||||
|
||||
いずれもDOM上の表示値を書き換えるのみで、実際の永続化は各画面の「Save」ボタン押下時のまま変更なし。Kaptureで3箇所(SPA AI TOOLタブ・SPA 設定タブ・サイドパネル)すべて、ollama⇄lmstudio⇄lemonadeの切替でURL欄がそれぞれ`http://localhost:11434`/`http://localhost:1234`/`http://localhost:13305`に変わることを確認。テスト中に実際の保存設定(`wfm_ai_settings`)を上書きしないよう、Saveボタンは押さずページリロードで検証用の一時入力を破棄した。
|
||||
|
||||
### 検討事項: Lemonadeの画像生成・音声機能への対応可否(質問への回答のみ、実装保留)
|
||||
|
||||
ユーザーから「lemonadeでは画像生成や音声出力、テキスト読み上げなどに対応しているが、これに対応させることは可能か」と質問(実装依頼ではなく質問のみと明言)された。Lemonadeは`/v1/images/generations`(画像生成)・`/v1/audio/speech`(読み上げ)・`/v1/audio/transcriptions`(音声認識)をOpenAI互換の独立エンドポイントとして提供しており技術的には対応可能だが、以下の理由で「既存バックエンド切替の自然な延長」ではなく別枠の機能追加になる旨を回答した:
|
||||
|
||||
- **画像生成**: 本プラグインの画像生成はChatのTool Calling(`generate_image`)からComfyUIワークフロー自体を実行する設計であり、Lemonade側の画像生成APIを追加すると生成経路が2系統になり紛らわしい
|
||||
- **音声読み上げ/文字起こし**: AI TOOLタブに該当UI(再生プレイヤー、マイク入力等)が現状一切なく、既存キーの拡張ではなく新規機能追加になる
|
||||
|
||||
ユーザーは「検討したいと思います」として今回は実装せず保留。README.mdの「Backend support」直後に「Lemonade's other endpoints (not integrated)」として上記を明記し、将来検討時の起点として残した。
|
||||
|
||||
### バグ修正: Bypass(バイパス)ノードを含むワークフローの生成失敗
|
||||
|
||||
ユーザーがミュートしているノードを含むワークフロー(`chat_i2i_anima.json`、ComfyUI保存済み)をGenerateUIタブで読み込んで生成したところ、以下のエラーで失敗した:
|
||||
|
||||
```
|
||||
[ERROR] Failed to validate prompt for output 46:
|
||||
[ERROR] * CLIPTextEncode 73:
|
||||
[ERROR] - Exception when validating inner node: '74'
|
||||
[ERROR] * KSampler 66:
|
||||
[ERROR] - Exception when validating inner node: '74'
|
||||
```
|
||||
|
||||
**原因調査:** 実際のワークフローjsonを確認したところ、ノード74(LoraLoader)は`mode: 4`(ComfyUI独自のBypassモード。litegraph標準の`mode: 2`=Never/Muteとは別物)だった。`static/js/comfyui-workflow.js`の`convertUiToApi()`は`if (node.mode === 4) continue;`でBypassノードをAPI出力から単純に除外するだけで、そのノードを経由していた配線(CLIPLoader→LoraLoader.clip→CLIPTextEncode(73).clip、UNETLoader→LoraLoader.model→KSampler(66).model)を繋ぎ直しておらず、73番・66番が存在しないノード74を参照したまま出力されてバリデーションエラーになっていた。ComfyUI本体はBypassノードを「入力と出力を同じ型のスロット同士でパススルー接続してから除去」する仕様のため、この動作の再現が必要と判断。
|
||||
|
||||
**実装:**
|
||||
- `_resolveBypassSource(nodeById, linkMap, nodeId, slot, visited)`(新規ヘルパー)を追加。リンクの参照先がBypassノードの場合、その出力スロットと同じ型の入力スロットを探し(同インデックス優先、なければ型一致する最初の入力)、その入力の配線元を再帰的に辿る(連鎖バイパスにも対応、循環ガード付き)。マッチする入力が無ければ`null`を返しリンク無し扱いにする
|
||||
- `convertUiToApi()`内の全リンク解決箇所をこの関数経由に変更。バイパスされていないノードが参照先の場合は即座にそのまま返るため、既存の非バイパス経路への影響はない
|
||||
- ついでに`mode: 2`(真のMute)も除外対象に追加(従来は一切スキップされておらず、ミュートしても実行時は普通に動いていた)。ただしMuteはパススルーせず単純除外 — ComfyUI本体でも「必須の下流依存があるノードをMuteすると壊れる」のが仕様通りの挙動のため、あえて救済しない
|
||||
|
||||
**検証:** `chat_i2i_anima.json`を実際のComfyUIサーバー(`/object_info`)に接続したNodeスクリプトで`convertUiToApi()`に直接通し、KSampler(66).model→`["68",0]`(UNETLoader直結)、CLIPTextEncode(73).clip→`["61",0]`(CLIPLoader直結)、ノード74自体は出力に存在しない、ことを確認。さらに変換結果を実際に`/prompt`へPOSTし`node_errors: {}`(バリデーション成功)を確認。キューに入った時点で`/interrupt`により即座に中断し、無駄なGPU生成は行っていない。
|
||||
|
||||
### 追加機能: GenerateUIのRaw JSON上部にBypass/Muteノード表示
|
||||
|
||||
ユーザーから「生成UIタブのInput、Model、SettingsのRAW JSONペインの上部にバイパスノードの存在を示す表示を行いたい」と依頼。API形式のJSONには`mode`情報が残らないため、Raw JSON表示だけではBypass/Muteの有無が分からなくなる点への対応。
|
||||
|
||||
- `comfyui-workflow.js`に`_lastBypassedNodes`/`_lastMutedNodes`(モジュールスコープ、`_lastCheckpointSubstitutions`と同じパターン)を追加し、`convertUiToApi()`実行中にBypass/Muteで除外したノードの`{nodeId, title}`を記録。`getLastBypassedNodes()`/`getLastMutedNodes()`で呼び出し元から取得可能にした
|
||||
- `templates/index.html`の共有Raw JSONウィジェット(`#wfm-gen-rawjson-widget`、Input/Model/Settingsタブ間をJSで移動する仕組み — 既存のsearch barと同じ場所)に`#wfm-gen-rawjson-bypass-note`を追加。3タブ共通のヘッダーに置くことで「Input/Model/Settingsそれぞれの上部」という要望を1箇所の実装で満たせる
|
||||
- `generate-tab.js`の`loadWorkflowIntoEditor()`で、UI形式からの変換時(`format === "ui"`)のみ上記2つのgetterを読み、該当ノードがあれば`t("rawJsonBypassNote", list)`/`t("rawJsonMutedNote", list)`(新規i18nキー、EN/JA/ZH追加)を`escapeHtml`経由でnote要素に表示、無ければ`display:none`
|
||||
- CSS: `--wfm-warning`色のアンバー背景バーとして`main.css`に追加
|
||||
- ヘルプ: `helpGen7`(index.html + i18n.js全ロケール、既存キーへの追記のため`app.js`のhelpIdMapは変更不要)にBypass/Mute注記の説明を追加
|
||||
|
||||
**検証**(Kapture、実機ブラウザ): Workflowタブから`chat_i2i_anima`を検索→「生成UIに読み込み」ボタンで読み込み、Input/Model/Settingsいずれのサブタブでも`#wfm-gen-rawjson-bypass-note`に「バイパス中(除外・配線は再接続済み): LoraLoader (74)」が表示されることを確認。Bypass/Muteノードを含まない別ワークフロー(`04031-lora.json`)を読み込んだ場合は`display: none`で非表示になることも確認。
|
||||
|
||||
## v0.3.74
|
||||
|
||||
### AI TOOL Chatペインの画像添付対応 + I2I連携
|
||||
|
||||
v0.3.73でChatペインのT2I画像生成（Tool Calling）を実装した直後の依頼。「TOOLSのファイルドロップエリアを使ってChatに画像添付対応させたい、I2Iワークフローとの連携（画像の差し替え）も行いたい」という要望を受けて着手。実装前に設計上の分岐点（添付画像をLLMにも見せるか／I2I用ワークフローをT2Iと共用するか／添付の持続性）をユーザーに確認し、それぞれ「LLMにも見せる（マルチモーダル）」「T2I専用とは別にI2I専用ワークフローを新設」「明示的にクリアするまで保持」で合意して実装した。
|
||||
|
||||
**対象ファイル:** `static/js/ai-tab.js`, `static/js/comfyui-editor.js`, `static/css/main.css`, `static/js/i18n.js`, `static/js/app.js`, `templates/index.html`
|
||||
|
||||
**TOOLS↔Chat 共有の添付画像:**
|
||||
- 新しいドロップゾーンを作らず、TOOLSペインの既存ドロップエリア（`wfm-ai-vlm-drop`、VLMタスク用）をChatの添付機構としても共用する設計。モジュールレベルの共有state `_toolsImage = { file, base64, mimeType }` を導入し、`initVlmTab()`のローカル変数`vlmImage`を置き換えた
|
||||
- `_syncAttachmentUI()`（新規）: TOOLS側プレビューの表示/非表示とChat側の添付インジケーター（サムネイル+ラベル+✕）を1箇所で同期。`document.getElementById`による都度参照のため、`initVlmTab`/`initChatTab`どちらが先に呼ばれても安全
|
||||
- クリアは共通の`_clearToolsImage()`。TOOLSプレビュー上の✕ボタン、Chat添付インジケーターの✕ボタンのどちらからでも同じ状態を更新する
|
||||
- 添付は合意事項通り、送信後も自動クリアされず明示的にクリアするまで保持される
|
||||
|
||||
**マルチモーダルチャット送信:**
|
||||
- `chatHistory`のエントリを内部共通形式 `{role, content, images?: [{base64, mimeType}]}` に拡張
|
||||
- `callChat()`に`_formatMessagesForBackend(messages, backend)`を追加し、送信直前にバックエンド別のワイヤーフォーマットへ変換（Ollama: `images:[base64...]`、LM Studio: `content`をテキスト+`image_url`のコンテンツブロック配列に変換）。`callVLM()`で既に使われている規約を踏襲
|
||||
- `generate_image`ツールの説明文を更新し、画像添付時はT2IでなくI2Iとして動作することをLLMに伝えるようにした（引数スキーマ自体は`prompt`/`negative_prompt`のまま変更なし）
|
||||
|
||||
**I2I生成ブリッジ:**
|
||||
- `comfyui-editor.js`の`applyImageToSlot(file, slotIndex, opts)`に`opts.workflow`/`opts.analysis`対応を追加（`applyImageAndMaskToSlot`と同一パターン）。渡された場合はDOM更新を行わずアップロード後のファイル名のみ返す非破壊的変更で、既存呼び出し元（GenerateUI Imageタブ）への影響なし
|
||||
- `generateImageFromChat(prompt, negativePrompt)`を拡張し、`_toolsImage`がセットされていればI2I分岐へ：対象ワークフロー（GenerateUIの読み込み中ワークフロー、またはI2I専用ワークフロー）に`load_image_nodes`が無ければ明確なエラーを投げ、あればslot 0のLoadImageノードへ添付画像を差し替えてから通常のプロンプト設定・生成へ進む
|
||||
|
||||
**SETTINGSペイン — Chat I2I Generation:**
|
||||
- 既存の「Chat Image Generation」（T2I専用ワークフロー）セクションと全く同じ構造で「Chat I2I Generation」セクションを新設。`chatGenI2IDedicatedEnabled`/`chatGenI2IDedicatedFilename`として`wfm_ai_settings`に独立して永続化。ワークフロー一覧の取得（`/api/wfm/workflows`）はT2I側のfetchを流用し2つのselectへ同時反映
|
||||
|
||||
**表示調整（ユーザーフィードバックにより追加修正）:**
|
||||
- Chatバブル内の添付画像エコー（送信したユーザーメッセージに表示される添付プレビュー）が大きすぎたため、`appendChatBubble`に`opts.attachThumb`（新設、max 120px）を追加し、生成結果画像用の`opts.imageUrl`（`.wfm-ai-chat-img`）とスタイルを分離
|
||||
- 生成結果画像自体も表示が大きすぎるとのフィードバックを受け、`.wfm-ai-chat-img`の`max-width`を`100%`→`20%`に変更（約80%サイズダウン）
|
||||
|
||||
**推奨モデル:** 動作確認の結果、Tool CallingとVision機能の両方が良好に動作したモデルとして Gemma 4:e4b、Qwen 3.5:9b、Ministral 3:3b（Ollama）を確認。ヘルプ（`helpAi3`）とREADMEに記載
|
||||
|
||||
**ヘルプ更新（3点セット）:** `templates/index.html`/`static/js/i18n.js`（EN/JA/ZH）/`static/js/app.js`の`helpIdMap` — `helpAi3`（添付画像・I2I・推奨モデルの追記）、`helpAi4`（TOOLSドロップ画像がChatとも共有される旨）、`helpAi6`（Chat I2I Generation設定セクションの追記）。いずれも既存キーへの追記のため`helpIdMap`自体の変更は不要
|
||||
|
||||
**検証**（Kapture、実機ブラウザ、Ollama）: TOOLSへの画像ドロップ→Chat添付インジケーター表示、Chatでの画像編集依頼→I2I生成の実行、TOOLS/Chat双方の✕による添付クリア、Chatバブルの画像サイズ調整（添付エコー120px、生成結果`max-width:20%`）を確認。ブラウザ接続（Kapture）が一時的に切断される場面があり、再接続後に検証を継続した。
|
||||
|
||||
## v0.3.73
|
||||
|
||||
### AI TOOL Chatペインからの対話式画像生成（Tool Calling）＋ Checkpoint関連の安全策
|
||||
|
||||
ユーザーからの「OpenWebUIのような対話式画像生成をこのプラグインで実現できないか」という相談から着手。既存のOllama/LM Studioチャット機能（`static/js/ai-tab.js`）とGenerateUIタブの生成機能（`static/js/generate-tab.js`）は別々に存在していたが、両者をLLM Tool Calling経由で接続した。実装・検証の過程で、GenerateUIのModelタブに以前から存在した「保存済みワークフローのCheckpointが実在しない場合、無警告で別モデルに差し替わる」という表示バグも発見・修正した。
|
||||
|
||||
**対象ファイル:** `static/js/ai-tab.js`, `static/js/generate-tab.js`, `static/js/settings-tab.js`, `static/js/comfyui-editor.js`, `static/js/comfyui-workflow.js`, `static/css/main.css`, `static/js/i18n.js`, `static/js/app.js`, `templates/index.html`
|
||||
|
||||
**Chatペイン画像生成（Tool Calling）:**
|
||||
- `generate_image`ツール（`prompt`/`negative_prompt`引数）をOllama/LM Studio双方のchat APIに渡し、呼び出すかどうかはLLM自身が判断する設計（合意事項: 画像生成後、結果はLLMに送り返さず会話は一旦区切る／SPA版のみ対応、サイドパネル版は対象外）
|
||||
- `callChat()`の戻り値を`string`から`{content, toolCalls}`へ変更。Ollamaの`tool_calls[].function.arguments`はオブジェクト、LM Studio(OpenAI互換)はJSON文字列という差異は`_parseToolArgs()`で吸収
|
||||
- 生成処理は既存の`window._wfmGenerateTab.generate(workflowOverride)`（Image Edit「Inpaint」の外部呼び出しと同じ橋渡しパターン）をそのまま再利用。ワークフローはディープクローンしてから`comfyEditor.setPromptText()`で書き込むため、GenerateUIタブの表示状態は一切汚染しない
|
||||
- **既存コードの欠落を修正:** `_coreGenerate`/`handleGenerate`（`generate-tab.js`）が生成結果`{images, seed}`を計算していながら`return`していなかったため、戻り値を追加（既存呼び出し元は戻り値を使っていないため影響なし）
|
||||
- Chatペイン下部（Send/Clearボタンの隣）に「画像生成を許可する」チェックボックス（デフォルトON、`wfm_ai_settings`に永続化）。OFF時は`callChat()`に`tools`を渡さずLLMには一切提示しない
|
||||
|
||||
**SETTINGSペイン — Chat画像生成の専用ワークフロー:**
|
||||
- Image Edit「Inpaint」の「Use dedicated workflow」と同一パターンを踏襲。OFF（デフォルト）はGenerateUIの読み込み中ワークフロー、ONは選択した保存済みワークフローを`/api/wfm/workflows/raw`経由でその都度ロード・変換（`comfyWorkflow.detectFormat`/`convertUiToApi`/`analyzeWorkflow`）して使用
|
||||
|
||||
**バグ修正: Checkpoint未一致時の無警告差し替え（`comfyui-workflow.js`）:**
|
||||
- `convertUiToApi()`のCOMBO値フォールバック処理（Impact Packのワイルドカード等、動的な選択肢がインスタンス間でズレて生成エラーになるのを防ぐため既存）が、`ckpt_name`にも無差別に適用されており、保存されたCheckpointパスが現在の環境に存在しない場合、無警告でCombo選択肢の先頭（たまたまアルファベット順で最初のFluxモデル）に差し替えられていた。この製品の「なぜかいつもFluxが表示される」という混乱の直接的な原因だった
|
||||
- `getLastCheckpointSubstitutions()`を追加し、`ckpt_name`の差し替えが発生した場合のみ元の値・ノードIDを記録。`loadWorkflowIntoEditor`（`generate-tab.js`）で検知し、通常の「読み込み完了」トーストの代わりに、差し替え前のモデル名を含む警告トースト（`error`スタイル）を表示する
|
||||
- GenerateUI Modelタブ（`comfyui-editor.js`の`renderModelTab`）にも、保存値が現在のモデル一覧に存在しない場合に警告付きの選択肢を先頭表示する対応を追加（API形式で保存され`convertUiToApi`を経由しないワークフローに対して有効。UI形式ワークフローは上記の差し替えにより「一致している」ように見えるため、この表示だけでは検知できないケースがある）
|
||||
|
||||
**設定タブ — デフォルトCheckpoint:**
|
||||
- チェックボックスで有効化すると、GenerateUIへのワークフロー読み込み時に全Checkpointローダー系ノード（`CheckpointLoaderSimple`/`CheckpointLoader`/`ImageMetadataPromptLoader`）の`ckpt_name`を指定モデルへ強制上書き。サーバー側`/api/wfm/settings`に永続化（複数ブラウザ間で共有）
|
||||
- **実装中に判明した順序依存の不具合:** 上書き処理を`analyzeWorkflow()`実行後に行っていたため、Raw JSON上のデータは正しく上書きされてもModelタブの表示（`analysis.checkpoint_nodes`由来）が古い値のまま残る不具合があった。`analyzeWorkflow()`実行前に上書きする順序に修正
|
||||
|
||||
**ヘルプ更新（3点セット）:** `templates/index.html`/`static/js/i18n.js`（EN/JA/ZH）/`static/js/app.js`の`helpIdMap` — `helpAi3`（Chat画像生成機能＋許可トグルの説明を追記）、`helpAi6`（SETTINGSペインの専用ワークフロー設定を追記）、`helpTrouble8`（新規: 「ModelタブのCheckpointが想定と違う」症状の原因と対処法）
|
||||
|
||||
**検証**（Kapture、実機ブラウザ + Ollama qwen3.5:9b）:
|
||||
- Chatペインから「〜の画像を生成して」で`generate_image`が呼ばれ、実際に画像が生成されチャット内に表示されることを確認（初回は無関係のワークフロー設定に起因するVAEチャンネル数不一致エラーが発生したが、ワークフロー側の修正後に正常動作を確認）
|
||||
- SETTINGSペインの専用ワークフロー機能: 選択したワークフロー（UI形式、`ws_sdxl_t2i_basic.json`）が正しくロード・変換され、Chat経由の生成に使われることを確認
|
||||
- 「画像生成を許可する」チェックボックスの位置変更（ヘッダー→下部の操作行）を反映
|
||||
- デフォルトCheckpointのON/OFF切り替えでModelタブの表示が正しく変わることを確認（ON: 指定モデル、OFF: 元の壊れた表示に復帰）
|
||||
- 実際に不一致のあるワークフロー（`op_sdxl_ill_lora.json`、保存値`anime\animozalyca_v10.safetensors`が未インストール）で、差し替え警告トーストが元のモデル名を含めて正しく表示されることを確認
|
||||
|
||||
## v0.3.72
|
||||
|
||||
### Comic Creator連携用の外部Inpaintエントリポイントを追加
|
||||
|
||||
Comic Creator（`comfyui-comic-creator`）のImageタブから、既存のI2I連携（`window._wfmReceiveImageForI2I`、iframe越しの直接関数呼び出し）と同じ方式でInpaintも呼び出せるようにする依頼を受けて対応。
|
||||
|
||||
**対象ファイル:** `static/js/image-edit-tab.js`, `static/js/gallery-tab.js`, `static/js/comfyui-editor.js`
|
||||
|
||||
- `image-edit-tab.js`: `_runInpaint()`（UI駆動）から共通処理（LoadImage/MaskEditorOneノードへの反映〜Generate実行〜結果URL取得）を`_runInpaintWithImages()`として切り出し、外部呼び出し専用の`runInpaintExternal(imageBlob, maskBlob, params)`を新設（専用ワークフロー選択は扱わず、常にGenerateUIの現在ロード中ワークフローが対象）。マスクレイヤー選択に`.visible`チェックを追加し、非表示のマスクレイヤーはUI駆動・外部呼び出し双方で対象から除外されるよう修正。
|
||||
- `gallery-tab.js`: `window._wfmReceiveImageForI2I`と同じ場所に`window._wfmReceiveInpaintRequest(imageBlob, maskBlob, params, workflowData?, workflowFilename?)`を新設。`workflowData`が渡されればI2Iと同じ手順（接続確認→モデルリスト確保→`loadWorkflowIntoEditor`）でロードしてから`runInpaintExternal`を呼ぶ。
|
||||
- **バグ修正（`comfyui-editor.js`）:** `_loadImageElement()`内の`src instanceof Blob`判定が、別ウィンドウ（Comic Creator）で生成されたBlob/Fileに対しては別レルムのコンストラクタ参照になるため常に`false`を返し、`img.src`にBlobオブジェクトがそのまま代入されて`[object Blob]`という文字列がURLとして解釈され404になるバグを発見・修正（`typeof src !== "string"`による実体判定に変更）。Blob自体は`URL.createObjectURL`等でレルムをまたいで問題なく使えるため、チェック方法のみが原因だった。同一オリジンiframe越しに他ウィンドウ生成のBlob/Fileを直接受け渡す連携を実装する際は、受け取り側で`instanceof`ベースの判定を避けること。
|
||||
|
||||
**検証**（Kapture、Comic Creator実機 `http://127.0.0.1:8189/ccc`）: Comic Creator側からInpaint実行→本ノードのInpaintが正常に動作し結果が返ることを確認。非表示マスクレイヤーの除外もComic Creator側UIから確認。
|
||||
|
||||
## v0.3.71
|
||||
|
||||
### Inpaint機能の追加（GenerateUI Imageタブ + Image Edit「Inpaint」タブ）
|
||||
|
||||
ユーザー要望「インペイント機能を追加したい」。参考ワークフロー（SDXL + VAEEncodeForInpaint構成）の解析から着手し、複数セッションにわたり段階的に実装。
|
||||
|
||||
**対象ファイル:** `static/js/comfyui-workflow.js`, `static/js/comfyui-editor.js`, `static/js/image-edit-tab.js`, `static/js/generate-tab.js`, `static/js/i18n.js`, `static/css/main.css`, `templates/index.html`, `static/js/app.js`
|
||||
|
||||
**ワークフロー解析（`analyzeWorkflow`）:**
|
||||
- `load_image_nodes` に `mask_used` フラグを追加。`LoadImage` ノードのMASK出力（output slot 1）が他ノードの入力（`["<id>", 1]` 参照）として使われているかを走査して判定。`MaskEditorNode` 等の中継ノードを経由していても、参照元のLoadImageまで正しく特定できる
|
||||
- `inpaint_encode_nodes`（`VAEEncodeForInpaint` の `grow_mask_by`）、`mask_editor_one_nodes`（`MaskEditorOne` ノード）を新規検出
|
||||
|
||||
**生成UI Input/Imageタブ — マスクスロット:**
|
||||
- `mask_used` なLoadImageスロットにのみ「Mask」ドロップゾーンを追加表示
|
||||
- Apply時、マスク指定があれば画像+マスクをRGBA合成（マスク白領域→アルファ0）して1枚のPNGとしてアップロード。ComfyUIネイティブの `mask = 1 - alpha` 抽出にそのまま準拠するため追加ノード不要
|
||||
- Mask Editor One ノード用の専用スロットも追加（画像・マスクの両方が揃って初めてApply可能）
|
||||
|
||||
**Image Editタブ — Inpaintツール（🩹）:**
|
||||
- プロパティパネルにポジ/ネガプロンプト、Grow Mask By、Denoise、Runボタン、結果画像プレビューを追加
|
||||
- Run押下で: 非マスクレイヤー合成画像 + アクティブなマスクレイヤーを書き出し → 生成UIのインペイント対応スロットへRGBA合成アップロード → プロンプト/grow_mask_by/denoiseを反映 → GenerateUIの生成を呼び出し（画面はImage Editタブに留まる）→ 完了後の結果画像をプロパティパネルに表示
|
||||
- **バグ修正:** ツールバーの `<button data-tool="inpaint">` を `templates/index.html` に追加し忘れており、`TOOL_DEFS` にエントリを追加しただけではボタンが表示されない不具合があった（ツールバーは静的HTML、`TOOL_DEFS` は `ready` 判定とラベル参照専用）
|
||||
|
||||
**Mask Editor One（`comfyui-mask-editor-one`）対応:**
|
||||
- 実装（`nodes.py`/`server.py`）を調査した結果、この custom node は `LoadImage` を介さず、画像はサーバー側インメモリキャッシュ（`node_id` キー、`bg_image_b64`、`/mask_editor/store_image` でPOST）から、マスクは `layer_data`（JSON文字列ウィジェット）の各レイヤーの**アルファチャンネル**から合成されると判明（`LoadImage` の `1 - alpha` とは逆で、alpha値がそのままmask値になる規約）
|
||||
- `comfyEditor.applyImageAndMaskToMaskEditorOneNode()` を新規実装し、この2つの経路（画像キャッシュPOST + layer_data書き込み）を実装
|
||||
- Inpaint Runは `mask_used` なLoadImageスロットを優先し、無ければMask Editor Oneノードへ自動フォールバック
|
||||
|
||||
**インペイント専用ワークフロー:**
|
||||
- Inpaintプロパティ上部に「Use dedicated workflow」チェックボックス + 保存済みワークフロー選択ドロップダウンを追加。OFF時は従来通りGenerateUIの読み込み中ワークフローを使用、ON時は選択したワークフローをその場でロード・解析し、**GenerateUIタブの表示状態には一切触れずに**画像/マスク/プロンプト/パラメータを適用して生成
|
||||
- `generate-tab.js`: `_coreGenerate`/`handleGenerate` に `workflowOverride` 引数を追加（省略時は従来通り `comfyUI.currentWorkflow` を使用）。オーバーライド時はバッチモードの影響を受けない単発生成に固定し、GenerateUI側のプロンプト同期（`syncToWorkflow`）もスキップ
|
||||
- `comfyui-editor.js`: `applyImageAndMaskToSlot` / `applyImageAndMaskToMaskEditorOneNode` / `setPromptText` / `setInpaintParams` に `{workflow, analysis}` オプションを追加し、指定時はそちらへ直接書き込む方式に統一
|
||||
|
||||
**サンプルワークフロー追加:** `workflows/ws_inpaint_basic.json`（LoadImage直結）、`workflows/ws_inpaint_mask_editor_one.json`（Mask Editor One使用）とプレビュー画像
|
||||
|
||||
**ヘルプ更新（3点セット）:** `templates/index.html`、`static/js/i18n.js`（EN/JA/ZH `helpImageEdit7e` 新規）、`static/js/app.js`（`helpIdMap` に `wfm-help-imageedit-7e` 追加）
|
||||
|
||||
**既知の簡略化点:** Grow Mask By / Denoiseのプロパティパネル初期表示値は、専用ワークフロー使用時も常にGenerateUI側の読み込み中ワークフローから算出される（Run実行時に書き込まれる値自体は専用ワークフロー側に正しく反映される）
|
||||
|
||||
## v0.3.70
|
||||
|
||||
### Workflow AI要約: Ollama 404エラー修正
|
||||
|
||||
ユーザー報告「ワークフロー詳細モーダルの要約機能でエラー `[ERROR] Ollama chat error: HTTP Error 404: Not Found`」の調査から発生。
|
||||
|
||||
**原因:** `static/js/workflow-tab.js` の要約ボタンはモデル名を指定せずサーバー側 `/api/wfm/ollama/chat` を呼んでおり、サーバー側デフォルト（`py/routes/ollama_routes.py` の `OLLAMA_DEFAULTS.model = "llava"`、タグ無し）が使われていた。実環境には `llava:7b` のようにタグ付きの名前でしか入っておらず、Ollamaは完全一致でしかモデルを解決しないため404になっていた。加えて、設定タブの「AI Assistant Settings (Prompt Tab)」（`localStorage` の `wfm_prompt_ai_settings`）にOllamaのURL・モデル選択UIがすでに存在していたが、Workflowタブの要約機能はこれを一切参照していなかった。
|
||||
|
||||
**対象ファイル:** `static/js/workflow-tab.js`, `py/routes/ollama_routes.py`, `static/js/i18n.js`
|
||||
|
||||
**変更内容:**
|
||||
- `workflow-tab.js`: 要約ボタンが `readJsonStorage("wfm_prompt_ai_settings", {})` で設定タブ保存済みのbackend/backendUrl/modelを読み込み、`/api/wfm/ollama/chat` へ `url` / `model` を渡すように変更。backendが `ollama` 以外（LM Studio）の場合は明示的にエラートースト
|
||||
- `ollama_routes.py`: `handle_chat` がリクエストbodyの `url` も受け付けるように対応（従来は `model` のみ）
|
||||
- i18n: `summarizeOllamaOnly` をEN/JA/ZHに追加
|
||||
|
||||
### Image Edit: New button で Layer 1 自動追加
|
||||
|
||||
ユーザー要望「New button 画像作成時に自動でレイヤー1を追加してほしい」。既存の画像ロード時（`hasLayers` が偽の新規キャンバス経路）は既に「Layer 1」を自動生成していたが、`_newCanvas()`（Newボタン）だけは空の `LayerManager` のままだった。
|
||||
|
||||
**対象ファイル:** `static/js/image-edit-tab.js`
|
||||
|
||||
**変更内容:** `_newCanvas()` で `this._layerMgr.addLayer("draw", "Layer 1")` を追加し、アクティブレイヤー・SelectToolに設定。
|
||||
|
||||
### Image Edit: マスクレイヤーのオーバーレイをアクティブなマスクのみに表示
|
||||
|
||||
ユーザー要望「マスクレイヤーのオーバーレイ表示をマスクレイヤー以外は非表示にしたい」。従来は `layer.visible` のみを条件にオーバーレイ（半透明の色付き表示）を描画しており、非アクティブなマスクレイヤーも常に表示され続けていた。
|
||||
|
||||
**対象ファイル:** `static/js/image-edit-tab.js`
|
||||
|
||||
**変更内容:**
|
||||
- `_renderMaskLayerOverlay(ctx, maskLayer)` の先頭に `if (this._layerMgr?.activeLayer !== maskLayer) return;` を追加。全ての呼び出し経路（単独マスク／マスクグループ）を1箇所でカバー
|
||||
- **副次修正:** レイヤーパネルでSelectツール使用中に通常レイヤーへ切り替えた際に `_updateCompositeView()` が呼ばれていない分岐があり、上記の変更後は「マスク選択→通常レイヤー選択」でオーバーレイが画面に残ったままになる不具合が顕在化するため、当該分岐にも再描画呼び出しを追加
|
||||
|
||||
### GenerateUI Input: プロンプトの「戻す」ボタン + 強調weight編集（Ctrl+↑/↓）
|
||||
|
||||
ユーザー要望2件を同じセッションでまとめて実装。
|
||||
|
||||
**対象ファイル:** `static/js/comfyui-editor.js`, `static/js/i18n.js`
|
||||
|
||||
**変更内容:**
|
||||
- **戻すボタン（↺）** — Positive/Negative各Applyボタンの左隣に追加。クリックで、選択中ノードIDに対応する**ワークフロー上の現在値**（＝直前にApply/ロードされた値）をテキストエリアへ再読み込みする、Applyの逆操作。ノード選択セレクトに `min-width:0` を追加し、ボタン増加によるレイアウト圧迫に対応
|
||||
- **強調weight編集（Ctrl+↑/↓）** — A1111 / ComfyUIネイティブのCLIP Text Encodeと同様の操作感。選択テキスト（無ければカーソル位置の括弧ブロック、次点で単語）を `(text:weight)` 構文に変換し、0.05刻みで増減。weightがちょうど1.0に戻ったら括弧を自動除去。汎用ヘルパー `_attachPromptWeightControl` / `_selectSurroundingParenBlock` / `_selectSurroundingWord` を新規追加し、Positive/Negative両テキストエリアにアタッチ
|
||||
- **バグ修正（同セッション内）** — weightがマイナスに達した状態（例: `(watermark:-0.05)`）でさらにCtrl+↓を押すと `((watermark:-0.05):0.95)` のような二重括弧になる不具合を確認。原因は数値抽出の正規表現 `([\d.]+)` が負符号にマッチせず、マッチ全体が失敗して選択テキスト全体を新しい単語として扱っていたため。`(-?[\d.]+)` に修正。下限は設けない仕様（ComfyUIネイティブのCLIP Text Encodeも同様に無制限のため）
|
||||
- i18n: `revertPromptTitle` をEN/JA/ZHに追加
|
||||
|
||||
**ヘルプ更新（3点セット）:**
|
||||
- `templates/index.html`: `wfm-help-imageedit-3`（New button説明にLayer 1自動追加を追記）、`wfm-help-imageedit-mask-3`（アクティブなマスクのみオーバーレイ表示である旨を追記）、`wfm-help-gen-4`（戻すボタン・Ctrl+↑/↓ weight編集の説明を追記）
|
||||
- `static/js/i18n.js`: `helpImageEdit3` / `helpImageEditMask3` / `helpGen4` をEN/JA/ZHで更新（新規キー追加ではなく既存キーへの追記のため `app.js` の `helpIdMap` は変更不要）
|
||||
|
||||
**教訓（デプロイ同期、再掲）:** 開発リポジトリと `custom_nodes/comfyui-workflow-studio`（StabilityMatrix配下の実行時ディレクトリ）は別実体のコピーであり自動同期しない。今回変更した全ファイル（`workflow-tab.js`, `ollama_routes.py`, `image-edit-tab.js`, `comfyui-editor.js`, `i18n.js`, `templates/index.html`）を都度両方へ適用して対応した。
|
||||
|
||||
## v0.3.69
|
||||
|
||||
### Gallery → ComfyUI Comic Creator 連携（Send CC ボタン）
|
||||
|
||||
ComfyUI Comic Creator（別カスタムノード、連携先名称は「Comic Creater」から改称。`/wfm` を同一オリジンのiframeで埋め込み使用）から、Workflow Studio の Gallery タブで選択した画像を直接送り込めるようにする連携機能。
|
||||
|
||||
**対象ファイル:** `templates/index.html`, `static/js/gallery-tab.js`, `static/js/i18n.js`
|
||||
|
||||
**変更内容:**
|
||||
- Gallery ツールバーの「Send GenUI Image」ボタン右隣に「Send CC」ボタンを追加（`wfm-gallery-send-cc-btn`）。初期状態は非表示
|
||||
- `gallery-tab.js` の `bindEvents()` で、`window.parent !== window`（iframe埋め込み判定）の場合のみボタンを表示
|
||||
- クリック時: `state.selectedImage` 未選択なら案内トースト。埋め込み側であれば `window.parent.insertImageFromUrl(url)`（ComfyUI Comic Creator 側の既存グローバル関数、`main.js` が非モジュールスクリプトのため `window` 直下に生えている）を呼び出し、選択中のコマ／オーバーレイへ画像を挿入する。関数が存在しない（ComfyUI Comic Creator以外からの埋め込み等）場合は案内トーストを表示
|
||||
- `window.parent` へのアクセスはtry/catchで保護（クロスオリジン埋め込み時の例外対策）
|
||||
- i18n: `galleryCCNotAvailable` / `gallerySentCC` を EN/JA/ZH に追加
|
||||
|
||||
**ComfyUI Comic Creator 側は無改修。** 既存の `insertImageFromUrl(url)`（コマ・オーバーレイ判定込みの画像挿入共通ヘルパー）をそのまま呼び出す設計。
|
||||
|
||||
**ハマりどころ（デプロイ同期忘れ）:** 本リポジトリは開発用ディレクトリと実行時の `custom_nodes/comfyui-workflow-studio`（StabilityMatrix配下）が別実体のコピーであり、symlinkではない。上記3ファイルを開発リポジトリのみ編集した状態でComfyUIを起動していたため、「Send CCボタンが表示されない」という報告を受けた。実行時ディレクトリへ3ファイルを手動コピーして解決（差分は今回の追加分のみで他の乖離なし）。今後この種の変更をした際は、都度 `custom_nodes/` 側への同期を忘れないこと（本体のコミット前チェックリスト「全ファイルを custom_nodes/ に同期」を参照）。
|
||||
|
||||
### I2I連携（Comic Creater送信画像の受信・デフォルトワークフロー自動読込）
|
||||
|
||||
ComfyUI Comic Creater の「I2Iへ送る」ボタンから、iframe越しに画像をGenerate UIのImage入力スロットへ直接セットする受信用グローバル関数`window._wfmReceiveImageForI2I(blob, name, workflowData?, workflowFilename?)`を新規追加。上記のSend CCと対になる、逆方向（Comic Creater→Workflow Studio）の連携。既存の「Send GenUI Image」（Galleryの選択画像を送る版）とロジックを共有。
|
||||
|
||||
**対象ファイル:** `static/js/gallery-tab.js`
|
||||
|
||||
**変更内容:**
|
||||
- `window._wfmReceiveImageForI2I`をモジュールトップレベルに追加。`comfyEditor.applyImageToSlot(file, 0)`を呼び、Generate UI → Input → Imageタブへ自動切替した上で画像をLoadImageスロットにセットする
|
||||
- `workflowData`（ワークフローJSON）が渡された場合、画像をセットする前に`loadWorkflowIntoEditor(workflowData, workflowFilename)`（generate-tab.js既存export）でワークフローを差し替える。Comic Creater側の設定タブで「デフォルトI2Iワークフロー」が有効な場合のみ渡される（`user/default/workflows/`配下のファイルをComic Creater側が`GET /api/wfm/workflows/raw?filename=X`で取得して渡す設計、本リポジトリのAPI自体は無改修）
|
||||
- 既存の「Send CC」ボタンのクリックハンドラを拡張し、`window.parent._ccI2ITargetMode`（Comic Creater側が送信元をレイアウトタブ／Imageタブのどちらか記録するフラグ）を参照して、`window.parent.insertImageFromUrl(url)`（レイアウトタブ挿入、従来通り）と`window.parent._ccImageTab.loadFromUrl(url, name)`（Imageタブ読込、新規）を分岐
|
||||
|
||||
**ハマりどころ1（プレビューのURLキャッシュ）:** Comic Creater側が同一ファイル名で連続送信すると、`applyImageToSlot`が`previewImg.src`に設定するURL文字列（`/view?filename=...`）が変わらないため、サーバー側は正しく上書きされているのにブラウザがキャッシュ画像を表示し続けた（「編集内容が反映されていないように見えるが、実際に生成すると反映されている」という診断が難しい症状として報告された）。対策はComic Creater側でファイル名をタイムスタンプ付きでユニーク化する方式とし、本リポジトリ側は無改修で解決。
|
||||
|
||||
**ハマりどころ2（モデルリスト未取得）:** iframe埋め込み直後など`comfyEditor.models`（Checkpoint等一覧、`init()`時に1回だけ非同期取得）が空のタイミングで`loadWorkflowIntoEditor`を呼ぶと、Model/生成UIタブのCheckpoint等ドロップダウンが空のままレンダリングされ、選択もできなくなる不具合が発生した（Comic Creater再起動でも再現するとの報告）。`_wfmReceiveImageForI2I`内でワークフローロード前に`comfyUI.checkConnection()`→（`comfyEditor.models.checkpoints`が空なら）`comfyEditor.loadModelLists()`を保証するよう修正して解決。
|
||||
|
||||
**ComfyUI Comic Creator 側の実装:** レイアウトタブ・Imageタブの「I2Iへ送る」ボタン、送信共通関数`sendImageToWorkflowStudioI2I`、設定タブの「I2I設定」ブロック（デフォルトワークフローのON/OFF・ファイル名指定）はすべてComic Creater側に実装（本リポジトリからは見えない）。
|
||||
|
||||
**教訓（デプロイ同期忘れ、再掲）:** 前回のSend CC実装時と同じ理由で、開発リポジトリと`custom_nodes/comfyui-workflow-studio`（StabilityMatrix配下の実行時ディレクトリ）は別実体のコピーであり自動同期しない。今回は`gallery-tab.js`の変更を都度両方へ適用して対応した。
|
||||
|
||||
### Loraバッチ生成のバリデーションエラー修正 + プロンプト自動反映
|
||||
|
||||
ユーザー報告「生成UIタブのBatchタブでLoraのバッチ機能を使用してIllustriousグループ（128モデル）でバッチ生成を開始したがエラー（`Prompt outputs failed validation`）となった」の調査から一連の修正を実施。
|
||||
|
||||
**原因: パス区切り文字の不一致**
|
||||
ComfyUI(Windows)はLoraのサブフォルダ区切りに`\`を使ってenumリストを返すが、Workflow Studio内部では`/`区切りで管理していたため、実ファイルが存在するにもかかわらずLoraLoaderの`lora_name`バリデーションに失敗していた（当初「サーバー起動後のキャッシュ未反映」と誤診断したが、実際は表記の不一致が原因だった）。
|
||||
|
||||
**対象ファイル:** `static/js/comfyui-editor.js`, `static/js/models-tab.js`, `static/js/generate-tab.js`
|
||||
|
||||
**変更内容:**
|
||||
- `comfyui-editor.js`の`comfyEditor`に共通ヘルパー`resolveLoraName(name)`を追加 — 内部の`/`区切り表記を、`comfyEditor.models.loras`（ComfyUIから取得済みの実表記）と突き合わせて実際の表記に変換
|
||||
- Lora Single適用（`_applyLoraToNode`）、Stack Apply、`models-tab.js`のGenUI Modelボタンの3箇所を`resolveLoraName`経由に統一
|
||||
- Loraバッチ実行（`generate-tab.js`）は`comfyUI.fetchLoras()`を都度呼び出して同様の変換マップを構築（バッチ実行前チェックと共用）
|
||||
|
||||
**Loraバッチ実行前チェック:**
|
||||
- 通常のLoraLoaderノードを使うワークフローの場合、バッチ開始前に選択済みLoraをComfyUI側の最新一覧と突き合わせ、認識されていないものがあれば`batchLoraMissing`警告トーストを表示（ComfyUIのRefresh/再起動を促す）
|
||||
- Lora Managerノード使用時はenum制約がないため対象外
|
||||
|
||||
**Loraバッチ実行時のプロンプト自動反映:**
|
||||
- 各Loraアイテム適用時、Positiveプロンプト（テキストエリア＋ワークフロー内の各positiveノード）にLora構文`<lora:name:strength_model:strength_clip>`とCivitAIトリガーワードを自動追加。常にバッチ開始前の元プロンプトを起点に再構築するため、Lora構文が蓄積されることはない
|
||||
- バッチ完了・停止（Stopボタン）・エラーいずれの場合も`finally`でプロンプトを開始前の状態に自動復元
|
||||
|
||||
**モデル詳細モーダルに「閉じる」ボタン追加:**
|
||||
- `models-tab.js`のモデル詳細モーダル（Checkpoint/Lora/Embedding/Hypernetworkなど全サブタブ共通）で、「保存」「GenUI PP/NP」「削除」ボタンの並び右端に「閉じる」ボタンを追加。連続作業時にモーダル右上のXボタンまでマウス移動する手間を削減。既存の`close` i18nキーを再利用
|
||||
|
||||
**ヘルプ更新（3点セット）:**
|
||||
- `templates/index.html`: `wfm-help-gen-19`を新規追加
|
||||
- `static/js/i18n.js`: `helpGen19`をEN/JA/ZHで新規追加（Loraバッチのプロンプト自動反映・復元・事前チェックの説明）
|
||||
- `static/js/app.js`の`helpIdMap`に`"wfm-help-gen-19": "helpGen19"`を登録
|
||||
|
||||
**その他:** 連携先カスタムノードの名称変更（Comic Creater → ComfyUI Comic Creator）をUI文言・コメント（`i18n.js`, `templates/index.html`, `gallery-tab.js`）に反映。
|
||||
|
||||
## v0.3.68
|
||||
|
||||
### MASK EDITOR ONE セクション常時表示化
|
||||
|
||||
ユーザー報告: 「Image EditタブでABRブラシが表示できない」の原因調査から発生。実際にはSAM3・BiRefNetは正常動作しており（`/mask_editor/sam3/status`・`/mask_editor/birefnet/status`とも`loaded: true`）、原因は Mask Editor One の `brushes/` フォルダが空（`.abr`未インポート）で、`_abrAvailable = tree.length > 0` の判定によりセクション自体が非表示になっていたこと。
|
||||
|
||||
調査の結果を受け、「MASK EDITOR ONEセクションは常時表示し、色で利用可否を示す」という方針に変更。
|
||||
|
||||
**対象ファイル:** `static/js/image-edit-tab.js`
|
||||
|
||||
**変更内容:**
|
||||
- Mask Paint モード（`_renderMaskProps`）・Draw ツール（`_renderDrawProps`）双方で、`MASK EDITOR ONE` / `MASK EDITOR ONE (COLOR)` セクションを囲んでいた `${this._abrAvailable ? ... : ""}` の外側条件分岐を削除し、常時レンダリングするように変更
|
||||
- セクション見出しの文字色を `this._abrAvailable` に応じて動的に切り替え: 利用可能時 `var(--wfm-success)`（緑）、未インポート時 `var(--wfm-text-secondary)`（既存のデフォルト色）
|
||||
- 見出しに `title` 属性でツールチップ（"Mask Editor One: brushes available" / "no brushes imported yet"）を追加
|
||||
- Select ボタンは `this._abrAvailable` が false の間 `disabled` 属性を付与（ブラシが1つもない状態でクリックしても意味がないため）
|
||||
- ブラシ画像が選択済み（`t.brushImage`）の場合の Spacing / Angle / Sz Jitter / Rot. Jitter 詳細行の表示条件は変更なし（`t.brushImage` の有無のみで判定、`_abrAvailable` とは独立）
|
||||
|
||||
**ヘルプ更新（3点セット）:**
|
||||
- `templates/index.html`: `wfm-help-imageedit-5`（Draw）・`wfm-help-imageedit-mask-4`（Mask Paint）の文言を更新
|
||||
- `static/js/i18n.js`: `helpImageEdit5` / `helpImageEditMask4` を EN/JA/ZH 3言語で更新
|
||||
- `static/js/app.js` の `helpIdMap` は既存キーのままで対応不要（新規キー追加なし）
|
||||
|
||||
**Why:** `_abrAvailable` はブラシ登録数のみで決まり、Mask Editor One のインストール有無とは無関係だった。旧仕様（ブラシ0件でセクション非表示）だと、ユーザーは機能の存在自体に気づけず「ABRブラシが使えない」と誤認する。常時表示＋色分けにすることで、機能の存在と現在の利用可否を両方伝える。
|
||||
|
||||
## v0.3.67
|
||||
|
||||
### Alt+Click Apply & Generate
|
||||
|
||||
GenerateUI タブの Apply ボタンを Alt+Click すると、Apply と Generate を1操作で実行できる機能を追加。
|
||||
よく変更する箇所（Positive Prompt・Checkpoint・KSampler）でApplyボタンとGenerateボタンを往復する手間を省く。
|
||||
|
||||
**対象ボタン（`comfyui-editor.js`）:**
|
||||
- Input タブ — Positive Prompt の Apply（`wfm-prompt-pos-apply`）
|
||||
- Model タブ — 全モデル Apply（`wfm-model-apply`: Checkpoint / VAE / Diffusion Model / ControlNet / Hypernetwork）
|
||||
- Settings タブ — KSampler の Apply（`wfm-settings-sampler-apply`）
|
||||
|
||||
**動作の流れ:**
|
||||
1. Alt+Click → Apply 処理を実行（ワークフローへの書き込み＋Raw JSON同期）
|
||||
2. Apply が成功（対象ノードが存在）した場合のみ `wfm:apply-and-generate` カスタムイベントを dispatch
|
||||
3. `generate-tab.js` のリスナーがイベントを受け取り `handleGenerate()` を呼び出す
|
||||
|
||||
循環参照を避けるためカスタムイベント経由で連携（comfyui-editor.js は generate-tab.js を import しない設計を維持）。
|
||||
対象ノードが存在しない場合はdispatchされないため、ワークフロー未読み込み時は何も起きない。
|
||||
|
||||
各 Apply ボタンに `title="Apply (Alt+Click: Apply & Generate)"` を追加してホバーで操作を確認できるようにした。
|
||||
|
||||
**ヘルプ更新:**
|
||||
- `helpGen18` を EN/JA/ZH の3言語で追加
|
||||
- `index.html` に `wfm-help-gen-18` の `<li>` 追加
|
||||
- `app.js` の `helpIdMap` に `"wfm-help-gen-18": "helpGen18"` 登録
|
||||
|
||||
---
|
||||
|
||||
## 計画: Image Edit 拡張 — ABRブラシ連携 + Mask Editor One 統合
|
||||
|
||||
**方針**: Mask Editor One（同作者）のインストールを前提に、WFS Image Edit タブに2つの拡張を加える。
|
||||
|
||||
### フェーズ1: Draw ツール — ABRブラシ対応
|
||||
|
||||
#### 概要
|
||||
WFS の Draw ツール（`DrawTool.js`）に画像ブラシ（PNG スタンプ）描画機能を追加する。
|
||||
ブラシデータは Mask Editor One の API エンドポイントを介して取得・管理する。
|
||||
|
||||
#### バックエンド（Mask Editor One API 共用）
|
||||
Mask Editor One がインストールされていれば以下のエンドポイントが利用可能：
|
||||
|
||||
| エンドポイント | 用途 |
|
||||
|---------------|------|
|
||||
| `GET /mask_editor/brushes/list` | フォルダツリー + ブラシ一覧取得 |
|
||||
| `GET /mask_editor/brushes/raw?path=…` | ブラシ PNG 画像をサーブ |
|
||||
| `POST /mask_editor/brushes/import` | PNG フォルダ一括インポート |
|
||||
| `POST /mask_editor/brushes/upload_abr` | ABR ファイルインポート（パーサーは Mask Editor One 側） |
|
||||
|
||||
ブラシの格納先は Mask Editor One のフォルダ（`comfyui-mask-editor-one/brushes/`）を共用。
|
||||
一度インポートすれば WFS / Mask Editor One の両方で同じブラシが使える。
|
||||
|
||||
#### フロントエンド変更
|
||||
|
||||
**`DrawTool.js`**
|
||||
- `brushType: "soft"` | `"image"` プロパティ追加
|
||||
- `imageBrush: { canvas, width, height }` — スタンプ用 OffscreenCanvas をキャッシュ
|
||||
- `_stamp()` を改修: `"image"` モード時は `ctx.drawImage(stamp)` で描画（Jitter は phase 2 以降）
|
||||
- サイズは `brushSize` を高さ基準に、アスペクト比を維持してスケーリング
|
||||
|
||||
**Image Edit タブ (`image-edit-tab.js`)**
|
||||
- Draw ツール Options パネルに「Brush Library」ボタンを追加
|
||||
- Mask Editor One 未検出時はボタンをグレーアウト + ツールチップ表示
|
||||
|
||||
**ブラシライブラリ UI（新規モーダルまたはサイドパネル）**
|
||||
- Mask Editor One API 未応答時は「Mask Editor One が必要です」メッセージ
|
||||
- 応答時: フォルダツリー + ブラシサムネイルグリッド表示
|
||||
- クリックでブラシを選択 → `DrawTool` に適用
|
||||
- Import Folder / Import ABR ボタン（Mask Editor One の import エンドポイントを呼ぶ）
|
||||
|
||||
#### Mask Editor One 検出ロジック
|
||||
```javascript
|
||||
// /mask_editor/brushes/list に HEAD または GET を投げて 200 なら存在確認
|
||||
async function detectMaskEditorOne() {
|
||||
try {
|
||||
const r = await fetch("/mask_editor/brushes/list");
|
||||
return r.ok;
|
||||
} catch { return false; }
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### フェーズ2: Mask Editor One 連携ボタン
|
||||
|
||||
#### 概要
|
||||
WFS Image Edit タブのツールバーまたは Mask ツールのオプションパネルに
|
||||
「Mask Editor で開く」ボタンを追加する。
|
||||
現在のキャンバスレイヤーを画像として Mask Editor One に渡し、編集結果を WFS に戻す。
|
||||
|
||||
#### 実装ポイント
|
||||
- WFS のキャンバス合成画像 (`_exportComposite()`) を Blob として取得
|
||||
- Mask Editor One の `/mask_editor/store_image` に POST してキャッシュ
|
||||
- Mask Editor One のモーダルを JavaScript から起動（`window.maskEditorOpen()` など）
|
||||
- Apply 後のコールバックで Mask Editor One の結果マスク PNG を取得
|
||||
- WFS の mask レイヤーとして追加
|
||||
|
||||
#### Mask Editor One 未インストール時
|
||||
- ボタンを非表示（検出ロジックで判定）
|
||||
|
||||
---
|
||||
|
||||
### 変更ファイル予定
|
||||
|
||||
| ファイル | 変更内容 |
|
||||
|---------|---------|
|
||||
| `static/js/image-edit/DrawTool.js` | 画像ブラシ描画対応 |
|
||||
| `static/js/image-edit-tab.js` | Brush Library ボタン・Mask Editor 連携ボタン |
|
||||
| `static/js/image-edit/BrushLibrary.js` | 新規: ブラシライブラリモーダル UI |
|
||||
| `py/routes/` | 不要（Mask Editor One API を直接利用） |
|
||||
| `static/css/main.css` | ブラシライブラリ UI スタイル |
|
||||
| `static/js/i18n.js` | ブラシ関連 i18n キー追加 |
|
||||
| `templates/index.html` | 不要（動的生成） |
|
||||
|
||||
---
|
||||
|
||||
### 実装順序
|
||||
1. `DrawTool.js` に画像ブラシ描画機能を追加（スタンプモード）
|
||||
2. Mask Editor One 検出ロジックを実装
|
||||
3. `BrushLibrary.js` 新規作成（ライブラリモーダル UI）
|
||||
4. Draw ツール Options パネルに Brush Library ボタンを接続
|
||||
5. フェーズ2: Mask Editor 連携ボタンを追加
|
||||
|
||||
---
|
||||
|
||||
## 2026-06-29: v0.3.66 — Mask ツール 5サブツール追加（Color / Alpha / Text / Vector / Shape）・Support リンク追加
|
||||
|
||||
**変更ファイル**: `static/js/image-edit/MaskEditorOneTools.js`（新規）, `static/js/image-edit-tab.js`, `templates/index.html`, `static/js/i18n.js`, `static/js/app.js`
|
||||
|
||||
### 概要
|
||||
|
||||
Image Edit タブの Mask ツールに Color / Alpha / Text / Vector / Shape の5つのサブツールを追加。いずれも Mask Editor One に依存せず単独で動作する。また Help の Support ページに comfyui-image-feeder と comfyui-mask-editor-one のリポジトリリンクを追加。
|
||||
|
||||
---
|
||||
|
||||
### MaskEditorOneTools.js（新規）
|
||||
|
||||
5つのマスクサブツールクラスを 1 ファイルにまとめた実装。各クラスは `setCanvas()` / `activate()` / `deactivate()` / `onMouseDown()` / `onMouseMove()` / `onMouseUp()` / `onMouseLeave()` インターフェースを実装し、`image-edit-tab.js` からルーティングされる。
|
||||
|
||||
#### MaskColorTool
|
||||
- クリック位置の色に近いピクセルをマスクとして選択（フラッドセレクト）
|
||||
- マスクレイヤーを除いた全レイヤーを合成した `bgCanvas` をピクセルソースとして使用
|
||||
- `tolerance`（0–255）: RGB ユークリッド距離による色類似度しきい値
|
||||
- `feather`（0–100%）: tolerance 範囲内で距離に応じた不透明度グラデーション
|
||||
- `mode`: `"add"` → white 書き込み、`"subtract"` → destination-out で消去
|
||||
|
||||
#### MaskAlphaTool
|
||||
- アクティブレイヤーのアルファチャンネルをマスクとして抽出
|
||||
- `threshold`（0–255）: Alpha ≥ threshold のピクセルのみ完全マスク化
|
||||
- `invert`: 抽出結果を反転（前景除去用）
|
||||
- Extract Alpha ボタン（`onMouseDown` ではなく手動実行）で適用
|
||||
|
||||
#### MaskTextTool
|
||||
- キャンバスクリック → overlay パネル表示（テキスト入力・フォント/サイズ/スタイル設定）
|
||||
- `_showOverlay(x, y)`: `.ie-mask-text-overlay` 要素をキャンバス座標に配置
|
||||
- `_stamp(x, y)`: `ctx.fillText` で white スタンプ（`mode=erase` 時は `destination-out`）
|
||||
- 複数行対応（textarea 内改行 → 行ごとに `fillText`）
|
||||
- Ctrl+Enter / Stamp ボタンで確定、Escape / Cancel でキャンセル
|
||||
- フォントファミリーは `MASK_TEXT_FONTS` 定数としてエクスポート（14種）
|
||||
|
||||
#### MaskVectorTool
|
||||
- クリックで Catmull-Rom スプライン制御点を追加、プレビューキャンバス（`ie-canvas-overlay`）にリアルタイム描画
|
||||
- 最初の点をクリックまたは Enter キーで閉じてポリゴン塗りつぶし確定
|
||||
- Backspace / Delete で最後の点を取り消し、Esc でリセット
|
||||
- `_buildSpline(ctx, pts, closed)`: Catmull-Rom → Bézier 変換して `bezierCurveTo` で描画
|
||||
- `onBeforeCommit` コールバック: コミット直前に Undo スナップショットを取得
|
||||
- Keyboard イベントは `_setupKeyboard()` で登録・クリーンアップ
|
||||
|
||||
#### MaskShapeTool
|
||||
- ドラッグで矩形または楕円のマスクを描画
|
||||
- `_drawPreview(x2, y2, shift)`: `ie-canvas-overlay` に青の点線プレビュー
|
||||
- Shift 押下で正方形/正円（短辺で揃え）
|
||||
- **ストロークバッファ問題対応**: `_curX / _curY / _curShift` を `onMouseMove` 時に記録し、`onMouseUp(x, y, e)` で `x ?? this._curX` を使用（`_onToolMouseUp` が `refCanvas` 座標を持たないため）
|
||||
- `mode`: `"add"` / `"erase"`、`shape`: `"rect"` / `"ellipse"`
|
||||
|
||||
---
|
||||
|
||||
### image-edit-tab.js 変更
|
||||
|
||||
#### インポート追加
|
||||
```javascript
|
||||
import { MaskColorTool, MaskAlphaTool, MaskTextTool, MaskVectorTool, MaskShapeTool, MASK_TEXT_FONTS }
|
||||
from "./image-edit/MaskEditorOneTools.js";
|
||||
```
|
||||
|
||||
#### コンストラクタ
|
||||
- `this._maskColorTool / _maskAlphaTool / _maskTextTool / _maskVectorTool / _maskShapeTool = null` を追加
|
||||
|
||||
#### _initMaskEditorOneTools()（新規）
|
||||
- Mask ツール初回選択時に一度だけ実行（`if (this._maskColorTool) return;`）
|
||||
- 5ツールを生成し `onChange` / `onBeforeCommit` コールバックを設定
|
||||
- VectorTool / ShapeTool には `setPreviewCanvas(overlayCanvas)` を渡す
|
||||
|
||||
#### _deactivateMaskSubtool() / _activateMaskSubtool()（新規）
|
||||
- 現在のサブツールに応じて `deactivate()` / `activate()` を呼び分け
|
||||
- `_setActiveTool` での `this._maskTool?.deactivate()` をこのメソッドに置換
|
||||
|
||||
#### _switchMaskSubtool(sub)（新規）
|
||||
- deactivate → `this._maskSubtool = sub` → `_renderToolOptions("mask")` → activate の一連フロー
|
||||
|
||||
#### ツールオプションバー
|
||||
- Paint / SAM3 の2ボタンから Paint / Color / Alpha / Text / Vector / Shape / SAM3 の7ボタンへ拡張
|
||||
- 各ボタンのクリックリスナーを `_switchMaskSubtool()` ベースに変更
|
||||
|
||||
#### _renderMaskProps(sub)（新規ブランチ追加）
|
||||
- `color` / `alpha` / `text` / `vector` / `shape` の各サブツール用 UI を生成
|
||||
- Color: Mode セレクト・Tolerance スライダー・Feather スライダー
|
||||
- Alpha: Threshold スライダー・Invert チェック・Extract Alpha ボタン
|
||||
- Text: Font セレクト・Size 入力・Bold/Italic/Align・Mode セレクト
|
||||
- Vector: 点数表示・Mode セレクト・Undo ヒント
|
||||
- Shape: Mode セレクト・Shape セレクト（Rect / Ellipse）
|
||||
|
||||
#### マウスイベントルーティング
|
||||
- `_onToolMouseDown`: `color` → `colorTool.onMouseDown(x, y)` + `_buildBgCanvas()` 渡し、`alpha` → `alphaTool.extract()`、`text` → `textTool.onMouseDown(x, y)`、`vector` → `vectorTool.onMouseDown(x, y)`、`shape` → `shapeTool.onMouseDown(x, y)`
|
||||
- `_onToolMouseMove`: `vector` → `vectorTool.onMouseMove(x, y)`、`shape` → `shapeTool.onMouseMove(x, y, e)`
|
||||
- `_onToolMouseUp`: `shape` → `shapeTool.onMouseUp()`（引数なし・内部の `_curX/_curY` を使用）
|
||||
- `_onToolMouseLeave`: `vector` → `vectorTool.onMouseLeave()`
|
||||
- `_setupKeyboard`: Vector の `onKeyDown` を追加（Escape / Enter / Backspace）
|
||||
|
||||
#### _buildBgCanvas()（新規）
|
||||
- マスクレイヤーを除いた全可視レイヤーを合成して返す OffscreenCanvas
|
||||
- ColorTool の click 時に生成・渡す（クリックごとに再生成して最新状態を反映）
|
||||
|
||||
---
|
||||
|
||||
### ヘルプ更新（3ファイル）
|
||||
|
||||
#### templates/index.html
|
||||
- `wfm-help-imageedit-7d`: 6サブツール列挙の説明に更新
|
||||
- `wfm-help-imageedit-mask-3`: 7サブツール一覧説明に更新
|
||||
- `wfm-help-imageedit-mask-9` 〜 `mask-13`: 新規 `<li>` 5件追加（`mask-8` の直後）
|
||||
- Support ページ: ComfyUI Image Feeder・Mask Editor One の GitHub リンクを Ko-fi の下に追加
|
||||
|
||||
#### static/js/i18n.js
|
||||
- 英語・日本語・中国語の3言語すべてで `helpImageEdit7d`・`helpImageEditMask3` 更新
|
||||
- `helpImageEditMask9` 〜 `helpImageEditMask13` を3言語で追加
|
||||
|
||||
#### static/js/app.js
|
||||
- `DATA_I18N_MAP` に `"wfm-help-imageedit-mask-9"` 〜 `"wfm-help-imageedit-mask-13"` の5エントリを追加
|
||||
|
||||
---
|
||||
|
||||
## 2026-06-29: v0.3.65 — Mask Editor One 連携修正・トップバーアイコン修正・Mask ABRブラシ対応
|
||||
|
||||
**変更ファイル**: `static/js/image-edit-tab.js`, `static/js/image-edit/MaskTool.js`, `web/comfyui/top_menu_extension.js`, `custom_nodes/comfyui-mask-editor-one/server.py`（インストール済み）
|
||||
|
||||
**Mask Editor One 対応バージョン**: v0.1.9+（BiRefNet / SAM3 / ABRブラシライブラリ連携）
|
||||
|
||||
### 概要
|
||||
|
||||
Mask Editor One の仕様変更に伴う連携修正、プロパティパネル開閉によるトップバーアイコン消滅バグの修正、および Mask ツールへの ABR ブラシサポート追加。
|
||||
|
||||
---
|
||||
|
||||
### Mask Editor One 連携修正（BiRefNet / SAM3）
|
||||
|
||||
#### 問題
|
||||
Mask Editor One の `store_image` API エンドポイントがフィールド名を `image_b64` から `bg_image_b64` に変更（仕様変更）したが、WFS 側が追随していなかったため、BiRefNet・SAM3 推論時に「no image available for this node」エラーが発生。
|
||||
|
||||
#### 修正内容
|
||||
- **`image-edit-tab.js`**: SAM3・BiRefNet の `store_image` 呼び出しで `image_b64` → `bg_image_b64` に修正（2箇所）
|
||||
- **`server.py`（インストール済み）**: `store_image` エンドポイントが `bg_image_b64` と旧キー `image_b64` の両方を受け付けるよう後方互換対応を追加
|
||||
|
||||
```python
|
||||
# Before
|
||||
entry["bg_image_b64"] = data.get("bg_image_b64")
|
||||
|
||||
# After
|
||||
img = data.get("bg_image_b64") or data.get("image_b64")
|
||||
entry["bg_image_b64"] = img
|
||||
```
|
||||
|
||||
> **Mask Editor One リポジトリ側**: 開発元 `server.py` にも同修正を適用済み。PR 時に含めること。
|
||||
|
||||
---
|
||||
|
||||
### トップバーアイコン消滅バグ修正（MutationObserver 追加）
|
||||
|
||||
#### 問題
|
||||
サブグラフノード選択時などにプロパティパネルを開くと、Vue がアクションバーを再レンダリングし、WFS・Snapshot・Node Sets のカスタム SVG アイコンが `<i>` タグにリセットされて消滅する（[ComfyUI-Lora-Manager #996](https://github.com/willmiao/ComfyUI-Lora-Manager/issues/996) と同根）。
|
||||
|
||||
#### 修正内容（`top_menu_extension.js`）
|
||||
- `replaceButtonIcons` を `applyIconToButton` + `pollUntilFound` に分割
|
||||
- SVG が既存の場合はスキップ（`btn.querySelector("svg")` チェック）
|
||||
- `MutationObserver` を追加して Vue 再レンダリング後も即座に SVG を再適用
|
||||
- `btn.querySelector("i")` で `<i>` リセットを検知 → `applyIconToButton` 再実行
|
||||
- 監視ノード: `[data-testid="action-bar-buttons"]` → `.actionbar-container` → `document.body`（フォールバック順）
|
||||
- Observer 参照を `window.__wfmIconObserver` に保持
|
||||
|
||||
```javascript
|
||||
// 旧: 一度だけ適用、Vue 再レンダリングで消滅
|
||||
const replaceButtonIcons = () => { ... btn.innerHTML = cfg.getIcon(); };
|
||||
|
||||
// 新: MutationObserver で監視・再適用
|
||||
const applyIconToButton = (btn, cfg) => {
|
||||
if (btn.querySelector("svg")) return; // 既存なら skip
|
||||
btn.innerHTML = cfg.getIcon();
|
||||
...
|
||||
};
|
||||
observer.observe(watchNode, { childList: true, subtree: true });
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### Mask ツール — ABRブラシ対応（Mask Editor One オプション）
|
||||
|
||||
Mask Editor One がインストールされている場合のみ有効。未インストール時は従来の円形ブラシのみで動作（機能維持）。
|
||||
|
||||
#### MaskTool.js 変更
|
||||
|
||||
| 追加プロパティ | 説明 |
|
||||
|---|---|
|
||||
| `brushImage` / `brushName` | ABR 画像ブラシ（null = デフォルト円形） |
|
||||
| `spacing` (0.05–1.0) | スタンプ間隔（ブラシサイズの倍率） |
|
||||
| `angle` (0–359°) | ブラシ固定回転角 |
|
||||
| `sizeJitter` / `sizeJitterAmount` | スタンプごとのサイズランダム変動 |
|
||||
| `rotationJitter` | スタンプごとの角度ランダム変動 (0–360°) |
|
||||
|
||||
- `setImageBrush(img, name)` / `clearImageBrush()` メソッド追加
|
||||
- **ストロークバッファ**: `_initStrokeBuffer` / `_mergeStroke` — PaintTool.js と同パターンで intra-stroke 蓄積を防止（`lighten` ブレンド）
|
||||
- `_getImageStamp()`: アルファチャンネル自動判定（ABR 透過 PNG 対応、グレースケール PNG は輝度から逆算）
|
||||
- `_paintImageBrush()`: `angle` 非ゼロ時に translate + rotate で描画
|
||||
- `_paintToStroke()`: Jitter 有効時は各スタンプに適用後、状態をリストア（PaintTool.js 同様）
|
||||
|
||||
#### image-edit-tab.js 変更
|
||||
|
||||
**初期化**
|
||||
- `_abrAvailable`、`_abrBrushTree` を追加
|
||||
- 起動時に `_checkAbrAvailability()` を非同期実行（`/mask_editor/brushes/list` が空でなければ有効）
|
||||
|
||||
**プロパティパネル（Paint サブツール）**
|
||||
|
||||
```
|
||||
Mode [Add] [Erase]
|
||||
Size ━━━━━━ 30px
|
||||
Hardness ━━━━━━ 85% ← ABRブラシ選択中は disabled
|
||||
─── MASK EDITOR ONE ───
|
||||
Brush Circle [Select] [✕]
|
||||
↓ ブラシ選択後
|
||||
Spacing ━━━━━━ 25%
|
||||
Angle ━━━━━━ 0°
|
||||
Sz Jitter━━━━━━ 50%
|
||||
Rot. Jitter □ On
|
||||
```
|
||||
|
||||
- **Select ボタン**: ABR ブラシライブラリピッカーモーダルを開く
|
||||
- **✕ ボタン**: Circle（デフォルト）に戻す（ブラシ選択中のみ表示）
|
||||
- ABR セクションは Mask Editor One インストール済みの場合のみ表示
|
||||
|
||||
**ABR ブラシライブラリピッカー** (`_openAbrBrushPicker()`)
|
||||
- フォルダツリー（左）＋ブラシサムネイルグリッド（右）のモーダル
|
||||
- サムネイル生成: BrushLibrary.js と同ロジック（アルファ判定・輝度変換・タイトルトリム）
|
||||
- 「Round Brush (default)」ボタンでリセット
|
||||
- ブラシクリック → `setImageBrush()` 適用後モーダル閉じる
|
||||
|
||||
---
|
||||
|
||||
## 2026-06-28: v0.3.64 — Image Edit マスク Add/Subtract・BiRefNet BG Remove・SAM3 セグメンテーション・ブラシカーソルバグ修正
|
||||
|
||||
**変更ファイル**: `static/js/image-edit-tab.js`, `static/js/image-edit/LayerManager.js`
|
||||
|
||||
### 概要
|
||||
|
||||
Image Edit タブのマスク機能を強化。Mask Editor One インストール済み環境向けに BiRefNet 背景削除と SAM3 テキストプロンプトセグメンテーションを追加。また独立機能としてマスクレイヤーの合成モード（Add/Subtract）を実装。
|
||||
|
||||
---
|
||||
|
||||
### マスクレイヤー Add/Subtract 合成モード
|
||||
|
||||
#### LayerManager.js
|
||||
- `Layer` クラスに `operation: "add"` プロパティ追加（`maskApply` 用）
|
||||
- `toJSON()` / `fromJSON()` で保存・復元対応
|
||||
- `LayerManager.toggleOperation(id)` メソッド追加（add ⇔ subtract トグル）
|
||||
|
||||
#### image-edit-tab.js — レイヤーパネル
|
||||
- マスクレイヤー行に **A/S トグルボタン** を追加（緑=Add、赤=Subtract）
|
||||
- クリックで `toggleOperation()` を呼び出し、合成ビューと一覧を再描画
|
||||
- マスクレイヤー選択時、`operation` に合わせて MaskTool の `mode` を自動同期（subtract → erase）
|
||||
|
||||
#### image-edit-tab.js — `_updateCompositeView()` 改修
|
||||
- 連続する `maskApply: true` マスクレイヤーをグループとして検出
|
||||
- グループを back→front 順で合成（Mask Editor One `CanvasCompositor` と同ロジック）
|
||||
- `add` → `globalCompositeOperation = "lighten"`
|
||||
- `subtract` → `globalCompositeOperation = "destination-out"`
|
||||
- 合成マスクでターゲットレイヤーを `destination-in` でクリップ
|
||||
- バグ修正: `maskApply=true` マスクが layers 末尾（ターゲットなし）の場合にオーバーレイ表示のみにフォールバック
|
||||
|
||||
---
|
||||
|
||||
### BG Remove — BiRefNet（Mask Editor One 連携）
|
||||
|
||||
- BG Remove ツール起動時に `/mask_editor/birefnet/status` を確認
|
||||
- Mask Editor One 未インストール時: BiRefNet オプションを `disabled`（"Mask Editor One required" 表示）
|
||||
- インストール済み時: BiRefNet 選択可能
|
||||
- 実行フロー:
|
||||
1. `store_image` でアクティブレイヤー画像を Mask Editor One キャッシュに送信（`node_id: "wfs_bgremove"`）
|
||||
2. `birefnet/remove_bg` で推論
|
||||
3. グレースケールマスク（白=前景）→ RGBA PNG に変換（`_applyMaskToImage()`）
|
||||
4. 既存の BG Remove フロー（New Layer / 上書き）で結果を適用
|
||||
|
||||
---
|
||||
|
||||
### SAM3 セグメンテーション（Mask Editor One 連携）
|
||||
|
||||
- Mask ツールの上部メニューに **[SAM3] ボタン**を追加（Paint の隣）
|
||||
- 起動時に `/mask_editor/sam3/status` を確認して有効/無効を制御
|
||||
|
||||
#### SAM3 モードの上部メニュー
|
||||
| 要素 | 説明 |
|
||||
|------|------|
|
||||
| テキスト入力 | セグメント対象のプロンプト（"cat", "person" 等） |
|
||||
| Max セレクト | 最大マスク取得数（3/6/9/12） |
|
||||
| Segment ボタン | 推論実行 |
|
||||
|
||||
#### プロパティペイン（SAM3）
|
||||
| 要素 | 説明 |
|
||||
|------|------|
|
||||
| Mode: Add/Erase | 適用モード切り替え |
|
||||
| サムネイルグリッド | 候補マスクをクリックで選択/解除（青ボーダー + ✓ マーク） |
|
||||
| Apply Selected (N) | 選択マスクをまとめて適用 |
|
||||
|
||||
#### 実行フロー
|
||||
1. `store_image` でイメージレイヤーを送信（`node_id: "wfs_sam3"`）
|
||||
2. `sam3/segment` で推論 → 複数マスク候補をプロパティペインに表示
|
||||
3. サムネイルをクリックして複数選択（新規 Segment 時に選択リセット）
|
||||
4. Apply Selected でまとめて合成適用
|
||||
- Add → `source-over`（既存マスクに重ね塗り）
|
||||
- Erase → `destination-out`（既存マスクから消去）
|
||||
5. アクティブレイヤーがマスクでない場合は新規マスクレイヤーを自動作成
|
||||
|
||||
---
|
||||
|
||||
## 2026-06-28: v0.3.63 — ノードタブ複数選択・全タブフィルタークリア・検索Xボタン
|
||||
|
||||
**変更ファイル**: `static/js/nodes-tab.js`, `static/js/workflow-tab.js`, `static/js/models-tab.js`, `static/js/gallery-tab.js`, `static/js/util.js`, `static/js/i18n.js`, `static/css/main.css`, `templates/index.html`
|
||||
@@ -194,7 +1068,7 @@ v0.3.60 で実装した G'MIC-Qt 連携の動作修正・セキュリティ強
|
||||
Windows でバックグラウンドプロセス（ComfyUI）からGUIウィンドウを表示するために必須のフラグ。一度削除したが eagle_comic_creater_web の参考実装を確認して再追加した。
|
||||
|
||||
#### 設定パスのプレースホルダー修正
|
||||
`settings-tab.js` の G'MIC-Qt パス入力フィールドのデフォルト値とプレースホルダーからユーザー固有のパス（`statsu-11`）を削除し、汎用的な `C:\path\to\gmic_qt.exe` に変更。`gmic_routes.py` のフォールバック値も同様に空文字に変更。
|
||||
`settings-tab.js` の G'MIC-Qt パス入力フィールドのデフォルト値とプレースホルダーからユーザー固有のパスを削除し、汎用的な `C:\path\to\gmic_qt.exe` に変更。`gmic_routes.py` のフォールバック値も同様に空文字に変更。
|
||||
|
||||
---
|
||||
|
||||
@@ -262,7 +1136,7 @@ G'MIC-Qt 連携用の API ルートを新規作成。
|
||||
| `GET /api/wfm/gmic/status/{job_id}` | ジョブの進行状況（`pending` / `processing` / `completed` / `failed`）を返す |
|
||||
| `POST /api/wfm/gmic/result` | `result_path` を受け取り、処理済み画像を base64 エンコードして返す |
|
||||
|
||||
- G'MIC-Qt の実行パスは Settings に保存された `gmic_qt_path` を参照。未設定の場合はデフォルトパス `C:\Users\statsu-11\gmic-3.6.5-qt-win64\gmic_qt.exe` にフォールバック。
|
||||
- G'MIC-Qt の実行パスは Settings に保存された `gmic_qt_path` を参照。未設定の場合はデフォルトパス `C:\path\to\gmic_qt.exe` にフォールバック。
|
||||
- プロセスは `subprocess.Popen` + `CREATE_NEW_CONSOLE` でノンブロッキングに起動し、スレッド内でポーリングして完了を検出。
|
||||
|
||||
#### `py/wfm.py`
|
||||
|
||||
@@ -3,58 +3,62 @@
|
||||
A comprehensive workflow, asset management, and generation UI plugin for [ComfyUI](https://github.com/comfyanonymous/ComfyUI).
|
||||
|
||||
**📁 Management** — organize all your assets in one studio
|
||||
|
||||
- Workflow, model, image, and prompt management
|
||||
- AI-powered prompt writing assistance, translation, and tag generation
|
||||
- File drop & Gallery-linked metadata viewing — inspect and reuse generation settings instantly
|
||||
|
||||
**⚡ GenerateUI** — a productivity-focused generation tab connected to every other tab
|
||||
|
||||
- Batch generation across models, samplers, prompts, and workflows
|
||||
- Image Feeder for continuous folder-based generation
|
||||
|
||||
**📚 Workflow Studio Library** — a multi-function side panel for smooth ComfyUI integration
|
||||
|
||||
- Drag & drop models, nodes, prompts, and workflows straight onto the canvas
|
||||
- **Send to Canvas**: click "Send to Canvas" (Workflow tab) or "Copy & Send Canvas" (Gallery tab) to send the workflow directly to the ComfyUI canvas — UI and API formats both supported
|
||||
- View metadata from images / JSON, then drop the detected models and prompts onto the canvas
|
||||
- Built-in AI tools (translation and more)
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## Screenshots
|
||||
|
||||
| Workflow Tab | Models Tab |
|
||||
|:---:|:---:|
|
||||
| Workflow Tab | Models Tab |
|
||||
| :-------------------------------------: | :---------------------------------: |
|
||||
|  |  |
|
||||
|
||||
| Prompt Input Assistance | Gen UI Feeder |
|
||||
|:---:|:---:|
|
||||
| Prompt Input Assistance | Gen UI Feeder |
|
||||
| :----------------------------------------------------------: | :---------------------------------------: |
|
||||
|  |  |
|
||||
|
||||
| GenUI LoRA Stack | GenUI Batch |
|
||||
|:---:|:---:|
|
||||
| GenUI LoRA Stack | GenUI Batch |
|
||||
| :---------------------------------------------: | :-------------------------------------: |
|
||||
|  |  |
|
||||
|
||||
| Models Multi-select Menu | Top Bar |
|
||||
|:---:|:---:|
|
||||
| Models Multi-select Menu | Top Bar |
|
||||
| :-----------------------------------------------------------: | :---------------------------: |
|
||||
|  |  |
|
||||
|
||||
| WS Library | Library Information |
|
||||
|:---:|:---:|
|
||||
| WS Library | Library Information |
|
||||
| :----------------------------------: | :---------------------------------------------------: |
|
||||
|  |  |
|
||||
|
||||
| Tagger Tab | Image Edit Tab |
|
||||
|:---:|:---:|
|
||||
| Tagger Tab | Image Edit Tab |
|
||||
| :-------------------------------: | :--------------------------------------: |
|
||||
|  |  |
|
||||
|
||||
| Customize | |
|
||||
|:---:|:---:|
|
||||
|  | |
|
||||
| Customize | |
|
||||
| :--------------------------------: | :-: |
|
||||
|  | |
|
||||
|
||||
---
|
||||
|
||||
## Features
|
||||
|
||||
### Workflow Tab
|
||||
|
||||
- **Thumbnail / Table views** — switch between view modes to browse your workflow library
|
||||
- **Thumbnail side panel** — preview workflow canvas snapshots in the side panel
|
||||
- **Badge filtering** — filter by user-defined badges (free labels you assign to each workflow)
|
||||
@@ -68,18 +72,24 @@ A comprehensive workflow, asset management, and generation UI plugin for [ComfyU
|
||||
- **Clear all filters (✕ Clear)** — rightmost toolbar button; resets search text, group filter, and badge filter (ALL) in one click
|
||||
|
||||
### Canvas Snapshot (v0.1.2)
|
||||
|
||||
- **One-click capture** — click the camera button in ComfyUI's top bar to snapshot the current workflow canvas
|
||||
- **Auto-save as thumbnail** — the snapshot is saved directly to the workflow data folder as a PNG thumbnail
|
||||
- **Embedded workflow metadata** — workflow JSON is embedded in the PNG (tEXt chunk), compatible with ComfyUI's drag-and-drop import
|
||||
- **Auto-import** — the captured workflow is automatically imported and appears in the Workflow tab
|
||||
|
||||
### GenerateUI Tab (v0.3.5)
|
||||
|
||||
- **5-tab layout** — Input / Model / Settings / Feeder / Batch tabs; Input, Model, and Settings each include a Raw JSON column on the right for instant preview and direct editing
|
||||
- **Save button** — located at the right end of the subtab row; opens a filename dialog (default: current workflow name) and saves the current workflow as a `.json` file to the Workflow tab via the import API
|
||||
- **Input tab** — Prompt and Image inner tabs (drag-and-drop upload); Prompt tab shows Positive Prompt and Negative Prompt textareas, plus an **Embeddings selector** at the bottom (Filter + Select + Weight input + Paste button); Paste inserts `(embedding:Name:weight)` at the cursor position of the last focused textarea (defaults to Positive when neither is focused); Raw JSON (540px) in the right column
|
||||
- **Revert button** (v0.3.70) — a ↺ button next to each Apply button reverts the textarea to the node's currently applied value (the reverse of Apply)
|
||||
- **Emphasis weight editing** (v0.3.70) — select text (or just place the cursor on a word/parenthesis block) and press Ctrl+↑/↓ to adjust `(text:weight)` by ±0.05, A1111/native-ComfyUI style; parentheses are removed automatically when the weight returns to 1.0
|
||||
- **Mask slot for inpainting** (v0.3.71) — LoadImage slots whose MASK output feeds an inpaint node (e.g. `VAEEncodeForInpaint`) show an additional Mask drop zone; when a mask is set, image + mask are composited into a single RGBA upload (mask baked into the alpha channel) matching ComfyUI's native alpha→MASK extraction — no extra nodes required
|
||||
- **Model tab** — Checkpoint, VAE, LoRA, ControlNet, Diffusion Model (UNETLoader / UnetLoaderGGUF / LoaderGGUF), Text Encoder (CLIPLoader / DualCLIPLoader / ClipLoaderGGUF / DualClipLoaderGGUF — single clip: type + device; dual clip: two clip selectors + type + device), **Hypernetwork** (with Strength field) selectors with filter; Raw JSON on the right
|
||||
- **Settings tab** — KSampler and Latent Image side by side at 50% width each; Raw JSON on the right
|
||||
- **Always-visible Raw JSON** — edit the API-format JSON directly from any tab with syntax highlighting; Apply button reloads the workflow; built-in **search bar** (always shown) finds all matches as you type with count display (`3/12`); navigate with ↑/↓ buttons or Enter / Shift+Enter; Escape or ✕ clears; current match highlighted in orange, other matches in yellow
|
||||
- **Bypass/Mute node handling** (v0.3.75) — loading a UI-format workflow with Bypass-mode nodes now reroutes their wires to the upstream source (matching same-type input/output slots, recursively through chained bypasses) instead of leaving a dangling reference that failed validation; Mute-mode nodes are excluded without rerouting, same as ComfyUI itself; when either is present, a note listing the affected nodes appears above the Raw JSON search bar in the Input/Model/Settings tabs
|
||||
- **One-click generation** — queue prompts to ComfyUI without leaving the studio
|
||||
- **Seed control** — randomize, lock, or manually set seeds; seed input and mode selector stacked vertically for readability
|
||||
- **Style selector** — checkbox and dropdown next to the Reset Workflow button; enable to apply a Fooocus-style JSON to positive and negative prompts at generation time; style files (`*.json`) are loaded from `user/default/Workflow-Studio/style/`; the style's `{prompt}` placeholder is replaced with the original prompt text, or the style is appended if no placeholder exists; `negative_prompt` is appended to the existing negative prompt; styles are applied to a per-generation copy and do not modify the loaded workflow
|
||||
@@ -88,13 +98,16 @@ A comprehensive workflow, asset management, and generation UI plugin for [ComfyU
|
||||
- **Left pane** — 4 tabs: **Checkpoints** (file-tree; Filter / All / None), **Sampler** (KSampler sampler list), **Scheduler** (KSampler scheduler list), **Style** (flat list of all styles from `Workflow-Studio/style/`; All / None buttons)
|
||||
- **Center pane** — group-based selection with inner tabs (Checkpoint | Lora | Prompt | Workflow); Checkpoint/Lora groups come from the Models tab, Prompt groups from the Prompt tab, Workflow groups from the Workflow tab — check a group to add all its members, expand ▶ to select individually
|
||||
- **Right pane (Batch Queue)** — 7 columns: Checkpoint / Lora / Prompt / Workflow / Sampler / Scheduler / **Style**; each column header has an enable checkbox (radio behavior: only one at a time); count shown per column; Style batch applies each selected style sequentially to a workflow copy
|
||||
- **Lora batch prompt sync** (v0.3.69) — for each selected LoRA, its syntax (`<lora:name:strength_model:strength_clip>`) and CivitAI trained words are automatically appended to the Positive prompt (rebuilt from the original prompt each time, not accumulated), then restored to the pre-batch state when the batch completes or is stopped; if a selected LoRA is not yet recognized by ComfyUI's model list, a warning toast suggests a Refresh or restart
|
||||
- **UI-to-API conversion** — automatic conversion supporting subgraphs (nested workflows), COMBO types, and display-only node exclusion; improved analysis covers SDXL multi-hop CONDITIONING chains, CLIPTextEncodeSDXL, SDXLPromptStyler, KSamplerAdvanced, and more
|
||||
- **Eagle integration** — auto-save generated images to [Eagle](https://eagle.cool/) with metadata
|
||||
|
||||
### Feeder subtab (v0.3.5 / v0.3.42)
|
||||
|
||||
Two independent modes selectable via **[Image Loop] / [Gallery]** toggle buttons at the top of the left pane (persisted in `localStorage`).
|
||||
|
||||
**Image Loop mode** — requires the **[comfyui-image-feeder](https://github.com/ketle-man/comfyui-image-feeder)** custom node.
|
||||
|
||||
- **ImageFeeder node control** — select the target node from a dropdown auto-populated from the loaded workflow; edit all node parameters (Directory, Sort Mode, Index, Start/End Index, Batch Size, Seed, Use Selection) and Apply to the workflow
|
||||
- **Image library** — 3-pane layout: folder tree (left) browsing `user/default/image-loop-data/`, image grid with checkbox selection (center), preview panel with resolution and file size (right)
|
||||
- **Selection management** — check individual images; All / None buttons for the current folder; selected files are reflected in `selected_files` on Apply
|
||||
@@ -107,6 +120,7 @@ Two independent modes selectable via **[Image Loop] / [Gallery]** toggle buttons
|
||||
- **Seed** — Run loop uses the right-pane seed setting (Random / Fixed / Increment / Decrement); the node's own Seed field only affects random sort order
|
||||
|
||||
**Gallery mode** (v0.3.42) — no external plugin required; uses the built-in **WFS_GalleryFeeder** custom node.
|
||||
|
||||
- **WFS_GalleryFeeder node** — reads images directly from a Gallery group and outputs them one at a time; inputs: `group_name`, `index`, `sort_mode` (filename_asc / filename_desc / random), `seed`
|
||||
- **Node & group selector** — pick the WFS_GalleryFeeder node from the loaded workflow and choose which Gallery group to feed images from; `__Feeder__` group is auto-created on first open
|
||||
- **Image grid** — center pane shows all images in the selected group; click any image to update the Index to that position
|
||||
@@ -114,6 +128,7 @@ Two independent modes selectable via **[Image Loop] / [Gallery]** toggle buttons
|
||||
- **Run / Stop controls** — left pane Run / Stop buttons manage the generation loop; After Gen combo (loop / increment / fixed), ▶ Run, and ■ Stop widgets are also available directly on the WFS_GalleryFeeder node in the ComfyUI canvas (`gallery_feeder_extension.js`)
|
||||
|
||||
### Prompt Tab
|
||||
|
||||
- **3-column layout** — AI Assistant (left), Presets/Preset Manager tab-panel (center), Wildcard support (right)
|
||||
- **AI chat assistant** — powered by [Ollama](https://ollama.com/), generate and refine prompts interactively
|
||||
- **Image attachment** — attach reference images for vision-capable models
|
||||
@@ -127,6 +142,7 @@ Two independent modes selectable via **[Image Loop] / [Gallery]** toggle buttons
|
||||
- **Wildcard file manager** — create, view, and edit `.txt` / `.yaml` wildcard files stored in `user/default/Workflow-Studio/wildcard/`; click a filename in the file picker to insert `__filename__` at cursor
|
||||
|
||||
### Metadata Tab (v0.3.8)
|
||||
|
||||
- **3-column layout** — Drop zone (left) | Model info (center) | LoRA + Prompt (right)
|
||||
- **File drop** — drop a ComfyUI-generated PNG / WebP or workflow JSON onto the drop zone (or click to open a file picker); PNG/WebP images are shown as a preview
|
||||
- **Model extraction** — automatically extracts Checkpoint, VAE, Diffusion Model, and Text Encoder names from the workflow; supports both standard and subgraph-based workflows (Flux.2 Dev/Klein, Qwen-Image-Edit/2511/Layered, Z-Image Base/Turbo, Ernie Image, WAN2.2); node types covered: UNETLoader, UnetLoaderGGUF, UNETLoaderGGUF (e.g. HiDream GGUF), CLIPLoader, DualCLIPLoader, TripleCLIPLoader, QuadrupleCLIPLoader (e.g. HiDream 4-CLIP)
|
||||
@@ -137,6 +153,7 @@ Two independent modes selectable via **[Image Loop] / [Gallery]** toggle buttons
|
||||
- **Format note** — supported formats and covered model types are always shown in the left column
|
||||
|
||||
### Settings Tab
|
||||
|
||||
- **2-column layout** — left column for all settings; right column shows the Theme panel fixed in place (sticky)
|
||||
- **Collapsible sections** — all settings organized in accordion panels for a clean layout
|
||||
- **Theme selection** — 13 built-in themes with visual swatch preview (Dark, Pop, Minimalist, Cyberpunk, Glassmorphism, Neumorphism, Retro Pixel, Pastel, Brutalism, Earthy, Material, Monotone, Corporate)
|
||||
@@ -148,6 +165,7 @@ Two independent modes selectable via **[Image Loop] / [Gallery]** toggle buttons
|
||||
- **CivitAI Host** — choose which site opens when clicking a model link: `civitai.com` (SFW only) or `civitai.red` (unrestricted); saved to `settings.json` and synced to `localStorage` for the Models tab to use without extra fetches
|
||||
- **CivitAI API Key** — optional Bearer token for authenticated CivitAI access; stored in `settings.json` (excluded from data exports); environment variable `CIVITAI_API_KEY` takes priority if set
|
||||
- **Default workflow** — set a workflow to auto-load on startup
|
||||
- **Default Checkpoint** (v0.3.73) — optional checkbox to force every checkpoint loader node's model to a chosen default whenever a workflow is loaded into GenerateUI; a safeguard against generation errors or garbled images from a stale/mismatched checkpoint saved in the workflow file
|
||||
- **Data Management** — export all plugin data (settings, metadata, prompts, etc.) to a single JSON file; import to restore data (useful when migrating or reinstalling); API keys are excluded from exports for security
|
||||
- **Text Size** — one slider (10–28 px) adjusts font size for all prompt and chat textareas at once: Generate UI positive/negative prompts, AI Assistant chat input, Preset prompts, Wildcard prompt and file editor, and Metadata prompt full preview; takes effect immediately and saved with Save Settings
|
||||
- **RAW JSON Colors** — customize the 6 syntax highlight colors for the Raw JSON editor in Generate UI: Default Text (base), Name/Scheduler (yellow), Title (pink), Width/Height (green), Prompt/Text (cyan), Image/File (red); changes apply immediately on color pick; Reset Defaults restores the original scheme; saved to `localStorage` under `wfm_settings.jsonColors` and applied on startup
|
||||
@@ -156,6 +174,7 @@ Two independent modes selectable via **[Image Loop] / [Gallery]** toggle buttons
|
||||
- **Language** — English / Japanese / Chinese
|
||||
|
||||
### Gallery Tab (v0.3.44)
|
||||
|
||||
- **Image browser** — browse ComfyUI output images (Thumbnail / Table views) with server-side scanning optimized for 6,000+ image libraries
|
||||
- **Thumbnail / Table views** — switch view modes; Favorites column shown leftmost in Table view
|
||||
- **Folder management** — create subfolders ("+ New") or delete the selected folder with all contents ("Del") from the folder tree header
|
||||
@@ -173,13 +192,16 @@ Two independent modes selectable via **[Image Loop] / [Gallery]** toggle buttons
|
||||
- **Load GenUI button** — loads the embedded ComfyUI workflow from the selected image directly into the GenerateUI tab; shows a warning toast if no workflow is embedded or the format is unsupported; Metadata button is styled green, Load GenUI button uses the primary accent color
|
||||
- **Image Edit button** — toolbar button; sends the selected image directly to the Image Edit tab as the base layer
|
||||
- **Send GenUI Image button** — toolbar button (next to Image Edit); uploads the selected image to ComfyUI and sets it as the input for the first LoadImage node in the GenerateUI tab; automatically switches to GenerateUI → Input → Image; requires a workflow with at least one LoadImage node to be loaded
|
||||
- **Send CC button** (v0.3.69) — toolbar button, shown only when this Gallery tab is embedded as an iframe inside ComfyUI Comic Creator (a separate custom node); sends the selected image directly into Comic Creator's currently selected panel/overlay
|
||||
- **Search clear (✕)** — inline ✕ button appears inside the search box whenever text is entered; click to clear immediately
|
||||
- **Clear all filters (✕ Clear)** — rightmost toolbar button; resets search text, tag filter, group filter, and favorites filter in one click (sort order is preserved)
|
||||
- **Workflow auto-save** — images generated from the Generate UI tab have their workflow automatically saved to gallery metadata
|
||||
- **Output folder configurable** — set the scanned output folder from Settings tab
|
||||
- **SVG file support** (v0.3.77) — `.svg` files are browsable, previewable (detail panel and lightbox), and included in favorites/tags/groups/move/delete/export alongside raster formats; served as-is with no rasterized thumbnail, since `<img>` scales vector graphics natively at any size
|
||||
- **Performance** — server-side 256px JPEG thumbnail generation with disk cache (`data/thumb_cache/`); infinite-scroll paging (50 images per page, IntersectionObserver); folder-level mtime cache (60s TTL); bulk operations use single-request API endpoints
|
||||
|
||||
### Nodes Tab (v0.1.7)
|
||||
|
||||
- **Node Browser** — browse all installed ComfyUI nodes from `/object_info` API with Card/Table views
|
||||
- **Search & Filter** — full-text search, filter by category, package, tags, groups, and favorites
|
||||
- **Package badges** — color-coded badges generated from package names
|
||||
@@ -191,6 +213,7 @@ Two independent modes selectable via **[Image Loop] / [Gallery]** toggle buttons
|
||||
- **Clear all filters (✕ Clear)** — rightmost toolbar button; resets search text, category, package, tag, group, and favorites filter in one click
|
||||
|
||||
### Models Tab (v0.2.3)
|
||||
|
||||
- **Model Browser** — browse all installed ComfyUI models (Checkpoint, LoRA, VAE, ControlNet, UNET, TextEncoder, Hypernetwork, Embedding) with sub-tab switching
|
||||
- **Thumbnail / Table views** — switch between view modes with pagination (24 items per page); Table view includes **Type** and **Base Model** columns sourced from cached CivitAI data, displayed between the Subdirectory and Extension columns; Enable/Disable column labeled **E/D**
|
||||
- **Table column sort** — click any column header to sort ascending (▲), click again for descending (▼), click a third time to clear; active column highlighted in accent color
|
||||
@@ -215,6 +238,7 @@ Two independent modes selectable via **[Image Loop] / [Gallery]** toggle buttons
|
||||
- **Clear all filters (✕ Clear)** — rightmost toolbar button; resets search text, tag filter, folder filter, group filter, favorites filter, and status filter in one click
|
||||
|
||||
### Tagger Tab (v0.3.38)
|
||||
|
||||
- **3 sub-tabs** — Single / Batch / DB for single-image tagging, folder batch processing, and tag database management
|
||||
- **Model support** — WD Tagger (ONNX, NCHW/NHWC auto-detect), SwinV2 (ONNX), DeepDanbooru (.h5, requires TensorFlow); place each model in its own subfolder under `ComfyUI/models/tagger/<model-name>/` containing the `.onnx` + `selected_tags.csv` (or `.h5` + label file)
|
||||
- **Threshold sliders** — General threshold (default 0.35) and Character threshold for `character:` prefix tags (default 0.85); sliders update the display value in real time
|
||||
@@ -225,19 +249,21 @@ Two independent modes selectable via **[Image Loop] / [Gallery]** toggle buttons
|
||||
- **DB tab** — searchable SQLite database of all tagged images; click a row to open the edit panel and modify WD Tags / VLM Tags; Save updates the record, Delete removes it; Export CSV downloads all records
|
||||
- **Dependencies** — install into ComfyUI's embedded Python: `python_embedded\python.exe -m pip install -r requirements.txt`; for GPU inference use `onnxruntime-gpu`; TensorFlow (DeepDanbooru) is optional and commented out in `requirements.txt`
|
||||
|
||||
### Image Edit Tab (v0.3.61)
|
||||
### Image Edit Tab (v0.3.65)
|
||||
|
||||
- **Layer-based image editor** — compose images with multiple layers (Image, Text, Draw, Mask types) and export the composite as PNG
|
||||
- **Loading images** — drag & drop onto the canvas, Upload button, or send from the Gallery tab via the **Image Edit** toolbar button; first image becomes Layer 1 (auto-locked), subsequent images are added as new layers scaled to fit the canvas
|
||||
- **New button** — create a blank canvas with custom dimensions (WxH prompt); clears all existing layers
|
||||
- **Tools** — Select (V), Draw (B), Text (T), Shape (S), Mask (🎭), Blur (≈), BG Remove (⬚), Filter (★); tool options bar updates per active tool
|
||||
- **New button** — create a blank canvas with custom dimensions (WxH prompt); clears all existing layers and automatically adds an empty Layer 1 (v0.3.70)
|
||||
- **Tools** — Select (V), Draw (B), Text (T), Shape (S), Mask (🎭), Blur (≈), BG Remove (⬚), Filter (★), Inpaint (🩹); tool options bar updates per active tool
|
||||
- **Select** — click to select; drag to move; drag corner handles to resize; drag circle handle to rotate; Flip H / Flip V / Rotate angle in the options bar; double-click a text layer to re-edit its content
|
||||
- **Draw** — freehand brush; options: color, brush size, blend mode; paints directly onto the active draw layer while all other layers remain visible; brush cursor shown as a size-accurate circle; strokes can start from outside the canvas margin and continue past the edge
|
||||
- **Text** — click to place; configure font, size, bold/italic, align, and color; placed as an exact-size text layer sized to the measured bounding box; double-click to re-edit
|
||||
- **Shape** — drag to draw geometric shapes (Rect / Ellipse / Line / FreeLine); options: shape type, Rounded toggle (Rect/Ellipse), Fill color, Stroke color + width, Opacity; each committed shape becomes an independent draw layer; Stroke None hidden for Line/FreeLine (stroke always active)
|
||||
- **Mask** — paint a white mask onto a dedicated mask layer; click **M** in the Layers header to add a mask layer (Mask tool activates automatically); clicking a mask layer in the list also switches to the Mask tool; **Tool Options bar**: Paint sub-tool button, Invert checkbox, Overlay color picker (default red), Blur slider (0–50 px); **Properties pane** (left of the Layers panel): Size (1–200 px), Hardness (0–100%), Mode — **Add** (draw white = mask present) / **Erase** (erase to transparent = mask absent); **✂ button** on the layer row enables/disables the mask as a clipping mask — when enabled (blue), the layer directly below is clipped to the painted area and the result is applied when exporting; brush cursor shown as a size-accurate circle; strokes can start from outside the canvas margin and continue past the edge
|
||||
- **Mask** — 7 sub-tools for painting masks onto a dedicated mask layer; click **M** in the Layers header to add a mask layer (Mask tool activates automatically); clicking a mask layer in the list also switches to the Mask tool; **Tool Options bar**: sub-tool buttons (Paint / Color / Alpha / Text / Vector / Shape / SAM3), Invert checkbox, Overlay color picker (default red), Blur slider (0–50 px); the overlay is only shown for the currently active mask layer, other mask layers stay hidden until selected (v0.3.70); SAM3 requires Mask Editor One (disabled when not installed); Color / Alpha / Text / Vector / Shape work without Mask Editor One; **Properties pane — Paint**: Mode (Add / Erase), Size (1–200 px), Hardness (0–100%); **MASK EDITOR ONE section** (Paint sub-tool, visible when installed): Select opens the ABR stamp-brush library; ✕ clears back to Circle; when an image brush is active, Hardness is disabled and Spacing (5–100%), Angle (0–359°), Sz Jitter (0–100%), Rot. Jitter (on/off) appear; **Properties pane — Color**: click canvas to flood-select pixels by color similarity; Mode (Add / Subtract), Tolerance (0–255), Feather % (0–100); **Properties pane — Alpha**: extract the active layer's transparency as a mask; Threshold, Invert checkbox, Extract Alpha button; **Properties pane — Text**: click canvas to open a stamp overlay — enter text, set Font / Size / Bold / Italic / Align / Mode (Add / Erase), Stamp or Ctrl+Enter to apply; multi-line supported; **Properties pane — Vector**: click to add Catmull-Rom spline points; Enter (or click first point) closes and fills the polygon; Backspace removes the last point; Esc resets; Mode (Add / Erase); **Properties pane — Shape**: drag to draw Rect or Ellipse; hold Shift for square/circle; blue dashed outline preview while dragging; Mode (Add / Erase); **Properties pane — SAM3**: enter a text prompt, set Max candidates (3/6/9/12), click Segment; select candidate thumbnails (multi-select), Apply Selected (N) applies with current Mode; **Mask layer A/S operation**: A/S toggle — Add (green) composites normally, Subtract (red) cuts the mask from below; **✂ clipping mask button** clips the layer below to the painted area; brush cursor shown as size-accurate circle; strokes can start from outside the canvas margin and continue past the edge
|
||||
- **Blur** — **Whole Blur**: Gaussian blur to the entire active layer with intensity slider (1–50 px); **Whole Mosaic**: pixelation mosaic with block-size slider (5–100 px); **Rect Blur / Rect Mosaic**: enable the toggle then drag a rectangle on the canvas to apply blur or mosaic to that region only (blue preview for blur, orange for mosaic); Rect Blur and Rect Mosaic are mutually exclusive; all operations support Undo
|
||||
- **BG Remove** — remove the background from the active layer; **Lightweight (@imgly)**: runs entirely in the browser via CDN (no server required; ~40 MB model downloaded on first use); **BiRefNet**: high-quality removal via the Python backend (coming soon); **New Layer** option (default on) adds the result as a new layer above the original; when off, replaces the active layer in-place
|
||||
- **BG Remove** — remove the background from the active layer; **Lightweight (@imgly)**: runs entirely in the browser via CDN (no server required; ~40 MB model downloaded on first use); **BiRefNet**: high-quality removal via Mask Editor One's Python backend (requires Mask Editor One installed and `birefnet.safetensors` in `ComfyUI/models/background_removal/`); **New Layer** option (default on) adds the result as a new layer above the original; when off, replaces the active layer in-place
|
||||
- **Filter (G'MIC)** — apply G'MIC-Qt filter effects to the active image layer; click **Edit with G'MIC** to launch G'MIC-Qt GUI; select a filter and click OK — a "G'MIC-Qt filter output" window appears; close it to save the result back as the active layer; requires G'MIC-Qt Standalone installed and path configured in Settings → G'MIC-Qt Executable Path
|
||||
- **Inpaint** (v0.3.71) — composites the visible layers plus a Mask layer into one RGBA image (mask baked into the alpha channel) and applies it to the first inpaint-capable LoadImage node in the workflow currently loaded in GenerateUI (a node whose MASK output feeds something like `VAEEncodeForInpaint`); also supports workflows built around the **Mask Editor One** custom node (`comfyui-mask-editor-one`) instead of LoadImage — image/mask are pushed via its node_id-keyed server cache and `layer_data` widget; **Properties pane**: Positive/Negative prompts, Grow Mask By (applied to the VAE Encode (for Inpainting) node), Denoise (applied to KSampler), Run button; **Use dedicated workflow** checkbox — when off, generates against the workflow currently loaded in GenerateUI; when on, pick a saved workflow from the dropdown to load, edit, and generate entirely in the background without disturbing what's shown in GenerateUI; the result image is shown back in the Properties pane when generation completes; requires a Mask layer painted first (Mask tool)
|
||||
- **Layer panel** — layer list with visibility (👁/🚫), lock (🔒/🔓), and clipping-mask (✂) toggles; opacity slider; type icons (🖼 image / T text / ✏ draw / ⬚ mask); Layer 1 is automatically locked on first image load
|
||||
- **Layer lock** — locked layers show an orange bounding box and 🔒 icon on the canvas; move/resize/rotate are disabled while locked; click the 🔓 button in the layer row to unlock
|
||||
- **Text quality** — text layers are rendered at their measured bounding-box size; resizing with the Select tool regenerates the canvas at the new display resolution so text stays sharp
|
||||
@@ -246,17 +272,26 @@ Two independent modes selectable via **[Image Loop] / [Gallery]** toggle buttons
|
||||
- **Undo / Redo** — Ctrl+Z / Ctrl+Y (or toolbar buttons); keyboard shortcuts: V (Select), B (Draw), T (Text), S (Shape), Delete (remove selected layer when 2+ exist)
|
||||
|
||||
### AI TOOL Tab (v0.3.14)
|
||||
|
||||
- **4-pane layout** — Translation | Chat | TOOLS | Settings; all panes always visible simultaneously; no sub-tab switching required
|
||||
- **Translation pane** — translate text between Japanese, English, Chinese, or a custom Free language using Ollama or LM Studio; language selectors with ⇄ swap button (swaps both language selectors and text content); selections saved automatically
|
||||
- **Chat pane** (v0.3.40) — multi-turn conversation with the LLM; full conversation history sent each turn for context; Enter to send, Shift+Enter for a newline; Clear button resets history; Ollama uses `/api/chat`, LM Studio uses `/v1/chat/completions`
|
||||
- **Translation pane** — translate text between Japanese, English, Chinese, or a custom Free language using Ollama, LM Studio, or Lemonade; language selectors with ⇄ swap button (swaps both language selectors and text content); selections saved automatically
|
||||
- **Chat pane** (v0.3.40) — multi-turn conversation with the LLM; full conversation history sent each turn for context; Enter to send, Shift+Enter for a newline; Clear button resets history; Ollama uses `/api/chat`, LM Studio and Lemonade use `/v1/chat/completions`
|
||||
- **Chat pane — image generation via Tool Calling** (v0.3.73) — if the selected model supports tool calling and the user asks for an image, a `generate_image` tool is invoked and the request runs through the same generation pipeline as the GenerateUI Generate button, with the result shown inline in the chat; an "Allow image generation" checkbox in the input row toggles this on/off (default on); the workflow used is the one currently loaded in GenerateUI, or a dedicated saved workflow configured in the Settings pane; models verified to work well for tool calling and vision: **Gemma 4:e4b**, **Qwen 3.5:9b**, **Ministral 3:3b** (Ollama)
|
||||
- **TOOLS pane (VLM)** — drop an image into the 110px drop zone, select a task (Describe Image / Create Prompt / Create Tags), and click Run to analyze with a vision model; result shown in the output area with a Copy button
|
||||
- **TOOLS pane — shared Chat attachment** (v0.3.74) — an image dropped in the TOOLS drop zone is also usable as the Chat pane's attachment: it's sent to the LLM as vision input, and used as the base image when `generate_image` runs image-to-image; a ✕ button clears it (from either the TOOLS preview or the Chat attachment indicator); it stays attached across turns until explicitly cleared
|
||||
- **TOOLS pane (Wildcards)** (v0.3.40) — select "Create wildcards" from the task dropdown; enter a category name and count; click Run to generate plain-text wildcard entries one per line (no markdown, no numbering); result can be copied directly into wildcard `.txt` files
|
||||
- **Settings pane** — choose backend (Ollama / LM Studio), set the API URL, test connection, select a model (with refresh button), and configure Free language names for translation source and destination
|
||||
- **Chat pane — image-to-image (I2I)** (v0.3.74) — when an image is attached and `generate_image` is invoked, the attachment is uploaded and swapped into the target workflow's LoadImage node instead of running text-to-image; the target workflow is the one currently loaded in GenerateUI, or a dedicated I2I workflow configured in the Settings pane
|
||||
- **Chat pane — SVG generation, no ComfyUI workflow involved** (v0.3.77) — the LLM can also produce SVG graphics directly as text; if a reply contains SVG code (wrapped in a markdown code fence or written directly as a bare `<svg>...</svg>`), it's rendered inline as a preview and a "Save to Gallery" button writes it as a `.svg` file to the Gallery tab's output folder; unlike the Tool Calling image generation flow above, this is plain text pattern matching, so it works with any model regardless of tool-calling support
|
||||
- **Settings pane** — choose backend (Ollama / LM Studio / Lemonade), set the API URL, test connection, select a model (with refresh button), and configure Free language names for translation source and destination
|
||||
- **Settings pane — Chat Image Generation** (v0.3.73) — "Use dedicated workflow" checkbox lets Chat-triggered image generation use a saved workflow of your choice instead of the one currently loaded in GenerateUI, without disturbing what's shown there (same pattern as Image Edit's Inpaint dedicated workflow)
|
||||
- **Settings pane — Chat I2I Generation** (v0.3.74) — same "Use dedicated workflow" pattern as above, but for image-to-image generation when an image is attached; independent of the text-to-image dedicated workflow setting
|
||||
- **Settings shared** — settings saved to `localStorage` under `wfm_ai_settings`; shared with the Library panel's AI TOOL tab so configuration is consistent across both interfaces
|
||||
- **Backend support** — Ollama (`/api/generate` for text, `/api/chat` for conversations, `/api/tags` for model list); LM Studio OpenAI-compatible API (`/v1/chat/completions`, `/v1/models`); VLM images sent as base64 (`images:[]` for Ollama, `image_url` content block for LM Studio)
|
||||
- **Backend support** — Ollama (`/api/generate` for text, `/api/chat` for conversations, `/api/tags` for model list); LM Studio and Lemonade via the OpenAI-compatible API (`/v1/chat/completions`, `/v1/models`); VLM images sent as base64 (`images:[]` for Ollama, `image_url` content block for LM Studio/Lemonade)
|
||||
- **URL security** — backend URL validated via `new URL()` to enforce `http://` or `https://` scheme
|
||||
- **Lemonade's other endpoints (not integrated)** — Lemonade Server also exposes OpenAI-compatible image generation (`/v1/images/generations`), text-to-speech (`/v1/audio/speech`), and transcription (`/v1/audio/transcriptions`) endpoints; these are not wired up — image generation would duplicate the existing ComfyUI-workflow-based `generate_image` tool call, and audio/TTS has no corresponding UI yet, so both are future considerations rather than a natural extension of the current backend switch
|
||||
|
||||
### Workflow Studio Library (ComfyUI Side Panel) (v0.3.9)
|
||||
|
||||
- **Tab layout (W / N / P / M / I / A)** — compact single-letter tabs with full name shown on hover
|
||||
- **W — Workflows tab** — browse favorite workflows (All / ★ Favorites / Groups / By Badge sub-tabs), ★ star shown for favorites in All view
|
||||
- **N — Nodes tab** — browse favorite nodes (All / ★ Favorites / Groups / Sets / 📂 Category / 🧩 Package sub-tabs), ★ star shown for favorites in All view
|
||||
@@ -265,7 +300,7 @@ Two independent modes selectable via **[Image Loop] / [Gallery]** toggle buttons
|
||||
- **M — Models tab** — browse installed models (All / ★ Favorites / Groups / By Type sub-tabs); LoRA groups show an **All N LoRAs** item — drag to canvas to place a `Lora Loader (LoraManager)` node with all LoRAs pre-loaded
|
||||
- **P — Prompts tab** — browse prompt presets with All / ★ Favorites / Categories sub-tabs; **Groups sub-tab** (row 2) — view presets by group (shared with the Batch tab's `wfm_prompt_preset_groups`)
|
||||
- **I — Information tab** — drop a ComfyUI-generated PNG/WebP or workflow JSON in the side panel to view its metadata; detects LoRAs from `LoraLoader`, `LoraLoaderModelOnly`, and `Lora Loader (LoraManager)` nodes (API format supported); supports `UnetLoaderGGUF` and `QuadrupleCLIPLoader` node types; preview area fixed at 110px
|
||||
- **A — AI TOOL tab** — Translation, Chat, TOOLS, and Settings sub-tabs powered by Ollama or LM Studio; Chat supports multi-turn conversations (full history sent each turn); TOOLS includes VLM image analysis and wildcard generation; settings (backend, URL, model) shared with the SPA AI TOOL tab via `localStorage`
|
||||
- **A — AI TOOL tab** — Translation, Chat, TOOLS, and Settings sub-tabs powered by Ollama, LM Studio, or Lemonade; Chat supports multi-turn conversations (full history sent each turn); TOOLS includes VLM image analysis and wildcard generation; settings (backend, URL, model) shared with the SPA AI TOOL tab via `localStorage`
|
||||
- **model sub-tab** — Checkpoint, VAE, Diffusion Model, and Text Encoder; drag items to canvas to place the corresponding loader node (Checkpoint → `CheckpointLoaderSimple`, VAE → `VAELoader`, Diffusion Model → `UNETLoader`, Text Encoder → `CLIPLoader`); double-click also places at canvas center
|
||||
- **lora sub-tab** — detects LoRAs from `LoraLoader`, `LoraLoaderModelOnly`, and `Lora Loader (LoraManager)` nodes (API format `inputs.loras.__value__` supported); shows `strength_model / strength_clip` values; drag individual LoRA to place `LoraLoader`; **Multiple LORA** section (appears for 1+ LoRAs) drags all LoRAs into a single `Lora Loader (LoraManager)` node with LoRA syntax pre-filled
|
||||
- **Prompts sub-tab** — POS / NEG badge list; drag a prompt to place `CLIPTextEncode` with text pre-filled; click any entry to view full text + Copy button
|
||||
@@ -279,8 +314,9 @@ Two independent modes selectable via **[Image Loop] / [Gallery]** toggle buttons
|
||||
- **⚙ Theme settings** — customize panel background, sub-header background, text, border, and secondary text colors; saved to localStorage and applied on every open
|
||||
|
||||
### Help & Support Tab (v0.1.3)
|
||||
|
||||
- **Sidebar navigation** — 2-column layout: left sidebar (15 topics) + right content pane; click any topic to switch the displayed content
|
||||
- **Support** — fixed at the bottom of the sidebar; shows GitHub and Ko-fi links in the right pane
|
||||
- **Support** — fixed at the bottom of the sidebar; shows GitHub, Ko-fi, **ComfyUI Image Feeder**, and **Mask Editor One** repository links in the right pane
|
||||
- **Feature list** — overview of all features organized by tab
|
||||
- **Keyboard Shortcuts** and **Troubleshooting** sections included
|
||||
|
||||
@@ -355,14 +391,16 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
|
||||
- **[Ollama](https://ollama.com/)** — for AI chat assistant, translation, and VLM features
|
||||
- **[LM Studio](https://lmstudio.ai/)** — alternative backend for translation and VLM (OpenAI-compatible API)
|
||||
- **[Lemonade Server](https://lemonade-server.ai/)** — alternative backend for translation, chat, and VLM (OpenAI-compatible API)
|
||||
- **[Eagle](https://eagle.cool/)** — for auto-saving generated images with metadata
|
||||
- **[comfyui-mask-editor-one](https://github.com/ketle-man/comfyui-mask-editor-one) (v0.1.9+)** — enables BiRefNet background removal, SAM3 text-prompt segmentation, and ABR stamp-brush library in the Image Edit Mask tool; `birefnet.safetensors` must be placed in `ComfyUI/models/background_removal/` for BiRefNet
|
||||
|
||||
---
|
||||
|
||||
## Supported Languages
|
||||
|
||||
| Language | Status |
|
||||
|----------|--------|
|
||||
| -------- | ------ |
|
||||
| English | Full |
|
||||
| Japanese | Full |
|
||||
| Chinese | Full |
|
||||
@@ -371,18 +409,129 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
|
||||
## Changelog
|
||||
|
||||
### v0.3.78
|
||||
|
||||
- **Eagle integration — SVG support** — auto-save now handles SVG output alongside raster images: the standard `SaveSVGNode` (via `images`-key detection with correct `image/svg+xml` MIME re-tagging) and `comfyui-tosvg`'s `Save SVG String` node (via its `saved_svg`/`path` UI keys, including a fix for ComfyUI's execution engine splitting single-string UI values into per-character arrays); SVGs are sent to Eagle through `addFromPath` (resolved to a real on-disk path, restricted to ComfyUI's managed directories) instead of `addFromURL`, since `/view` forces `application/octet-stream` for SVG as an XSS guard; temp-only preview images (e.g. `SVG String Preview`) are excluded from both auto-save and the GenerateUI result display, which now shows the actual saved SVG file instead of a stale pre-vectorized preview
|
||||
- **GenerateUI / Metadata tabs — subgraph workflow support (Mage-Flow, and any similar template)** — workflows that merely contain ComfyUI subgraphs (`definitions.subgraphs`) are no longer blocked as unsupported "App format"; only true simplified-UI App-mode workflows (Linear Mode / `.app.json`) still are. `convertUiToApi()` now correctly injects the outer subgraph node's actual widget values (prompt text, seed, model names, etc. — what the user actually sees in the collapsed subgraph form) into the internal template nodes, which previously kept stale placeholder values from when the subgraph was authored; added support for `TextEncodeMageFlowEdit` (prompt analysis) and ComfyUI's new DynamicCombo widget type (e.g. `SaveImageAdvanced`'s format selector)
|
||||
- **Workflow tab — structured AI summary** — the "Summarize" button now extracts model names, LoRAs, prompts, and sampler settings via `analyzeWorkflow()` instead of dumping the raw workflow JSON's first 4000 characters, which used to get crowded out by long `MarkdownNote` text or UI position data on complex/subgraph workflows
|
||||
- **Workflow tab — accurate node counts and format badge** — the side panel's "P:/I:/→" counts and the API/App format badge now recognize `TextEncodeMageFlowEdit`/`SaveImageAdvanced` and other newer node types, and use the same "App means Linear Mode, not just subgraphs" rule as GenerateUI
|
||||
- **Workflow/Gallery tabs — clearer "Send to Canvas" toast** — the toast previously always said "drag the title to canvas" even when the workflow was sent directly via `window.opener` (no drag needed); it now only shows the drag instruction for the actual drag-required fallback path
|
||||
|
||||
### v0.3.77
|
||||
|
||||
- **Gallery Tab — SVG file support** — `.svg` added to `IMAGE_EXTENSIONS` (`gallery_service.py`), covering folder scanning, listing, move/delete, and serving; `serve_thumbnail()` returns the original file for SVG (same as the existing GIF case) since Pillow can't open vector images and the browser scales them natively; no frontend changes needed since `gallery-tab.js` renders every image through plain `<img>` tags
|
||||
- **AI TOOL Chat — SVG generation without a ComfyUI workflow** — assistant replies are now scanned for SVG code (wrapped in a markdown code fence or written directly as a bare `<svg>...</svg>`); when found, it's rendered inline via `<img src="data:image/svg+xml;base64,...">` (script execution is disabled by the browser for SVG loaded through `<img>`) with a "Save to Gallery" button; `/wfm/gallery/image/save` (`gallery_routes.py`) was generalized to detect the target format from the data URL's MIME type instead of assuming PNG, so both Image Edit Tab's PNG saves and Chat's SVG saves go through the same endpoint
|
||||
|
||||
### v0.3.76
|
||||
|
||||
- **Comic Creator — I2I execution bridge** — added `window._wfmReceiveI2IRunRequest` (`gallery-tab.js`) and `runI2IExternal()`/`_runI2IWithImage()` (`image-edit-tab.js`), a mask-free counterpart to the existing Inpaint bridge (`_wfmReceiveInpaintRequest`/`runInpaintExternal`); lets Comic Creator's Image tab send an image with Positive/Negative prompts and Denoise, run generation in place, and get the result image URL back without opening the Workflow Studio UI
|
||||
|
||||
### v0.3.75
|
||||
|
||||
- **Lemonade Server support — third AI backend** — added [Lemonade Server](https://lemonade-server.ai/) alongside Ollama and LM Studio as a selectable backend for Translation, Chat, TOOLS (VLM/Wildcards), and the Prompt tab's AI Assistant, in both the SPA and the Library side panel; Lemonade's OpenAI-compatible API (`/v1/models`, `/v1/chat/completions`) reuses the same request/response handling already used for LM Studio, so no new wire-format code was needed
|
||||
- **Shared default-URL lookup** — `static/js/util.js` gains `getAiBackendDefaultUrl(backend)` (`AI_BACKEND_DEFAULT_URLS`: Ollama `http://localhost:11434`, LM Studio `http://localhost:1234`, Lemonade `http://localhost:13305`), replacing the previous two-way ternary in `ai-tab.js`, `prompt-tab.js`, and `settings-tab.js`; the ComfyUI side panel (`node_sets_menu.js`) keeps its own local copy since it can't import from the SPA's `static/js` modules
|
||||
- **Backend switch now always resets the URL field** — switching the backend radio (Ollama / LM Studio / Lemonade) in any of the three UIs now unconditionally fills the URL field with that backend's default, instead of only when the field was empty; the side panel previously had no such handler at all
|
||||
- **Bug fix — Bypass-mode nodes broke generation with a dangling-reference validation error** — `convertUiToApi()` used to drop Bypass-mode (`mode: 4`) nodes without reconnecting the links that ran through them, so any node downstream of a bypassed node's output referenced a node ID that no longer existed in the API graph, and ComfyUI rejected the prompt (`Exception when validating inner node: 'N'`). Bypassed nodes' wires are now traced through to their upstream source (matching same-type input/output slots, recursively for chained bypasses) before being dropped, exactly like ComfyUI's own Bypass behavior. Mute-mode nodes (`mode: 2`) are now also excluded from the API graph (previously they were sent as if fully active); unlike Bypass they are not rerouted, matching ComfyUI's own behavior where muting a node with required downstream dependents is expected to error.
|
||||
- **GenerateUI — Bypass/Mute indicator above Raw JSON** — when a loaded workflow has Bypass or Mute nodes, a note listing them (title + node ID) now appears above the Raw JSON search bar in the Input/Model/Settings tabs, since the API-format JSON shown there has no `mode` field and can no longer reveal this on its own
|
||||
|
||||
### v0.3.74
|
||||
|
||||
- **AI TOOL Chat — image attachment shared with TOOLS drop zone** — an image dropped in the TOOLS pane's existing drop zone is now also usable as the Chat pane's attachment (no separate drop zone); it is sent to the LLM as vision input (Ollama `images:[]`, LM Studio `image_url` content block) and shown as an indicator (thumbnail + label + ✕) above the Chat input; it persists across turns until explicitly cleared from either pane
|
||||
- **AI TOOL Chat — image-to-image (I2I) generation** — when an image is attached and the `generate_image` tool is invoked, the attachment is uploaded and swapped into the target workflow's `LoadImage` node instead of running text-to-image; the `generate_image` tool description was updated so the LLM knows attaching an image switches it to I2I
|
||||
- **AI TOOL Settings — Chat I2I Generation dedicated workflow** — same "Use dedicated workflow" pattern as the existing T2I setting, but independent and specific to I2I generation
|
||||
- **`comfyui-editor.js` — `applyImageToSlot()` now supports `opts.workflow`/`opts.analysis`** — mirrors the existing pattern in `applyImageAndMaskToSlot()`; lets callers upload+swap an image into a cloned workflow without touching GenerateUI's displayed state (used by the new Chat I2I bridge)
|
||||
- **Chat bubble image sizing** — the attached-image echo shown in the user's own message is now a small thumbnail (max 120px) instead of filling the bubble; generated result images are now capped at 20% width instead of 100%
|
||||
- **Recommended models** — Gemma 4:e4b, Qwen 3.5:9b, and Ministral 3:3b (Ollama) verified to work well for both tool calling and vision in the Chat pane
|
||||
|
||||
### v0.3.73
|
||||
|
||||
- **AI TOOL Chat — image generation via Tool Calling** — if the selected Ollama/LM Studio model supports tool calling, asking Chat for an image (e.g. "generate a picture of a cat") invokes a `generate_image` tool and runs the request through the same generation pipeline as the GenerateUI Generate button (`window._wfmGenerateTab.generate()`); the result is shown inline in the chat as an image bubble; the conversation is not sent back to the LLM after generation
|
||||
- **AI TOOL Chat — "Allow image generation" toggle** — checkbox next to the Send/Clear buttons (default on, persisted to `wfm_ai_settings`); when off, the `generate_image` tool is not offered to the LLM at all
|
||||
- **AI TOOL Settings — Chat Image Generation dedicated workflow** — "Use dedicated workflow" checkbox + saved-workflow picker; when off (default), Chat-triggered generation uses the workflow currently loaded in GenerateUI; when on, it loads the selected saved workflow fresh each time via `/api/wfm/workflows/raw`, without touching what's shown in GenerateUI (same pattern as Image Edit's Inpaint dedicated workflow)
|
||||
- **Settings — Default Checkpoint** — optional checkbox to force every checkpoint loader node (`CheckpointLoaderSimple` / `CheckpointLoader` / `ImageMetadataPromptLoader`) to a chosen model whenever a workflow is loaded into GenerateUI; a safeguard for environments with many saved workflows referencing models that were later moved/renamed
|
||||
- **Bug fix — silent checkpoint substitution now surfaced** — `convertUiToApi()`'s COMBO-value fallback (originally added to tolerate drifting Impact Pack wildcard options) was silently replacing *any* unrecognized `ckpt_name` with the first entry in the installed-checkpoints list, making the Model tab show an unrelated model with no indication anything was wrong; workflow loading now detects this specific case and shows a warning toast naming the missing checkpoint instead of the usual "workflow loaded" toast
|
||||
- **GenerateUI — return value for programmatic generation** — `_coreGenerate`/`handleGenerate` now return `{images, seed}` on success (previously void); existing callers are unaffected, and this enables features like the new Chat image bridge to retrieve the generated image without scraping the DOM
|
||||
|
||||
### v0.3.72
|
||||
|
||||
- **Comic Creator integration — Inpaint via external entry point** — the Image tab in Comic Creator (`comfyui-comic-creator`) can now trigger Inpaint the same way it already triggers I2I, via `window._wfmReceiveInpaintRequest(imageBlob, maskBlob, params, workflowData?, workflowFilename?)` called across the same-origin iframe boundary; common Inpaint logic was factored out into `_runInpaintWithImages()` and shared by the UI-driven flow and this new external entry point
|
||||
- **Bug fix — cross-realm Blob detection** — images/masks generated in a different window (Comic Creator) failed to load (`[object Blob]` was interpreted as a URL string, causing a 404) because `instanceof Blob` checks fail across window realms; switched to a `typeof src !== "string"` check
|
||||
- Hidden mask layers are now excluded from Inpaint in both the UI-driven and external-call paths
|
||||
|
||||
### v0.3.71
|
||||
|
||||
- **Image Edit — Inpaint tool (🩹)** — new tool composites the canvas (all non-mask layers) plus the active mask layer, uploads to an inpaint-capable LoadImage node (or a Mask Editor One node) in the GenerateUI workflow, applies Positive/Negative prompts, Grow Mask By, and Denoise, then triggers generation — all without leaving the Image Edit tab; the result is shown in the Properties pane
|
||||
- **Image Edit — Inpaint: dedicated workflow** — "Use dedicated workflow" checkbox lets you pick a saved workflow to run the inpaint against instead of the one currently loaded in GenerateUI, without disturbing what's shown there
|
||||
- **Image Edit — Inpaint: Mask Editor One support** — workflows built around the `comfyui-mask-editor-one` custom node (no LoadImage) are also supported; image/mask are pushed via its node_id-keyed server cache and `layer_data` widget
|
||||
- **GenerateUI — Input/Image tab mask slots** — LoadImage nodes whose MASK output feeds an inpaint node (e.g. `VAEEncodeForInpaint`) now show an additional Mask drop zone; image + mask are composited into a single RGBA upload matching ComfyUI's native alpha→MASK extraction
|
||||
- New example workflows: `ws_inpaint_basic.json`, `ws_inpaint_mask_editor_one.json`
|
||||
|
||||
### v0.3.70
|
||||
|
||||
- **Workflow AI summary — Ollama 404 fix** — the summarize button in the workflow detail modal now uses the Ollama URL/model saved in Settings → AI Assistant Settings (previously it silently fell back to a hardcoded default model tag that didn't match locally installed models, causing a 404)
|
||||
- **Image Edit — New button auto-adds Layer 1** — creating a blank canvas via the New button now automatically adds an empty "Layer 1", matching the existing image-load behavior
|
||||
- **Image Edit — mask overlay shown only for the active mask layer** — previously every visible mask layer's overlay was rendered regardless of selection; now only the currently active mask layer shows its overlay, other mask layers stay hidden until selected
|
||||
- **GenerateUI — Revert button for Positive/Negative Prompt** — a ↺ button next to each Apply button reverts the textarea to the node's currently applied value
|
||||
- **GenerateUI — Ctrl+↑/↓ prompt emphasis weight editing** — A1111 / native ComfyUI CLIP Text Encode style: select text (or just place the cursor on a word/parenthesis block) and press Ctrl+↑/↓ to adjust `(text:weight)` by ±0.05; parentheses are removed automatically when the weight returns to 1.0
|
||||
|
||||
### v0.3.69
|
||||
|
||||
- **Gallery — Send CC button** — new toolbar button, shown only when the Gallery tab is embedded as an iframe inside ComfyUI Comic Creator (a separate custom node); sends the selected image directly into Comic Creator's currently selected panel/overlay via its existing `insertImageFromUrl(url)` helper (no changes required on the Comic Creator side)
|
||||
- **Lora batch — validation fix** — fixed a `Prompt outputs failed validation` error where LoRA files that actually existed were rejected by the standard `LoraLoader` node; the root cause was a path-separator mismatch (ComfyUI on Windows returns `\`-separated enum values while WFS tracked LoRAs internally with `/`); a shared `resolveLoraName()` helper now converts to ComfyUI's actual notation before applying, used consistently by Lora Single apply, Stack apply, the Models tab GenUI Model button, and Lora batch generation
|
||||
- **Lora batch — pre-flight check** — before running a batch on a standard `LoraLoader` workflow, selected LoRAs are checked against ComfyUI's current model list; if any are not yet recognized, a warning toast suggests a Refresh or ComfyUI restart (skipped for Lora Manager–based workflows, which have no enum constraint)
|
||||
- **Lora batch — automatic prompt sync** — for each LoRA applied during a batch, its syntax (`<lora:name:strength_model:strength_clip>`) and CivitAI trained words are automatically appended to the Positive prompt, rebuilt from the original prompt each time (not accumulated); the prompt is automatically restored to its pre-batch state when the batch completes, is stopped, or errors
|
||||
- **Models tab — Close button in detail modal** — added a Close button at the right end of the Save / GenUI PP·NP / Delete button row in the model detail modal (all sub-tabs), reducing mouse travel to the top-right ✕ during repeated batch edits
|
||||
- **Help** — new help entry (`helpGen19`) added in EN / JA / ZH describing the Lora batch prompt sync, restore, and pre-flight check behavior
|
||||
|
||||
### v0.3.68
|
||||
|
||||
- **Image Edit — MASK EDITOR ONE section always visible** — the ABR brush section in the Draw tool's (`MASK EDITOR ONE (COLOR)`) and Mask Paint mode's (`MASK EDITOR ONE`) Properties pane is now always shown instead of being hidden when no brushes are imported; the header text turns green when at least one ABR brush is available and gray when none are imported yet; the Select button is disabled until a brush exists
|
||||
- **Help — MASK EDITOR ONE status** — updated `helpImageEdit5` (Draw tool) and `helpImageEditMask4` (Mask Paint mode) in EN / JA / ZH to describe the always-visible section and its color-coded availability state
|
||||
|
||||
### v0.3.67
|
||||
|
||||
- **GenerateUI — Alt+Click Apply & Generate** — Alt+Click any Apply button to apply the parameter and immediately queue a generation in one step; applies to Positive Prompt Apply (Input tab), all model Apply buttons (Model tab: Checkpoint / VAE / Diffusion Model / ControlNet / Hypernetwork), and KSampler Apply (Settings tab); only triggers generation when the target node exists in the loaded workflow (no action on missing nodes); each Apply button shows a tooltip `Apply (Alt+Click: Apply & Generate)` on hover
|
||||
- **Help — Alt+Click Apply & Generate** — new help entry (`helpGen18`) added in EN / JA / ZH
|
||||
|
||||
### v0.3.66
|
||||
|
||||
- **Image Edit — Mask Tool: 5 new sub-tools** — Paint / Color / Alpha / Text / Vector / Shape / SAM3 (7 sub-tools total); Color, Alpha, Text, Vector, and Shape work without Mask Editor One
|
||||
- **Color** — click the canvas to flood-select pixels similar in color to the clicked point; Properties pane: Mode (Add / Subtract), Tolerance (0–255), Feather % (0–100)
|
||||
- **Alpha** — extract the active layer's alpha channel as a mask; Properties pane: Threshold, Invert checkbox, Extract Alpha button
|
||||
- **Text** — click to open a stamp overlay; enter text, set Font / Size / Bold / Italic / Align / Mode (Add / Erase), confirm with Stamp or Ctrl+Enter; multi-line text supported
|
||||
- **Vector** — click to add Catmull-Rom spline control points; Enter (or click the first point) closes and fills the polygon; Backspace removes the last point; Esc resets; Mode (Add / Erase)
|
||||
- **Shape** — drag to draw a rectangle or ellipse; hold Shift for a perfect square/circle; blue dashed outline preview while dragging; Properties pane: Mode (Add / Erase), Shape (Rect / Ellipse)
|
||||
- **Help — Support page** — added **ComfyUI Image Feeder** and **Mask Editor One** GitHub repository links to the Support card
|
||||
|
||||
### v0.3.65
|
||||
|
||||
- **Image Edit — Mask Editor One integration fixes** — `store_image` API field mismatch (`image_b64` → `bg_image_b64`) corrected so BiRefNet and SAM3 no longer report "no image available"; `server.py` updated to accept both field names for backward compatibility
|
||||
- **Image Edit — top bar icon persistence** — WFS / Snapshot / Node Sets SVG icons in the ComfyUI action bar disappeared when the Properties Panel was opened (Vue re-render reset custom `innerHTML` to `<i>`); fixed with a `MutationObserver` that re-applies SVG icons whenever a reset is detected
|
||||
- **Image Edit — Mask Tool: ABR brush library** (requires Mask Editor One) — Select button in the Properties pane opens a folder-tree + thumbnail-grid brush picker; stamp brushes are loaded from Mask Editor One's `/mask_editor/brushes/` folder; ✕ clears back to the default circle brush
|
||||
- **Image Edit — Mask Tool: ABR brush controls** — when an image brush is active, Hardness is disabled and new controls appear in the Properties pane: Spacing (stamp interval 5–100%), Angle (fixed rotation 0–359°), Sz Jitter (random size reduction per stamp 0–100%), Rot. Jitter (random angle per stamp on/off); size jitter clamped to minimum 1 px to prevent zero-dimension canvas errors
|
||||
- **Image Edit — Mask brush cursor** — brush size circle is now hidden outside the canvas; only shown when the pointer is within the canvas bounds (window-level mousemove no longer shows the cursor overlay outside)
|
||||
|
||||
### v0.3.64
|
||||
|
||||
- **Image Edit — Mask layer Add/Subtract** — A/S toggle button on each mask layer row; Add (green, default) composites the mask normally; Subtract (red) cuts the mask area from the layer below; multiple mask layers are composited back-to-front matching Mask Editor One's CanvasCompositor logic
|
||||
- **Image Edit — BiRefNet BG Remove** (requires Mask Editor One + `birefnet.safetensors` in `ComfyUI/models/background_removal/`) — BiRefNet model now fully functional via Mask Editor One's Python backend; grayscale mask returned as RGBA PNG and applied as a new layer or in-place per the New Layer toggle
|
||||
- **Image Edit — SAM3 segmentation** (requires Mask Editor One) — new SAM3 sub-tool in the Mask tool options bar; enter a text prompt, set Max candidates (3/6/9/12), click Segment; candidate mask thumbnails shown in the Properties pane; click to select (multi-select), Apply Selected (N) applies all chosen masks with Add or Erase mode; new mask layer auto-created if active layer is not a mask
|
||||
|
||||
### v0.3.63
|
||||
|
||||
- **Nodes tab — multi-select** — Ctrl+click to toggle individual nodes, Shift+click for range selection; bulk action bar appears with add to group / remove from group / create & add group / bulk favorite / unfavorite; works in both Card and Table view modes
|
||||
- **All tabs — search clear (✕)** — inline ✕ overlay button inside each search box (Workflow / Nodes / Models / Gallery); shown only when text is entered, click to clear and re-filter immediately
|
||||
- **All tabs — clear all filters button** — new ✕ Clear button at the rightmost end of each tab's toolbar; resets all active filters (search, group, tag, folder, favorites, badge) in one click; Gallery sort order is preserved
|
||||
|
||||
### v0.3.62
|
||||
|
||||
- **Gallery tab — Send GenUI Image button** — new toolbar button (next to Image Edit); uploads the selected image to ComfyUI and sets it as the input for the first LoadImage node in the GenerateUI tab; automatically switches to GenerateUI → Input → Image; `comfyEditor.applyImageToSlot(file, slotIndex)` added to `comfyui-editor.js` for reusable image-slot injection
|
||||
- **Bug fix: tagger_settings.json missing from data export** — `tagger_settings.json` was absent from `_DATA_FILES` in `settings_routes.py`; Tagger model directory and threshold settings were silently excluded from Settings → Data Management export/import; fixed by adding the file to the export list
|
||||
- **Help — Send GenUI Image** — new help card (`helpGallery17`) added in EN/JA/ZH; registered in `helpIdMap`
|
||||
- **Screenshots — Tagger and Image Edit tabs** — `docs/12_Tagger.png` and `docs/13_ImageEdit.png` added to the README screenshots section
|
||||
|
||||
### v0.3.61
|
||||
|
||||
- **Image Edit — Draw / Mask brush cursor** — cursor replaced with a size-accurate circle overlay matching the current brush size; the circle scales correctly with canvas zoom so the visible area matches exactly what will be painted
|
||||
- **Image Edit — Draw / Mask out-of-canvas strokes** — strokes can now start from the canvas margin area (outside the image boundary) and continue past the edge without interruption; `window`-level `mousemove` / `mouseup` tracking keeps the stroke alive when the pointer leaves the canvas element
|
||||
- **G'MIC — argument order fix** — corrected `gmic_qt.exe` launch arguments to `-o <output> <input>` (the only order G'MIC-Qt Standalone accepts); the previous order caused the GUI to exit immediately without opening
|
||||
@@ -391,10 +540,12 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **Help — G'MIC Filter section** — added two new help cards (G'MIC Filter usage and G'MIC-Qt Installation) with full i18n support (English / Japanese / Chinese)
|
||||
|
||||
### v0.3.60
|
||||
|
||||
- **Image Edit — Filter tool (G'MIC-Qt integration)** — the previously inactive ★ Filter tool now launches G'MIC-Qt GUI with the active layer image; select a filter and click OK, then close the "G'MIC-Qt filter output" window to apply the result back as the active layer; polling-based job system with progress display, Cancel button, and Undo support; requires G'MIC-Qt Standalone (`gmic_qt.exe`) configured in Settings
|
||||
- **Settings — G'MIC-Qt Executable Path** — new collapsible section in Settings for entering and saving the path to `gmic_qt.exe`
|
||||
|
||||
### v0.3.59
|
||||
|
||||
- **Image Edit — Mask Tool** — new Mask tool (🎭) in the Image Edit sidebar; click **M** in the Layers header to add a mask layer (Mask tool activates automatically); clicking a mask layer in the layer list also switches to the Mask tool; **Tool Options bar**: Paint button, Invert checkbox (inverts overlay preview), Overlay color picker (default red), Blur slider (0–50 px) for overlay edge softening; **Properties pane** (left of the Layers panel, shown when Mask tool is active): Size (1–200 px), Hardness (0–100%), Mode — **Add** / **Erase** toggle buttons (active mode highlighted in blue)
|
||||
- **Image Edit — Clipping mask (✂ button)** — each mask layer row shows a ✂ toggle; when enabled (blue), the mask clips the layer directly below it so only the painted area is visible; clipping is applied to PNG save / Save to Gallery / Send to ComfyUI exports
|
||||
- **Image Edit — Draw & Mask paint bugfix** — Draw and Mask tools now paint directly onto `layer.canvas`; all other layers remain fully visible during brush strokes (previously the composite view was replaced by the active layer only while painting)
|
||||
@@ -402,20 +553,24 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **Help — Mask Tool section** — added Mask Tool card with full i18n support (English / Japanese / Chinese); updated Tools list, layer type icon list, and Layer panel "M button" description
|
||||
|
||||
### v0.3.58
|
||||
|
||||
- **GenerateUI Model tab — Diffusion Model GGUF support** — `LoaderGGUF` and `LoaderGGUFAdvanced` nodes are now recognized alongside `UNETLoader` / `UnetLoaderGGUF`; the correct input key (`gguf_name` vs `unet_name`) is selected automatically on Apply; the Models tab "GenUI Model" button also applies correctly to `LoaderGGUF` workflows
|
||||
- **GenerateUI Model tab — Text Encoder expanded (CLIPLoader / DualCLIPLoader / GGUF variants)** — the Text Encoder section now renders a node-type-aware UI: **single CLIP** (`CLIPLoader` / `ClipLoaderGGUF`) shows one clip selector + **type** dropdown + **device** (GGUF only); **Dual CLIP** (`DualCLIPLoader` / `DualClipLoaderGGUF`) shows two clip selectors (clip_name1 / clip_name2) + **type** dropdown + **device** (GGUF only); type options are fetched dynamically from `/object_info`; filter applies to the first selector only
|
||||
|
||||
### v0.3.57
|
||||
|
||||
- **Image Edit — Blur tool** — new Blur tool (≈) in the Image Edit sidebar; **Whole Blur**: Gaussian blur to the entire active layer with intensity slider (1–50 px); **Whole Mosaic**: pixelation mosaic with block-size slider (5–100 px); **Rect Blur / Rect Mosaic**: toggle to enter rect-draw mode then drag to select a region — blur or mosaic is applied on mouse release; Rect Blur and Rect Mosaic are mutually exclusive; all operations support Undo (Ctrl+Z)
|
||||
- **Image Edit — BG Remove tool** — new BG Remove tool (⬚); **Lightweight (@imgly)**: background removal running entirely in the browser via CDN (~40 MB model cached after first load); **BiRefNet**: stub wired to a future Python backend endpoint (coming soon); **New Layer** checkbox (default on) adds the result as a new layer above the original — uncheck to replace the active layer in-place; supports Undo
|
||||
- **Image Edit — sidebar icons** — removed `ie-tool-placeholder` dimming from Blur and BG Remove buttons; both now display at full brightness matching other active tools
|
||||
- **Help — Blur / BG Remove sections** — added two new help cards (Blur Tool and BG Remove Tool) with full i18n support (English / Japanese / Chinese); Tools list updated with Blur and BG Remove overview items
|
||||
|
||||
### v0.3.56
|
||||
|
||||
- **GenerateUI — Style selector** — new checkbox and dropdown next to the Reset Workflow button; when enabled, a Fooocus-style JSON style is applied to positive and negative prompts at generation time; style files (`*.json`) are read from `user/default/Workflow-Studio/style/`; multiple files are merged into a single list sorted by filename; the style's `{prompt}` placeholder is replaced with the original prompt text, otherwise the style text is appended; `negative_prompt` is appended to the existing negative prompt; styles are applied to a per-generation workflow copy and never modify the loaded workflow
|
||||
- **Batch tab — Style batch** — new **Style** tab in the Batch left pane lists all styles loaded from the style directory (flat list with All / None buttons); select any combination, enable the **Style** column in Batch Queue, then Generate to run each selected style sequentially; Batch Queue expanded from 6 to 7 columns (Style added as the rightmost column)
|
||||
|
||||
### v0.3.55
|
||||
|
||||
- **Group feature — fix data loss on Windows (backslash/slash mismatch)** — on Windows, ComfyUI returns model paths with backslashes (`sub\model.safetensors`) while the backend normalized to forward slashes; this caused all subdir group members to be flagged as missing and deleted on save; fixed by normalizing both stored and scanned paths to forward slashes in `get_model_groups` and `save_model_groups`
|
||||
- **Group feature — network drive protection** — if no model directories are accessible (e.g. external drive disconnected), the group cleanup step is now skipped entirely to prevent wiping all group memberships
|
||||
- **Group feature — scan cache** — `_scan_model_names` now caches results for 30 seconds to eliminate redundant full directory scans on startup (caused high CPU load / crash on large model sets)
|
||||
@@ -429,19 +584,23 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **Help tab — Image Edit section i18n** — the Image Edit help page was hardcoded in English with no language switching support; all 6 sections (30 items + 7 headings) now have i18n IDs wired to English / Japanese / Chinese translations
|
||||
|
||||
### v0.3.54
|
||||
|
||||
- **Image Edit — Shape tool (S)** — new Shape tool added to the Image Edit toolbar; draw Rect, Ellipse, Line, and FreeLine shapes by dragging; each committed shape becomes an independent draw layer that can be undone in a single step; Tool Options: shape type selector, Rounded toggle (Rect/Ellipse only), Fill color + None toggle (hidden for Line/FreeLine), Stroke color + width (Stroke None hidden for Line/FreeLine where stroke is always active), Opacity slider, Undo button; blue dashed outline previews the shape during drag; keyboard shortcut **S** activates the tool
|
||||
- **Models tab — fix B/S overlay buttons not highlighting** — the Batch (B) and Stack (S) card overlay buttons failed to turn yellow after clicking because `e.currentTarget` is nulled by the browser after an `async` event handler yields at `await`; fixed by capturing `const btn = e.currentTarget` before the await in both handlers
|
||||
|
||||
### v0.3.53
|
||||
|
||||
- **Image Edit Tab** — new layer-based image editing tab with Select / Draw / Text tools, multi-layer compositing, canvas zoom & pan, and Undo/Redo; text layers are sized to exact bounding-box dimensions and regenerated at display resolution on resize to prevent blurring; double-click a text layer to re-edit its content; Gallery tab gains an "Image Edit" toolbar button to send the selected image directly to the editor
|
||||
- **Image Edit — Layer lock** — lock icon (🔒/🔓) on each layer row; locked layers display an orange bounding box and ignore all Select-tool transforms; Layer 1 is auto-locked when the first image is loaded to prevent accidental moves
|
||||
- **Image Edit — Save to Gallery** — "Save to Gallery" button (next to Save PNG) saves the composite image to the Gallery root folder; filename defaults to `wfs-image-YYYYMMDDHHmmss`; backed by new `POST /wfm/gallery/image/save` API endpoint
|
||||
- **Help tab — Image Edit page** — new dedicated help page covering tools, layer panel, text quality, export options, and keyboard shortcuts
|
||||
|
||||
### v0.3.52
|
||||
|
||||
- **GenerateUI Model tab — fix LoRA selection reset when switching subtabs** — applying a LoRA via "GenUI Model" button and then switching to another subTab (Prompt/Image/Settings) and back to Model caused the LoRA selector, syntax display, and trigger words to revert to the original workflow values; fixed by reading `currentVal` directly from `currentWorkflow` instead of the stale `currentAnalysis`, and by saving/restoring the Single tab's syntax and trigger words across re-renders
|
||||
|
||||
### v0.3.51
|
||||
|
||||
- **Models tab — Embedding type: GenUI PP / GenUI NP buttons** — Embedding models now show two buttons ("GenUI PP" and "GenUI NP") in the side panel nav, detail side panel, and detail modal (replacing the single "GenUI Model" button); clicking either appends `(embedding:Name:1.0)` to the Positive or Negative prompt of the loaded workflow
|
||||
- **GenerateUI Prompt tab — Embeddings selector** — new section at the bottom of the Prompt tab: Filter input, model select dropdown, Weight input (default 1.0), and Paste button; Paste inserts `(embedding:Stem:weight)` at the cursor position of the last focused textarea (Positive or Negative); focus state is tracked on click/keyup/blur so the button works even after clicking away
|
||||
- **GenerateUI Model tab — Hypernetwork support** — Hypernetwork section added with model selector (filter) and Strength field; applies to `HypernetworkLoader` nodes in the workflow; GenUI Model button in Models tab also triggers Hypernetwork apply
|
||||
@@ -449,33 +608,40 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **Models tab — GenUI Model button in side panel nav** — "GenUI Model" button added to the tab navigation bar (Info / Group / CivitAI) of the side panel; appears for supported model types (Checkpoint, LoRA, VAE, etc.) and hides for unsupported types; Embedding type shows PP/NP nav buttons instead
|
||||
|
||||
### v0.3.50
|
||||
|
||||
- **Gallery tab — fix prompt search causing ComfyUI hang under large folders** — the v0.3.49 on-demand metadata read ran synchronously on the aiohttp event loop, blocking ComfyUI when folders contained many uncached images; fixed by: (1) removing on-demand reads from `list_images()`; (2) wrapping `list_images()` in `asyncio.to_thread()` to keep the event loop free; (3) adding a background indexer (`start_background_index`) that automatically indexes uncached images after a folder is loaded — processes 10 images per batch with a 50 ms sleep between batches; cancellable on folder switch
|
||||
|
||||
### v0.3.49
|
||||
|
||||
- **GenerateUI tab — A1111-style SPA-side wildcard expansion** — when prompt text in non-ImpactWildcard nodes (e.g. CLIPTextEncode) contains `__name__` syntax, the SPA expands it at generation time by randomly picking a line from the matching file in the WFS wildcard folder; nested wildcards are re-expanded up to 5 passes; unresolved wildcards are passed through unchanged; ImpactWildcardEncode/Processor nodes are skipped (handled server-side by Impact Pack); works in both single and batch generation
|
||||
- **Gallery tab — fix Export button missing label** — the bulk action bar's Export button had no text label because the `textContent` assignment was missing from `updateUITexts()`; fixed by adding the `galleryBulkExport` i18n key assignment alongside the existing Move/Delete entries
|
||||
- **Gallery tab — fix prompt search not matching images with no cached index** — `prompt_cache` was only built when an image was opened in the detail panel; A1111 images (or any images never opened) were invisible to prompt search; now when search is active and `prompt_cache` is empty, the image file is read on-demand and the cache is populated and persisted for future searches
|
||||
|
||||
### v0.3.48
|
||||
|
||||
- **Gallery tab — single image download** — hover over a detail-panel preview image to reveal a download overlay (⬇ icon); click to download the original file with its original filename preserved
|
||||
- **Gallery tab — bulk export to ZIP** — multiple selected images can be exported as a ZIP archive via the "Export" button in the bulk action bar; filename: `gallery_export_<timestamp>.zip`; backend: `POST /wfm/gallery/images/export-zip` with path-traversal protection
|
||||
|
||||
### v0.3.47
|
||||
|
||||
- **Models tab — fix stale group state after file move** — when models were moved to a subdirectory via "Move To...", `state.modelGroups` in the JS client was not updated to reflect the new model paths; the group filter view would lose the moved models immediately after the operation. Now the client-side group membership is updated in sync with the server-side rename (mirrors the existing Python `move_models` logic). Generate tab Batch groups are unaffected as they always fetch fresh from the server.
|
||||
|
||||
### v0.3.46
|
||||
|
||||
- **Prompt tab AI Assistant — LM Studio support** — switched from Python proxy (`/api/wfm/ollama/*`) to direct browser-to-backend API calls (same pattern as the AI TOOL tab); supports Ollama (`/api/chat`) and LM Studio (`/v1/chat/completions`); image attachments are automatically converted to the correct format per backend
|
||||
- **Settings tab — AI Assistant Settings (Prompt Tab)** — renamed from "Ollama Settings"; added backend selector (Ollama / LM Studio), URL input with per-backend placeholder, model select with Refresh, and Test button; settings saved to localStorage `wfm_prompt_ai_settings` (independent of AI TOOL tab settings)
|
||||
- **Auto-refresh on backend change** — if the backend is switched in Settings tab while Prompt tab is already open, `sendMessage()` now detects the mismatch and automatically re-fetches the model list before sending; model status shows the active backend name (`[ollama]` / `[lmstudio]`)
|
||||
- **Help text updated** (EN/JA/ZH) — Prompt tab, Settings tab, and Troubleshooting sections updated to reflect Ollama / LM Studio dual-backend support
|
||||
|
||||
### v0.3.45
|
||||
|
||||
- **Group auto-cleanup — Models tab** — stale group entries (models that no longer exist on disk) are automatically removed when the Models tab is loaded or the model type is switched; models moved within the app via "Move To..." also update their group membership immediately
|
||||
- **Group auto-cleanup — Gallery tab (folder view)** — metadata entries for missing files are cleaned up each time a folder is scanned (`list_images`), synchronized with the 60s TTL + folder-mtime cache
|
||||
- **Group auto-cleanup — Gallery tab (group image list)** — `list_images_in_group` (used by the Feeder tab Gallery mode) now filters out non-existent paths and removes them from the group in a single write operation
|
||||
- **Gallery tab — Shift+click range selection** — Shift+click selects all images between the last clicked item (anchor) and the current item; works in both thumbnail and table views; anchor is updated on Ctrl+click and regular click; resets on folder change, image reload, and Deselect All; help text updated (EN/JA/ZH)
|
||||
|
||||
### v0.3.44
|
||||
|
||||
- **Gallery tab — server-side thumbnail generation** — `GET /wfm/gallery/image/thumb?path=...&w=256` endpoint generates 256px JPEG thumbnails via Pillow and caches them to `data/thumb_cache/` keyed by `md5(path:mtime:width)`; GIF served as-is to preserve animation; falls back to the original file if Pillow is unavailable; thumbnail view and table view both switched from `/image/serve` to `/image/thumb`
|
||||
- **Gallery tab — infinite-scroll paging** — thumbnail view renders 50 images initially; an IntersectionObserver sentinel (rootMargin 300px) appends the next page on scroll; sentinel is disconnected and removed when all images are rendered; paging resets on every `renderImages()` call (folder change, filter, sort)
|
||||
- **Gallery tab — bulk API endpoints** — `POST /wfm/gallery/bulk/favorite` and `POST /wfm/gallery/bulk/group` handle favorite set and group add/remove for any number of images in a single request; replaced N-parallel individual fetches in `bulkSetFavorite()` and `bulkAddToGroup()`
|
||||
@@ -488,10 +654,12 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **Help tab — search box** — live search input above the nav sidebar filters matching pages and auto-clicks the first result; placeholder text localized (EN/JA/ZH)
|
||||
|
||||
### v0.3.43
|
||||
|
||||
- **Send to Canvas — direct canvas load via `window.opener`** — clicking "Send to Canvas" (Workflow tab) or "Copy & Send Canvas" (Gallery tab) now sends the workflow directly to the ComfyUI canvas without requiring a title drag; uses `window.opener.wfmReceiveWorkflow()` registered by `node_sets_menu.js` via `app.handleFile()`; both UI and API formats are supported; fallback to localStorage + title drag when `window.opener` is unavailable (e.g. opened from a bookmark), UI-format only
|
||||
- **Workflow Studio Library — API-format DnD enabled** — API-format workflows in the W (Workflows) sub-tab are no longer grayed out; drag & drop and double-click now work for all formats via `app.handleFile()`
|
||||
|
||||
### v0.3.42
|
||||
|
||||
- **Feeder tab — Gallery mode** — new [Image Loop] / [Gallery] toggle in the Feeder tab; Gallery mode drives a WFS_GalleryFeeder node without any external plugin: node selector, group select, sort mode / index / seed, After Gen (Loop / Increment / Fixed), Run / Stop; center pane shows the selected group's images — click any image to jump to that index; `__Feeder__` group is auto-created on first open
|
||||
- **WFS_GalleryFeeder custom node** — new ComfyUI node (Workflow Studio category) that reads images from a Gallery group and outputs one `IMAGE` at a time; inputs: `group_name`, `index`, `sort_mode` (filename_asc / filename_desc / random), `seed`; skips missing files; `IS_CHANGED` ensures re-execution on every queue
|
||||
- **WFS_GalleryFeeder — ComfyUI canvas controls** — `gallery_feeder_extension.js` adds After Gen combo (loop / increment / fixed), ▶ Run button, and ■ Stop button as non-serialized widgets directly on the node in the ComfyUI canvas; manages per-node loop state with `waitForExecution()` Promise pattern; `onRemoved` hook auto-stops the loop on node deletion
|
||||
@@ -503,6 +671,7 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **Bug fix: WFS_GalleryFeeder seed validation error** — seed `max` changed from `0x7FFFFFFF` to `0xffffffffffffffff` (matching KSampler); `applySeedToWorkflow()` was writing values exceeding the old max, causing `value_bigger_than_max` validation failures
|
||||
|
||||
### v0.3.41
|
||||
|
||||
- **Generate UI — ImpactWildcardEncode / ImpactWildcardProcessor prompt detection** — fixed: wildcard text inputs from comfy-impact-pack nodes were not shown in the Prompt tab of Generate UI
|
||||
- `CLIPTextEncodeEditPlus` node (used as the text encoder in these workflows) now correctly propagates positive/negative roles upstream to ImpactWildcard nodes via BFS
|
||||
- `CLIPTextEncodeEditPlus` with an empty `text_edit` field is no longer added to `prompt_nodes` ahead of the upstream ImpactWildcard node, preventing a blank text area
|
||||
@@ -510,17 +679,20 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- Static fallback mapping added for `ImpactWildcardProcessor` and `ImpactWildcardEncode` so detection works even when the ComfyUI server is offline
|
||||
|
||||
### v0.3.40
|
||||
|
||||
- **AI TOOL tab — Chat pane** — new pane (between Translation and TOOLS) for multi-turn conversation with the LLM; full conversation history sent each turn for context; Enter to send, Shift+Enter for newline; Clear button resets history; Ollama uses `/api/chat`, LM Studio uses `/v1/chat/completions`
|
||||
- **AI TOOL tab — Wildcard generation** — new "Create wildcards" task in the TOOLS pane dropdown; enter a category name and count, click Run to generate plain-text entries one per line (no markdown, no numbering); output can be pasted directly into wildcard `.txt` files
|
||||
- **Library A tab — Chat and Wildcards** — both features added to the side panel's A tab: Chat as a new sub-tab (Translation → Chat → TOOLS → Settings), wildcard generation as a new option in the TOOLS sub-tab dropdown
|
||||
- **Help updated** — AI TOOL tab help card updated to 6 items (Chat and Wildcards added); Library panel sidepanel-16 updated; EN/JA/ZH
|
||||
|
||||
### v0.3.39
|
||||
|
||||
- **Workflow tab — Send to Canvas button** — replaced "Open in ComfyUI" (toolbar and detail modal) with "Send to Canvas"; stores the selected workflow in `localStorage` for title-drag to the canvas without opening a new browser tab
|
||||
- **Gallery tab — Copy & Send Canvas button** — renamed "Copy Workflow" to "Copy & Send Canvas"; copies the embedded workflow JSON to the clipboard and simultaneously stores it for title-drag
|
||||
- **Workflow Studio Library — title drag** — after "Send to Canvas" or "Copy & Send Canvas" is clicked, the "Workflow Studio Library" panel title turns blue with a green ● indicator; drag the title onto the ComfyUI canvas to load the workflow; title resets automatically after loading
|
||||
|
||||
### v0.3.38
|
||||
|
||||
- **Tagger tab** — new tab for automatic image tagging; supports WD Tagger (ONNX), SwinV2, DeepDanbooru (.h5), and Ollama VLM; 3 sub-tabs: Single (drag & drop / upload, 5 output targets), Batch (folder processing with real-time progress), DB (searchable SQLite database with CSV export)
|
||||
- **Tagger single — GenUI:P button** — new button (left of "Send to Prompt") that appends generated tags to the GenerateUI positive prompt and immediately applies them to the loaded workflow; shows a warning if no workflow is loaded in GenerateUI
|
||||
- **Tagger batch — Write .txt output** — new output option that creates `<filename>.txt` alongside each processed image containing all generated tags (comma-separated)
|
||||
@@ -531,11 +703,13 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **Workflow analyzer — lumina2 model type** — CLIPLoader `type: "lumina2"` is now correctly classified as Z-IMAGE in the workflow type detector
|
||||
|
||||
### v0.3.37
|
||||
|
||||
- **Models tab — Select All button** — new button added to the right of "Deselect All" in the multi-select action bar; selects all models currently visible after applying the active search / filter / group filters
|
||||
- **Gallery tab — Select All button** — new button added to the right of "Deselect All" in the bulk action bar; selects all images in the current folder view
|
||||
- **Gallery bulk bar — i18n** — all bulk action bar buttons and the selection count were hard-coded English strings; they now use the `t()` translation system (EN / JA / ZH) so the bar respects the selected UI language
|
||||
|
||||
### v0.3.36
|
||||
|
||||
- **GenerateUI Save — overwrite protection** — saving now checks for an existing file and asks for confirmation before overwriting; if the target file is in UI format, a dedicated warning explains that saving in API format will lose the node layout
|
||||
- **GenerateUI Save — Raw JSON sync** — unapplied Raw JSON edits are now included in the save (parsed and synced back to the editor); invalid JSON aborts the save with an error instead of silently saving stale content
|
||||
- **GenerateUI Save — hardening** — filename is set via DOM (no HTML-attribute injection), image extensions (`.png` etc.) are stripped from the default name, and a double-submit guard prevents duplicate POSTs
|
||||
@@ -545,11 +719,13 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **README refreshed** — intro rewritten around the three pillars (Management / GenerateUI / Library side panel); new screenshots: GenUI LoRA Stack, GenUI Batch, Models Multi-select Menu; WS Library image updated
|
||||
|
||||
### v0.3.35
|
||||
|
||||
- **Models tab — Table column sort** — click any column header to sort ascending (▲), click again for descending (▼), click a third time to clear; active column name highlighted in accent color; Enable/Disable column header now labeled **E/D**
|
||||
- **Gallery tab — Load GenUI button** — new button to the right of the Metadata button in the detail panel; loads the embedded ComfyUI workflow from the selected image directly into the GenerateUI tab; warning toast shown if no workflow is embedded or the format is unsupported; Metadata button restyled green, Load GenUI uses primary accent color
|
||||
- **GenerateUI tab — Save button** — new button at the right end of the subtab row; opens a filename dialog (default: current workflow name) and saves the current workflow as a `.json` file to the Workflow tab via the import API; workflow name label updates to the saved filename on success
|
||||
|
||||
### v0.3.33
|
||||
|
||||
- **LoRA pane — workflow load no longer overwrites LoraManager** — removed the auto-apply block that replaced `inputs.loras` / `inputs.text` with Stack group contents on every workflow load; Stack is now applied only when the Apply button is pressed
|
||||
- **LoRA pane — 🔄 button no longer resets to Single tab** — active tab state is saved before `innerHTML` rebuild and restored afterwards; staying on Stack tab after refresh
|
||||
- **Models tab — Stack group hidden for non-LoRA types** — when switching to Checkpoint or other non-LoRA types, the Stack group is now excluded from the group filter dropdown and side-panel group management (LoRA-only concept)
|
||||
@@ -557,20 +733,24 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **Stack Apply — trigger words now applied correctly on first press** — trigger words (`currentAllTriggers` / `currentActiveTriggers`) are now recomputed at click time from the latest `_stackActive` + `metadata` + `civitaiCache`; previously used a stale snapshot captured at render time, causing trigger words to be missing on the first Apply and to linger after disabling a model
|
||||
|
||||
### v0.3.32
|
||||
|
||||
- **Lora Loader (LoraManager) LoRA detection** — I tab and Metadata tab now correctly detect LoRAs from `Lora Loader (LoraManager)` nodes in API format (`inputs.loras.__value__`); `strength`/`clipStrength` stored as strings (e.g. `"0.20"`) are now parsed correctly
|
||||
- **LoraManager node placement — LoRA syntax** — placing a `Lora Loader (LoraManager)` node via drag now also updates the `text` widget with `<lora:name:strength>` syntax (previously only the `loras` array widget was set)
|
||||
- **M tab Groups — LoRA → LoraManager drop** — LoRA groups in the Library M tab show an **All N LoRAs** item; drag to canvas places a `Lora Loader (LoraManager)` node with all group LoRAs; double-click also places at canvas center
|
||||
- **P tab — Groups sub-tab** — new Groups sub-tab (row 2) in the Library P tab; groups are read from `localStorage["wfm_prompt_preset_groups"]` (shared with Batch); expanding a group shows draggable preset items
|
||||
|
||||
### v0.3.31
|
||||
|
||||
- **LoRA pane — Single/Stack tabs** — LoRA pane split into two tabs: Single (filter, model dropdown, M/C strength, target node, Apply, P, LORA SYNTAX, TRIGGER WORDS) and Stack (target node, Apply, P, Toggle-all, global strength adjuster, LORA SYNTAX, TRIGGER WORDS, model list); each tab has independent strength settings
|
||||
- **GenUI Model — LoRA improvements** — now correctly handles `Lora Loader (LoraManager)` nodes (previously failed to find the node); on apply: switches to Single tab, disables all Stack models, and updates LORA SYNTAX / TRIGGER WORDS in the Single tab panel
|
||||
|
||||
### v0.3.30
|
||||
|
||||
- **LoRA Stack trigger words fix** — inactive stack models no longer show their trigger words in the Trigger words display; both initial render and per-model toggle/toggle-all now filter to active models only
|
||||
- **Help troubleshooting** — added entry for "No such file or directory" error when running LoRA Stack (comfyui-lora-manager compatibility issue)
|
||||
|
||||
### v0.3.29
|
||||
|
||||
- **LoRA section unified** — single LoRA and Stack sections merged into one pane; Apply button handles both cases (stack models present → apply all active + prompt sync; no stack → apply selected single LoRA + prompt sync); Ctrl+Apply removed, now plain Apply by default
|
||||
- **LoRA prompt sync** — Apply inserts `<lora:stem:M:C>` syntax and CivitAI trigger words into the Positive prompt; re-applying updates the prompt by diff (removes stale tokens, re-adds active ones); works for both single LoRA and Stack
|
||||
- **P button** — placed to the right of Apply; immediately writes the current Positive prompt textarea to the target workflow node without switching tabs
|
||||
@@ -589,22 +769,26 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **Models thumbnail bug fixes** — preview endpoint now sends `Cache-Control: no-cache`; files under 100 bytes skipped; `.disabled` model files included in preview change lookup
|
||||
|
||||
### v0.3.23
|
||||
|
||||
- **Bug fix: workflow batch 404** — `_runBatchGenerate()` workflow case was fetching `/api/wfm/workflows/{filename}` (non-existent route); corrected to `/api/wfm/workflows/raw?filename={filename}`
|
||||
- **Bug fix: rename double-submit** — `addEventListener("blur", commitRename)` was accumulating on the persistent `#wfm-modal-title-input` element each time the modal opened; subsequent renames fired the handler twice, sending two rename requests back-to-back (first succeeds, second returns 409 or 404); fixed by storing the listener reference on `titleInput._commitRename` and calling `removeEventListener` before re-registering
|
||||
|
||||
### v0.3.22
|
||||
|
||||
- **Card view removed** — Workflow tab and Models tab no longer offer Card view; Thumbnail and Table remain; if `"card"` was previously stored in localStorage it falls back to Thumbnail automatically
|
||||
- **Batch type selector** — replaced the Checkpoint Batch toggle with per-type checkboxes on the Batch Queue column headers (Checkpoint / Lora / Prompt / Workflow); radio behavior ensures only one type is active at a time; the Batch panel below Generate repurposed as a status display showing the active type, amber progress bar, and Pause/Resume / Stop controls
|
||||
- **4-type batch generation** — `_runBatchGenerate()` dispatches to Checkpoint (file-tree + group selection), Lora (group selection), Prompt (preset group items applied to positive/negative nodes), and Workflow (group selection, restores original workflow after batch); all types use the same generic `_runBatchLoop()` with pause/abort support
|
||||
- **Help updated** — EN / JA / ZH strings updated for `helpWf1`, `helpModels2`, `helpGen11`, `helpGen13`, `helpGen14`
|
||||
|
||||
### v0.3.21
|
||||
|
||||
- **CivitAI Host setting** — new dropdown in Settings tab (CivitAI section): choose `civitai.com` (SFW only) or `civitai.red` (unrestricted); selection is saved to `settings.json` and synced to `localStorage` so the Models tab uses it immediately without extra server calls
|
||||
- **CivitAI panel — Info / Sample sub-tabs** — the CivitAI side panel is split into two sub-tabs; Info tab contains model details and actions; Sample tab shows all sample images (count displayed in label); images open full-size in a new browser tab on click
|
||||
- **Bug fix: model page URL for existing cache** — `modelId: null` entries (the majority of the cache) previously generated broken links (`/models?modelVersionId=…`); both the Python service and the JS renderer now fall back to `/{host}/model-versions/{versionId}` which redirects correctly to the model page; all 324 existing cache entries are fixed immediately without re-fetching
|
||||
- **Help updated** — Batch tab entries (gen-12 / gen-13 / gen-14) and Settings entries (settings-11 Text Size / settings-12 RAW JSON Colors / settings-13 CivitAI Host) are now fully localized in EN / JA / ZH; `helpGen3` updated to reflect 5-tab layout; `helpGen11` rewritten to describe the Batch toggle; JA/ZH translations no longer contain untranslated English terms (Filter, Pause/Resume, Stop)
|
||||
|
||||
### v0.3.20
|
||||
|
||||
- **CivitAI panel — Type / Base Model / Hash display** — side panel CivitAI tab now shows a Type badge (e.g. CHECKPOINT, LORA), Base Model row, and Hash row (BLAKE3 preferred, SHA256 fallback from CivitAI API or local metadata); click the hash to copy the full value to clipboard
|
||||
- **CivitAI panel — images open in new tab** — sample images in the CivitAI tab are now wrapped in links; clicking an image opens the full-size version in a new browser tab
|
||||
- **CivitAI panel — 3-state UI** — the panel now distinguishes between "not yet checked" (blue fetch button), "checked but not found on CivitAI" (re-check button with a notice), and "found" (full info); no more ambiguity after running batch fetch
|
||||
@@ -613,6 +797,7 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **CivitAI cache — `fileHashes` field added** — `_extract_info` now stores the primary file's full hash map (BLAKE3, SHA256, AutoV2, etc.) so the Hash row is populated for newly fetched or refreshed models
|
||||
|
||||
### v0.3.19
|
||||
|
||||
- **CivitAI batch fetch — major speedup** — switched from one-by-one `GET` requests (0.5 s delay each) to `POST /model-versions/by-hash` batch endpoint; up to 100 hashes per request, reducing 100-model fetch from ~50 s to a few seconds
|
||||
- **Retry with exponential backoff** — `fetch_by_hash` and the new batch POST both retry on HTTP 429 / 500 / 502 / 503 / 504 with 1 s → 2 s → 4 s delays (max 3 attempts), as recommended in the CivitAI API docs
|
||||
- **CivitAI API key support** — optional Bearer token can be set in Settings tab (CivitAI API Key section); environment variable `CIVITAI_API_KEY` takes priority over the stored key; API keys are excluded from data exports
|
||||
@@ -621,29 +806,35 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **Bug fix: CivitAI tab blank after batch fetch** — the `done` SSE event now applies `data.hashes` directly to `state.modelMetadata` so the side-panel CivitAI tab renders correctly even when the subsequent `fetchModelMetadata()` call races ahead of the server flush
|
||||
|
||||
### v0.3.18
|
||||
|
||||
- **Batch tab** — new 5th subtab in GenerateUI with a dedicated 3-pane layout for assembling checkpoint batch queues; left pane: file-tree checkpoint selection (filter, All/None, initially unchecked); center pane: group-based selection with inner tabs (Checkpoint / Lora / Prompt / Workflow — Lora/Prompt/Workflow coming soon); right pane: live Batch Queue preview combining both pane selections with duplicates removed
|
||||
- **Checkpoint selector moved** — the checkpoint dropdown is removed from the right panel; selection is now done exclusively in the Batch tab left and center panes; the right panel retains only the enable/disable toggle and progress display
|
||||
- **Group selection fix** — batch group selection now stores selected group names (not raw model names), so changes to group membership in the Models tab are always reflected in the queue without stale entries
|
||||
- **Models tab bulk operations expanded** — bulk action bar now includes: Deselect All (clear all selections without exiting select mode), ★ Favorite / ☆ Unfavorite, +Badge / −Badge (apply or remove a badge from all selected models); existing group and delete operations unchanged
|
||||
|
||||
### v0.3.17
|
||||
|
||||
- **CivitAI SSL fix** — resolved `CERTIFICATE_VERIFY_FAILED` errors when fetching model info on Windows Portable Python environments; uses `certifi` CA bundle when available, falls back to system store, and disables verification only as a last resort with a warning log
|
||||
- **Lora Manager support** — `Lora Loader (LoraManager)` nodes (ComfyUI-Lora-Manager) are now correctly converted from UI format to API format in the GenerateUI tab; the `loras` widget array is wrapped to `{"__value__": [...]}` as required by the node, enabling generation with LoRA Manager workflows
|
||||
|
||||
### v0.3.16
|
||||
|
||||
- **CivitAI preview fallback** — model cards and the detail panel's Info tab now display the first CivitAI image directly when no local preview file exists; if the backend download fails (e.g. network restriction server-side), the browser fetches the image URL from the CivitAI cache as a fallback so the preview is always shown after fetching
|
||||
|
||||
### v0.3.15
|
||||
|
||||
- **Sample workflows** — added `workflows/` directory containing 13 sample workflows (SD1.5 / SDXL / DWPose / Face Detailer / Image Editing) with PNG thumbnails, bundled in the package
|
||||
- **CivitAI auto-preview** — when fetching CivitAI info (individual or batch), the first CivitAI image is automatically downloaded and saved as `{model_stem}.preview.png` if no preview exists; batch summary reports the count of auto-saved previews
|
||||
- **TOOLS pane — Create Tags** — new task option in the VLM dropdown (both SPA AI TOOL tab and Library A tab): generates a comma-separated list of descriptive English tags from the image
|
||||
|
||||
### v0.3.14
|
||||
|
||||
- **AI TOOL tab redesign** — tab renamed from "A" to "AI TOOL"; sub-tab navigation removed in favor of a permanent 3-pane layout (Translation 40% | TOOLS 40% | Settings 20%) — all panes always visible simultaneously; "VLM" pane renamed to "TOOLS"
|
||||
- **Settings — RAW JSON Colors** — new accordion section with 6 color pickers to customize the syntax highlight colors for the Raw JSON editor in Generate UI: Default Text, Name/Scheduler, Title, Width/Height, Prompt/Text, Image/File; changes apply immediately on color pick; Reset Defaults restores the original scheme; saved to `localStorage` under `wfm_settings.jsonColors` and applied on startup
|
||||
- **Help tab updated** — AI TOOL tab card rewritten; Settings card updated with RAW JSON Colors entry; Library panel sidepanel-16 entry updated
|
||||
|
||||
### v0.3.13
|
||||
|
||||
- **AI Tab (A)** — new tab added to both the SPA and the Workflow Studio Library side panel (rightmost tab)
|
||||
- **Translation sub-tab** — translate text via Ollama or LM Studio between Japanese, English, Chinese, or a custom Free language; ⇄ swap button exchanges both language selectors and text content simultaneously; language selections persisted automatically
|
||||
- **VLM sub-tab** — drop zone (110px, matching the I tab) accepts images via drag & drop or click; task selector (Describe Image / Create Prompt); Run button streams result into output area with Copy button; Ollama uses `images:[base64]` payload, LM Studio uses `image_url` content block
|
||||
@@ -653,15 +844,18 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **Help Tab updated** — added AI Tab (A) feature card and Library panel A tab entry; i18n support in EN/JA/ZH
|
||||
|
||||
### v0.3.12
|
||||
|
||||
- **GenerateUI — Raw JSON search** — always-visible search bar above the Raw JSON editor; finds all matches as you type with match count (`3/12`); navigate forward/back with ↑/↓ buttons, Enter / Shift+Enter, or Escape / ✕ to clear; current match highlighted in orange, other matches in yellow; search overlay syncs with editor scroll and stays updated while editing
|
||||
- **Workflow analyzer — extended model type detection** — added CLIPLoader `type` field mapping to model family (`flux`, `hidream_i`, `wan`, `cosmos`, `lumina`, `ovis`, etc.) via `_CLIP_TYPE_TO_MODEL`; subgraph nodes (`definitions.subgraphs`) now scanned for model detection; `UnetLoaderGGUF` and similar loaders matched via `"UnetLoader" in ntype`; new families added: NewBie, Ovis, HiDream, Wan, Cosmos, Lumina; model-name detection refactored into reusable `_detect_model_type_from_name()`
|
||||
- **Screenshots refreshed** — replaced tab-by-tab screenshots with 8 feature-focused images
|
||||
|
||||
### v0.3.11
|
||||
|
||||
- **Metadata Tab — extended loader support** — `metadata-tab.js` now recognizes `UnetLoaderGGUF` and `UNETLoaderGGUF` as Diffusion Model (e.g. HiDream GGUF workflows), and `QuadrupleCLIPLoader` as Text Encoder (e.g. HiDream 4-CLIP); previously these were detected only in the side panel I tab, not in the Metadata tab itself
|
||||
- **Settings Tab — Text Size** — new slider (10–28 px) in the Settings tab adjusts font size for all prompt and chat text areas at once: Generate UI positive/negative prompts, AI Assistant chat input, Preset prompts, Wildcard text area and file editor, and Metadata prompt full preview; applied immediately on drag and persisted with Save Settings
|
||||
|
||||
### v0.3.10
|
||||
|
||||
- **Information tab — drag to canvas** — model, lora, and Prompts sub-tabs in the side panel I tab now support drag & drop onto the ComfyUI canvas; double-click also places nodes at canvas center
|
||||
- model sub-tab: each item places the corresponding loader node (Checkpoint → `CheckpointLoaderSimple`, VAE → `VAELoader`, Diffusion Model → `UNETLoader`, Text Encoder → `CLIPLoader`)
|
||||
- lora sub-tab: drag individual LoRA to place `LoraLoader`; **Multiple LORA** section (shown for 1+ LoRAs) places all LoRAs in a single `Lora Loader (LoraManager)` node
|
||||
@@ -671,44 +865,52 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **Preview area fixed height** — Information tab drop zone fixed at 110px so model/prompt lists are no longer compressed when a large image is loaded
|
||||
|
||||
### v0.3.9
|
||||
|
||||
- **Side panel I tab** — new Information tab in the Workflow Studio Library side panel; drop a ComfyUI PNG/WebP/JSON directly in the panel to inspect models, LoRAs, and prompts without opening the Metadata tab; sub-tabs: model / lora / Prompts with full-text preview and Copy button
|
||||
- **Side panel tab redesign** — tabs shortened to single letters (W / N / P / M / I) with full name shown on hover
|
||||
- **Bug fix: top bar icons** — icons (Workflow Studio / camera / Node Sets) were invisible in newer ComfyUI versions because Iconify converted the MDI CSS class to an inline SVG before the custom SVG could be injected; fixed by removing the early-return guard and adopting the same simple `requestAnimationFrame` retry pattern used by lora-manager
|
||||
|
||||
### v0.3.8
|
||||
|
||||
- **Metadata Tab: extended subgraph support** — added extraction for Flux.2 Dev fp8 (`SamplerCustomAdvanced`), Flux.2 Klein 4B Distilled (image edit), Ernie Image, Qwen-Image-Edit 2511 (`TextEncodeQwenImageEditPlus`), and WAN2.2 14B Animate (top-level CLIPTextEncode + subgraph KSampler)
|
||||
- **Prompt type: Text (no badge)** — when positive/negative polarity cannot be determined (indirect sampler connections, cross-level links, `PrimitiveStringMultiline` etc.), prompts are listed without a POS/NEG badge; action buttons still work normally
|
||||
- **Prompt extraction improvements** — `extractPromptsFromNodeSet` now resolves link sources from any STRING-output node (e.g. `ComfySwitchNode`, `PrimitiveStringMultiline`) without type restriction; `PrimitiveStringMultiline` search and final text-encoder fallback both extended to include subgraph nodes via `collectAllNodes`
|
||||
- **i18n** — added `metaPromptText` key (EN: "Text" / JA: "テキスト" / ZH: "文本")
|
||||
|
||||
### v0.3.7
|
||||
|
||||
- **Metadata Tab: subgraph workflow support** — Flux.2 (Dev fp8 / Klein), Qwen-Image-Edit (/ 2511 / Layered), and Z-Image (Base / Turbo) official templates now correctly extract models and prompts; these use ComfyUI's `definitions.subgraphs` format with `UNETLoader`, `CLIPLoader`, and `VAELoader` inside the subgraph
|
||||
- **Prompt extraction improvements** — 7-stage fallback chain: ImageMetadataPromptLoader → WFS_PromptText → top-level CLIPTextEncode+KSampler → `PrimitiveStringMultiline` (flux2-klein) → subgraph CLIPTextEncode+KSampler → PromptStyler → all CLIPTextEncode text
|
||||
- **MarkdownNote model fallback** — `extractMarkdownNoteModels()` parses `**section** → - [model](url)` patterns from MarkdownNote nodes as a supplemental model source
|
||||
- **Format note updated** — "Flux.2 / Qwen-Image / Z-Image subgraph workflows supported" (EN/JA/ZH)
|
||||
|
||||
### v0.3.6
|
||||
|
||||
- **Metadata Tab** — new tab (between Prompt and Gallery) that extracts model and prompt information from ComfyUI-generated PNG/WebP images and workflow JSON files; 3-column layout: drop zone with image preview (left), Checkpoint/VAE/Diffusion Model/Text Encoder lists (center), LoRA list with strength values + Prompt list with full-text viewer (right)
|
||||
- **Prompt action buttons** — Copy, GenUI:P/N (set GenerateUI prompts), Prompt:P/N (set Prompt tab preset prompts) directly from the extracted prompt text
|
||||
- **SDXL Prompt Styler support** — improved prompt extraction resolves `PromptStyler → CLIPTextEncode` link chains in both LiteGraph and API workflow formats
|
||||
- **Format support** — ComfyUI (PNG/WebP/JSON), SD WebUI, SD Forge, Fooocus
|
||||
|
||||
### v0.3.5
|
||||
|
||||
- **Feeder subtab** — new subtab in GenerateUI for controlling [comfyui-image-feeder](https://github.com/ketle-man/comfyui-image-feeder) nodes; left pane: node selector + all ImageFeeder parameters + presets + Run/Stop controls; center pane: folder tree, image grid with checkbox selection, and preview panel
|
||||
- **Run loop with After gen modes** — Loop (wrap and continue), Increment (advance and auto-stop), Fixed (constant index); index updates automatically via WebSocket `image_loop_node_sync` after each generation; seed comes from the right-pane seed setting
|
||||
- **Workflow analysis improvements** — `analyzeWorkflow` now handles multi-hop CONDITIONING chains via BFS (up to 5 iterations), CLIPTextEncodeSDXL / CLIPTextEncodeSDXLRefiner, SDXLPromptStyler / SDXLPromptStylerAdvanced, KSamplerAdvanced (`noise_seed`), TextEncodeQwenImageEditPlus, PrimitiveStringMultiline, Power Lora Loader (rgthree), and `Checkpoint Loader` (WAS) with space in the class name
|
||||
|
||||
### v0.3.4
|
||||
|
||||
- **Wildcard support panel** — new right column in the Prompt tab with a one-click toolbar for inserting wildcard syntax (`{|}`, `{n$|}`, `__|__`, `:`, `;`, `$`, `<lora::1:LBW=;>`, `[]`, single/multi pick) and wrapping selected text; dedicated prompt textarea and wildcard file picker (click to insert `__filename__`)
|
||||
- **Wildcard file manager** — create, view, edit, and delete `.txt` / `.yaml` wildcard files stored in `user/default/Workflow-Studio/wildcard/`; editor opens inline with filename input and save/cancel controls
|
||||
- **Preset/Preset Manager tab switch** — the center pane of the Prompt tab is now a two-tab panel (Presets / Preset Manager) to reclaim horizontal space for the new wildcard panel
|
||||
- **Wildcard Integration setting** — new accordion section in Settings tab; auto-detects ComfyUI-Impact-Pack; when installed, provides a button to create a directory junction (Windows) or symlink (other OS) from the WFS wildcard directory to Impact Pack's `wildcards/` directory; existing WFS files are migrated automatically; a Remove Link button reverses the operation
|
||||
|
||||
### v0.3.2
|
||||
|
||||
- **Checkpoint Batch** — new panel in the GenerateUI right column (below Seed, above results); enable via checkbox to auto-generate once per checkpoint model; filter included/excluded subfolders by comma-separated names (empty = all checkpoints); real-time preview of matched model count; amber progress bar shows current model name and index; Stop button aborts the loop after the current generation completes; failed models are counted and reported in the summary toast
|
||||
- **Seed layout fix** — seed value input and mode selector (Random / Fixed / Increment / Decrement) now stacked vertically so neither is clipped in narrow panels
|
||||
|
||||
### v0.3.1
|
||||
|
||||
- **Folder operations** — create subfolders and delete folders (with all contents) directly from the folder tree header buttons
|
||||
- **File operations** — move or delete individual images from the detail panel; bulk move and bulk delete from the multi-select bar
|
||||
- **Tree state preserved** — folder expansion state is maintained after create/delete/move/refresh operations
|
||||
@@ -716,10 +918,12 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **Workflow auto-save** — after each generation in the Generate UI tab, the current workflow is automatically saved to gallery metadata for the generated images; shown in the Metadata tab even if PNG embedding is absent
|
||||
|
||||
### v0.3.0
|
||||
|
||||
- **Cross-type group filter** — the group filter dropdown in the Models tab now shows groups from all model types simultaneously, each prefixed with a type label (`[Checkpoint]`, `[LoRA]`, etc.); selecting a group automatically switches to the corresponding model type
|
||||
- **Sidebar group display fixed** — the ComfyUI sidebar "Model Groups" view now correctly renders per-type groups (introduced in v0.2.9) with a type label on each group header; fixes a crash where `.filter is not a function` was thrown on the new nested group structure
|
||||
|
||||
### v0.2.9
|
||||
|
||||
- **Model Enable/Disable** — hide models from ComfyUI by renaming the file extension to `.disabled`; toggle per model (⏸ button on each card/row), per group (Enable All / Disable All buttons in the Group panel), or filter the grid by status (All / Enabled only / Disabled only). Changes take effect after ComfyUI refresh.
|
||||
- **Per-type model groups** — groups are now scoped to each model type; checkpoint groups only appear in the Checkpoint tab, LoRA groups only in the LoRA tab, etc. Existing flat groups are automatically migrated.
|
||||
- **Multi-select mode** — click the Select button in the toolbar to enter selection mode; check individual models across Thumbnail / Card / Table views
|
||||
@@ -729,10 +933,12 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **Bug fix** — Hypernetwork tab showed `C`, `O`, `M`, `B` as fake model items; caused by the new ComfyUI API format returning `"COMBO"` as the first element; fixed in `comfyui-client.js`
|
||||
|
||||
### v0.2.8
|
||||
|
||||
- **Data storage moved** — plugin data (settings, metadata, prompts, etc.) is now stored in `ComfyUI/user/default/Workflow-Studio/` instead of `custom_nodes/ComfyUI-Workflow-Studio/data/`; falls back to the old `data/` directory if `user/default/` does not exist
|
||||
- **Data Management section** — new Settings tab section to export all plugin data to a single JSON file and import it back; useful for migration, backup, and reinstallation
|
||||
|
||||
### v0.2.7
|
||||
|
||||
- **Gallery tab** — new image browser for ComfyUI output folder; Thumbnail/Table views, multi-select with Bulk Bar, server-side group/tag/favorite filtering, group management (rename support), performance-optimized with + mtime folder cache
|
||||
- **Group UI unified** — Workflow, Nodes, and Gallery group panels rebuilt to match the Models tab 4-section pattern (Current Groups / Add to Group / Create New Group / Manage Groups); Rename support added to Workflow and Nodes tabs
|
||||
- **Settings 2-column layout** — Theme panel fixed on the right (50% width, sticky); all other settings flow continuously on the left with no visual gap
|
||||
@@ -740,18 +946,21 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **Help tab** — Gallery tab description card added
|
||||
|
||||
### v0.2.5
|
||||
|
||||
- **Sidebar Category/Package sub-tabs** — added 📂 Category and 🧩 Package sub-tabs to the Nodes tab in Workflow Studio Library; each shows a dropdown to filter nodes by category or custom node package (reads `/object_info` for accurate package detection)
|
||||
- **Sidebar theme settings** — added ⚙ button in the panel header to customize background, sub-header background, text, border, and secondary text colors with live preview; settings saved to localStorage
|
||||
- **Sidebar TextEncoder (By Type)** — fixed TextEncoder not appearing in Models → By Type; now uses `DualCLIPLoader` → `CLIPLoader` fallback to retrieve `clip_name1` list
|
||||
- **Hide `.index.json`** — excluded `.index.json` from both the Workflow tab and the Workflow Studio Library side panel
|
||||
|
||||
### v0.2.4
|
||||
|
||||
- **GenerateUI tab redesign** — reorganized from 5 tabs (Prompt/Image/Model/Settings/Raw JSON) to 3 tabs (Input/Model/Settings); each tab shows a Raw JSON column (540px) for instant JSON preview and direct editing from any tab
|
||||
- **Input tab** — Prompt and Image stacked vertically in the left column
|
||||
- **Settings tab** — KSampler and LatentImage stacked vertically in the left column
|
||||
- **Raw JSON tab removed** — Raw JSON is now always visible as a right-column panel within each tab
|
||||
|
||||
### v0.2.3
|
||||
|
||||
- **Badge system unified** — Workflow and Models tabs now share a single badge palette (`⚙ Badge` button); workflow auto-analysis model type system removed in favor of user-defined free-label badges
|
||||
- **GenUI Model button** — apply any model from the Models tab directly to the corresponding node in GenerateUI's current workflow (available in detail modal and side panel; Checkpoint / LoRA / VAE / ControlNet / UNET / TextEncoder)
|
||||
- **Sidebar Models tab** — added All / ★ Favorites / Groups / By Type sub-tabs to the Models section of Workflow Studio Library
|
||||
@@ -759,6 +968,7 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **Sidebar panel width** — widened from 280px to 310px
|
||||
|
||||
### v0.2.2
|
||||
|
||||
- **Models tab** — browse, search, and manage all installed ComfyUI models (Checkpoint, LoRA, VAE, ControlNet, UNET, TextEncoder) with Thumbnail/Card/Table views
|
||||
- **CivitAI integration** — fetch model metadata by SHA256 hash (individual or batch per model type) with SSE progress streaming
|
||||
- **Model groups** — create, rename, delete groups and assign/remove models for organization
|
||||
@@ -771,6 +981,7 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **Help tab updated** — Models Tab section added to feature list
|
||||
|
||||
### v0.2.0
|
||||
|
||||
- **Prompt presets in sidebar** — added Prompts tab to Workflow Studio Library (ComfyUI side panel) with All / Favorites / Categories sub-tabs
|
||||
- **WFS_PromptText custom node** — drag prompt presets onto the canvas to create nodes with positive/negative prompt outputs
|
||||
- **Preset Manager** — 3-column layout in Prompt tab: AI Assistant | Presets editor | Preset Manager (All / Favorites / Groups)
|
||||
@@ -782,47 +993,56 @@ Click the **camera icon** (next to the W button) in ComfyUI's top bar to capture
|
||||
- **Help tab updated** — Prompt Tab and Workflow Studio Library sections reflect new features
|
||||
|
||||
### v0.1.9
|
||||
|
||||
- **Side panel 2-row sub-tabs** — Workflows: row 1 (Workflows / Favorites / Groups), row 2 (Model Type); Nodes: row 1 (Nodes / Favorites / Groups), row 2 (Sets)
|
||||
- **Save dialog** — canvas snapshot now shows a filename edit dialog instead of auto-naming
|
||||
- **API/App format badge** — workflow items in side panel show red (API) or orange (APP) badge
|
||||
- **Group auto-cleanup** — deleted workflows are automatically removed from groups on refresh
|
||||
|
||||
### v0.1.8
|
||||
|
||||
- **WF & Node Library side panel** — renamed from "Node Library", added two top-level tabs (Workflows / Nodes) accessible from ComfyUI top bar
|
||||
- **Workflows tab** — browse favorite workflows, filter by model type, filter by group with collapsible sections
|
||||
- **Workflow drag & drop** — drag workflows from the side panel onto the canvas to load them instantly
|
||||
- **Help tab update** — added Nodes Tab and WF & Node Library sections to the feature list
|
||||
|
||||
### v0.1.7
|
||||
|
||||
- **Nodes tab** — browse, search, and filter all installed ComfyUI nodes with Card/Table views, pagination (50 nodes/page), package color badges, and node detail side panel with I/O specs
|
||||
- **Node Sets** — save selected nodes + connections from ComfyUI canvas as reusable sets via right-click context menu
|
||||
- **Node Library side panel** — accessible from ComfyUI top bar with Favorites, Sets, and Groups tabs, drag & drop placement
|
||||
- **3 top bar buttons** — Workflow Studio, Canvas Snapshot, and Node Library buttons in ComfyUI's action bar
|
||||
|
||||
### v0.1.6
|
||||
|
||||
- **Security fix** — path traversal vulnerability in `workflow_service.py` (reported via ComfyUI-Manager PR review)
|
||||
|
||||
### v0.1.5
|
||||
|
||||
- **Theme system** — 13 built-in themes selectable from Settings tab with instant preview (Deep Ocean Dark, Pop & Vibrant, Light Minimalist, Cyberpunk, Glassmorphism, Neumorphism, Retro 8-bit, Pastel Dream, Brutalism, Earthy, Material UI, Monotone + Accent, Corporate Trust)
|
||||
- Theme preference persisted in localStorage and restored on page load (no flash)
|
||||
- Special CSS effects per theme: neon glow (Cyberpunk), backdrop blur (Glassmorphism), dual shadow (Neumorphism), pixel borders (Retro/Brutalism)
|
||||
|
||||
### v0.1.4
|
||||
|
||||
- **App format support** — detect `.app.json` workflows (ComfyUI App mode), show "App Format" badge, block loading in GenerateUI with guidance message
|
||||
- **Preset clipboard copy** — added PP Copy / NP Copy buttons to copy positive/negative prompts to clipboard
|
||||
- **Analysis bugfix** — fixed workflow analysis crash when `widgets_values` contains non-string values (e.g. integers)
|
||||
|
||||
### v0.1.3
|
||||
|
||||
- Added **Help & Support tab** — feature list, tips, and support links (GitHub, Ko-fi)
|
||||
- Multi-language support (EN/JA/ZH) for all help content
|
||||
|
||||
### v0.1.2
|
||||
|
||||
- Added **Canvas Snapshot** button to ComfyUI top bar — capture workflow canvas as PNG thumbnail with embedded workflow metadata
|
||||
- Added **Thumbnail tab** to the workflow side panel for quick visual preview
|
||||
- Added **Thumbnail section** to the workflow detail modal
|
||||
- Snapshot images are auto-imported as workflows with thumbnails
|
||||
|
||||
### v0.1.1
|
||||
|
||||
- Initial feature set: Workflow management, GenerateUI, Prompt assistant, Settings
|
||||
|
||||
---
|
||||
@@ -905,3 +1125,4 @@ MIT License
|
||||
- [ComfyUI-Gallery](https://github.com/PanicTitan/ComfyUI-Gallery) by PanicTitan — thumbnail grid UX reference
|
||||
- [infinite-image-browsing](https://github.com/zanllp/sd-webui-infinite-image-browsing) by zanllp — thumbnail caching and index strategy reference
|
||||
- [Fooocus](https://github.com/lllyasviel/Fooocus) by lllyasviel — style preset JSON format reference
|
||||
|
||||
|
||||
+103
-2
@@ -3,6 +3,7 @@
|
||||
import asyncio
|
||||
import json
|
||||
import logging
|
||||
import os
|
||||
import urllib.request
|
||||
import urllib.error
|
||||
|
||||
@@ -17,6 +18,84 @@ def setup_routes(app: web.Application):
|
||||
app.router.add_post("/api/wfm/eagle/test", handle_test)
|
||||
|
||||
|
||||
def _resolve_local_path(filename, subfolder, type_name):
|
||||
"""filename/subfolder/type を ComfyUI 出力ディレクトリ上の実パスに解決する。
|
||||
ComfyUI と Eagle が同一マシン上で動作している場合のみ有効なパスが返る
|
||||
(別マシンの場合は None を返し、呼び出し側は addFromURL にフォールバックする)。"""
|
||||
try:
|
||||
import folder_paths # type: ignore
|
||||
except Exception:
|
||||
return None
|
||||
|
||||
base_dir = folder_paths.get_directory_by_type(type_name or "output")
|
||||
if not base_dir:
|
||||
return None
|
||||
base_dir = os.path.abspath(base_dir)
|
||||
|
||||
filename = os.path.basename(filename or "")
|
||||
if not filename:
|
||||
return None
|
||||
|
||||
full_dir = os.path.abspath(os.path.join(base_dir, subfolder or ""))
|
||||
# Windowsはパス比較で大文字小文字を区別しないため normcase で正規化してから比較する
|
||||
if os.path.commonpath((os.path.normcase(full_dir), os.path.normcase(base_dir))) != os.path.normcase(base_dir):
|
||||
# ディレクトリトラバーサル対策: base_dir 配下以外は拒否
|
||||
return None
|
||||
|
||||
full_path = os.path.join(full_dir, filename)
|
||||
if not os.path.isfile(full_path):
|
||||
return None
|
||||
return full_path
|
||||
|
||||
|
||||
def _resolve_absolute_svg_path(abs_path):
|
||||
"""comfyui-tosvg の Save SVG String ノードなどが返す絶対パスを検証する。
|
||||
ComfyUI管理下(output/input/temp)ディレクトリ配下の実在する .svg ファイルのみ許可する
|
||||
(任意の絶対パスをそのまま信頼すると、外部からこのAPIを叩かれた際に
|
||||
ローカルの任意ファイルを送信させられてしまうため)。"""
|
||||
if not abs_path or not abs_path.lower().endswith(".svg"):
|
||||
return None
|
||||
try:
|
||||
import folder_paths # type: ignore
|
||||
except Exception:
|
||||
return None
|
||||
|
||||
abs_path = os.path.abspath(abs_path)
|
||||
if not os.path.isfile(abs_path):
|
||||
return None
|
||||
|
||||
for type_name in ("output", "temp", "input"):
|
||||
base_dir = folder_paths.get_directory_by_type(type_name)
|
||||
if not base_dir:
|
||||
continue
|
||||
base_dir = os.path.abspath(base_dir)
|
||||
try:
|
||||
# Windowsはパス比較で大文字小文字を区別しないため normcase で正規化してから比較する
|
||||
if os.path.commonpath((os.path.normcase(abs_path), os.path.normcase(base_dir))) == os.path.normcase(base_dir):
|
||||
return abs_path
|
||||
except ValueError:
|
||||
# Windowsで異なるドライブレターの場合 commonpath が例外を投げる
|
||||
continue
|
||||
return None
|
||||
|
||||
|
||||
def _eagle_add_from_path(eagle_url, file_path, name, tags):
|
||||
"""Proxy request to Eagle's addFromPath API (runs in thread).
|
||||
SVG は ComfyUI の /view がセキュリティ上 application/octet-stream +
|
||||
attachment で返すため、addFromURL 経由だと正しい種別で保存されないことがある。
|
||||
ComfyUI と Eagle が同一マシン上にある場合はローカルパスを直接渡す方が確実。"""
|
||||
eagle_url = eagle_url.rstrip("/")
|
||||
payload = json.dumps({"path": file_path, "name": name, "tags": tags}).encode("utf-8")
|
||||
req = urllib.request.Request(
|
||||
f"{eagle_url}/api/item/addFromPath",
|
||||
data=payload,
|
||||
headers={"Content-Type": "application/json"},
|
||||
method="POST",
|
||||
)
|
||||
with urllib.request.urlopen(req, timeout=10) as resp:
|
||||
return json.loads(resp.read().decode("utf-8"))
|
||||
|
||||
|
||||
def _eagle_add(eagle_url, image_url, name, tags):
|
||||
"""Proxy request to Eagle API (runs in thread)."""
|
||||
eagle_url = eagle_url.rstrip("/")
|
||||
@@ -71,11 +150,33 @@ async def handle_add(request: web.Request) -> web.Response:
|
||||
image_url = body.get("url", "")
|
||||
name = body.get("name", "image.png")
|
||||
tags = body.get("tags", [])
|
||||
filename = body.get("filename", "")
|
||||
subfolder = body.get("subfolder", "")
|
||||
file_type = body.get("type", "output")
|
||||
local_path_hint = body.get("localPath", "")
|
||||
|
||||
if not image_url:
|
||||
if not image_url and not local_path_hint:
|
||||
return web.json_response({"status": "error", "message": "No URL provided"}, status=400)
|
||||
|
||||
result = await asyncio.to_thread(_eagle_add, eagle_url, image_url, name, tags)
|
||||
# SVG は /view が application/octet-stream + attachment で返すため、
|
||||
# ローカルファイルが解決できる場合は addFromPath で直接渡す
|
||||
local_path = None
|
||||
if local_path_hint:
|
||||
# comfyui-tosvg の Save SVG String ノードなど、絶対パスが既知の場合
|
||||
local_path = _resolve_absolute_svg_path(local_path_hint)
|
||||
elif (filename or name or "").lower().endswith(".svg"):
|
||||
local_path = _resolve_local_path(filename or name, subfolder, file_type)
|
||||
|
||||
if not local_path and not image_url:
|
||||
return web.json_response(
|
||||
{"status": "error", "message": f"Could not resolve local SVG path: {local_path_hint}"},
|
||||
status=400,
|
||||
)
|
||||
|
||||
if local_path:
|
||||
result = await asyncio.to_thread(_eagle_add_from_path, eagle_url, local_path, name, tags)
|
||||
else:
|
||||
result = await asyncio.to_thread(_eagle_add, eagle_url, image_url, name, tags)
|
||||
return web.json_response(result)
|
||||
except urllib.error.URLError as e:
|
||||
logger.error("Eagle URL error: %s", e)
|
||||
|
||||
@@ -260,8 +260,18 @@ async def toggle_favorite(request: web.Request) -> web.Response:
|
||||
return web.json_response({"error": str(e)}, status=500)
|
||||
|
||||
|
||||
_SAVE_EXT_BY_MIME = {
|
||||
"image/png": ".png",
|
||||
"image/jpeg": ".jpg",
|
||||
"image/webp": ".webp",
|
||||
"image/gif": ".gif",
|
||||
"image/svg+xml": ".svg",
|
||||
}
|
||||
|
||||
|
||||
async def save_image_to_gallery(request: web.Request) -> web.Response:
|
||||
"""Image Edit Tab からの PNG をギャラリーのルートフォルダに保存する。"""
|
||||
"""Image Edit Tab / AI Chat からの画像(PNG等)やSVGをギャラリーのルートフォルダに保存する。
|
||||
imageData は data URL (data:<mime>;base64,<data>) を想定。ヘッダがなければPNG扱い（旧互換）。"""
|
||||
try:
|
||||
body = await request.json()
|
||||
filename = body.get("filename", "").strip()
|
||||
@@ -273,15 +283,21 @@ async def save_image_to_gallery(request: web.Request) -> web.Response:
|
||||
if _service._allowed_root is None:
|
||||
return web.json_response({"error": "Gallery root not configured. Open Gallery tab and set output folder first."}, status=500)
|
||||
|
||||
# data URL から MIME タイプを判定し、拡張子を決定する
|
||||
raw = image_data
|
||||
mime = "image/png"
|
||||
if raw.startswith("data:"):
|
||||
header, _, raw = raw.partition(",")
|
||||
m = re.match(r"data:([^;]+)", header)
|
||||
if m:
|
||||
mime = m.group(1)
|
||||
ext = _SAVE_EXT_BY_MIME.get(mime, ".png")
|
||||
|
||||
# ファイル名サニタイズ（OSで使えない文字を除去）
|
||||
safe = re.sub(r'[<>:"/\\|?*\x00-\x1f]', "_", filename)
|
||||
if not safe.lower().endswith(".png"):
|
||||
safe += ".png"
|
||||
if not safe.lower().endswith(ext):
|
||||
safe += ext
|
||||
|
||||
# base64 data URL をデコード
|
||||
raw = image_data
|
||||
if "," in raw:
|
||||
raw = raw.split(",", 1)[1]
|
||||
image_bytes = base64.b64decode(raw)
|
||||
|
||||
save_path = _service._allowed_root / safe
|
||||
|
||||
@@ -82,7 +82,8 @@ async def handle_chat(request: web.Request) -> web.Response:
|
||||
try:
|
||||
body = await request.json()
|
||||
cfg = _get_ollama_config()
|
||||
model = body.get("model", cfg["model"])
|
||||
model = body.get("model") or cfg["model"]
|
||||
base_url = (body.get("url") or cfg["url"]).rstrip("/")
|
||||
messages = body.get("messages", [])
|
||||
|
||||
def _chat():
|
||||
@@ -92,7 +93,7 @@ async def handle_chat(request: web.Request) -> web.Response:
|
||||
"stream": False,
|
||||
}).encode("utf-8")
|
||||
|
||||
url = f"{cfg['url']}/api/chat"
|
||||
url = f"{base_url}/api/chat"
|
||||
req = urllib.request.Request(
|
||||
url,
|
||||
data=payload,
|
||||
|
||||
@@ -16,7 +16,7 @@ from typing import Any
|
||||
logger = logging.getLogger(__name__)
|
||||
|
||||
# サポートする画像拡張子
|
||||
IMAGE_EXTENSIONS = {".png", ".jpg", ".jpeg", ".webp", ".gif"}
|
||||
IMAGE_EXTENSIONS = {".png", ".jpg", ".jpeg", ".webp", ".gif", ".svg"}
|
||||
|
||||
# メタデータ保存ファイル (gallery専用)
|
||||
from .gallery_metadata import GalleryMetadataStore
|
||||
@@ -684,6 +684,11 @@ class GalleryService:
|
||||
if p.suffix.lower() == ".gif":
|
||||
return p
|
||||
|
||||
# SVG はベクター画像でPillowが開けないため、元ファイルをそのまま返す
|
||||
# (<img>タグはブラウザ側で任意サイズにスケーリングして表示する)
|
||||
if p.suffix.lower() == ".svg":
|
||||
return p
|
||||
|
||||
try:
|
||||
mtime = int(p.stat().st_mtime * 1000)
|
||||
except OSError:
|
||||
|
||||
@@ -3,6 +3,17 @@
|
||||
import os
|
||||
import re
|
||||
|
||||
# プロンプトを直接持つノードタイプ（CLIPTextEncode以外の複合ノード含む）
|
||||
_PROMPT_NODE_TYPES = {
|
||||
"CLIPTextEncode", "CLIPTextEncodeSDXL", "CLIPTextEncodeSDXLRefiner",
|
||||
"CLIPTextEncodeEditPlus", "TextEncodeQwenImageEditPlus", "TextEncodeMageFlowEdit",
|
||||
"SDXLPromptStyler", "SDXLPromptStylerAdvanced", "ImageMetadataPromptLoader",
|
||||
"WFS_PromptText", "ImpactWildcardEncode", "ImpactWildcardProcessor",
|
||||
}
|
||||
|
||||
# 画像を最終出力として保存するノードタイプ
|
||||
_OUTPUT_IMAGE_NODE_TYPES = {"SaveImage", "SaveImageAdvanced"}
|
||||
|
||||
# CLIPLoader / DualCLIPLoader の type フィールド → モデル種別マッピング
|
||||
_CLIP_TYPE_TO_MODEL = {
|
||||
"flux": "Flux",
|
||||
@@ -181,25 +192,27 @@ def analyze_workflow(workflow_data, filename=""):
|
||||
if "hidream" in title:
|
||||
model_types.add("HiDream")
|
||||
|
||||
if ntype == "CLIPTextEncode" or "prompt" in title:
|
||||
if ntype in _PROMPT_NODE_TYPES or "prompt" in title:
|
||||
inputs["prompts"] += 1
|
||||
if ntype in ("LoadImage", "LoadImageMask"):
|
||||
inputs["images"] += 1
|
||||
if ntype == "LoadVideo" or "load video" in title:
|
||||
inputs["videos"] += 1
|
||||
if ntype == "SaveImage":
|
||||
if ntype in _OUTPUT_IMAGE_NODE_TYPES:
|
||||
outputs["images"] += 1
|
||||
if ntype in ("SaveVideo", "VH_VideoCombine"):
|
||||
outputs["videos"] += 1
|
||||
|
||||
# Detect workflow format
|
||||
if raw_nodes is not None:
|
||||
# App format: UI-based structure with definitions (subgraphs) or linearMode
|
||||
# App format: simplified web-app-style UI (linearMode) or .app.json filename.
|
||||
# A workflow that merely *contains* subgraphs (definitions.subgraphs) is still a
|
||||
# normal node graph (comfyui-workflow.js's convertUiToApi flattens subgraphs before
|
||||
# conversion), so it's treated as "ui" here too — must match detectFormat() in
|
||||
# static/js/comfyui-workflow.js or the App/UI badge shown to the user disagrees
|
||||
# with what GenerateUI actually does with the file.
|
||||
extra = workflow_data.get("extra", {})
|
||||
if (
|
||||
"definitions" in workflow_data
|
||||
or extra.get("linearMode") is True
|
||||
):
|
||||
if extra.get("linearMode") is True:
|
||||
wf_format = "app"
|
||||
elif filename and filename.lower().endswith(".app.json"):
|
||||
wf_format = "app"
|
||||
|
||||
+1
-1
@@ -1,7 +1,7 @@
|
||||
[project]
|
||||
name = "comfyui-workflow-studio"
|
||||
description = "A comprehensive workflow, asset management, and generation UI plugin for ComfyUI. Manage workflows, models, images, and prompts; batch generation and Image Feeder in the GenerateUI tab; library side panel with canvas drag & drop and AI tools."
|
||||
version = "0.3.63"
|
||||
version = "0.3.78"
|
||||
license = "MIT"
|
||||
requires-python = ">= 3.10"
|
||||
dependencies = ["jinja2"]
|
||||
|
||||
@@ -381,7 +381,7 @@
|
||||
padding: 0;
|
||||
line-height: 1;
|
||||
color: var(--wfm-text);
|
||||
opacity: 0.5;
|
||||
opacity: 0.85;
|
||||
flex-shrink: 0;
|
||||
transition: opacity 0.1s;
|
||||
}
|
||||
|
||||
@@ -511,6 +511,18 @@ body {
|
||||
transition: border-color 0.2s ease;
|
||||
}
|
||||
|
||||
.wfm-select-missing {
|
||||
border-color: var(--wfm-warning);
|
||||
color: var(--wfm-warning);
|
||||
}
|
||||
|
||||
.wfm-model-missing-hint {
|
||||
font-size: 11px;
|
||||
color: var(--wfm-warning);
|
||||
margin-top: 2px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.wfm-input:focus,
|
||||
.wfm-textarea:focus,
|
||||
.wfm-select:focus {
|
||||
@@ -1044,6 +1056,17 @@ body {
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
/* Bypass/Mute node indicator (shown above the Raw JSON search bar when present) */
|
||||
.wfm-gen-rawjson-bypass-note {
|
||||
padding: 6px 10px;
|
||||
background: rgba(255, 165, 2, 0.12);
|
||||
border-bottom: 1px solid var(--wfm-border);
|
||||
color: var(--wfm-warning);
|
||||
font-size: 11px;
|
||||
line-height: 1.5;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* RAW JSON search bar */
|
||||
.wfm-rawjson-search {
|
||||
display: flex;
|
||||
@@ -2938,6 +2961,41 @@ body {
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
.wfm-i2i-mask-section {
|
||||
margin-top: 8px;
|
||||
padding-top: 8px;
|
||||
border-top: 1px dashed var(--wfm-border);
|
||||
}
|
||||
|
||||
.wfm-i2i-mask-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 6px;
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
color: var(--wfm-text-secondary);
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.wfm-i2i-mask-filename {
|
||||
font-size: 10px;
|
||||
font-weight: 400;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
max-width: 120px;
|
||||
}
|
||||
|
||||
.wfm-i2i-mask-preview-wrap .wfm-i2i-preview-img {
|
||||
max-height: 70px;
|
||||
background: #000;
|
||||
}
|
||||
|
||||
.wfm-i2i-mask-drop-zone {
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
/* ============================================
|
||||
Side Panel - Thumbnail Tab
|
||||
============================================ */
|
||||
@@ -5207,6 +5265,9 @@ body {
|
||||
.wfm-ai-pane-settings { flex: 2; }
|
||||
|
||||
.wfm-ai-pane-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
color: var(--wfm-text-secondary);
|
||||
@@ -5218,6 +5279,19 @@ body {
|
||||
background: var(--wfm-surface);
|
||||
}
|
||||
|
||||
.wfm-ai-chat-toggle-label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
margin-left: auto;
|
||||
font-size: 11px;
|
||||
font-weight: 400;
|
||||
color: var(--wfm-text-secondary);
|
||||
text-transform: none;
|
||||
letter-spacing: normal;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.wfm-ai-pane-divider {
|
||||
width: 1px;
|
||||
background: var(--wfm-border);
|
||||
@@ -5435,6 +5509,29 @@ body {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.wfm-ai-vlm-clear {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
right: 4px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: none;
|
||||
border-radius: 50%;
|
||||
background: rgba(0, 0, 0, 0.6);
|
||||
color: #fff;
|
||||
font-size: 11px;
|
||||
line-height: 1;
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.wfm-ai-vlm-clear:hover {
|
||||
background: var(--wfm-danger);
|
||||
}
|
||||
|
||||
.wfm-ai-vlm-task-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -5511,6 +5608,79 @@ body {
|
||||
color: var(--wfm-text);
|
||||
}
|
||||
|
||||
.wfm-ai-chat-img {
|
||||
max-width: 20%;
|
||||
border-radius: 6px;
|
||||
margin-top: 6px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.wfm-ai-chat-attach-thumb {
|
||||
max-width: 120px;
|
||||
max-height: 120px;
|
||||
border-radius: 6px;
|
||||
margin-top: 6px;
|
||||
display: block;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.wfm-ai-chat-svg-wrapper {
|
||||
margin-top: 6px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.wfm-ai-chat-svg-img {
|
||||
max-width: 240px;
|
||||
max-height: 240px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid var(--wfm-border);
|
||||
background: #fff;
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
.wfm-ai-chat-attachment {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 4px 6px;
|
||||
border: 1px solid var(--wfm-border);
|
||||
border-radius: var(--wfm-radius-sm);
|
||||
background: var(--wfm-surface);
|
||||
font-size: 11px;
|
||||
color: var(--wfm-text-secondary);
|
||||
}
|
||||
|
||||
.wfm-ai-chat-attachment-thumb {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
object-fit: cover;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.wfm-ai-chat-attachment-clear {
|
||||
margin-left: auto;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: none;
|
||||
border-radius: 50%;
|
||||
background: transparent;
|
||||
color: var(--wfm-text-secondary);
|
||||
font-size: 11px;
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.wfm-ai-chat-attachment-clear:hover {
|
||||
background: var(--wfm-danger);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.wfm-ai-chat-input-area {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
+314
-31
@@ -1,11 +1,14 @@
|
||||
/**
|
||||
* AI Tab - Translation, VLM, Settings
|
||||
* Supports Ollama and LM Studio as backends
|
||||
* Supports Ollama, LM Studio, and Lemonade as backends
|
||||
*/
|
||||
|
||||
import { showToast } from "./app.js";
|
||||
import { t } from "./i18n.js";
|
||||
import { readJsonStorage } from "./util.js";
|
||||
import { readJsonStorage, getAiBackendDefaultUrl } from "./util.js";
|
||||
import { comfyUI } from "./comfyui-client.js";
|
||||
import { comfyEditor } from "./comfyui-editor.js";
|
||||
import { comfyWorkflow } from "./comfyui-workflow.js";
|
||||
|
||||
const SETTINGS_KEY = "wfm_ai_settings";
|
||||
|
||||
@@ -196,7 +199,7 @@ function initTranslateTab() {
|
||||
|
||||
const settings = loadAiSettings();
|
||||
const { backend = "ollama", backendUrl, model } = settings;
|
||||
const url = backendUrl || (backend === "ollama" ? "http://localhost:11434" : "http://localhost:1234");
|
||||
const url = backendUrl || getAiBackendDefaultUrl(backend);
|
||||
|
||||
if (!isValidBackendUrl(url)) {
|
||||
showToast(t("aiToastInvalidUrl"), "error");
|
||||
@@ -285,12 +288,11 @@ function initSettingsTab() {
|
||||
const urlInput = document.getElementById("wfm-ai-backend-url");
|
||||
if (urlInput && saved.backendUrl) urlInput.value = saved.backendUrl;
|
||||
|
||||
// Update URL placeholder when backend changes
|
||||
// Switch URL to the new backend's default when the user changes backend
|
||||
backendRadios.forEach((r) => {
|
||||
r.addEventListener("change", () => {
|
||||
if (!urlInput) return;
|
||||
const defaultUrl = r.value === "ollama" ? "http://localhost:11434" : "http://localhost:1234";
|
||||
if (!saved.backendUrl) urlInput.value = defaultUrl;
|
||||
urlInput.value = getAiBackendDefaultUrl(r.value);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -341,6 +343,47 @@ function initSettingsTab() {
|
||||
if (freeSrcInput && saved.freeSrcLang) freeSrcInput.value = saved.freeSrcLang;
|
||||
if (freeDstInput && saved.freeDstLang) freeDstInput.value = saved.freeDstLang;
|
||||
|
||||
// Chat image generation — dedicated workflow selection (T2I)
|
||||
const chatGenCheckbox = document.getElementById("wfm-ai-chatgen-dedicated-checkbox");
|
||||
const chatGenRow = document.getElementById("wfm-ai-chatgen-dedicated-row");
|
||||
const chatGenSelect = document.getElementById("wfm-ai-chatgen-dedicated-select");
|
||||
|
||||
if (chatGenCheckbox) chatGenCheckbox.checked = !!saved.chatGenDedicatedEnabled;
|
||||
if (chatGenRow) chatGenRow.style.display = saved.chatGenDedicatedEnabled ? "" : "none";
|
||||
|
||||
chatGenCheckbox?.addEventListener("change", () => {
|
||||
if (chatGenRow) chatGenRow.style.display = chatGenCheckbox.checked ? "" : "none";
|
||||
});
|
||||
|
||||
// Chat I2I generation — dedicated workflow selection
|
||||
const chatGenI2ICheckbox = document.getElementById("wfm-ai-chatgen-i2i-dedicated-checkbox");
|
||||
const chatGenI2IRow = document.getElementById("wfm-ai-chatgen-i2i-dedicated-row");
|
||||
const chatGenI2ISelect = document.getElementById("wfm-ai-chatgen-i2i-dedicated-select");
|
||||
|
||||
if (chatGenI2ICheckbox) chatGenI2ICheckbox.checked = !!saved.chatGenI2IDedicatedEnabled;
|
||||
if (chatGenI2IRow) chatGenI2IRow.style.display = saved.chatGenI2IDedicatedEnabled ? "" : "none";
|
||||
|
||||
chatGenI2ICheckbox?.addEventListener("change", () => {
|
||||
if (chatGenI2IRow) chatGenI2IRow.style.display = chatGenI2ICheckbox.checked ? "" : "none";
|
||||
});
|
||||
|
||||
if (chatGenSelect) {
|
||||
fetch(`${comfyUI.baseUrl}/api/wfm/workflows`)
|
||||
.then((r) => (r.ok ? r.json() : []))
|
||||
.then((list) => {
|
||||
const filenames = (list || []).map((w) => w.filename).filter(Boolean);
|
||||
const optionsHtml = `<option value="">-- select workflow --</option>` +
|
||||
filenames.map((f) => `<option value="${f}">${f}</option>`).join("");
|
||||
chatGenSelect.innerHTML = optionsHtml;
|
||||
if (saved.chatGenDedicatedFilename) chatGenSelect.value = saved.chatGenDedicatedFilename;
|
||||
if (chatGenI2ISelect) {
|
||||
chatGenI2ISelect.innerHTML = optionsHtml;
|
||||
if (saved.chatGenI2IDedicatedFilename) chatGenI2ISelect.value = saved.chatGenI2IDedicatedFilename;
|
||||
}
|
||||
})
|
||||
.catch(() => {});
|
||||
}
|
||||
|
||||
// Save settings
|
||||
document.getElementById("wfm-ai-settings-save-btn")?.addEventListener("click", () => {
|
||||
const backend = document.querySelector("input[name='wfm-ai-backend']:checked")?.value || "ollama";
|
||||
@@ -348,13 +391,21 @@ function initSettingsTab() {
|
||||
const model = document.getElementById("wfm-ai-model-select")?.value || "";
|
||||
const freeSrcLang = freeSrcInput?.value?.trim() || "";
|
||||
const freeDstLang = freeDstInput?.value?.trim() || "";
|
||||
const chatGenDedicatedEnabled = !!chatGenCheckbox?.checked;
|
||||
const chatGenDedicatedFilename = chatGenSelect?.value || "";
|
||||
const chatGenI2IDedicatedEnabled = !!chatGenI2ICheckbox?.checked;
|
||||
const chatGenI2IDedicatedFilename = chatGenI2ISelect?.value || "";
|
||||
|
||||
if (url && !isValidBackendUrl(url)) {
|
||||
showToast(t("aiToastInvalidUrl"), "error");
|
||||
return;
|
||||
}
|
||||
|
||||
saveAiSettings({ backend, backendUrl: url, model, freeSrcLang, freeDstLang });
|
||||
saveAiSettings({
|
||||
backend, backendUrl: url, model, freeSrcLang, freeDstLang,
|
||||
chatGenDedicatedEnabled, chatGenDedicatedFilename,
|
||||
chatGenI2IDedicatedEnabled, chatGenI2IDedicatedFilename,
|
||||
});
|
||||
showToast(t("aiToastSettingsSaved"), "success");
|
||||
});
|
||||
|
||||
@@ -368,30 +419,190 @@ function initSettingsTab() {
|
||||
// Chat tab
|
||||
// ============================================
|
||||
|
||||
async function callChat(url, backend, model, messages) {
|
||||
const IMAGE_GEN_TOOLS = [{
|
||||
type: "function",
|
||||
function: {
|
||||
name: "generate_image",
|
||||
description: "Generate an image using the currently loaded ComfyUI workflow. If an image is currently attached to the conversation, this performs image-to-image generation using that image as the base; otherwise it performs text-to-image. Call this when the user asks to create, draw, paint, edit, or transform an image.",
|
||||
parameters: {
|
||||
type: "object",
|
||||
properties: {
|
||||
prompt: { type: "string", description: "Positive prompt describing the desired image." },
|
||||
negative_prompt: { type: "string", description: "What to avoid in the image. Optional." },
|
||||
},
|
||||
required: ["prompt"],
|
||||
},
|
||||
},
|
||||
}];
|
||||
|
||||
// chatHistory の内部共通形式 {role, content, images?:[{base64,mimeType}]} を
|
||||
// バックエンドごとのワイヤーフォーマットへ変換する（callVLM() と同じ規約）
|
||||
function _formatMessagesForBackend(messages, backend) {
|
||||
return messages.map((m) => {
|
||||
if (!m.images?.length) return { role: m.role, content: m.content };
|
||||
if (backend === "ollama") {
|
||||
return { role: m.role, content: m.content, images: m.images.map((i) => i.base64) };
|
||||
}
|
||||
return {
|
||||
role: m.role,
|
||||
content: [
|
||||
{ type: "text", text: m.content },
|
||||
...m.images.map((i) => ({ type: "image_url", image_url: { url: `data:${i.mimeType};base64,${i.base64}` } })),
|
||||
],
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
async function callChat(url, backend, model, messages, tools) {
|
||||
const formattedMessages = _formatMessagesForBackend(messages, backend);
|
||||
if (backend === "ollama") {
|
||||
const body = { model, messages: formattedMessages, stream: false };
|
||||
if (tools) body.tools = tools;
|
||||
const res = await fetch(`${url}/api/chat`, {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({ model, messages, stream: false }),
|
||||
body: JSON.stringify(body),
|
||||
});
|
||||
if (!res.ok) throw new Error(`HTTP ${res.status}`);
|
||||
return (await res.json()).message?.content || "";
|
||||
const message = (await res.json()).message || {};
|
||||
return { content: message.content || "", toolCalls: message.tool_calls || null };
|
||||
} else {
|
||||
const body = { model, messages: formattedMessages, stream: false };
|
||||
if (tools) { body.tools = tools; body.tool_choice = "auto"; }
|
||||
const res = await fetch(`${url}/v1/chat/completions`, {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({ model, messages, stream: false }),
|
||||
body: JSON.stringify(body),
|
||||
});
|
||||
if (!res.ok) throw new Error(`HTTP ${res.status}`);
|
||||
return (await res.json()).choices?.[0]?.message?.content || "";
|
||||
const message = (await res.json()).choices?.[0]?.message || {};
|
||||
return { content: message.content || "", toolCalls: message.tool_calls || null };
|
||||
}
|
||||
}
|
||||
|
||||
function appendChatBubble(messagesEl, role, content) {
|
||||
function _parseToolArgs(toolCall) {
|
||||
const raw = toolCall.function?.arguments ?? toolCall.arguments;
|
||||
if (typeof raw === "string") {
|
||||
try { return JSON.parse(raw); } catch { return {}; }
|
||||
}
|
||||
return raw || {};
|
||||
}
|
||||
|
||||
async function _loadDedicatedChatGenWorkflow(filename) {
|
||||
const resp = await fetch(`${comfyUI.baseUrl}/api/wfm/workflows/raw?filename=${encodeURIComponent(filename)}`);
|
||||
if (!resp.ok) throw new Error(`Failed to load workflow (HTTP ${resp.status})`);
|
||||
let workflow = await resp.json();
|
||||
const format = comfyWorkflow.detectFormat(workflow, filename);
|
||||
if (format === "ui") {
|
||||
workflow = await comfyWorkflow.convertUiToApi(workflow);
|
||||
} else if (format !== "api") {
|
||||
throw new Error("Unsupported or unrecognized workflow format");
|
||||
}
|
||||
return { workflow, analysis: comfyWorkflow.analyzeWorkflow(workflow) };
|
||||
}
|
||||
|
||||
async function generateImageFromChat(prompt, negativePrompt) {
|
||||
if (!window._wfmGenerateTab?.generate) throw new Error(t("aiChatGenerateNotReady"));
|
||||
|
||||
const settings = loadAiSettings();
|
||||
const isI2I = !!_toolsImage;
|
||||
let workflow, analysis;
|
||||
|
||||
if (isI2I && settings.chatGenI2IDedicatedEnabled && settings.chatGenI2IDedicatedFilename) {
|
||||
({ workflow, analysis } = await _loadDedicatedChatGenWorkflow(settings.chatGenI2IDedicatedFilename));
|
||||
} else if (!isI2I && settings.chatGenDedicatedEnabled && settings.chatGenDedicatedFilename) {
|
||||
({ workflow, analysis } = await _loadDedicatedChatGenWorkflow(settings.chatGenDedicatedFilename));
|
||||
} else {
|
||||
if (!comfyUI.currentWorkflow || !comfyUI.currentAnalysis) throw new Error(t("aiChatNoWorkflowLoaded"));
|
||||
workflow = JSON.parse(JSON.stringify(comfyUI.currentWorkflow));
|
||||
analysis = comfyUI.currentAnalysis;
|
||||
}
|
||||
|
||||
if (isI2I) {
|
||||
if (!(analysis.load_image_nodes?.length > 0)) throw new Error(t("aiChatNoLoadImageNode"));
|
||||
await comfyEditor.applyImageToSlot(_toolsImage.file, 0, { workflow, analysis });
|
||||
}
|
||||
|
||||
comfyEditor.setPromptText("positive", prompt || "", { workflow, analysis });
|
||||
if (negativePrompt) comfyEditor.setPromptText("negative", negativePrompt, { workflow, analysis });
|
||||
|
||||
const result = await window._wfmGenerateTab.generate(workflow);
|
||||
const images = result?.images || [];
|
||||
if (images.length === 0) throw new Error(t("aiChatNoImageProduced"));
|
||||
|
||||
const img = images[0];
|
||||
return `/view?filename=${encodeURIComponent(img.filename)}&subfolder=${encodeURIComponent(img.subfolder || "")}&type=${encodeURIComponent(img.type || "output")}`;
|
||||
}
|
||||
|
||||
// アシスタント応答からSVGコードを抽出する（```svg フェンス or 生の <svg>...</svg>）
|
||||
function _extractSvgCode(text) {
|
||||
if (!text) return null;
|
||||
const fenced = text.match(/```(?:svg|xml)?\s*([\s\S]*?<svg[\s\S]*?<\/svg>)[\s\S]*?```/i);
|
||||
if (fenced) return fenced[1].trim();
|
||||
const bare = text.match(/<svg[\s\S]*?<\/svg>/i);
|
||||
if (bare) return bare[0].trim();
|
||||
return null;
|
||||
}
|
||||
|
||||
// SVGコードをプレビュー表示し、Galleryへ保存するボタンを追加する。
|
||||
// <img src="data:..."> でのレンダリングはブラウザがスクリプト実行を無効化するため安全。
|
||||
function _appendSvgPreview(container, svgCode) {
|
||||
const wrapper = document.createElement("div");
|
||||
wrapper.className = "wfm-ai-chat-svg-wrapper";
|
||||
|
||||
const dataUrl = `data:image/svg+xml;base64,${btoa(unescape(encodeURIComponent(svgCode)))}`;
|
||||
|
||||
const img = document.createElement("img");
|
||||
img.src = dataUrl;
|
||||
img.className = "wfm-ai-chat-svg-img";
|
||||
img.alt = "Generated SVG";
|
||||
wrapper.appendChild(img);
|
||||
|
||||
const saveBtn = document.createElement("button");
|
||||
saveBtn.className = "wfm-btn wfm-btn-sm";
|
||||
saveBtn.textContent = t("aiChatSaveSvgToGallery");
|
||||
saveBtn.addEventListener("click", async () => {
|
||||
saveBtn.disabled = true;
|
||||
try {
|
||||
const res = await fetch("/wfm/gallery/image/save", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({ filename: `chat_svg_${Date.now()}.svg`, imageData: dataUrl }),
|
||||
});
|
||||
const data = await res.json();
|
||||
if (!res.ok || data.error) throw new Error(data.error || `HTTP ${res.status}`);
|
||||
showToast(t("aiChatSvgSaved"), "success");
|
||||
} catch (e) {
|
||||
showToast(t("aiChatSvgSaveFailed") + e.message, "error");
|
||||
} finally {
|
||||
saveBtn.disabled = false;
|
||||
}
|
||||
});
|
||||
wrapper.appendChild(saveBtn);
|
||||
|
||||
container.appendChild(wrapper);
|
||||
}
|
||||
|
||||
function appendChatBubble(messagesEl, role, content, opts = {}) {
|
||||
const div = document.createElement("div");
|
||||
div.className = `wfm-ai-chat-msg wfm-ai-chat-msg-${role}`;
|
||||
div.textContent = content;
|
||||
if (content) div.textContent = content;
|
||||
if (opts.imageUrl) {
|
||||
const img = document.createElement("img");
|
||||
img.src = opts.imageUrl;
|
||||
img.className = "wfm-ai-chat-img";
|
||||
div.appendChild(img);
|
||||
}
|
||||
if (opts.attachThumb) {
|
||||
const img = document.createElement("img");
|
||||
img.src = opts.attachThumb;
|
||||
img.className = "wfm-ai-chat-attach-thumb";
|
||||
div.appendChild(img);
|
||||
}
|
||||
if (role === "assistant" && content) {
|
||||
const svgCode = _extractSvgCode(content);
|
||||
if (svgCode) _appendSvgPreview(div, svgCode);
|
||||
}
|
||||
messagesEl.appendChild(div);
|
||||
messagesEl.scrollTop = messagesEl.scrollHeight;
|
||||
return div;
|
||||
@@ -403,9 +614,22 @@ function initChatTab() {
|
||||
const sendBtn = document.getElementById("wfm-ai-chat-send-btn");
|
||||
const clearBtn = document.getElementById("wfm-ai-chat-clear-btn");
|
||||
const statusEl = document.getElementById("wfm-ai-chat-status");
|
||||
const imgGenToggle = document.getElementById("wfm-ai-chat-imggen-toggle");
|
||||
|
||||
if (!messagesEl || !inputEl || !sendBtn) return;
|
||||
|
||||
if (imgGenToggle) {
|
||||
const savedToggle = loadAiSettings();
|
||||
imgGenToggle.checked = savedToggle.chatImageGenEnabled !== false;
|
||||
imgGenToggle.addEventListener("change", () => {
|
||||
saveAiSettings({ chatImageGenEnabled: imgGenToggle.checked });
|
||||
});
|
||||
}
|
||||
|
||||
document.getElementById("wfm-ai-chat-attachment-clear")?.addEventListener("click", () => {
|
||||
_clearToolsImage();
|
||||
});
|
||||
|
||||
let chatHistory = [];
|
||||
|
||||
async function sendMessage() {
|
||||
@@ -414,7 +638,7 @@ function initChatTab() {
|
||||
|
||||
const settings = loadAiSettings();
|
||||
const { backend = "ollama", backendUrl, model } = settings;
|
||||
const url = backendUrl || (backend === "ollama" ? "http://localhost:11434" : "http://localhost:1234");
|
||||
const url = backendUrl || getAiBackendDefaultUrl(backend);
|
||||
|
||||
if (!isValidBackendUrl(url)) {
|
||||
showToast(t("aiToastInvalidUrl"), "error");
|
||||
@@ -427,17 +651,39 @@ function initChatTab() {
|
||||
|
||||
inputEl.value = "";
|
||||
inputEl.style.height = "";
|
||||
chatHistory.push({ role: "user", content: text });
|
||||
appendChatBubble(messagesEl, "user", text);
|
||||
const userEntry = { role: "user", content: text };
|
||||
if (_toolsImage) userEntry.images = [{ base64: _toolsImage.base64, mimeType: _toolsImage.mimeType }];
|
||||
chatHistory.push(userEntry);
|
||||
appendChatBubble(messagesEl, "user", text, _toolsImage ? { attachThumb: `data:${_toolsImage.mimeType};base64,${_toolsImage.base64}` } : {});
|
||||
|
||||
sendBtn.disabled = true;
|
||||
statusEl.textContent = t("aiStatusChatting");
|
||||
statusEl.className = "wfm-ai-trans-status wfm-ai-status-working";
|
||||
|
||||
try {
|
||||
const reply = await callChat(url, backend, model, chatHistory);
|
||||
chatHistory.push({ role: "assistant", content: reply });
|
||||
appendChatBubble(messagesEl, "assistant", reply);
|
||||
const tools = imgGenToggle?.checked !== false ? IMAGE_GEN_TOOLS : undefined;
|
||||
const reply = await callChat(url, backend, model, chatHistory, tools);
|
||||
const toolCall = reply.toolCalls?.find(
|
||||
(tc) => (tc.function?.name || tc.name) === "generate_image"
|
||||
);
|
||||
|
||||
if (toolCall) {
|
||||
chatHistory.push({ role: "assistant", content: reply.content || "" });
|
||||
if (reply.content) appendChatBubble(messagesEl, "assistant", reply.content);
|
||||
|
||||
statusEl.textContent = t("aiStatusGeneratingImage");
|
||||
const args = _parseToolArgs(toolCall);
|
||||
try {
|
||||
const imageUrl = await generateImageFromChat(args.prompt, args.negative_prompt);
|
||||
appendChatBubble(messagesEl, "assistant", "", { imageUrl });
|
||||
} catch (genErr) {
|
||||
appendChatBubble(messagesEl, "assistant", `${t("aiToastImageGenFailed")}${genErr.message}`);
|
||||
showToast(t("aiToastImageGenFailed") + genErr.message, "error");
|
||||
}
|
||||
} else {
|
||||
chatHistory.push({ role: "assistant", content: reply.content });
|
||||
appendChatBubble(messagesEl, "assistant", reply.content);
|
||||
}
|
||||
statusEl.textContent = "";
|
||||
statusEl.className = "wfm-ai-trans-status";
|
||||
} catch (err) {
|
||||
@@ -469,14 +715,49 @@ function initChatTab() {
|
||||
});
|
||||
}
|
||||
|
||||
// ============================================
|
||||
// TOOLS ↔ Chat shared image attachment
|
||||
// ============================================
|
||||
|
||||
let _toolsImage = null; // { file: File, base64: string, mimeType: string }
|
||||
|
||||
function _syncAttachmentUI() {
|
||||
const vlmPreview = document.getElementById("wfm-ai-vlm-preview");
|
||||
const vlmLabel = document.getElementById("wfm-ai-vlm-label");
|
||||
const vlmClear = document.getElementById("wfm-ai-vlm-clear");
|
||||
const chatAttach = document.getElementById("wfm-ai-chat-attachment");
|
||||
const chatThumb = document.getElementById("wfm-ai-chat-attachment-thumb");
|
||||
const chatLabel = document.getElementById("wfm-ai-chat-attachment-label");
|
||||
|
||||
if (_toolsImage) {
|
||||
const dataUrl = `data:${_toolsImage.mimeType};base64,${_toolsImage.base64}`;
|
||||
if (vlmPreview) { vlmPreview.src = dataUrl; vlmPreview.style.display = "block"; }
|
||||
if (vlmLabel) vlmLabel.style.display = "none";
|
||||
if (vlmClear) vlmClear.style.display = "flex";
|
||||
if (chatAttach) chatAttach.style.display = "flex";
|
||||
if (chatThumb) chatThumb.src = dataUrl;
|
||||
if (chatLabel) chatLabel.textContent = t("aiChatAttachmentLabel");
|
||||
} else {
|
||||
if (vlmPreview) { vlmPreview.src = ""; vlmPreview.style.display = "none"; }
|
||||
if (vlmLabel) vlmLabel.style.display = "";
|
||||
if (vlmClear) vlmClear.style.display = "none";
|
||||
if (chatAttach) chatAttach.style.display = "none";
|
||||
if (chatThumb) chatThumb.src = "";
|
||||
}
|
||||
}
|
||||
|
||||
function _clearToolsImage() {
|
||||
_toolsImage = null;
|
||||
_syncAttachmentUI();
|
||||
}
|
||||
|
||||
// ============================================
|
||||
// VLM tab
|
||||
// ============================================
|
||||
|
||||
function initVlmTab() {
|
||||
const dropEl = document.getElementById("wfm-ai-vlm-drop");
|
||||
const previewEl = document.getElementById("wfm-ai-vlm-preview");
|
||||
const labelEl = document.getElementById("wfm-ai-vlm-label");
|
||||
const clearEl = document.getElementById("wfm-ai-vlm-clear");
|
||||
const fileInput = document.getElementById("wfm-ai-vlm-file");
|
||||
const taskSel = document.getElementById("wfm-ai-vlm-task");
|
||||
const runBtn = document.getElementById("wfm-ai-vlm-run");
|
||||
@@ -489,8 +770,6 @@ function initVlmTab() {
|
||||
|
||||
if (!dropEl) return;
|
||||
|
||||
let vlmImage = null; // { base64, mimeType }
|
||||
|
||||
function updateTaskUI() {
|
||||
const isWildcard = taskSel?.value === "wildcard";
|
||||
dropEl.style.display = isWildcard ? "none" : "";
|
||||
@@ -501,10 +780,9 @@ function initVlmTab() {
|
||||
|
||||
const loadImage = async (file) => {
|
||||
if (!file || !file.type.startsWith("image/")) return;
|
||||
vlmImage = await fileToBase64(file);
|
||||
previewEl.src = `data:${vlmImage.mimeType};base64,${vlmImage.base64}`;
|
||||
previewEl.style.display = "block";
|
||||
labelEl.style.display = "none";
|
||||
const { base64, mimeType } = await fileToBase64(file);
|
||||
_toolsImage = { file, base64, mimeType };
|
||||
_syncAttachmentUI();
|
||||
};
|
||||
|
||||
dropEl.addEventListener("click", () => fileInput.click());
|
||||
@@ -516,12 +794,17 @@ function initVlmTab() {
|
||||
dropEl.classList.remove("drag-over");
|
||||
if (e.dataTransfer.files[0]) loadImage(e.dataTransfer.files[0]);
|
||||
});
|
||||
clearEl?.addEventListener("click", (e) => {
|
||||
e.stopPropagation();
|
||||
_clearToolsImage();
|
||||
if (fileInput) fileInput.value = "";
|
||||
});
|
||||
|
||||
runBtn.addEventListener("click", async () => {
|
||||
const task = taskSel?.value || "describe";
|
||||
const settings = loadAiSettings();
|
||||
const { backend = "ollama", backendUrl, model } = settings;
|
||||
const url = backendUrl || (backend === "ollama" ? "http://localhost:11434" : "http://localhost:1234");
|
||||
const url = backendUrl || getAiBackendDefaultUrl(backend);
|
||||
|
||||
if (!isValidBackendUrl(url)) { showToast(t("aiToastInvalidUrl"), "error"); return; }
|
||||
if (!model) { showToast(t("aiToastNoModel"), "error"); return; }
|
||||
@@ -557,7 +840,7 @@ function initVlmTab() {
|
||||
return;
|
||||
}
|
||||
|
||||
if (!vlmImage) { showToast(t("aiToastNoImage"), "error"); return; }
|
||||
if (!_toolsImage) { showToast(t("aiToastNoImage"), "error"); return; }
|
||||
|
||||
runBtn.disabled = true;
|
||||
statusEl.textContent = t("aiStatusRunning");
|
||||
@@ -565,7 +848,7 @@ function initVlmTab() {
|
||||
resultEl.value = "";
|
||||
|
||||
try {
|
||||
const result = await callVLM(url, backend, model, VLM_PROMPTS[task], vlmImage.base64, vlmImage.mimeType);
|
||||
const result = await callVLM(url, backend, model, VLM_PROMPTS[task], _toolsImage.base64, _toolsImage.mimeType);
|
||||
resultEl.value = result.trim();
|
||||
statusEl.textContent = t("aiStatusDone");
|
||||
statusEl.className = "wfm-ai-trans-status wfm-ai-status-ok";
|
||||
|
||||
+20
-4
@@ -310,6 +310,16 @@ function applyI18nToHtml() {
|
||||
if (aiFreeDstLabel) aiFreeDstLabel.textContent = t("aiSettingsOutputLang");
|
||||
const aiSaveBtn = document.getElementById("wfm-ai-settings-save-btn");
|
||||
if (aiSaveBtn) aiSaveBtn.textContent = t("aiSettingsSaveBtn");
|
||||
const aiChatImgGenLabel = document.getElementById("wfm-ai-chat-imggen-label-text");
|
||||
if (aiChatImgGenLabel) aiChatImgGenLabel.textContent = t("aiChatImgGenToggle");
|
||||
const aiChatGenTitle = document.getElementById("wfm-ai-settings-chatgen-title");
|
||||
if (aiChatGenTitle) aiChatGenTitle.textContent = t("aiSettingsChatGenTitle");
|
||||
const aiChatGenDedicatedLabel = document.getElementById("wfm-ai-chatgen-dedicated-label");
|
||||
if (aiChatGenDedicatedLabel) aiChatGenDedicatedLabel.textContent = t("aiSettingsChatGenDedicated");
|
||||
const aiChatGenI2ITitle = document.getElementById("wfm-ai-settings-chatgen-i2i-title");
|
||||
if (aiChatGenI2ITitle) aiChatGenI2ITitle.textContent = t("aiSettingsChatI2IGenTitle");
|
||||
const aiChatGenI2IDedicatedLabel = document.getElementById("wfm-ai-chatgen-i2i-dedicated-label");
|
||||
if (aiChatGenI2IDedicatedLabel) aiChatGenI2IDedicatedLabel.textContent = t("aiSettingsChatGenDedicated");
|
||||
|
||||
// Group panel labels
|
||||
const propTitle = document.querySelector("#wfm-side-tab-group .wfm-group-section-title");
|
||||
@@ -355,7 +365,8 @@ function applyI18nToHtml() {
|
||||
"wfm-help-gen-11": "helpGen11", "wfm-help-gen-12": "helpGen12",
|
||||
"wfm-help-gen-13": "helpGen13", "wfm-help-gen-14": "helpGen14",
|
||||
"wfm-help-gen-15": "helpGen15", "wfm-help-gen-16": "helpGen16",
|
||||
"wfm-help-gen-17": "helpGen17",
|
||||
"wfm-help-gen-17": "helpGen17", "wfm-help-gen-18": "helpGen18",
|
||||
"wfm-help-gen-19": "helpGen19",
|
||||
"wfm-help-feeder-title": "helpFeederTitle",
|
||||
"wfm-help-feeder-desc": "helpFeederDesc",
|
||||
"wfm-help-feeder-imgloop-title": "helpFeederImgloopTitle",
|
||||
@@ -422,6 +433,7 @@ function applyI18nToHtml() {
|
||||
"wfm-help-ai-title": "helpAiTitle",
|
||||
"wfm-help-ai-1": "helpAi1", "wfm-help-ai-2": "helpAi2", "wfm-help-ai-3": "helpAi3",
|
||||
"wfm-help-ai-4": "helpAi4", "wfm-help-ai-5": "helpAi5", "wfm-help-ai-6": "helpAi6",
|
||||
"wfm-help-ai-7": "helpAi7",
|
||||
"wfm-help-imageedit-title": "helpImageEditTitle",
|
||||
"wfm-help-imageedit-tools-title": "helpImageEditToolsTitle",
|
||||
"wfm-help-imageedit-layer-title": "helpImageEditLayerTitle",
|
||||
@@ -444,7 +456,7 @@ function applyI18nToHtml() {
|
||||
"wfm-help-imageedit-28": "helpImageEdit28", "wfm-help-imageedit-29": "helpImageEdit29",
|
||||
"wfm-help-imageedit-30": "helpImageEdit30",
|
||||
"wfm-help-imageedit-7b": "helpImageEdit7b", "wfm-help-imageedit-7c": "helpImageEdit7c",
|
||||
"wfm-help-imageedit-7d": "helpImageEdit7d",
|
||||
"wfm-help-imageedit-7d": "helpImageEdit7d", "wfm-help-imageedit-7e": "helpImageEdit7e",
|
||||
"wfm-help-imageedit-8b": "helpImageEdit8b",
|
||||
"wfm-help-imageedit-blur-title": "helpImageEditBlurTitle",
|
||||
"wfm-help-imageedit-blur-1": "helpImageEditBlur1", "wfm-help-imageedit-blur-2": "helpImageEditBlur2",
|
||||
@@ -457,7 +469,11 @@ function applyI18nToHtml() {
|
||||
"wfm-help-imageedit-mask-title": "helpImageEditMaskTitle",
|
||||
"wfm-help-imageedit-mask-1": "helpImageEditMask1", "wfm-help-imageedit-mask-2": "helpImageEditMask2",
|
||||
"wfm-help-imageedit-mask-3": "helpImageEditMask3", "wfm-help-imageedit-mask-4": "helpImageEditMask4",
|
||||
"wfm-help-imageedit-mask-5": "helpImageEditMask5",
|
||||
"wfm-help-imageedit-mask-5": "helpImageEditMask5", "wfm-help-imageedit-mask-6": "helpImageEditMask6",
|
||||
"wfm-help-imageedit-mask-7": "helpImageEditMask7", "wfm-help-imageedit-mask-8": "helpImageEditMask8",
|
||||
"wfm-help-imageedit-mask-9": "helpImageEditMask9", "wfm-help-imageedit-mask-10": "helpImageEditMask10",
|
||||
"wfm-help-imageedit-mask-11": "helpImageEditMask11", "wfm-help-imageedit-mask-12": "helpImageEditMask12",
|
||||
"wfm-help-imageedit-mask-13": "helpImageEditMask13",
|
||||
"wfm-help-imageedit-gmic-title": "helpImageEditGmicTitle",
|
||||
"wfm-help-imageedit-gmic-1": "helpImageEditGmic1", "wfm-help-imageedit-gmic-2": "helpImageEditGmic2",
|
||||
"wfm-help-imageedit-gmic-3": "helpImageEditGmic3", "wfm-help-imageedit-gmic-4": "helpImageEditGmic4",
|
||||
@@ -477,7 +493,7 @@ function applyI18nToHtml() {
|
||||
"wfm-help-trouble-1": "helpTrouble1", "wfm-help-trouble-2": "helpTrouble2",
|
||||
"wfm-help-trouble-3": "helpTrouble3", "wfm-help-trouble-4": "helpTrouble4",
|
||||
"wfm-help-trouble-5": "helpTrouble5", "wfm-help-trouble-6": "helpTrouble6",
|
||||
"wfm-help-trouble-7": "helpTrouble7",
|
||||
"wfm-help-trouble-7": "helpTrouble7", "wfm-help-trouble-8": "helpTrouble8",
|
||||
"wfm-help-support-title": "helpSupportTitle",
|
||||
"wfm-help-support-desc": "helpSupportDesc",
|
||||
"wfm-help-github-desc": "helpGithubDesc",
|
||||
|
||||
@@ -240,7 +240,13 @@ export const comfyUI = {
|
||||
});
|
||||
const res = await fetch(`${this.baseUrl}/view?${params}`);
|
||||
if (!res.ok) throw new Error(`Failed to fetch image: HTTP ${res.status}`);
|
||||
return await res.blob();
|
||||
const blob = await res.blob();
|
||||
// /view はSVGをセキュリティ上application/octet-streamで返すため、
|
||||
// <img>で表示できるよう拡張子から正しいMIMEタイプへ付け替える
|
||||
if (imageData.filename?.toLowerCase().endsWith(".svg") && blob.type !== "image/svg+xml") {
|
||||
return blob.slice(0, blob.size, "image/svg+xml");
|
||||
}
|
||||
return blob;
|
||||
},
|
||||
|
||||
async uploadImage(file, filename, overwrite = true) {
|
||||
@@ -300,6 +306,9 @@ export const comfyUI = {
|
||||
|
||||
// Extract images from SaveImage outputs only
|
||||
const images = [];
|
||||
// comfyui-tosvg の "Save SVG String" ノードは images ではなく
|
||||
// saved_svg(ファイル名) / path(絶対パス) という独自キーで返す
|
||||
const svgOutputs = [];
|
||||
const outputs = history.outputs || {};
|
||||
for (const nodeOutput of Object.values(outputs)) {
|
||||
if (nodeOutput.images) {
|
||||
@@ -307,10 +316,23 @@ export const comfyUI = {
|
||||
images.push(img);
|
||||
}
|
||||
}
|
||||
if (nodeOutput.saved_svg) {
|
||||
// ComfyUI の実行エンジンは ui 出力の各値をイテラブルとして連結するため、
|
||||
// ノード側が単一文字列で返すと 1 文字ずつ分解された配列になってしまう。
|
||||
// (例: "a.svg" -> ["a",".","s","v","g"]) 文字配列を検出したら結合して復元する。
|
||||
const joinIfCharArray = (v) =>
|
||||
Array.isArray(v) && v.every((c) => typeof c === "string" && c.length === 1)
|
||||
? v.join("")
|
||||
: v;
|
||||
svgOutputs.push({
|
||||
filename: joinIfCharArray(nodeOutput.saved_svg),
|
||||
path: joinIfCharArray(nodeOutput.path) || "",
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
onComplete?.(images, seed);
|
||||
return { images, seed };
|
||||
return { images, seed, svgOutputs };
|
||||
} catch (err) {
|
||||
onError?.(err);
|
||||
throw err;
|
||||
|
||||
+484
-19
@@ -4,6 +4,8 @@
|
||||
|
||||
import { comfyUI } from "./comfyui-client.js";
|
||||
import { syncJsonHighlight } from "./json-highlight.js";
|
||||
import { t } from "./i18n.js";
|
||||
import { escapeHtml } from "./util.js";
|
||||
|
||||
// ── Latent Image preset state ─────────────────────────────
|
||||
const _LATENT_PRESET_KEY = "wfm_latent_presets";
|
||||
@@ -85,7 +87,7 @@ function _applyLoraToNode(nodeId, loraPath, strModel, strClip, isLoraManager) {
|
||||
};
|
||||
comfyUI.currentWorkflow[nodeId].inputs.text = `<lora:${stem}:${strModel}:${strClip}>`;
|
||||
} else {
|
||||
comfyUI.currentWorkflow[nodeId].inputs.lora_name = loraPath;
|
||||
comfyUI.currentWorkflow[nodeId].inputs.lora_name = comfyEditor.resolveLoraName(loraPath);
|
||||
comfyUI.currentWorkflow[nodeId].inputs.strength_model = strModel;
|
||||
comfyUI.currentWorkflow[nodeId].inputs.strength_clip = strClip;
|
||||
}
|
||||
@@ -153,6 +155,142 @@ function _syncRawJson() {
|
||||
}
|
||||
}
|
||||
|
||||
// ── Inpaint: 画像+マスクのRGBA合成 ──────────────────────
|
||||
// mask は白=インペイント対象領域/黒=維持領域のグレースケール画像を想定（Image Editの
|
||||
// マスクレイヤーも、手動でドロップする白黒マスクファイルも同じ規約）。
|
||||
// ComfyUIネイティブのLoadImageはアルファチャンネルから mask = 1 - alpha を抽出するため、
|
||||
// 合成後の alpha は 255 - maskGray とする。
|
||||
async function _loadImageElement(src) {
|
||||
// `instanceof Blob` は別レルム（他ウィンドウ/iframe）で生成されたBlob/Fileでは
|
||||
// falseになる（コンストラクタの参照が異なるため）。Comic CreaterからiframeへBlobを
|
||||
// 直接渡すInpaint連携で発生するため、実体で判定する（文字列URLかどうかだけを見る）。
|
||||
const isBlobLike = typeof src !== "string";
|
||||
const url = isBlobLike ? URL.createObjectURL(src) : src;
|
||||
try {
|
||||
const img = new Image();
|
||||
img.src = url;
|
||||
await new Promise((resolve, reject) => {
|
||||
img.onload = resolve;
|
||||
img.onerror = () => reject(new Error("Failed to load image"));
|
||||
});
|
||||
return img;
|
||||
} finally {
|
||||
if (isBlobLike) URL.revokeObjectURL(url);
|
||||
}
|
||||
}
|
||||
|
||||
async function _compositeImageWithMask(imageInput, maskInput) {
|
||||
const img = await _loadImageElement(imageInput);
|
||||
const mask = await _loadImageElement(maskInput);
|
||||
|
||||
const w = img.naturalWidth, h = img.naturalHeight;
|
||||
const canvas = document.createElement("canvas");
|
||||
canvas.width = w; canvas.height = h;
|
||||
const ctx = canvas.getContext("2d");
|
||||
ctx.drawImage(img, 0, 0, w, h);
|
||||
const imgData = ctx.getImageData(0, 0, w, h);
|
||||
|
||||
const maskCanvas = document.createElement("canvas");
|
||||
maskCanvas.width = w; maskCanvas.height = h;
|
||||
const mctx = maskCanvas.getContext("2d");
|
||||
mctx.drawImage(mask, 0, 0, w, h);
|
||||
const maskData = mctx.getImageData(0, 0, w, h).data;
|
||||
|
||||
const data = imgData.data;
|
||||
for (let i = 0; i < data.length; i += 4) {
|
||||
data[i + 3] = 255 - maskData[i];
|
||||
}
|
||||
ctx.putImageData(imgData, 0, 0);
|
||||
|
||||
return new Promise((resolve) => canvas.toBlob(resolve, "image/png"));
|
||||
}
|
||||
|
||||
// ── Inpaint: Mask Editor One (comfyui-mask-editor-one) ノード向けヘルパー ──────
|
||||
// この custom node は LoadImage を介さず、画像は /mask_editor/store_image でサーバー側
|
||||
// キャッシュ(bg_image_b64, node_idキー)へ、マスクは layer_data(JSON文字列)ウィジェットの
|
||||
// 各レイヤーの「アルファチャンネル」から合成される（LoadImageの 1-alpha とは逆で、
|
||||
// alpha値がそのままmask値になる規約）。
|
||||
async function _imageInputToDataURL(imageInput) {
|
||||
const img = await _loadImageElement(imageInput);
|
||||
const canvas = document.createElement("canvas");
|
||||
canvas.width = img.naturalWidth;
|
||||
canvas.height = img.naturalHeight;
|
||||
canvas.getContext("2d").drawImage(img, 0, 0);
|
||||
return canvas.toDataURL("image/png");
|
||||
}
|
||||
|
||||
async function _maskInputToAlphaDataURL(maskInput) {
|
||||
const img = await _loadImageElement(maskInput);
|
||||
const w = img.naturalWidth, h = img.naturalHeight;
|
||||
const canvas = document.createElement("canvas");
|
||||
canvas.width = w; canvas.height = h;
|
||||
const ctx = canvas.getContext("2d");
|
||||
ctx.drawImage(img, 0, 0, w, h);
|
||||
const imgData = ctx.getImageData(0, 0, w, h);
|
||||
|
||||
const data = imgData.data;
|
||||
for (let i = 0; i < data.length; i += 4) {
|
||||
const gray = data[i];
|
||||
data[i] = data[i + 1] = data[i + 2] = 255;
|
||||
data[i + 3] = gray;
|
||||
}
|
||||
ctx.putImageData(imgData, 0, 0);
|
||||
|
||||
return canvas.toDataURL("image/png");
|
||||
}
|
||||
|
||||
// ── プロンプト強調weight編集 (Ctrl+↑/↓) ──────────────────────
|
||||
// A1111 / ComfyUIネイティブのCLIP Text Encodeと同様の操作感:
|
||||
// 選択（無ければカーソル位置の括弧ブロックまたは単語）を (text:weight) 形式に変換し、
|
||||
// weightを0.05刻みで増減する。weightが1.0に戻ったら括弧を除去する。
|
||||
const _PROMPT_WEIGHT_DELIMITERS = new Set([",", "\n", "\r", "\t", " ", "(", ")", ":"]);
|
||||
|
||||
function _selectSurroundingParenBlock(text, pos) {
|
||||
const openIdx = text.lastIndexOf("(", pos - 1);
|
||||
if (openIdx === -1) return null;
|
||||
const closeBefore = text.lastIndexOf(")", pos - 1);
|
||||
if (closeBefore > openIdx) return null; // カーソルは既に閉じたブロックの外
|
||||
const closeIdx = text.indexOf(")", pos);
|
||||
if (closeIdx === -1) return null;
|
||||
return { start: openIdx, end: closeIdx + 1 };
|
||||
}
|
||||
|
||||
function _selectSurroundingWord(text, pos) {
|
||||
let start = pos, end = pos;
|
||||
while (start > 0 && !_PROMPT_WEIGHT_DELIMITERS.has(text[start - 1])) start--;
|
||||
while (end < text.length && !_PROMPT_WEIGHT_DELIMITERS.has(text[end])) end++;
|
||||
return { start, end };
|
||||
}
|
||||
|
||||
function _attachPromptWeightControl(textarea) {
|
||||
textarea.addEventListener("keydown", (e) => {
|
||||
if (!e.ctrlKey || (e.key !== "ArrowUp" && e.key !== "ArrowDown")) return;
|
||||
e.preventDefault();
|
||||
|
||||
const delta = e.key === "ArrowUp" ? 0.05 : -0.05;
|
||||
const text = textarea.value;
|
||||
let start = textarea.selectionStart;
|
||||
let end = textarea.selectionEnd;
|
||||
|
||||
if (start === end) {
|
||||
const range = _selectSurroundingParenBlock(text, start) || _selectSurroundingWord(text, start);
|
||||
start = range.start;
|
||||
end = range.end;
|
||||
}
|
||||
if (start === end) return;
|
||||
|
||||
const selected = text.substring(start, end);
|
||||
const m = selected.match(/^\((.*):(-?[\d.]+)\)$/s);
|
||||
const inner = m ? m[1] : selected;
|
||||
let weight = (m ? parseFloat(m[2]) : 1.0) + delta;
|
||||
weight = Math.round(weight * 100) / 100;
|
||||
|
||||
const replacement = weight === 1.0 ? inner : `(${inner}:${weight.toFixed(2)})`;
|
||||
textarea.value = text.substring(0, start) + replacement + text.substring(end);
|
||||
textarea.setSelectionRange(start, start + replacement.length);
|
||||
});
|
||||
}
|
||||
|
||||
export const comfyEditor = {
|
||||
models: {
|
||||
checkpoints: [],
|
||||
@@ -199,6 +337,13 @@ export const comfyEditor = {
|
||||
}
|
||||
},
|
||||
|
||||
// ComfyUI(Windows)は"\"区切りでLoraのenumを返すため、内部の"/"区切り表記と突き合わせて実際の表記に変換する
|
||||
resolveLoraName(name) {
|
||||
const normalized = name.replace(/\\/g, "/");
|
||||
const found = this.models.loras.find((n) => n.replace(/\\/g, "/") === normalized);
|
||||
return found || name;
|
||||
},
|
||||
|
||||
renderAll(analysis, workflow) {
|
||||
this.renderPromptTab(analysis, "wfm-gen-prompt-fields");
|
||||
this.renderImageTab(analysis, "wfm-gen-image-fields");
|
||||
@@ -221,21 +366,23 @@ export const comfyEditor = {
|
||||
<div class="wfm-form-group">
|
||||
<label>Positive Prompt</label>
|
||||
<div style="display:flex;gap:8px;margin-bottom:6px;">
|
||||
<select id="wfm-prompt-pos-target" class="wfm-select" style="width:auto;flex:1">
|
||||
<select id="wfm-prompt-pos-target" class="wfm-select" style="width:auto;flex:1;min-width:0;">
|
||||
${positiveNodes.map((n) => `<option value="${n.id}" data-text-key="${n.textKey || "text"}" selected>ID:${n.id} (${n.title})</option>`).join("")}
|
||||
${nodeOpts}
|
||||
</select>
|
||||
<button class="wfm-btn wfm-btn-sm" id="wfm-prompt-pos-apply">Apply</button>
|
||||
<button class="wfm-btn wfm-btn-sm" id="wfm-prompt-pos-revert" title="${t("revertPromptTitle")}">↺</button>
|
||||
<button class="wfm-btn wfm-btn-sm" id="wfm-prompt-pos-apply" title="Apply (Alt+Click: Apply & Generate)">Apply</button>
|
||||
</div>
|
||||
<textarea class="wfm-textarea" id="wfm-prompt-pos-text" rows="6">${positiveNodes[0]?.text || ""}</textarea>
|
||||
</div>
|
||||
<div class="wfm-form-group">
|
||||
<label>Negative Prompt</label>
|
||||
<div style="display:flex;gap:8px;margin-bottom:6px;">
|
||||
<select id="wfm-prompt-neg-target" class="wfm-select" style="width:auto;flex:1">
|
||||
<select id="wfm-prompt-neg-target" class="wfm-select" style="width:auto;flex:1;min-width:0;">
|
||||
${negativeNodes.map((n) => `<option value="${n.id}" data-text-key="${n.textKey || "text"}" selected>ID:${n.id} (${n.title})</option>`).join("")}
|
||||
${nodeOpts}
|
||||
</select>
|
||||
<button class="wfm-btn wfm-btn-sm" id="wfm-prompt-neg-revert" title="${t("revertPromptTitle")}">↺</button>
|
||||
<button class="wfm-btn wfm-btn-sm" id="wfm-prompt-neg-apply">Apply</button>
|
||||
</div>
|
||||
<textarea class="wfm-textarea" id="wfm-prompt-neg-text" rows="6">${negativeNodes[0]?.text || ""}</textarea>
|
||||
@@ -254,7 +401,7 @@ export const comfyEditor = {
|
||||
</div>
|
||||
`;
|
||||
|
||||
document.getElementById("wfm-prompt-pos-apply")?.addEventListener("click", () => {
|
||||
document.getElementById("wfm-prompt-pos-apply")?.addEventListener("click", (e) => {
|
||||
const nodeId = document.getElementById("wfm-prompt-pos-target")?.value;
|
||||
const text = document.getElementById("wfm-prompt-pos-text")?.value;
|
||||
if (nodeId && comfyUI.currentWorkflow?.[nodeId]) {
|
||||
@@ -262,6 +409,7 @@ export const comfyEditor = {
|
||||
const textKey = promptNode?.textKey || "text";
|
||||
comfyUI.currentWorkflow[nodeId].inputs[textKey] = text;
|
||||
_syncRawJson();
|
||||
if (e.altKey) document.dispatchEvent(new CustomEvent("wfm:apply-and-generate"));
|
||||
}
|
||||
});
|
||||
|
||||
@@ -276,6 +424,27 @@ export const comfyEditor = {
|
||||
}
|
||||
});
|
||||
|
||||
// Revert: テキストエリアを直前にApplyされたノードの現在値へ戻す
|
||||
document.getElementById("wfm-prompt-pos-revert")?.addEventListener("click", () => {
|
||||
const nodeId = document.getElementById("wfm-prompt-pos-target")?.value;
|
||||
const wfNode = comfyUI.currentWorkflow?.[nodeId];
|
||||
const ta = document.getElementById("wfm-prompt-pos-text");
|
||||
if (!nodeId || !wfNode || !ta) return;
|
||||
const promptNode = (analysis.prompt_nodes || []).find(n => n.id === nodeId);
|
||||
const textKey = promptNode?.textKey || "text";
|
||||
ta.value = wfNode.inputs[textKey] ?? "";
|
||||
});
|
||||
|
||||
document.getElementById("wfm-prompt-neg-revert")?.addEventListener("click", () => {
|
||||
const nodeId = document.getElementById("wfm-prompt-neg-target")?.value;
|
||||
const wfNode = comfyUI.currentWorkflow?.[nodeId];
|
||||
const ta = document.getElementById("wfm-prompt-neg-text");
|
||||
if (!nodeId || !wfNode || !ta) return;
|
||||
const promptNode = (analysis.prompt_nodes || []).find(n => n.id === nodeId);
|
||||
const textKey = promptNode?.textKey || "text";
|
||||
ta.value = wfNode.inputs[textKey] ?? "";
|
||||
});
|
||||
|
||||
// Track last focused prompt textarea for Paste button
|
||||
["wfm-prompt-pos-text", "wfm-prompt-neg-text"].forEach((taId) => {
|
||||
const ta = document.getElementById(taId);
|
||||
@@ -285,6 +454,7 @@ export const comfyEditor = {
|
||||
_lastPromptFocus = { id: taId, selStart: ta.selectionStart, selEnd: ta.selectionEnd };
|
||||
});
|
||||
});
|
||||
_attachPromptWeightControl(ta);
|
||||
});
|
||||
|
||||
// Embedding filter
|
||||
@@ -353,6 +523,7 @@ export const comfyEditor = {
|
||||
.map((s) => {
|
||||
const models = this.models[s.key] || [];
|
||||
const currentVal = s.nodes?.[0]?.[s.inputKey] || "";
|
||||
const isMissing = !!currentVal && !models.includes(currentVal);
|
||||
const targetOpts = s.nodes
|
||||
.map((n) => `<option value="${n.id}">ID:${n.id} (${n.title})</option>`)
|
||||
.join("");
|
||||
@@ -371,13 +542,15 @@ export const comfyEditor = {
|
||||
<div class="wfm-form-group" style="border-bottom:1px solid var(--wfm-border);padding-bottom:12px;">
|
||||
<label>${s.label}</label>
|
||||
<input type="text" class="wfm-input wfm-model-filter" placeholder="Filter..." data-target="wfm-model-${s.key}" style="margin-bottom:4px;">
|
||||
<select class="wfm-select" id="wfm-model-${s.key}" style="margin-bottom:4px;">
|
||||
<select class="wfm-select ${isMissing ? "wfm-select-missing" : ""}" id="wfm-model-${s.key}" style="margin-bottom:4px;">
|
||||
${isMissing ? `<option value="${escapeHtml(currentVal)}" selected>⚠ ${escapeHtml(currentVal)} (${t("modelNotFound")})</option>` : ""}
|
||||
${models.map((m) => `<option value="${m}" ${m === currentVal ? "selected" : ""}>${m}</option>`).join("")}
|
||||
</select>
|
||||
${isMissing ? `<div class="wfm-model-missing-hint">${t("modelNotFoundHint")}</div>` : ""}
|
||||
${extrasHtml}
|
||||
<div style="display:flex;gap:8px;align-items:center;margin-top:4px;">
|
||||
<select class="wfm-select" id="wfm-model-${s.key}-target" style="flex:1;">${targetOpts}</select>
|
||||
<button class="wfm-btn wfm-btn-sm wfm-model-apply" data-key="${s.key}" data-input="${s.inputKey}">Apply</button>
|
||||
<button class="wfm-btn wfm-btn-sm wfm-model-apply" data-key="${s.key}" data-input="${s.inputKey}" title="Apply (Alt+Click: Apply & Generate)">Apply</button>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
@@ -402,7 +575,7 @@ export const comfyEditor = {
|
||||
|
||||
// Apply buttons
|
||||
el.querySelectorAll(".wfm-model-apply").forEach((btn) => {
|
||||
btn.addEventListener("click", () => {
|
||||
btn.addEventListener("click", (e) => {
|
||||
const key = btn.dataset.key;
|
||||
let inputKey = btn.dataset.input;
|
||||
const select = document.getElementById(`wfm-model-${key}`);
|
||||
@@ -424,6 +597,7 @@ export const comfyEditor = {
|
||||
if (!isNaN(exVal)) comfyUI.currentWorkflow[nodeId].inputs[exInputKey] = exVal;
|
||||
});
|
||||
_syncRawJson();
|
||||
if (e.altKey) document.dispatchEvent(new CustomEvent("wfm:apply-and-generate"));
|
||||
}
|
||||
});
|
||||
});
|
||||
@@ -783,7 +957,7 @@ export const comfyEditor = {
|
||||
} else {
|
||||
const first = stackModels[0];
|
||||
if (first) {
|
||||
comfyUI.currentWorkflow[nodeId].inputs.lora_name = first;
|
||||
comfyUI.currentWorkflow[nodeId].inputs.lora_name = comfyEditor.resolveLoraName(first);
|
||||
comfyUI.currentWorkflow[nodeId].inputs.strength_model = _stackStrengths[first]?.m ?? 1.0;
|
||||
comfyUI.currentWorkflow[nodeId].inputs.strength_clip = _stackStrengths[first]?.c ?? 1.0;
|
||||
}
|
||||
@@ -890,7 +1064,7 @@ export const comfyEditor = {
|
||||
<label>Denoise</label>
|
||||
<input type="number" class="wfm-input" id="wfm-settings-denoise" value="${sampler.denoise ?? 1.0}" step="0.05" min="0" max="1">
|
||||
</div>
|
||||
<button class="wfm-btn wfm-btn-sm" id="wfm-settings-sampler-apply">Apply</button>
|
||||
<button class="wfm-btn wfm-btn-sm" id="wfm-settings-sampler-apply" title="Apply (Alt+Click: Apply & Generate)">Apply</button>
|
||||
` : "<p class='wfm-placeholder'>No KSampler node found</p>"}
|
||||
</div>
|
||||
<div style="flex:1;min-width:0;padding-left:14px;">
|
||||
@@ -934,7 +1108,7 @@ export const comfyEditor = {
|
||||
</div>
|
||||
`;
|
||||
|
||||
document.getElementById("wfm-settings-sampler-apply")?.addEventListener("click", () => {
|
||||
document.getElementById("wfm-settings-sampler-apply")?.addEventListener("click", (e) => {
|
||||
const nodeId = document.getElementById("wfm-settings-sampler-id")?.value;
|
||||
if (!nodeId || !comfyUI.currentWorkflow?.[nodeId]) return;
|
||||
const inputs = comfyUI.currentWorkflow[nodeId].inputs;
|
||||
@@ -947,6 +1121,7 @@ export const comfyEditor = {
|
||||
inputs.scheduler = document.getElementById("wfm-settings-scheduler")?.value;
|
||||
inputs.denoise = parseFloat(document.getElementById("wfm-settings-denoise")?.value) || 1.0;
|
||||
_syncRawJson();
|
||||
if (e.altKey) document.dispatchEvent(new CustomEvent("wfm:apply-and-generate"));
|
||||
});
|
||||
|
||||
document.getElementById("wfm-settings-latent-apply")?.addEventListener("click", () => {
|
||||
@@ -1027,14 +1202,18 @@ export const comfyEditor = {
|
||||
if (!el) return;
|
||||
|
||||
const loadNodes = analysis.load_image_nodes || [];
|
||||
if (loadNodes.length === 0) {
|
||||
el.innerHTML = `<p class="wfm-placeholder">No LoadImage nodes found in workflow</p>`;
|
||||
const meoNodes = analysis.mask_editor_one_nodes || [];
|
||||
if (loadNodes.length === 0 && meoNodes.length === 0) {
|
||||
el.innerHTML = `<p class="wfm-placeholder">No LoadImage / Mask Editor One nodes found in workflow</p>`;
|
||||
return;
|
||||
}
|
||||
|
||||
// Render up to 4 image input slots
|
||||
const slots = loadNodes.slice(0, 4);
|
||||
// Mask Editor One ノード（画像+マスクを内包、常に両方必須）— 別枠で最大2件表示
|
||||
const meoSlots = meoNodes.slice(0, 2);
|
||||
el.innerHTML = `
|
||||
${slots.length === 0 ? "" : `
|
||||
<div class="wfm-i2i-grid">
|
||||
${slots.map((node, i) => `
|
||||
<div class="wfm-i2i-slot" data-slot="${i}" data-node-id="${node.id}">
|
||||
@@ -1051,6 +1230,23 @@ export const comfyEditor = {
|
||||
<input type="file" accept="image/*" class="wfm-i2i-file" id="wfm-i2i-file-${i}" style="display:none;">
|
||||
</label>
|
||||
</div>
|
||||
${node.mask_used ? `
|
||||
<div class="wfm-i2i-mask-section">
|
||||
<div class="wfm-i2i-mask-header">
|
||||
<span>Mask</span>
|
||||
<span class="wfm-i2i-mask-filename" id="wfm-i2i-mask-filename-${i}"></span>
|
||||
</div>
|
||||
<div class="wfm-i2i-preview-wrap wfm-i2i-mask-preview-wrap" id="wfm-i2i-mask-preview-wrap-${i}" style="display:none;">
|
||||
<img class="wfm-i2i-preview-img" id="wfm-i2i-mask-preview-${i}">
|
||||
</div>
|
||||
<div class="wfm-i2i-drop-zone wfm-i2i-mask-drop-zone" id="wfm-i2i-mask-drop-${i}">
|
||||
<label class="wfm-i2i-drop-label">
|
||||
Drop mask (white=inpaint) or click to select
|
||||
<input type="file" accept="image/*" class="wfm-i2i-file" id="wfm-i2i-mask-file-${i}" style="display:none;">
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
` : ""}
|
||||
<div style="display:flex;gap:6px;margin-top:6px;">
|
||||
<button class="wfm-btn wfm-btn-sm wfm-btn-primary wfm-i2i-apply" data-slot="${i}" disabled>Apply</button>
|
||||
<span class="wfm-i2i-status" id="wfm-i2i-status-${i}"></span>
|
||||
@@ -1058,6 +1254,46 @@ export const comfyEditor = {
|
||||
</div>
|
||||
`).join("")}
|
||||
</div>
|
||||
`}
|
||||
${meoSlots.length === 0 ? "" : `
|
||||
<div class="wfm-i2i-grid" style="margin-top:12px;">
|
||||
${meoSlots.map((node, i) => `
|
||||
<div class="wfm-i2i-slot" data-meo-slot="${i}" data-node-id="${node.id}">
|
||||
<div class="wfm-i2i-slot-header">
|
||||
<span style="font-weight:600;font-size:12px;">ID:${node.id} ${node.title} (Mask Editor One)</span>
|
||||
</div>
|
||||
<div class="wfm-i2i-preview-wrap" id="wfm-meo-preview-wrap-${i}" style="display:none;">
|
||||
<img class="wfm-i2i-preview-img" id="wfm-meo-preview-${i}">
|
||||
</div>
|
||||
<div class="wfm-i2i-drop-zone" id="wfm-meo-drop-${i}">
|
||||
<label class="wfm-i2i-drop-label">
|
||||
Drop image or click to select
|
||||
<input type="file" accept="image/*" class="wfm-i2i-file" id="wfm-meo-file-${i}" style="display:none;">
|
||||
</label>
|
||||
</div>
|
||||
<div class="wfm-i2i-mask-section">
|
||||
<div class="wfm-i2i-mask-header">
|
||||
<span>Mask</span>
|
||||
<span class="wfm-i2i-mask-filename" id="wfm-meo-mask-filename-${i}"></span>
|
||||
</div>
|
||||
<div class="wfm-i2i-preview-wrap wfm-i2i-mask-preview-wrap" id="wfm-meo-mask-preview-wrap-${i}" style="display:none;">
|
||||
<img class="wfm-i2i-preview-img" id="wfm-meo-mask-preview-${i}">
|
||||
</div>
|
||||
<div class="wfm-i2i-drop-zone wfm-i2i-mask-drop-zone" id="wfm-meo-mask-drop-${i}">
|
||||
<label class="wfm-i2i-drop-label">
|
||||
Drop mask (white=inpaint) or click to select
|
||||
<input type="file" accept="image/*" class="wfm-i2i-file" id="wfm-meo-mask-file-${i}" style="display:none;">
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display:flex;gap:6px;margin-top:6px;">
|
||||
<button class="wfm-btn wfm-btn-sm wfm-btn-primary wfm-meo-apply" data-slot="${i}" disabled>Apply</button>
|
||||
<span class="wfm-i2i-status" id="wfm-meo-status-${i}"></span>
|
||||
</div>
|
||||
</div>
|
||||
`).join("")}
|
||||
</div>
|
||||
`}
|
||||
`;
|
||||
|
||||
// Initialize each slot
|
||||
@@ -1069,7 +1305,13 @@ export const comfyEditor = {
|
||||
const filenameEl = document.getElementById(`wfm-i2i-filename-${i}`);
|
||||
const statusEl = document.getElementById(`wfm-i2i-status-${i}`);
|
||||
const dropZone = document.getElementById(`wfm-i2i-drop-${i}`);
|
||||
const maskFileInput = document.getElementById(`wfm-i2i-mask-file-${i}`);
|
||||
const maskDropZone = document.getElementById(`wfm-i2i-mask-drop-${i}`);
|
||||
const maskPreviewWrap = document.getElementById(`wfm-i2i-mask-preview-wrap-${i}`);
|
||||
const maskPreviewImg = document.getElementById(`wfm-i2i-mask-preview-${i}`);
|
||||
const maskFilenameEl = document.getElementById(`wfm-i2i-mask-filename-${i}`);
|
||||
let pendingFile = null;
|
||||
let pendingMaskFile = null;
|
||||
|
||||
const applyFile = (file) => {
|
||||
if (!file || !file.type.startsWith("image/")) return;
|
||||
@@ -1082,10 +1324,24 @@ export const comfyEditor = {
|
||||
statusEl.textContent = "";
|
||||
};
|
||||
|
||||
const applyMaskFile = (file) => {
|
||||
if (!file || !file.type.startsWith("image/")) return;
|
||||
pendingMaskFile = file;
|
||||
const url = URL.createObjectURL(file);
|
||||
maskPreviewImg.src = url;
|
||||
maskPreviewWrap.style.display = "";
|
||||
maskFilenameEl.textContent = file.name;
|
||||
applyBtn.disabled = false;
|
||||
statusEl.textContent = "";
|
||||
};
|
||||
|
||||
// File input change
|
||||
fileInput?.addEventListener("change", () => {
|
||||
if (fileInput.files.length > 0) applyFile(fileInput.files[0]);
|
||||
});
|
||||
maskFileInput?.addEventListener("change", () => {
|
||||
if (maskFileInput.files.length > 0) applyMaskFile(maskFileInput.files[0]);
|
||||
});
|
||||
|
||||
// Drag & drop
|
||||
if (dropZone) {
|
||||
@@ -1102,14 +1358,39 @@ export const comfyEditor = {
|
||||
if (e.dataTransfer.files.length > 0) applyFile(e.dataTransfer.files[0]);
|
||||
});
|
||||
}
|
||||
if (maskDropZone) {
|
||||
maskDropZone.addEventListener("dragover", (e) => {
|
||||
e.preventDefault();
|
||||
maskDropZone.classList.add("drag-over");
|
||||
});
|
||||
maskDropZone.addEventListener("dragleave", () => {
|
||||
maskDropZone.classList.remove("drag-over");
|
||||
});
|
||||
maskDropZone.addEventListener("drop", (e) => {
|
||||
e.preventDefault();
|
||||
maskDropZone.classList.remove("drag-over");
|
||||
if (e.dataTransfer.files.length > 0) applyMaskFile(e.dataTransfer.files[0]);
|
||||
});
|
||||
}
|
||||
|
||||
// Apply button: upload to ComfyUI and set on node
|
||||
// (マスクが指定されている場合は画像+マスクをRGBA合成して1枚のPNGとしてアップロードする)
|
||||
applyBtn?.addEventListener("click", async () => {
|
||||
if (!pendingFile) return;
|
||||
if (!pendingFile && !pendingMaskFile) return;
|
||||
applyBtn.disabled = true;
|
||||
statusEl.textContent = "Uploading...";
|
||||
try {
|
||||
const result = await comfyUI.uploadImage(pendingFile, pendingFile.name);
|
||||
let result;
|
||||
if (pendingMaskFile) {
|
||||
const baseImage = pendingFile || previewImg.src;
|
||||
if (!baseImage) throw new Error("No base image to apply mask to");
|
||||
const composedBlob = await _compositeImageWithMask(baseImage, pendingMaskFile);
|
||||
const fileName = (pendingFile?.name || node.image || "inpaint.png").replace(/\.[^.]+$/, "") + "_masked.png";
|
||||
const composedFile = new File([composedBlob], fileName, { type: "image/png" });
|
||||
result = await comfyUI.uploadImage(composedFile, fileName);
|
||||
} else {
|
||||
result = await comfyUI.uploadImage(pendingFile, pendingFile.name);
|
||||
}
|
||||
if (result.name) {
|
||||
// Update workflow node
|
||||
if (comfyUI.currentWorkflow?.[node.id]) {
|
||||
@@ -1129,20 +1410,97 @@ export const comfyEditor = {
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Initialize each Mask Editor One slot（画像+マスク両方が揃って初めてApply可能）
|
||||
meoSlots.forEach((node, i) => {
|
||||
const fileInput = document.getElementById(`wfm-meo-file-${i}`);
|
||||
const maskFileInput = document.getElementById(`wfm-meo-mask-file-${i}`);
|
||||
const dropZone = document.getElementById(`wfm-meo-drop-${i}`);
|
||||
const maskDropZone = document.getElementById(`wfm-meo-mask-drop-${i}`);
|
||||
const previewWrap = document.getElementById(`wfm-meo-preview-wrap-${i}`);
|
||||
const previewImg = document.getElementById(`wfm-meo-preview-${i}`);
|
||||
const maskPreviewWrap = document.getElementById(`wfm-meo-mask-preview-wrap-${i}`);
|
||||
const maskPreviewImg = document.getElementById(`wfm-meo-mask-preview-${i}`);
|
||||
const maskFilenameEl = document.getElementById(`wfm-meo-mask-filename-${i}`);
|
||||
const applyBtn = el.querySelector(`.wfm-meo-apply[data-slot="${i}"]`);
|
||||
const statusEl = document.getElementById(`wfm-meo-status-${i}`);
|
||||
let pendingFile = null;
|
||||
let pendingMaskFile = null;
|
||||
|
||||
const updateApplyEnabled = () => { applyBtn.disabled = !(pendingFile && pendingMaskFile); };
|
||||
|
||||
const applyFile = (file) => {
|
||||
if (!file || !file.type.startsWith("image/")) return;
|
||||
pendingFile = file;
|
||||
previewImg.src = URL.createObjectURL(file);
|
||||
previewWrap.style.display = "";
|
||||
statusEl.textContent = "";
|
||||
updateApplyEnabled();
|
||||
};
|
||||
const applyMaskFile = (file) => {
|
||||
if (!file || !file.type.startsWith("image/")) return;
|
||||
pendingMaskFile = file;
|
||||
maskPreviewImg.src = URL.createObjectURL(file);
|
||||
maskPreviewWrap.style.display = "";
|
||||
maskFilenameEl.textContent = file.name;
|
||||
statusEl.textContent = "";
|
||||
updateApplyEnabled();
|
||||
};
|
||||
|
||||
fileInput?.addEventListener("change", () => {
|
||||
if (fileInput.files.length > 0) applyFile(fileInput.files[0]);
|
||||
});
|
||||
maskFileInput?.addEventListener("change", () => {
|
||||
if (maskFileInput.files.length > 0) applyMaskFile(maskFileInput.files[0]);
|
||||
});
|
||||
|
||||
[[dropZone, applyFile], [maskDropZone, applyMaskFile]].forEach(([zone, handler]) => {
|
||||
if (!zone) return;
|
||||
zone.addEventListener("dragover", (e) => { e.preventDefault(); zone.classList.add("drag-over"); });
|
||||
zone.addEventListener("dragleave", () => zone.classList.remove("drag-over"));
|
||||
zone.addEventListener("drop", (e) => {
|
||||
e.preventDefault();
|
||||
zone.classList.remove("drag-over");
|
||||
if (e.dataTransfer.files.length > 0) handler(e.dataTransfer.files[0]);
|
||||
});
|
||||
});
|
||||
|
||||
applyBtn?.addEventListener("click", async () => {
|
||||
if (!pendingFile || !pendingMaskFile) return;
|
||||
applyBtn.disabled = true;
|
||||
statusEl.textContent = "Uploading...";
|
||||
try {
|
||||
await this.applyImageAndMaskToMaskEditorOneNode(pendingFile, pendingMaskFile, node.id);
|
||||
statusEl.textContent = "✓ Applied";
|
||||
statusEl.style.color = "var(--wfm-success)";
|
||||
} catch (err) {
|
||||
statusEl.textContent = `✗ ${err.message}`;
|
||||
statusEl.style.color = "var(--wfm-danger)";
|
||||
applyBtn.disabled = false;
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
async applyImageToSlot(file, slotIndex = 0) {
|
||||
const loadNodes = comfyUI.currentAnalysis?.load_image_nodes || [];
|
||||
// opts.workflow/opts.analysis を渡すと comfyUI.currentWorkflow/currentAnalysis の代わりに
|
||||
// そちらへ書き込み、DOM更新は行わずアップロード後のファイル名だけを返す
|
||||
// （GenerateUIタブの表示状態には触れない。Chatペインの画像添付I2I連携から利用）。
|
||||
async applyImageToSlot(file, slotIndex = 0, opts = {}) {
|
||||
const workflow = opts.workflow || comfyUI.currentWorkflow;
|
||||
const analysis = opts.analysis || comfyUI.currentAnalysis;
|
||||
const loadNodes = analysis?.load_image_nodes || [];
|
||||
const node = loadNodes[slotIndex];
|
||||
if (!node) throw new Error("No LoadImage node at slot " + slotIndex);
|
||||
|
||||
const result = await comfyUI.uploadImage(file, file.name);
|
||||
if (!result.name) throw new Error("Upload returned no filename");
|
||||
|
||||
if (comfyUI.currentWorkflow?.[node.id]) {
|
||||
comfyUI.currentWorkflow[node.id].inputs.image = result.name;
|
||||
if (workflow?.[node.id]) {
|
||||
workflow[node.id].inputs.image = result.name;
|
||||
}
|
||||
|
||||
if (opts.workflow) return result.name;
|
||||
|
||||
const previewWrap = document.getElementById(`wfm-i2i-preview-wrap-${slotIndex}`);
|
||||
const previewImg = document.getElementById(`wfm-i2i-preview-${slotIndex}`);
|
||||
const filenameEl = document.getElementById(`wfm-i2i-filename-${slotIndex}`);
|
||||
@@ -1161,6 +1519,113 @@ export const comfyEditor = {
|
||||
return result.name;
|
||||
},
|
||||
|
||||
// imageInput/maskInput: File/Blob いずれも可。マスクは白=インペイント対象領域のグレースケール想定。
|
||||
// 画像とマスクをRGBA合成し、1枚のPNGとして対象LoadImageノードへアップロードする
|
||||
// （ComfyUIネイティブのアルファ→MASK抽出に準拠。Image Edit「Inpaint」タブのRunボタンから利用）。
|
||||
// opts.workflow/opts.analysis を渡すと、comfyUI.currentWorkflow/currentAnalysis の代わりに
|
||||
// そのワークフローへ書き込む（GenerateUIタブの表示・DOM更新は行わない。専用ワークフロー実行用）。
|
||||
async applyImageAndMaskToSlot(imageInput, maskInput, slotIndex = 0, opts = {}) {
|
||||
const workflow = opts.workflow || comfyUI.currentWorkflow;
|
||||
const analysis = opts.analysis || comfyUI.currentAnalysis;
|
||||
const loadNodes = analysis?.load_image_nodes || [];
|
||||
const node = loadNodes[slotIndex];
|
||||
if (!node) throw new Error("No LoadImage node at slot " + slotIndex);
|
||||
|
||||
const composedBlob = await _compositeImageWithMask(imageInput, maskInput);
|
||||
const fileName = `inpaint_${Math.random().toString(36).slice(2, 10)}.png`;
|
||||
const composedFile = new File([composedBlob], fileName, { type: "image/png" });
|
||||
|
||||
const result = await comfyUI.uploadImage(composedFile, fileName);
|
||||
if (!result.name) throw new Error("Upload returned no filename");
|
||||
|
||||
if (workflow?.[node.id]) {
|
||||
workflow[node.id].inputs.image = result.name;
|
||||
}
|
||||
|
||||
if (opts.workflow) return result.name;
|
||||
|
||||
const previewWrap = document.getElementById(`wfm-i2i-preview-wrap-${slotIndex}`);
|
||||
const previewImg = document.getElementById(`wfm-i2i-preview-${slotIndex}`);
|
||||
const filenameEl = document.getElementById(`wfm-i2i-filename-${slotIndex}`);
|
||||
const statusEl = document.getElementById(`wfm-i2i-status-${slotIndex}`);
|
||||
const applyBtn = document.querySelector(`.wfm-i2i-apply[data-slot="${slotIndex}"]`);
|
||||
|
||||
if (previewImg) {
|
||||
previewImg.src = `/view?filename=${encodeURIComponent(result.name)}&type=input`;
|
||||
if (previewWrap) previewWrap.style.display = "";
|
||||
}
|
||||
if (filenameEl) filenameEl.textContent = result.name;
|
||||
if (statusEl) { statusEl.textContent = `✓ ${result.name}`; statusEl.style.color = "var(--wfm-success)"; }
|
||||
if (applyBtn) applyBtn.disabled = true;
|
||||
|
||||
_syncRawJson();
|
||||
return result.name;
|
||||
},
|
||||
|
||||
// imageInput/maskInput: File/Blob いずれも可。マスクは白=インペイント対象領域のグレースケール想定。
|
||||
// Mask Editor One (comfyui-mask-editor-one) ノード向け。画像はサーバー側キャッシュへ
|
||||
// /mask_editor/store_image でPOSHし（node_idキー、bg_image_b64）、マスクは layer_data
|
||||
// ウィジェットへ「アルファチャンネル=mask値」のレイヤーとして書き込む。
|
||||
// opts.workflow を渡すと comfyUI.currentWorkflow の代わりにそのワークフローへ書き込む。
|
||||
async applyImageAndMaskToMaskEditorOneNode(imageInput, maskInput, nodeId, opts = {}) {
|
||||
const workflow = opts.workflow || comfyUI.currentWorkflow;
|
||||
const bgDataUrl = await _imageInputToDataURL(imageInput);
|
||||
const maskDataUrl = await _maskInputToAlphaDataURL(maskInput);
|
||||
|
||||
const resp = await fetch(`${comfyUI.baseUrl}/mask_editor/store_image`, {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({ node_id: String(nodeId), bg_image_b64: bgDataUrl }),
|
||||
});
|
||||
if (!resp.ok) throw new Error(`Failed to store image for Mask Editor One (node ${nodeId})`);
|
||||
|
||||
if (workflow?.[nodeId]) {
|
||||
workflow[nodeId].inputs.layer_data = JSON.stringify({
|
||||
layers: [{ visible: true, opacity: 1, operation: "add", imageData: maskDataUrl }],
|
||||
});
|
||||
}
|
||||
|
||||
if (!opts.workflow) _syncRawJson();
|
||||
},
|
||||
|
||||
// Inpaint Run から呼ばれるポジ/ネガプロンプト設定。
|
||||
// opts.workflow/opts.analysis を渡すと、GenerateUIタブの選択中ターゲット（DOM）に依存せず、
|
||||
// そのワークフロー内の最初の該当role prompt_nodeへ直接反映する（専用ワークフロー実行用）。
|
||||
setPromptText(role, text, opts = {}) {
|
||||
if (opts.workflow && opts.analysis) {
|
||||
const node = (opts.analysis.prompt_nodes || []).find((n) => n.role === role);
|
||||
if (node && opts.workflow[node.id]) {
|
||||
opts.workflow[node.id].inputs[node.textKey || "text"] = text;
|
||||
}
|
||||
return;
|
||||
}
|
||||
const textareaId = role === "positive" ? "wfm-prompt-pos-text" : "wfm-prompt-neg-text";
|
||||
const textarea = document.getElementById(textareaId);
|
||||
if (textarea) textarea.value = text;
|
||||
this.syncToWorkflow();
|
||||
_syncRawJson();
|
||||
},
|
||||
|
||||
// Inpaint Run から呼ばれる grow_mask_by / denoise 設定。
|
||||
// ワークフロー内の最初の VAEEncodeForInpaint ノード / denoise を持つ最初の sampler ノードへ反映する
|
||||
// （複数のインペイントパイプラインが同一ワークフローに存在するケースは現状非対応）。
|
||||
// workflow/analysis を渡すと comfyUI.currentWorkflow/currentAnalysis の代わりにそちらへ書き込む。
|
||||
setInpaintParams({ growMaskBy, denoise, workflow, analysis } = {}) {
|
||||
const wf = workflow || comfyUI.currentWorkflow;
|
||||
const an = analysis || comfyUI.currentAnalysis;
|
||||
const encodeNode = an?.inpaint_encode_nodes?.[0];
|
||||
if (encodeNode && growMaskBy != null && wf?.[encodeNode.id]) {
|
||||
wf[encodeNode.id].inputs.grow_mask_by = growMaskBy;
|
||||
}
|
||||
|
||||
const samplerNode = (an?.sampler_nodes || []).find((n) => n.denoise !== undefined);
|
||||
if (samplerNode && denoise != null && wf?.[samplerNode.id]) {
|
||||
wf[samplerNode.id].inputs.denoise = denoise;
|
||||
}
|
||||
|
||||
if (!workflow) _syncRawJson();
|
||||
},
|
||||
|
||||
syncToWorkflow() {
|
||||
// Sync prompt texts before generation
|
||||
const posSelect = document.getElementById("wfm-prompt-pos-target");
|
||||
|
||||
+281
-15
@@ -5,6 +5,50 @@
|
||||
// Cache for /object_info (loaded once, shared)
|
||||
let _objectInfoCache = null;
|
||||
|
||||
// convertUiToApi() の COMBO フォールバック（未一致時に選択肢の先頭へ無警告で差し替え）が
|
||||
// ckpt_name に対して発生した場合の記録。呼び出し元が読み込み直後に確認して警告表示できるよう、
|
||||
// 直近の convertUiToApi() 呼び出し分だけを保持する。
|
||||
let _lastCheckpointSubstitutions = [];
|
||||
|
||||
// convertUiToApi() で除外された Bypass(mode:4) / Mute(mode:2) ノードの記録。
|
||||
// API形式には mode 情報が残らないため、呼び出し元がRaw JSON表示時に
|
||||
// 「このワークフローにはバイパス/ミュート中のノードがあった」と伝えられるよう、
|
||||
// 直近の convertUiToApi() 呼び出し分だけを保持する。
|
||||
let _lastBypassedNodes = [];
|
||||
let _lastMutedNodes = [];
|
||||
|
||||
/**
|
||||
* Trace a link's source through any Bypass-mode (mode 4) nodes, matching each bypassed
|
||||
* node's output slot to an input slot of the same type and following the connection
|
||||
* upstream (recursively, for chained bypasses). Mirrors ComfyUI's own Bypass behavior,
|
||||
* where a bypassed node is removed but its wires are reconnected end-to-end.
|
||||
* Returns null when no pass-through source exists (the matching input is unconnected),
|
||||
* in which case the caller should treat the input as unlinked.
|
||||
*/
|
||||
function _resolveBypassSource(nodeById, linkMap, nodeId, slot, visited) {
|
||||
const idStr = String(nodeId);
|
||||
const node = nodeById[idStr];
|
||||
if (!node || node.mode !== 4) return [idStr, slot];
|
||||
if (visited.has(idStr)) return null; // circular bypass chain guard
|
||||
|
||||
visited.add(idStr);
|
||||
const outputs = node.outputs || [];
|
||||
const inputs = node.inputs || [];
|
||||
const outType = outputs[slot]?.type;
|
||||
|
||||
let inIdx = -1;
|
||||
if (inputs[slot]?.type === outType && linkMap[idStr]?.[slot]) {
|
||||
inIdx = slot;
|
||||
} else {
|
||||
inIdx = inputs.findIndex((inp, i) => inp.type === outType && linkMap[idStr]?.[i]);
|
||||
}
|
||||
if (inIdx === -1) return null;
|
||||
|
||||
const upstream = linkMap[idStr][inIdx];
|
||||
if (!upstream) return null;
|
||||
return _resolveBypassSource(nodeById, linkMap, upstream[0], upstream[1], visited);
|
||||
}
|
||||
|
||||
async function _loadObjectInfo() {
|
||||
if (_objectInfoCache) return _objectInfoCache;
|
||||
try {
|
||||
@@ -37,7 +81,7 @@ function _getWidgetInputNames(objectInfo, classType) {
|
||||
names.push(name);
|
||||
} else if (typeof type === "string") {
|
||||
const upper = type.toUpperCase();
|
||||
if (upper === "INT" || upper === "FLOAT" || upper === "STRING" || upper === "BOOLEAN" || upper === "COMBO") {
|
||||
if (upper === "INT" || upper === "FLOAT" || upper === "STRING" || upper === "BOOLEAN" || upper === "COMBO" || upper === "COMFY_DYNAMICCOMBO_V3") {
|
||||
names.push(name);
|
||||
}
|
||||
// Other uppercase types (MODEL, CLIP, etc.) are link inputs, skip
|
||||
@@ -51,7 +95,7 @@ function _getWidgetInputNames(objectInfo, classType) {
|
||||
names.push(name);
|
||||
} else if (typeof type === "string") {
|
||||
const upper = type.toUpperCase();
|
||||
if (upper === "INT" || upper === "FLOAT" || upper === "STRING" || upper === "BOOLEAN") {
|
||||
if (upper === "INT" || upper === "FLOAT" || upper === "STRING" || upper === "BOOLEAN" || upper === "COMFY_DYNAMICCOMBO_V3") {
|
||||
names.push(name);
|
||||
}
|
||||
}
|
||||
@@ -62,7 +106,7 @@ function _getWidgetInputNames(objectInfo, classType) {
|
||||
|
||||
/**
|
||||
* Get ordered widget input types for a node class (parallel to _getWidgetInputNames).
|
||||
* Returns type info: "INT", "FLOAT", "STRING", "BOOLEAN", or "COMBO".
|
||||
* Returns type info: "INT", "FLOAT", "STRING", "BOOLEAN", "COMBO", or "COMFY_DYNAMICCOMBO_V3".
|
||||
*/
|
||||
function _getWidgetInputTypes(objectInfo, classType) {
|
||||
const info = objectInfo[classType];
|
||||
@@ -77,7 +121,7 @@ function _getWidgetInputTypes(objectInfo, classType) {
|
||||
types.push("COMBO");
|
||||
} else if (typeof type === "string") {
|
||||
const upper = type.toUpperCase();
|
||||
if (upper === "INT" || upper === "FLOAT" || upper === "STRING" || upper === "BOOLEAN" || upper === "COMBO") {
|
||||
if (upper === "INT" || upper === "FLOAT" || upper === "STRING" || upper === "BOOLEAN" || upper === "COMBO" || upper === "COMFY_DYNAMICCOMBO_V3") {
|
||||
types.push(upper);
|
||||
}
|
||||
}
|
||||
@@ -88,7 +132,7 @@ function _getWidgetInputTypes(objectInfo, classType) {
|
||||
types.push("COMBO");
|
||||
} else if (typeof type === "string") {
|
||||
const upper = type.toUpperCase();
|
||||
if (upper === "INT" || upper === "FLOAT" || upper === "STRING" || upper === "BOOLEAN" || upper === "COMBO") {
|
||||
if (upper === "INT" || upper === "FLOAT" || upper === "STRING" || upper === "BOOLEAN" || upper === "COMBO" || upper === "COMFY_DYNAMICCOMBO_V3") {
|
||||
types.push(upper);
|
||||
}
|
||||
}
|
||||
@@ -96,6 +140,19 @@ function _getWidgetInputTypes(objectInfo, classType) {
|
||||
return types;
|
||||
}
|
||||
|
||||
/**
|
||||
* Resolve the sub-input names for a DynamicCombo's currently-selected option.
|
||||
* objectInfo spec shape: ["COMFY_DYNAMICCOMBO_V3", { options: [{ key, inputs: { required: {...} } }, ...] }]
|
||||
*/
|
||||
function _getDynamicComboSubNames(objectInfo, classType, widgetName, selectedKey) {
|
||||
const info = objectInfo[classType];
|
||||
const spec = info?.input?.required?.[widgetName] || info?.input?.optional?.[widgetName];
|
||||
const options = spec?.[1]?.options;
|
||||
if (!Array.isArray(options)) return [];
|
||||
const opt = options.find((o) => o.key === selectedKey) || options[0];
|
||||
return Object.keys(opt?.inputs?.required || {});
|
||||
}
|
||||
|
||||
/**
|
||||
* Detect if a widget value is a frontend-only extra (like "control_after_generate").
|
||||
* These values appear in widgets_values but are not in object_info inputs.
|
||||
@@ -123,10 +180,17 @@ function _isExtraWidgetValue(val, expectedType) {
|
||||
*
|
||||
* Strategy: expand internal nodes into the parent, redirect parent links through
|
||||
* the boundary ports, and convert internal links from object to array format.
|
||||
* Widget values in internal nodes are preserved as-is (they are synced at save time
|
||||
* by ComfyUI frontend). convertUiToApi handles widget mapping via object_info.
|
||||
*
|
||||
* Widget values: the outer subgraph node's own widgets_values hold the values actually
|
||||
* set via the subgraph's collapsed form (what the user sees/edits). The internal nodes'
|
||||
* widgets_values, stored in the subgraph template (definitions.subgraphs[].nodes), are
|
||||
* only stale defaults from when the template was authored — ComfyUI does NOT keep them
|
||||
* synced in saved workflow JSON. Un-linked outer widget inputs are therefore copied onto
|
||||
* the matching internal node's widgets_values (via objectInfo to get the correct index,
|
||||
* since the internal node's real class type is known). Linked outer inputs are left to
|
||||
* the "Redirect parent links" step above, which takes priority.
|
||||
*/
|
||||
function _flattenSubgraphs(workflow) {
|
||||
function _flattenSubgraphs(workflow, objectInfo) {
|
||||
const defs = workflow.definitions?.subgraphs;
|
||||
if (!defs || defs.length === 0) return workflow;
|
||||
|
||||
@@ -192,6 +256,12 @@ function _flattenSubgraphs(workflow) {
|
||||
}
|
||||
|
||||
// === Redirect parent links ===
|
||||
// Track which {internal node, input slot} pairs end up resolved by a real outer
|
||||
// link after redirection — needed below to tell apart "boundary-only" links
|
||||
// (prompt/model-name ports that are actually widget values, see injection step)
|
||||
// from ports that truly carry a link end-to-end (e.g. width/height wired to a
|
||||
// ResolutionSelector node).
|
||||
const redirectedTargets = new Set();
|
||||
for (const link of wf.links) {
|
||||
if (link[3] === node.id) {
|
||||
const dstSlot = link[4];
|
||||
@@ -204,6 +274,7 @@ function _flattenSubgraphs(workflow) {
|
||||
if (target) {
|
||||
link[3] = target.targetNodeId;
|
||||
link[4] = target.targetSlot;
|
||||
redirectedTargets.add(`${target.targetNodeId}:${target.targetSlot}`);
|
||||
}
|
||||
}
|
||||
if (link[1] === node.id) {
|
||||
@@ -217,12 +288,82 @@ function _flattenSubgraphs(workflow) {
|
||||
}
|
||||
|
||||
// === Add internal nodes (remapped IDs) ===
|
||||
const remappedByOrigId = {};
|
||||
const normalizedNodeIds = new Set();
|
||||
for (const iNode of sgDef.nodes) {
|
||||
const remapped = JSON.parse(JSON.stringify(iNode));
|
||||
remapped.id = nodeIdRemap[iNode.id];
|
||||
|
||||
// Some subgraph-template nodes store widgets_values in the "legacy full" format
|
||||
// (one entry per widget input, including linked ones), while convertUiToApi's
|
||||
// widget-mapping loop assumes the "modern" format (linked widget inputs have no
|
||||
// entry at all). Detect the full format by comparing lengths and strip the
|
||||
// entries belonging to inputs that are *actually* linked end-to-end (per
|
||||
// redirectedTargets above) so downstream mapping stays index-aligned. Boundary
|
||||
// links that terminate in a plain widget value (e.g. prompt text) are NOT
|
||||
// stripped — their value lives in the outer node's widgets_values instead and
|
||||
// is injected below.
|
||||
const allWidgetInputs = (remapped.inputs || []).filter((i) => i.widget);
|
||||
if (remapped.widgets_values && remapped.widgets_values.length === allWidgetInputs.length) {
|
||||
const linkedIdx = new Set();
|
||||
allWidgetInputs.forEach((inp, i) => {
|
||||
const slotIdx = remapped.inputs.indexOf(inp);
|
||||
if (redirectedTargets.has(`${remapped.id}:${slotIdx}`)) linkedIdx.add(i);
|
||||
});
|
||||
if (linkedIdx.size > 0) {
|
||||
remapped.widgets_values = remapped.widgets_values.filter((_, i) => !linkedIdx.has(i));
|
||||
normalizedNodeIds.add(remapped.id);
|
||||
}
|
||||
}
|
||||
|
||||
addedNodes.push(remapped);
|
||||
remappedByOrigId[iNode.id] = remapped;
|
||||
}
|
||||
|
||||
// === Inject outer subgraph-node widget values into internal nodes ===
|
||||
// Only un-linked widget inputs — linked ones are already redirected above.
|
||||
const outerWidgetInputs = (node.inputs || []).filter((inp) => inp.widget);
|
||||
outerWidgetInputs.forEach((inp, widgetIdx) => {
|
||||
if (inp.link != null) return;
|
||||
if (widgetIdx >= (node.widgets_values || []).length) return;
|
||||
const outerValue = node.widgets_values[widgetIdx];
|
||||
|
||||
const portIdx = (sgDef.inputs || []).findIndex((p) => p.name === inp.name);
|
||||
if (portIdx === -1) return;
|
||||
const target = inputPortTargets[portIdx];
|
||||
if (!target) return;
|
||||
|
||||
const origInternalId = String(target.targetNodeId).split(":").pop();
|
||||
const remappedNode = remappedByOrigId[origInternalId];
|
||||
if (!remappedNode) return;
|
||||
|
||||
const targetInputDef = (remappedNode.inputs || [])[target.targetSlot];
|
||||
if (!targetInputDef?.widget) return;
|
||||
|
||||
// When the internal node's widgets_values was normalized above (stripped of
|
||||
// linked-slot entries), the index must be computed against that same reduced
|
||||
// set of widget names — object_info's full name order (which still includes
|
||||
// e.g. width/height) would be off by however many entries were stripped.
|
||||
let iWidgetIdx;
|
||||
if (normalizedNodeIds.has(remappedNode.id)) {
|
||||
const remainingNames = (remappedNode.inputs || [])
|
||||
.filter((i) => i.widget)
|
||||
.filter((i) => {
|
||||
const slotIdx = remappedNode.inputs.indexOf(i);
|
||||
return !redirectedTargets.has(`${remappedNode.id}:${slotIdx}`);
|
||||
})
|
||||
.map((i) => i.name);
|
||||
iWidgetIdx = remainingNames.indexOf(targetInputDef.name);
|
||||
} else {
|
||||
const widgetNames = _getWidgetInputNames(objectInfo, remappedNode.type);
|
||||
iWidgetIdx = widgetNames.indexOf(targetInputDef.name);
|
||||
}
|
||||
if (iWidgetIdx === -1) return;
|
||||
|
||||
if (!remappedNode.widgets_values) remappedNode.widgets_values = [];
|
||||
remappedNode.widgets_values[iWidgetIdx] = outerValue;
|
||||
});
|
||||
|
||||
// === Add internal links (object format → array format) ===
|
||||
for (const iLink of (sgDef.links || [])) {
|
||||
if (iLink.origin_id === -10 || iLink.target_id === -20) continue;
|
||||
@@ -253,8 +394,11 @@ export const comfyWorkflow = {
|
||||
detectFormat(workflow, filename) {
|
||||
if (!workflow || typeof workflow !== "object") return "unknown";
|
||||
if (Array.isArray(workflow.nodes) && workflow.links !== undefined) {
|
||||
// App format: UI-based structure with definitions (subgraphs) or linearMode
|
||||
if (workflow.definitions || workflow.extra?.linearMode === true) return "app";
|
||||
// App format: simplified web-app-style UI (linearMode) or .app.json filename.
|
||||
// A workflow that merely *contains* subgraphs (definitions.subgraphs) is still
|
||||
// a normal node graph — convertUiToApi() flattens subgraphs before conversion,
|
||||
// so it's treated as "ui" rather than blocked as unsupported "app" format.
|
||||
if (workflow.extra?.linearMode === true) return "app";
|
||||
if (filename && /\.app\.json$/i.test(filename)) return "app";
|
||||
return "ui";
|
||||
}
|
||||
@@ -267,14 +411,30 @@ export const comfyWorkflow = {
|
||||
/**
|
||||
* Convert UI-format workflow to API-format using /object_info for accurate widget mapping.
|
||||
*/
|
||||
getLastCheckpointSubstitutions() {
|
||||
return _lastCheckpointSubstitutions;
|
||||
},
|
||||
|
||||
getLastBypassedNodes() {
|
||||
return _lastBypassedNodes;
|
||||
},
|
||||
|
||||
getLastMutedNodes() {
|
||||
return _lastMutedNodes;
|
||||
},
|
||||
|
||||
async convertUiToApi(workflow) {
|
||||
_lastCheckpointSubstitutions = [];
|
||||
_lastBypassedNodes = [];
|
||||
_lastMutedNodes = [];
|
||||
if (!workflow.nodes || !workflow.links) return {};
|
||||
|
||||
// Flatten subgraphs before conversion
|
||||
const flatWorkflow = _flattenSubgraphs(workflow);
|
||||
|
||||
const objectInfo = await _loadObjectInfo();
|
||||
|
||||
// Flatten subgraphs before conversion (needs objectInfo to correctly map outer
|
||||
// subgraph-node widget values onto internal nodes' widgets_values indices)
|
||||
const flatWorkflow = _flattenSubgraphs(workflow, objectInfo);
|
||||
|
||||
// Build link map: dstNode -> { dstSlot -> [srcNodeId, srcSlot] }
|
||||
const linkMap = {};
|
||||
for (const link of flatWorkflow.links) {
|
||||
@@ -282,10 +442,23 @@ export const comfyWorkflow = {
|
||||
if (!linkMap[dstNode]) linkMap[dstNode] = {};
|
||||
linkMap[dstNode][dstSlot] = [String(srcNode), srcSlot];
|
||||
}
|
||||
const nodeById = {};
|
||||
for (const n of flatWorkflow.nodes) nodeById[String(n.id)] = n;
|
||||
|
||||
const api = {};
|
||||
for (const node of flatWorkflow.nodes) {
|
||||
if (node.mode === 4) continue; // muted/bypassed
|
||||
// Mute (mode 2): excluded, no pass-through — matches ComfyUI itself, where
|
||||
// muting a node with required downstream dependents is expected to error.
|
||||
// Bypass (mode 4): excluded here too, but its wires are rerouted below via
|
||||
// _resolveBypassSource() so downstream nodes reconnect to its upstream source.
|
||||
if (node.mode === 2) {
|
||||
_lastMutedNodes.push({ nodeId: String(node.id), title: node.title || node.type });
|
||||
continue;
|
||||
}
|
||||
if (node.mode === 4) {
|
||||
_lastBypassedNodes.push({ nodeId: String(node.id), title: node.title || node.type });
|
||||
continue;
|
||||
}
|
||||
// Skip note/display-only nodes that are unknown to ComfyUI backend
|
||||
if (!objectInfo[node.type] && _isDisplayOnlyNode(node)) continue;
|
||||
const nodeId = String(node.id);
|
||||
@@ -301,7 +474,9 @@ export const comfyWorkflow = {
|
||||
const linkedSlotNames = new Set();
|
||||
inputDefs.forEach((inp, idx) => {
|
||||
if (nodeLinks[idx]) {
|
||||
inputs[inp.name] = nodeLinks[idx];
|
||||
const resolved = _resolveBypassSource(nodeById, linkMap, nodeLinks[idx][0], nodeLinks[idx][1], new Set());
|
||||
if (!resolved) return; // Bypass chain with no upstream source — leave unlinked
|
||||
inputs[inp.name] = resolved;
|
||||
linkedInputNames.add(inp.name);
|
||||
linkedSlotNames.add(inp.name);
|
||||
}
|
||||
@@ -365,6 +540,22 @@ export const comfyWorkflow = {
|
||||
wIdx++;
|
||||
}
|
||||
}
|
||||
// DynamicCombo (e.g. SaveImageAdvanced's "format"): val is the selected
|
||||
// option's key (e.g. "png"). Per comfy_api/latest/_io.py
|
||||
// DynamicCombo._expand_schema_for_dynamic, the backend looks up flat
|
||||
// dot-prefixed keys ("format", "format.bit_depth", ...) in the raw
|
||||
// inputs dict and assembles them into a single dict itself at execution
|
||||
// time — it does NOT accept a pre-built dict under the "format" key.
|
||||
if (expectedType === "COMFY_DYNAMICCOMBO_V3") {
|
||||
inputs[name] = val;
|
||||
const subNames = _getDynamicComboSubNames(objectInfo, node.type, name, val);
|
||||
for (const subName of subNames) {
|
||||
if (wIdx >= widgets.length) break;
|
||||
inputs[`${name}.${subName}`] = widgets[wIdx];
|
||||
wIdx++;
|
||||
}
|
||||
continue;
|
||||
}
|
||||
// For COMBO inputs, validate the value against the available choices.
|
||||
// Dynamic COMBO options (e.g. Impact Pack's "Select to add Wildcard") may
|
||||
// differ between the saved workflow and the current ComfyUI instance
|
||||
@@ -379,6 +570,14 @@ export const comfyWorkflow = {
|
||||
if (spec) {
|
||||
const choices = Array.isArray(spec[0]) ? spec[0] : null;
|
||||
if (choices && choices.length > 0 && !choices.includes(val)) {
|
||||
if (name === "ckpt_name") {
|
||||
_lastCheckpointSubstitutions.push({
|
||||
nodeId: String(node.id),
|
||||
title: node.title || node.type,
|
||||
original: val,
|
||||
replaced: choices[0],
|
||||
});
|
||||
}
|
||||
val = choices[0];
|
||||
}
|
||||
}
|
||||
@@ -487,6 +686,8 @@ export const comfyWorkflow = {
|
||||
vae_nodes: [],
|
||||
save_nodes: [],
|
||||
load_image_nodes: [],
|
||||
inpaint_encode_nodes: [],
|
||||
mask_editor_one_nodes: [],
|
||||
text_encoder_nodes: [],
|
||||
diffusion_model_nodes: [],
|
||||
controlnet_nodes: [],
|
||||
@@ -686,6 +887,23 @@ export const comfyWorkflow = {
|
||||
});
|
||||
}
|
||||
|
||||
// Mage-Flow text encoder — prompt + negative_prompt in one node (fixed roles,
|
||||
// unlike KSampler-derived getRole() since both wires originate from this node)
|
||||
if (ct === "TextEncodeMageFlowEdit") {
|
||||
if (typeof inputs.prompt === "string") {
|
||||
result.prompt_nodes.push({
|
||||
id, type: ct, title: `${title} [positive]`, role: "positive",
|
||||
text: inputs.prompt, textKey: "prompt",
|
||||
});
|
||||
}
|
||||
if (typeof inputs.negative_prompt === "string") {
|
||||
result.prompt_nodes.push({
|
||||
id, type: ct, title: `${title} [negative]`, role: "negative",
|
||||
text: inputs.negative_prompt, textKey: "negative_prompt",
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// SDXLPromptStyler / SDXLPromptStylerAdvanced — contains both pos & neg in one node
|
||||
if (ct === "SDXLPromptStyler" || ct === "SDXLPromptStylerAdvanced") {
|
||||
if (inputs.text_positive !== undefined) {
|
||||
@@ -747,6 +965,20 @@ export const comfyWorkflow = {
|
||||
});
|
||||
}
|
||||
|
||||
// TextEncodeMageFlowEdit also carries width/height/batch_size directly
|
||||
// (it builds the latent internally instead of a separate EmptyLatentImage node).
|
||||
// width/height are commonly wired to a ResolutionSelector-style helper node
|
||||
// (array link ref) rather than a direct number — leave those as undefined so
|
||||
// the settings-tab UI falls back to its default instead of rendering a link ref.
|
||||
if (ct === "TextEncodeMageFlowEdit") {
|
||||
result.latent_nodes.push({
|
||||
id, type: ct, title,
|
||||
width: typeof inputs.width === "number" ? inputs.width : undefined,
|
||||
height: typeof inputs.height === "number" ? inputs.height : undefined,
|
||||
batch_size: inputs.batch_size,
|
||||
});
|
||||
}
|
||||
|
||||
// --- LoRA nodes ---
|
||||
if (ct === "LoraLoader" || ct === "LoraLoaderModelOnly") {
|
||||
result.lora_nodes.push({
|
||||
@@ -809,6 +1041,22 @@ export const comfyWorkflow = {
|
||||
});
|
||||
}
|
||||
|
||||
// --- VAE Encode (for Inpainting) nodes ---
|
||||
if (ct === "VAEEncodeForInpaint") {
|
||||
result.inpaint_encode_nodes.push({
|
||||
id, type: ct, title,
|
||||
grow_mask_by: inputs.grow_mask_by,
|
||||
});
|
||||
}
|
||||
|
||||
// --- Mask Editor One nodes (comfyui-mask-editor-one) ---
|
||||
// 画像とマスクをノード自身が内包する（LoadImageを介さない）インペイント画像ソース。
|
||||
// image出力はサーバー側キャッシュ(bg_image_b64、node_idキー)から、mask出力は
|
||||
// layer_data(JSON文字列)ウィジェットの各レイヤーのアルファチャンネルから合成される。
|
||||
if (ct === "MaskEditorOne") {
|
||||
result.mask_editor_one_nodes.push({ id, type: ct, title });
|
||||
}
|
||||
|
||||
// --- Text encoder (CLIP) nodes ---
|
||||
if (ct === "DualCLIPLoader" || ct === "CLIPLoader" || ct === "ClipLoaderGGUF" || ct === "DualClipLoaderGGUF") {
|
||||
result.text_encoder_nodes.push({
|
||||
@@ -850,6 +1098,24 @@ export const comfyWorkflow = {
|
||||
}
|
||||
}
|
||||
|
||||
// --- Post-pass: flag LoadImage nodes whose MASK output (slot 1) is wired to something
|
||||
// downstream (directly, or via a pass-through node like MaskEditorNode). These are the
|
||||
// "inpaint-capable" slots — image + mask both come from the same node's two outputs, so
|
||||
// painting a mask for them only requires re-uploading that one node's image with the mask
|
||||
// baked into the alpha channel (matches ComfyUI's native LoadImage alpha→MASK extraction). ---
|
||||
const loadImageIds = new Set(result.load_image_nodes.filter(n => n.type === "LoadImage").map(n => n.id));
|
||||
if (loadImageIds.size > 0) {
|
||||
for (const node of Object.values(workflow)) {
|
||||
if (!node?.inputs) continue;
|
||||
for (const v of Object.values(node.inputs)) {
|
||||
if (Array.isArray(v) && v.length === 2 && Number(v[1]) === 1 && loadImageIds.has(String(v[0]))) {
|
||||
const target = result.load_image_nodes.find(n => n.id === String(v[0]));
|
||||
if (target) target.mask_used = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
result.all_nodes.sort((a, b) => Number(a.id) - Number(b.id));
|
||||
return result;
|
||||
},
|
||||
|
||||
+146
-1
@@ -43,6 +43,89 @@ const API = {
|
||||
|
||||
export const FEEDER_GROUP = "__Feeder__";
|
||||
|
||||
// ComfyUI Comic Creater からiframe越しに画像を受け取り、Generate UIのImage入力スロットへ直接セットする（I2I連携）。
|
||||
// Comic Creater側の「I2Iへ送る」ボタンから
|
||||
// iframe.contentWindow._wfmReceiveImageForI2I(blob, name, workflowData?, workflowFilename?) として呼ばれる。
|
||||
// 画像スロットへのセット自体は wfm-gallery-send-genui-image-btn のクリックハンドラ（Galleryの選択画像を送る版）と同一。
|
||||
// workflowData が渡された場合（Comic Creater側の設定タブでデフォルトワークフローが有効な時）は、
|
||||
// 画像をセットする前にそのワークフローを読み込む。
|
||||
window._wfmReceiveImageForI2I = async (blob, name, workflowData, workflowFilename) => {
|
||||
try {
|
||||
if (workflowData) {
|
||||
try {
|
||||
// iframeロード直後などモデルリスト未取得のままワークフローを読み込むと、
|
||||
// Model/生成UIタブのCheckpoint等ドロップダウンが空のままレンダリングされてしまう。
|
||||
// 接続確認・モデルリスト取得を保証してからワークフローを読み込む
|
||||
if (!comfyUI.connected) {
|
||||
await comfyUI.checkConnection();
|
||||
}
|
||||
if (comfyUI.connected && (!comfyEditor.models.checkpoints || comfyEditor.models.checkpoints.length === 0)) {
|
||||
await comfyEditor.loadModelLists();
|
||||
}
|
||||
await loadWorkflowIntoEditor(workflowData, workflowFilename || "workflow.json");
|
||||
} catch (e) {
|
||||
console.warn("[I2I] failed to load default workflow:", e);
|
||||
}
|
||||
}
|
||||
const file = new File([blob], name || "cc-image.png", { type: blob.type || "image/png" });
|
||||
document.querySelector('[data-tab="generate"]')?.click();
|
||||
document.querySelector('.wfm-gen-subtab-btn[data-subtab="input"]')?.click();
|
||||
document.querySelector('.wfm-input-inner-tab[data-input-tab="image"]')?.click();
|
||||
await comfyEditor.applyImageToSlot(file, 0);
|
||||
showToast(t("gallerySentGenUI"), "success");
|
||||
return true;
|
||||
} catch (e) {
|
||||
showToast(t("errorWithMsg", e.message), "error");
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
// ComfyUI Comic Creater からiframe越しに合成画像+マスクを受け取り、Image Edit タブの
|
||||
// Inpaint機能をUIを開かずに直接実行して結果URLを返す（Inpaint連携）。
|
||||
// Comic Creater側の Image タブ「Inpaint」から
|
||||
// iframe.contentWindow._wfmReceiveInpaintRequest(imageBlob, maskBlob, params, workflowData?, workflowFilename?) として呼ばれる。
|
||||
// workflowData が渡された場合（Comic Creater側の設定タブでInpaint用デフォルトワークフローが有効な時）は、
|
||||
// 実行前にそのワークフローを読み込む。渡されない場合はGenerate UIに現在ロード中のワークフローをそのまま使う。
|
||||
window._wfmReceiveInpaintRequest = async (imageBlob, maskBlob, params, workflowData, workflowFilename) => {
|
||||
try {
|
||||
if (workflowData) {
|
||||
if (!comfyUI.connected) {
|
||||
await comfyUI.checkConnection();
|
||||
}
|
||||
if (comfyUI.connected && (!comfyEditor.models.checkpoints || comfyEditor.models.checkpoints.length === 0)) {
|
||||
await comfyEditor.loadModelLists();
|
||||
}
|
||||
await loadWorkflowIntoEditor(workflowData, workflowFilename || "workflow.json");
|
||||
}
|
||||
return await window._wfmImageEditTab.runInpaintExternal(imageBlob, maskBlob, params);
|
||||
} catch (e) {
|
||||
return { ok: false, message: e.message };
|
||||
}
|
||||
};
|
||||
|
||||
// ComfyUI Comic Creater からiframe越しに画像を受け取り、Image Edit タブの
|
||||
// Select I2I機能をUIを開かずに直接実行して結果URLを返す（I2I連携、マスク不要）。
|
||||
// Comic Creater側の Image タブ「Select→I2I」から
|
||||
// iframe.contentWindow._wfmReceiveI2IRunRequest(imageBlob, params, workflowData?, workflowFilename?) として呼ばれる。
|
||||
// workflowData が渡された場合（Comic Creater側のI2I設定でデフォルトワークフローが有効な時）は、
|
||||
// 実行前にそのワークフローを読み込む。渡されない場合はGenerate UIに現在ロード中のワークフローをそのまま使う。
|
||||
window._wfmReceiveI2IRunRequest = async (imageBlob, params, workflowData, workflowFilename) => {
|
||||
try {
|
||||
if (workflowData) {
|
||||
if (!comfyUI.connected) {
|
||||
await comfyUI.checkConnection();
|
||||
}
|
||||
if (comfyUI.connected && (!comfyEditor.models.checkpoints || comfyEditor.models.checkpoints.length === 0)) {
|
||||
await comfyEditor.loadModelLists();
|
||||
}
|
||||
await loadWorkflowIntoEditor(workflowData, workflowFilename || "workflow.json");
|
||||
}
|
||||
return await window._wfmImageEditTab.runI2IExternal(imageBlob, params);
|
||||
} catch (e) {
|
||||
return { ok: false, message: e.message };
|
||||
}
|
||||
};
|
||||
|
||||
// ── ページング ────────────────────────────────────────────────
|
||||
const PAGE_SIZE = 50;
|
||||
let _renderedCount = 0;
|
||||
@@ -1506,6 +1589,68 @@ function bindEvents() {
|
||||
}
|
||||
});
|
||||
|
||||
// 選択画像を ComfyUI Comic Creator の選択コマ／オーバーレイへ送信
|
||||
// （ComfyUI Comic CreaterからこのGalleryタブがiframe埋め込みされている場合のみ表示・動作する）
|
||||
const sendCcBtn = document.getElementById("wfm-gallery-send-cc-btn");
|
||||
if (sendCcBtn) {
|
||||
let embedded = false;
|
||||
try {
|
||||
embedded = !!(window.parent && window.parent !== window);
|
||||
} catch (e) {
|
||||
embedded = false;
|
||||
}
|
||||
if (embedded) sendCcBtn.style.display = "";
|
||||
|
||||
sendCcBtn.addEventListener("click", () => {
|
||||
if (!state.selectedImage) {
|
||||
showToast(t("gallerySelectImageFirst"), "info");
|
||||
return;
|
||||
}
|
||||
const url = API.serveImage(state.selectedImage.path);
|
||||
|
||||
// I2I送信元がImageタブだった場合はそちらへ画像を読み込ませる（_ccI2ITargetModeはComic Creater側が
|
||||
// 「I2Iへ送る」ボタン押下時にセットするフラグ。undefined/'layout'なら従来通りコマ/オーバーレイへ挿入）
|
||||
let targetMode = null;
|
||||
try {
|
||||
targetMode = window.parent?._ccI2ITargetMode || null;
|
||||
} catch (e) {
|
||||
targetMode = null;
|
||||
}
|
||||
if (targetMode === "image") {
|
||||
let imageTab = null;
|
||||
try {
|
||||
if (window.parent && window.parent !== window && typeof window.parent._ccImageTab?.loadFromUrl === "function") {
|
||||
imageTab = window.parent._ccImageTab;
|
||||
}
|
||||
} catch (e) {
|
||||
imageTab = null;
|
||||
}
|
||||
if (!imageTab) {
|
||||
showToast(t("galleryCCNotAvailable"), "info");
|
||||
return;
|
||||
}
|
||||
imageTab.loadFromUrl(url, (state.selectedImage.filename || "cc-image").replace(/\.[^.]+$/, ""));
|
||||
showToast(t("gallerySentCC"), "success");
|
||||
return;
|
||||
}
|
||||
|
||||
let insertFn = null;
|
||||
try {
|
||||
if (window.parent && window.parent !== window && typeof window.parent.insertImageFromUrl === "function") {
|
||||
insertFn = window.parent.insertImageFromUrl;
|
||||
}
|
||||
} catch (e) {
|
||||
insertFn = null;
|
||||
}
|
||||
if (!insertFn) {
|
||||
showToast(t("galleryCCNotAvailable"), "info");
|
||||
return;
|
||||
}
|
||||
insertFn(url);
|
||||
showToast(t("gallerySentCC"), "success");
|
||||
});
|
||||
}
|
||||
|
||||
// 検索
|
||||
document.getElementById("wfm-gallery-search")?.addEventListener("input", (e) => {
|
||||
state.search = e.target.value;
|
||||
@@ -1591,7 +1736,7 @@ function bindEvents() {
|
||||
if (window.opener && typeof window.opener.wfmReceiveWorkflow === "function") {
|
||||
window.opener.wfmReceiveWorkflow(state.embeddedWorkflow);
|
||||
await navigator.clipboard.writeText(JSON.stringify(state.embeddedWorkflow, null, 2)).catch(() => {});
|
||||
showToast(t("workflowSentToCanvas"), "success");
|
||||
showToast(t("workflowSentToCanvasDirect"), "success");
|
||||
return;
|
||||
}
|
||||
// フォールバック: localStorage + タイトルドラッグ（UI形式のみ）
|
||||
|
||||
+224
-32
@@ -9,7 +9,7 @@ import { comfyEditor } from "./comfyui-editor.js";
|
||||
import { t } from "./i18n.js";
|
||||
import { syncJsonHighlight, syncScroll } from "./json-highlight.js";
|
||||
import { initFeederTab, refreshFeederNodeList } from "./feeder-tab.js";
|
||||
import { getSettings, readJsonStorage } from "./util.js";
|
||||
import { getSettings, readJsonStorage, escapeHtml } from "./util.js";
|
||||
|
||||
// ============================================
|
||||
// Eagle Auto-Save
|
||||
@@ -23,7 +23,7 @@ function getEagleSettings() {
|
||||
};
|
||||
}
|
||||
|
||||
async function saveToEagle(imageUrl, name, tags = []) {
|
||||
async function saveToEagle(imageUrl, name, tags = [], fileInfo = null) {
|
||||
const eagle = getEagleSettings();
|
||||
if (!eagle.autoSave) return;
|
||||
try {
|
||||
@@ -35,6 +35,12 @@ async function saveToEagle(imageUrl, name, tags = []) {
|
||||
url: imageUrl,
|
||||
name,
|
||||
tags: ["wfm-comfyui", ...tags],
|
||||
// SVG はサーバー側でローカルパス解決(addFromPath)するために必要
|
||||
filename: fileInfo?.filename || "",
|
||||
subfolder: fileInfo?.subfolder || "",
|
||||
type: fileInfo?.type || "output",
|
||||
// comfyui-tosvg の Save SVG String など、絶対パスが既知の場合に渡す
|
||||
localPath: fileInfo?.localPath || "",
|
||||
}),
|
||||
});
|
||||
const data = await res.json();
|
||||
@@ -218,21 +224,52 @@ async function saveCurrentWorkflow() {
|
||||
// Workflow Loading
|
||||
// ============================================
|
||||
|
||||
// ワークフロー読み込み時、設定タブで有効化されていれば checkpoint loader 系ノード全件の
|
||||
// ckpt_name をデフォルトモデルへ強制上書きする（保存済みワークフローのモデルが
|
||||
// 環境と合わず生成エラー/不鮮明な画像になるのを防ぐ回避策）。
|
||||
// analyzeWorkflow() より前に apiWorkflow 自体を書き換える必要がある — analysis後に
|
||||
// 書き換えると Model タブの表示（analysis.checkpoint_nodes 由来）が古い値のまま残るため。
|
||||
async function _applyDefaultCheckpointIfEnabled(apiWorkflow) {
|
||||
try {
|
||||
const res = await fetch("/api/wfm/settings");
|
||||
if (!res.ok) return;
|
||||
const settings = await res.json();
|
||||
if (!settings.default_checkpoint_enabled || !settings.default_checkpoint_name) return;
|
||||
|
||||
let applied = false;
|
||||
for (const node of Object.values(apiWorkflow)) {
|
||||
const ct = node?.class_type || "";
|
||||
if (node?.inputs && (ct.includes("CheckpointLoader") || ct === "Checkpoint Loader" || ct === "ImageMetadataPromptLoader")) {
|
||||
node.inputs.ckpt_name = settings.default_checkpoint_name;
|
||||
applied = true;
|
||||
}
|
||||
}
|
||||
if (applied) showToast(t("defaultCheckpointApplied", settings.default_checkpoint_name), "info");
|
||||
} catch { /* non-critical, ignore */ }
|
||||
}
|
||||
|
||||
export async function loadWorkflowIntoEditor(workflow, filename) {
|
||||
let apiWorkflow = workflow;
|
||||
const format = comfyWorkflow.detectFormat(workflow, filename);
|
||||
let ckptWarning = null;
|
||||
|
||||
if (format === "app") {
|
||||
showToast(t("appFormatNotSupported"), "error");
|
||||
return false;
|
||||
} else if (format === "ui") {
|
||||
apiWorkflow = await comfyWorkflow.convertUiToApi(workflow);
|
||||
const ckptSubs = comfyWorkflow.getLastCheckpointSubstitutions();
|
||||
if (ckptSubs.length > 0) {
|
||||
const names = [...new Set(ckptSubs.map((s) => s.original))].join(", ");
|
||||
ckptWarning = t("checkpointSubstitutedWarning", names);
|
||||
}
|
||||
} else if (format === "unknown") {
|
||||
showToast(t("unknownWorkflowFormat"), "error");
|
||||
return false;
|
||||
}
|
||||
|
||||
comfyUI.currentWorkflow = apiWorkflow;
|
||||
await _applyDefaultCheckpointIfEnabled(apiWorkflow);
|
||||
comfyUI.currentAnalysis = comfyWorkflow.analyzeWorkflow(apiWorkflow);
|
||||
|
||||
// Render editor tabs
|
||||
@@ -247,6 +284,30 @@ export async function loadWorkflowIntoEditor(workflow, filename) {
|
||||
syncJsonHighlight(rawHighlight, jsonStr);
|
||||
}
|
||||
|
||||
// Update Bypass/Mute node indicator (shared Raw JSON widget header, visible on
|
||||
// Input/Model/Settings tabs). API-format JSON has no mode field, so this info is
|
||||
// only available right after a UI→API conversion — captured via comfyWorkflow's
|
||||
// getLastBypassedNodes()/getLastMutedNodes() before it's discarded.
|
||||
const bypassNote = document.getElementById("wfm-gen-rawjson-bypass-note");
|
||||
if (bypassNote) {
|
||||
const bypassed = format === "ui" ? comfyWorkflow.getLastBypassedNodes() : [];
|
||||
const muted = format === "ui" ? comfyWorkflow.getLastMutedNodes() : [];
|
||||
const lines = [];
|
||||
if (bypassed.length > 0) {
|
||||
lines.push(t("rawJsonBypassNote", bypassed.map((n) => `${n.title} (${n.nodeId})`).join(", ")));
|
||||
}
|
||||
if (muted.length > 0) {
|
||||
lines.push(t("rawJsonMutedNote", muted.map((n) => `${n.title} (${n.nodeId})`).join(", ")));
|
||||
}
|
||||
if (lines.length > 0) {
|
||||
bypassNote.innerHTML = lines.map((l) => escapeHtml(l)).join("<br>");
|
||||
bypassNote.style.display = "";
|
||||
} else {
|
||||
bypassNote.textContent = "";
|
||||
bypassNote.style.display = "none";
|
||||
}
|
||||
}
|
||||
|
||||
// Update workflow name display
|
||||
const nameEl = document.getElementById("wfm-gen-wf-name");
|
||||
if (nameEl) {
|
||||
@@ -260,7 +321,11 @@ export async function loadWorkflowIntoEditor(workflow, filename) {
|
||||
|
||||
refreshFeederNodeList();
|
||||
|
||||
showToast(t("workflowLoadedName", filename || ""), "success");
|
||||
if (ckptWarning) {
|
||||
showToast(ckptWarning, "error");
|
||||
} else {
|
||||
showToast(t("workflowLoadedName", filename || ""), "success");
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
@@ -1397,7 +1462,7 @@ async function _expandWildcardsInWorkflow(workflow) {
|
||||
// Generation (core — throws on error)
|
||||
// ============================================
|
||||
|
||||
async function _coreGenerate(silent = false) {
|
||||
async function _coreGenerate(silent = false, workflowOverride = null) {
|
||||
const progressBar = document.getElementById("wfm-gen-progress-bar");
|
||||
const progressText = document.getElementById("wfm-gen-progress-text");
|
||||
const resultImg = document.getElementById("wfm-gen-result-img");
|
||||
@@ -1409,9 +1474,10 @@ async function _coreGenerate(silent = false) {
|
||||
if (progressBar) progressBar.style.width = "0%";
|
||||
if (progressText) progressText.textContent = "Starting...";
|
||||
|
||||
const workflowExpanded = await _expandWildcardsInWorkflow({ ...comfyUI.currentWorkflow });
|
||||
const baseWorkflow = workflowOverride || comfyUI.currentWorkflow;
|
||||
const workflowExpanded = await _expandWildcardsInWorkflow({ ...baseWorkflow });
|
||||
const workflowForGenerate = _applyStyleToWorkflow(workflowExpanded);
|
||||
const { images, seed } = await comfyUI.generate(
|
||||
const { images, seed, svgOutputs } = await comfyUI.generate(
|
||||
workflowForGenerate,
|
||||
{
|
||||
seedMode,
|
||||
@@ -1429,18 +1495,49 @@ async function _coreGenerate(silent = false) {
|
||||
if (progressText) progressText.textContent = `Done (${images.length} image${images.length !== 1 ? "s" : ""})`;
|
||||
if (progressBar) progressBar.style.width = "100%";
|
||||
|
||||
if (images.length > 0) {
|
||||
const blob = await comfyUI.getImageBlob(images[0]);
|
||||
// type=temp はプレビュー用の一時画像 (PreviewImage, SVG String Preview など) のため
|
||||
// 生成結果表示からは除外し、実際に保存された成果物のみを表示する
|
||||
const outputImages = images.filter((img) => img.type !== "temp");
|
||||
|
||||
if (svgOutputs?.length > 0) {
|
||||
// comfyui-tosvg の Save SVG String は images ではなく saved_svg/path で返すため、
|
||||
// images配列には(あれば)プレビュー用の一時PNGしか入らず実際の保存物と食い違う。
|
||||
// 実際に保存されたSVGファイルをそのままプレビューに表示する。
|
||||
// /view はSVGをセキュリティ上application/octet-streamで返すため使えず、
|
||||
// 代わりにGalleryタブの配信エンドポイント(絶対パス指定・正しいContent-Type)を使う。
|
||||
const svgUrl = (svg) => `/wfm/gallery/image/serve?path=${encodeURIComponent(svg.path)}`;
|
||||
if (resultImg && svgOutputs[0].path) {
|
||||
resultImg.src = svgUrl(svgOutputs[0]);
|
||||
resultImg.style.display = "block";
|
||||
}
|
||||
|
||||
if (resultThumbs && svgOutputs.length > 1) {
|
||||
resultThumbs.innerHTML = "";
|
||||
svgOutputs.forEach((svg, i) => {
|
||||
if (!svg.path) return;
|
||||
const thumb = document.createElement("img");
|
||||
thumb.src = svgUrl(svg);
|
||||
thumb.className = `wfm-gen-thumb ${i === 0 ? "active" : ""}`;
|
||||
thumb.addEventListener("click", () => {
|
||||
resultImg.src = thumb.src;
|
||||
resultThumbs.querySelectorAll(".wfm-gen-thumb").forEach((t) => t.classList.remove("active"));
|
||||
thumb.classList.add("active");
|
||||
});
|
||||
resultThumbs.appendChild(thumb);
|
||||
});
|
||||
}
|
||||
} else if (outputImages.length > 0) {
|
||||
const blob = await comfyUI.getImageBlob(outputImages[0]);
|
||||
const url = URL.createObjectURL(blob);
|
||||
if (resultImg) {
|
||||
resultImg.src = url;
|
||||
resultImg.style.display = "block";
|
||||
}
|
||||
|
||||
if (resultThumbs && images.length > 1) {
|
||||
if (resultThumbs && outputImages.length > 1) {
|
||||
resultThumbs.innerHTML = "";
|
||||
for (let i = 0; i < images.length; i++) {
|
||||
const b = i === 0 ? blob : await comfyUI.getImageBlob(images[i]);
|
||||
for (let i = 0; i < outputImages.length; i++) {
|
||||
const b = i === 0 ? blob : await comfyUI.getImageBlob(outputImages[i]);
|
||||
const u = i === 0 ? url : URL.createObjectURL(b);
|
||||
const thumb = document.createElement("img");
|
||||
thumb.src = u;
|
||||
@@ -1455,18 +1552,28 @@ async function _coreGenerate(silent = false) {
|
||||
}
|
||||
}
|
||||
|
||||
if (getEagleSettings().autoSave && images.length > 0) {
|
||||
for (const img of images) {
|
||||
if (getEagleSettings().autoSave && outputImages.length > 0) {
|
||||
for (const img of outputImages) {
|
||||
const viewUrl = `/view?filename=${encodeURIComponent(img.filename)}&subfolder=${encodeURIComponent(img.subfolder || "")}&type=${encodeURIComponent(img.type || "output")}`;
|
||||
saveToEagle(viewUrl, img.filename);
|
||||
saveToEagle(viewUrl, img.filename, [], img);
|
||||
}
|
||||
}
|
||||
|
||||
if (getEagleSettings().autoSave && svgOutputs?.length > 0) {
|
||||
// comfyui-tosvg の "Save SVG String" は絶対パスを直接返すため、/view を介さず
|
||||
// サーバー側でそのパスを検証した上で addFromPath させる
|
||||
for (const svg of svgOutputs) {
|
||||
saveToEagle("", svg.filename, [], { filename: svg.filename, localPath: svg.path });
|
||||
}
|
||||
}
|
||||
|
||||
if (images.length > 0) {
|
||||
saveGeneratedImagesMeta(images, { ...comfyUI.currentWorkflow }).catch(() => {});
|
||||
saveGeneratedImagesMeta(images, { ...baseWorkflow }).catch(() => {});
|
||||
}
|
||||
|
||||
if (!silent) showToast(t("generationComplete"), "success");
|
||||
|
||||
return { images, seed };
|
||||
}
|
||||
|
||||
// ============================================
|
||||
@@ -1559,20 +1666,89 @@ async function _runBatchGenerate() {
|
||||
if (loraNodes.length === 0) { showToast(t("modelsGenUINoNode", "LoRA"), "error"); return; }
|
||||
const list = [..._getSelectedLoraGroupItems()];
|
||||
if (list.length === 0) { showToast(t("batchNoneSelected", "LoRAs"), "error"); return; }
|
||||
await _runBatchLoop(list, (loraName) => {
|
||||
for (const node of loraNodes) {
|
||||
if (!comfyUI.currentWorkflow?.[node.id]) continue;
|
||||
if (node.is_lora_manager) {
|
||||
// 通常のLoraLoaderはComfyUI側のenumリストに存在しないファイル名だとバリデーションエラーになる。
|
||||
// ComfyUI(Windows)はサブフォルダ区切りに"\"を使うが内部リストは"/"のため、事前に正しい表記へ変換しておく。
|
||||
let loraNameMap = null;
|
||||
if (loraNodes.some((node) => !node.is_lora_manager)) {
|
||||
try {
|
||||
const known = await comfyUI.fetchLoras();
|
||||
loraNameMap = new Map(known.map((n) => [n.replace(/\\/g, "/"), n]));
|
||||
const missing = list.filter((name) => !loraNameMap.has(name.replace(/\\/g, "/")));
|
||||
if (missing.length > 0) {
|
||||
showToast(t("batchLoraMissing", missing.length, list.length, missing[0]), "error");
|
||||
}
|
||||
} catch {}
|
||||
}
|
||||
// Positiveプロンプトへlora構文＋トリガーワードを反映するための準備（Single/Stack適用と同じ仕組み）
|
||||
const positiveNodes = (comfyUI.currentAnalysis?.prompt_nodes || []).filter((n) => n.role === "positive");
|
||||
let metadata = {}, civitaiCache = {};
|
||||
try {
|
||||
const [metaRes, civRes] = await Promise.all([
|
||||
fetch("/api/wfm/models/metadata"),
|
||||
fetch("/api/wfm/models/civitai/cache"),
|
||||
]);
|
||||
metadata = metaRes.ok ? await metaRes.json() : {};
|
||||
civitaiCache = civRes.ok ? await civRes.json() : {};
|
||||
} catch {}
|
||||
|
||||
// バッチ開始前のプロンプトを保存し、完了・停止後に復元する
|
||||
const posTextarea = document.getElementById("wfm-prompt-pos-text");
|
||||
const savedTextareaValue = posTextarea ? posTextarea.value : null;
|
||||
const savedNodeTexts = new Map();
|
||||
for (const node of positiveNodes) {
|
||||
const wfNode = comfyUI.currentWorkflow?.[node.id];
|
||||
if (wfNode) savedNodeTexts.set(node.id, wfNode.inputs[node.textKey || "text"]);
|
||||
}
|
||||
|
||||
try {
|
||||
await _runBatchLoop(list, (loraName) => {
|
||||
for (const node of loraNodes) {
|
||||
if (!comfyUI.currentWorkflow?.[node.id]) continue;
|
||||
if (node.is_lora_manager) {
|
||||
const stem = loraName.replace(/\\/g, "/").split("/").pop().replace(/\.[^.]+$/, "");
|
||||
comfyUI.currentWorkflow[node.id].inputs.loras = {
|
||||
__value__: [{ name: stem, strength: 1.0, active: true, expanded: false, clipStrength: 1.0, locked: false }],
|
||||
};
|
||||
comfyUI.currentWorkflow[node.id].inputs.text = `<lora:${stem}:1:1>`;
|
||||
} else {
|
||||
const actualName = loraNameMap?.get(loraName.replace(/\\/g, "/")) || loraName;
|
||||
comfyUI.currentWorkflow[node.id].inputs.lora_name = actualName;
|
||||
}
|
||||
}
|
||||
|
||||
if (positiveNodes.length > 0) {
|
||||
const stem = loraName.replace(/\\/g, "/").split("/").pop().replace(/\.[^.]+$/, "");
|
||||
comfyUI.currentWorkflow[node.id].inputs.loras = {
|
||||
__value__: [{ name: stem, strength: 1.0, active: true, expanded: false, clipStrength: 1.0, locked: false }],
|
||||
};
|
||||
comfyUI.currentWorkflow[node.id].inputs.text = `<lora:${stem}:1:1>`;
|
||||
} else {
|
||||
comfyUI.currentWorkflow[node.id].inputs.lora_name = loraName;
|
||||
const firstStandardNode = loraNodes.find((n) => !n.is_lora_manager);
|
||||
const strModel = firstStandardNode ? (comfyUI.currentWorkflow[firstStandardNode.id]?.inputs.strength_model ?? 1.0) : 1.0;
|
||||
const strClip = firstStandardNode ? (comfyUI.currentWorkflow[firstStandardNode.id]?.inputs.strength_clip ?? 1.0) : 1.0;
|
||||
const loraSyntax = `<lora:${stem}:${strModel}:${strClip}>`;
|
||||
const sha = (metadata[loraName] || {}).sha256;
|
||||
const civInfo = sha && civitaiCache[sha];
|
||||
const triggerWords = civInfo?.trainedWords || [];
|
||||
const append = triggerWords.length > 0 ? `${loraSyntax}, ${triggerWords.join(", ")}` : loraSyntax;
|
||||
|
||||
for (const node of positiveNodes) {
|
||||
const wfNode = comfyUI.currentWorkflow?.[node.id];
|
||||
if (!wfNode) continue;
|
||||
const base = (savedNodeTexts.get(node.id) || "").replace(/,\s*$/, "").trim();
|
||||
wfNode.inputs[node.textKey || "text"] = base ? `${base}, ${append}` : append;
|
||||
}
|
||||
if (posTextarea && savedTextareaValue !== null) {
|
||||
const base = savedTextareaValue.replace(/,\s*$/, "").trim();
|
||||
posTextarea.value = base ? `${base}, ${append}` : append;
|
||||
}
|
||||
}
|
||||
}, (name) => name.replace(/\.[^.]+$/, ""));
|
||||
} finally {
|
||||
// プロンプトをバッチ開始前の状態へ復元
|
||||
for (const node of positiveNodes) {
|
||||
const wfNode = comfyUI.currentWorkflow?.[node.id];
|
||||
if (wfNode && savedNodeTexts.has(node.id)) {
|
||||
wfNode.inputs[node.textKey || "text"] = savedNodeTexts.get(node.id);
|
||||
}
|
||||
}
|
||||
}, (name) => name.replace(/\.[^.]+$/, ""));
|
||||
if (posTextarea && savedTextareaValue !== null) posTextarea.value = savedTextareaValue;
|
||||
}
|
||||
break;
|
||||
}
|
||||
case "prompt": {
|
||||
@@ -1660,14 +1836,20 @@ async function _runBatchGenerate() {
|
||||
// Generate entry point
|
||||
// ============================================
|
||||
|
||||
async function handleGenerate() {
|
||||
if (!comfyUI.currentWorkflow) {
|
||||
// workflowOverride: 明示的に渡された場合、comfyUI.currentWorkflow の代わりにこのワークフローで
|
||||
// 生成する（GenerateUIの表示状態には触れない。Image Edit「Inpaint」の専用ワークフロー実行から利用）。
|
||||
// ボタンのclickハンドラから呼ばれる場合は第一引数がMouseEventになるため、その場合は無視する。
|
||||
async function handleGenerate(workflowOverride = null) {
|
||||
if (workflowOverride instanceof Event) workflowOverride = null;
|
||||
|
||||
if (!workflowOverride && !comfyUI.currentWorkflow) {
|
||||
showToast(t("noWorkflowLoaded"), "error");
|
||||
return;
|
||||
}
|
||||
if (comfyUI.generating) return;
|
||||
|
||||
comfyEditor.syncToWorkflow();
|
||||
// オーバーライド実行時は GenerateUI 側の表示中プロンプトを別ワークフローへ誤って書き込まないよう同期をスキップする
|
||||
if (!workflowOverride) comfyEditor.syncToWorkflow();
|
||||
|
||||
const genBtn = document.getElementById("wfm-gen-generate-btn");
|
||||
const interruptBtn = document.getElementById("wfm-gen-interrupt-btn");
|
||||
@@ -1678,18 +1860,20 @@ async function handleGenerate() {
|
||||
_ckptBatch.paused = false;
|
||||
_ckptBatch._resumeResolve = null;
|
||||
|
||||
const batchEnabled = _activeBatchType !== null;
|
||||
// オーバーライド実行時はバッチモードの影響を受けない単発生成に固定する
|
||||
const batchEnabled = !workflowOverride && _activeBatchType !== null;
|
||||
|
||||
try {
|
||||
if (batchEnabled) {
|
||||
await _runBatchGenerate();
|
||||
} else {
|
||||
try {
|
||||
await _coreGenerate(false);
|
||||
return await _coreGenerate(false, workflowOverride);
|
||||
} catch (err) {
|
||||
const progressText = document.getElementById("wfm-gen-progress-text");
|
||||
if (progressText) progressText.textContent = "Error";
|
||||
showToast(t("generationError", err.message), "error");
|
||||
throw err;
|
||||
}
|
||||
}
|
||||
} finally {
|
||||
@@ -1750,7 +1934,15 @@ export async function initGenerateTab() {
|
||||
});
|
||||
|
||||
// Generate button
|
||||
document.getElementById("wfm-gen-generate-btn")?.addEventListener("click", handleGenerate);
|
||||
document.getElementById("wfm-gen-generate-btn")?.addEventListener("click", () => {
|
||||
handleGenerate().catch(() => {});
|
||||
});
|
||||
|
||||
// Cross-tab entry point (Image Edit「Inpaint」タブの Run ボタンなど外部から生成を呼び出す用)
|
||||
window._wfmGenerateTab = { generate: handleGenerate };
|
||||
|
||||
// Alt+Apply from Input/Model/Settings tabs → Apply & Generate
|
||||
document.addEventListener("wfm:apply-and-generate", () => handleGenerate());
|
||||
|
||||
// Interrupt button (stops both single generation and batch loop)
|
||||
document.getElementById("wfm-gen-interrupt-btn")?.addEventListener("click", async () => {
|
||||
|
||||
+189
-60
@@ -92,6 +92,7 @@ const LANGUAGES = {
|
||||
sendToCanvas: "Send to Canvas",
|
||||
copyAndSendCanvas: "Copy & Send Canvas",
|
||||
workflowSentToCanvas: "Workflow ready — drag 'Workflow Studio Library' title to canvas",
|
||||
workflowSentToCanvasDirect: "Workflow sent to canvas",
|
||||
comfyUILoadTimeout: "ComfyUI load timeout",
|
||||
popupBlocked: "Popup blocked. Please allow popups for this site.",
|
||||
setAsDefault: "Set as Default",
|
||||
@@ -116,6 +117,7 @@ const LANGUAGES = {
|
||||
deleteConfirm: (name) => `Delete "${name}"?`,
|
||||
summaryGenerated: "Summary generated",
|
||||
summarizeError: "Summarize error",
|
||||
summarizeOllamaOnly: "Summarize only supports the Ollama backend. Switch backend in Settings.",
|
||||
copied: "Copied",
|
||||
|
||||
// -- GenerateUI --
|
||||
@@ -206,10 +208,15 @@ const LANGUAGES = {
|
||||
unknownWorkflowFormat: "Unknown workflow format",
|
||||
generationComplete: "Generation complete",
|
||||
generationError: (msg) => `Generation error: ${msg}`,
|
||||
defaultCheckpointApplied: (name) => `Default checkpoint applied: ${name}`,
|
||||
checkpointSubstitutedWarning: (names) => `Checkpoint not found in this workflow, silently replaced with another model: ${names}. Please check the Model tab.`,
|
||||
rawJsonBypassNote: (list) => `Bypassed (excluded, wires reconnected): ${list}`,
|
||||
rawJsonMutedNote: (list) => `Muted (excluded): ${list}`,
|
||||
batchNoneSelected: (what) => `No ${what} selected`,
|
||||
batchItemFailed: (i, total, msg) => `[${i}/${total}] Failed: ${msg}`,
|
||||
batchStopped: (completed, failed) => `Batch stopped — ${completed} completed, ${failed} failed`,
|
||||
batchComplete: (completed, total, failed) => failed > 0 ? `Batch complete: ${completed}/${total} (${failed} failed)` : `Batch complete: ${completed}/${total}`,
|
||||
batchLoraMissing: (count, total, sample) => `${count}/${total} selected LoRAs are not recognized by ComfyUI yet (e.g. ${sample}). Click Refresh in ComfyUI or restart the server, then try again.`,
|
||||
connectedToComfyUI: "Connected to ComfyUI",
|
||||
failedToConnect: "Failed to connect",
|
||||
modelListsRefreshed: "Model lists refreshed",
|
||||
@@ -355,6 +362,7 @@ const LANGUAGES = {
|
||||
modelsGenUIUnsupported: "This model type cannot be set in GenerateUI",
|
||||
modelsGenUINoWorkflow: "No workflow loaded in GenerateUI",
|
||||
modelsGenUINoNode: (type) => `No ${type} node found in current workflow`,
|
||||
revertPromptTitle: "Revert to last applied prompt",
|
||||
modelsCopyName: "Click to copy model name",
|
||||
modelsCopiedName: "Model name copied",
|
||||
modelsFilePath: "File Path",
|
||||
@@ -471,6 +479,8 @@ const LANGUAGES = {
|
||||
gallerySelectImageFirst: "Please select an image first",
|
||||
galleryNoLoadImageNode: "No LoadImage node in current workflow",
|
||||
gallerySentGenUI: "Sent to GenerateUI Image tab",
|
||||
galleryCCNotAvailable: "Open this Gallery from ComfyUI Comic Creator to use Send CC",
|
||||
gallerySentCC: "Sent to ComfyUI Comic Creator",
|
||||
galleryNoEmbeddedWorkflow: "No ComfyUI workflow embedded in this image.",
|
||||
galleryBulkSelected: "selected",
|
||||
galleryBulkDeselectAll: "Deselect All",
|
||||
@@ -597,6 +607,20 @@ const LANGUAGES = {
|
||||
aiStatusChatting: "Thinking...",
|
||||
aiToastChatFailed: "Chat failed: ",
|
||||
aiToastWcNoName: "Please enter a wildcard name",
|
||||
aiStatusGeneratingImage: "Generating image...",
|
||||
aiChatNoWorkflowLoaded: "No workflow loaded in GenerateUI",
|
||||
aiChatGenerateNotReady: "GenerateUI is not ready yet",
|
||||
aiChatNoImageProduced: "Generation completed but no image was produced",
|
||||
aiToastImageGenFailed: "Image generation failed: ",
|
||||
aiChatSaveSvgToGallery: "Save to Gallery",
|
||||
aiChatSvgSaved: "SVG saved to gallery",
|
||||
aiChatSvgSaveFailed: "Failed to save SVG: ",
|
||||
aiChatImgGenToggle: "Allow image generation",
|
||||
aiSettingsChatGenTitle: "Chat Image Generation",
|
||||
aiSettingsChatGenDedicated: "Use dedicated workflow",
|
||||
aiSettingsChatI2IGenTitle: "Chat I2I Generation",
|
||||
aiChatAttachmentLabel: "Image attached",
|
||||
aiChatNoLoadImageNode: "No LoadImage node found in the target workflow for image-to-image",
|
||||
|
||||
// -- Help & Support --
|
||||
tabHelp: "Help",
|
||||
@@ -613,15 +637,15 @@ const LANGUAGES = {
|
||||
helpWf6: "Detail modal: rename, favorite, thumbnail change, badge assignment, tags, memo, AI summary, send to canvas, load in GenerateUI, set as default, delete",
|
||||
helpWf7: "Badge management: add, rename, delete badges with custom colors shared with the Models tab (⚙ Badge button)",
|
||||
helpGen1: "Connect/disconnect ComfyUI and check connection status",
|
||||
helpGen2: "Load workflows from Workflow tab (App format .app.json not supported); Reset Workflow button re-reads the current workflow file from disk and reloads the editor; Save button (right end of the tab bar) saves the current workflow — including any edits made in the editor — as a new .json file to the Workflow tab; a filename dialog appears with the current workflow name as the default",
|
||||
helpGen2: "Load workflows from Workflow tab (subgraph-containing workflows are supported, e.g. Flux.2 / Qwen-Image / Z-Image / Mage-Flow templates; only ComfyUI's simplified App format [.app.json / Linear Mode] is not); Reset Workflow button re-reads the current workflow file from disk and reloads the editor; Save button (right end of the tab bar) saves the current workflow — including any edits made in the editor — as a new .json file to the Workflow tab; a filename dialog appears with the current workflow name as the default",
|
||||
helpGen3: "5-tab layout — Input (Prompt + Image), Model, Settings, Feeder, Batch — Input/Model/Settings each include a Raw JSON column for instant preview and direct editing",
|
||||
helpGen4: "Input tab: inner tabs — Prompt and Image (drag-and-drop upload); Prompt tab has Positive Prompt, Negative Prompt, and an Embeddings selector at the bottom — select a model, set Weight (default 1.0), then click Paste to insert (embedding:Name:weight) at the cursor position of the last focused textarea (defaults to Positive if neither is focused)",
|
||||
helpGen4: "Input tab: inner tabs — Prompt and Image (drag-and-drop upload); Prompt tab has Positive Prompt, Negative Prompt, and an Embeddings selector at the bottom — select a model, set Weight (default 1.0), then click Paste to insert (embedding:Name:weight) at the cursor position of the last focused textarea (defaults to Positive if neither is focused); a ↺ button next to each Apply button reverts the textarea to the node's currently applied value; select text (or just place the cursor on a word/parenthesis block) and press Ctrl+↑/↓ to adjust its emphasis weight in (text:weight) syntax by ±0.05 — the parentheses are removed automatically when the weight returns to 1.0",
|
||||
helpGen5: "Model tab: Checkpoint, VAE, LoRA (Single/Stack tabs), ControlNet, Diffusion Model (UNETLoader / UnetLoaderGGUF / LoaderGGUF), Text Encoder (CLIPLoader / DualCLIPLoader / ClipLoaderGGUF / DualClipLoaderGGUF — type and device selectors; DualCLIP shows two clip selectors), Hypernetwork (with Strength field) selectors with filter",
|
||||
helpGen6: "Settings tab: KSampler and Latent Image side by side, each at 50% width",
|
||||
helpGen7: "Raw JSON always visible in the right column of each tab — edit directly and Apply to reload the workflow",
|
||||
helpGen7: "Raw JSON always visible in the right column of each tab — edit directly and Apply to reload the workflow; if the loaded workflow has Bypass or Mute nodes, a note listing them appears above the search bar (Bypass nodes are excluded with their wires reconnected around them; Mute nodes are excluded with no reconnection, matching ComfyUI itself)",
|
||||
helpGen8: "Seed control: random, fixed, increment, decrement",
|
||||
helpGen9: "Generate, progress display, stop, and view results",
|
||||
helpGen10: "Eagle integration: auto-save generated images to Eagle",
|
||||
helpGen10: "Eagle integration: auto-save generated images to Eagle (SVG output supported too — both the standard SaveSVGNode and comfyui-tosvg's Save SVG String node)",
|
||||
helpGen11: "Batch tab — enable one batch type at a time by checking the checkbox in the Batch Queue column header; Generate then runs through all queued items sequentially with Pause/Resume and Stop controls",
|
||||
helpGen12: "Batch tab — Left pane has 3 tabs: Checkpoints (folder tree with Filter/All/None; (root) header checkbox selects all), Sampler (KSampler sampler_name list with (root) checkbox), Scheduler (KSampler scheduler list with (root) checkbox); All/None toolbar buttons also available",
|
||||
helpGen13: "Batch tab — Center pane: group-based selection with inner tabs (Checkpoint | Lora | Prompt | Workflow); Checkpoint/Lora groups come from the Models tab, Prompt groups from the Prompt tab, Workflow groups from the Workflow tab — check a group header to select all its members, or expand ▶ to select individually",
|
||||
@@ -629,6 +653,8 @@ const LANGUAGES = {
|
||||
helpGen15: "Sampler/Scheduler batch: select samplers or schedulers in the left pane, enable the column in Batch Queue, then Generate to iterate through each value on the KSampler node; lists are fetched from ComfyUI (connection required)",
|
||||
helpGen16: "SPA-side wildcard expansion (A1111-style): when prompt text in non-ImpactWildcard nodes (e.g. CLIPTextEncode) contains __name__ syntax, the SPA expands it at generation time by randomly picking a line from the matching file in the WFS wildcard folder; nested wildcards are re-expanded up to 5 passes; unresolved wildcards are passed through unchanged; ImpactWildcardEncode/Processor nodes are skipped (handled server-side by Impact Pack); works in both single and batch generation",
|
||||
helpGen17: "Style batch: select styles from the Style tab in the left pane, enable the Style column in Batch Queue, then Generate — each selected style is applied in sequence to the positive and negative prompts; applied to workflow copies so the loaded workflow is not modified; style files are re-read on each page load from user/default/Workflow-Studio/style/*.json",
|
||||
helpGen18: "Alt+Click any Apply button (Positive Prompt / Checkpoint / KSampler) to Apply & Generate in one step — applies the parameter to the workflow then immediately queues a generation; only fires when the target node exists in the loaded workflow",
|
||||
helpGen19: "Lora batch: for each LoRA, its syntax (<lora:name:strength_model:strength_clip>) and CivitAI trained words are automatically appended to the Positive prompt — rebuilt from the original prompt each time, not accumulated; the prompt is automatically restored to its pre-batch state when the batch completes or is stopped; if a selected LoRA is not yet recognized by ComfyUI's model list, a warning toast is shown (Refresh or restart ComfyUI)",
|
||||
helpFeederTitle: "GenerateUI Tab — Feeder subtab",
|
||||
helpFeederDesc: "Two modes switchable via the [Image Loop] / [Gallery] toggle at the top of the left pane.",
|
||||
helpFeederImgloopTitle: "Image Loop mode",
|
||||
@@ -651,7 +677,7 @@ const LANGUAGES = {
|
||||
helpFeederGal5: "__Feeder__ group: reserved group pre-created automatically; cannot be renamed or deleted; add images to it from the Gallery tab using the F overlay button on each thumbnail",
|
||||
helpFeederGal6: "WFS_GalleryFeeder canvas controls: the node also has Run / Stop / After Gen widgets added directly on the ComfyUI canvas — these work the same as the WFM UI controls and allow running the gallery feeder loop without opening WFM",
|
||||
helpSearchPlaceholder: "Search help...",
|
||||
helpPrompt1: "AI assistant (Ollama / LM Studio): model selection, chat for prompt consultation, image attachment (vision models); backend and URL configured in Settings tab",
|
||||
helpPrompt1: "AI assistant (Ollama / LM Studio / Lemonade): model selection, chat for prompt consultation, image attachment (vision models); backend and URL configured in Settings tab",
|
||||
helpPrompt2: "Apply AI responses to GenerateUI prompts",
|
||||
helpPrompt3: "Translation: JA\u2194EN, ZH\u2194EN",
|
||||
helpPrompt4: "Preset management: create, edit, positive/negative prompt clipboard copy (PP/NP)",
|
||||
@@ -664,7 +690,7 @@ const LANGUAGES = {
|
||||
helpSettings2: "Theme selection (13 presets) with customization: color overrides, background patterns (stripes, polka dot, checkerboard, SVG tiling), and font selection (16 Google Fonts including Japanese display fonts)",
|
||||
helpSettings3: "Workflow data folder path",
|
||||
helpSettings4: "ComfyUI connection URL and test",
|
||||
helpSettings5: "AI Assistant (Prompt Tab): backend (Ollama / LM Studio), API URL, default model, and connection test",
|
||||
helpSettings5: "AI Assistant (Prompt Tab): backend (Ollama / LM Studio / Lemonade), API URL, default model, and connection test",
|
||||
helpSettings6: "Default workflow setting",
|
||||
helpSettings7: "Eagle integration URL and auto-save toggle",
|
||||
helpSettings8: "Data Management: export all plugin data (settings, metadata, prompts, etc.) to a JSON file, or import to restore. After importing, restart ComfyUI.",
|
||||
@@ -739,22 +765,23 @@ const LANGUAGES = {
|
||||
helpSidepanel13: "I tab (Information): drop a ComfyUI PNG/WebP/JSON to inspect model, LoRA, and prompt metadata in the side panel — sub-tabs: model / lora / Prompts; supports UnetLoaderGGUF, QuadrupleCLIPLoader, and Lora Loader (LoraManager) node types",
|
||||
helpSidepanel14: "Information tab — drag items to canvas: model sub-tab places the loader node (Checkpoint → CheckpointLoaderSimple, VAE → VAELoader, Diffusion Model → UNETLoader, Text Encoder → CLIPLoader); double-click also places at canvas center",
|
||||
helpSidepanel15: "Information tab — LoRA sub-tab: detects LoRAs from LoraLoader, LoraLoaderModelOnly, and Lora Loader (LoraManager) nodes (API format supported); drag individual LoRA to place LoraLoader; \"Multiple LORA\" section places all LoRAs in a single Lora Loader (LoraManager) node with LoRA syntax pre-filled; Prompts sub-tab: drag a prompt to place CLIPTextEncode node with text pre-filled; click prompt to view full text and copy",
|
||||
helpSidepanel16: "A tab (AI Tools): Translation, Chat, TOOLS, and Settings sub-tabs powered by Ollama or LM Studio; Chat supports multi-turn conversations; TOOLS includes VLM image analysis and wildcard generation; settings shared with the SPA AI TOOL tab via localStorage",
|
||||
helpSidepanel16: "A tab (AI Tools): Translation, Chat, TOOLS, and Settings sub-tabs powered by Ollama, LM Studio, or Lemonade; Chat supports multi-turn conversations; TOOLS includes VLM image analysis and wildcard generation; settings shared with the SPA AI TOOL tab via localStorage",
|
||||
helpSidepanel17: "Send to Canvas: clicking 'Send to Canvas' (Workflow tab) or 'Copy & Send Canvas' (Gallery tab) sends the workflow directly to the ComfyUI canvas — both UI and API formats are supported; if Workflow Studio was not opened from the ComfyUI toolbar (window.opener unavailable), UI-format workflows fall back to title drag (title turns blue with a green ●)",
|
||||
helpAiTitle: "AI Tab (A)",
|
||||
helpAi1: "4-pane layout — Translation | Chat | TOOLS | Settings — all panes are always visible simultaneously",
|
||||
helpAi2: "Translation pane: translate between Japanese, English, Chinese, or Free language; ⇄ swap button swaps both language selectors and text content; selections are saved automatically",
|
||||
helpAi3: "Chat pane: multi-turn conversation with the LLM; Enter to send a message, Shift+Enter for a newline; Clear button resets the conversation history",
|
||||
helpAi4: "TOOLS pane — VLM: drop an image (PNG/JPG/WebP) and select a task (Describe Image, Create Prompt, Create Tags), click Run; or select \"Create wildcards\", enter a category name and count to generate plain-text entries one per line",
|
||||
helpAi5: "Settings pane: choose backend (Ollama / LM Studio), set API URL, test connection, select model, configure Free language names for translation",
|
||||
helpAi6: "Settings are saved to localStorage and shared with the Library panel's A tab",
|
||||
helpAi3: "Chat pane: multi-turn conversation with the LLM; Enter to send a message, Shift+Enter for a newline; Clear button resets the conversation history; if the model supports tool calling and asks for an image (\"generate a cat picture\", etc.) it will run generation on the workflow currently loaded in GenerateUI and show the result inline; the \"Allow image generation\" checkbox in the pane header toggles this on/off; if an image is attached (dropped in the TOOLS pane) it is sent to the LLM as vision input and, when generate_image is called, used as the base for image-to-image generation instead of text-to-image; models verified to work well for tool calling and vision: Gemma 4:e4b, Qwen 3.5:9b, Ministral 3:3b (Ollama)",
|
||||
helpAi4: "TOOLS pane — VLM: drop an image (PNG/JPG/WebP) and select a task (Describe Image, Create Prompt, Create Tags), click Run; or select \"Create wildcards\", enter a category name and count to generate plain-text entries one per line; the dropped image is also shared with the Chat pane as its attachment (shown there and used for image-to-image generation) until cleared with the ✕ button",
|
||||
helpAi5: "Settings pane: choose backend (Ollama / LM Studio / Lemonade), set API URL, test connection, select model, configure Free language names for translation",
|
||||
helpAi6: "Settings pane: choose backend (Ollama / LM Studio / Lemonade), set API URL, test connection, select model, configure Free language names; Chat Image Generation section lets you enable a dedicated workflow for Chat-triggered text-to-image generation instead of the one currently loaded in GenerateUI; Chat I2I Generation section is the same but for image-to-image generation when an image is attached; settings are shared with the Library panel's A tab via localStorage",
|
||||
helpAi7: "Chat pane — SVG: the LLM can also produce SVG graphics directly as text, with no ComfyUI workflow involved; ask it to draw something in SVG and, if the reply contains SVG code, it is rendered inline as a preview with a \"Save to Gallery\" button that writes it as a .svg file to the Gallery tab's output folder; this does not use tool calling, so it works with any model regardless of tool-calling support",
|
||||
helpImageEditTitle: "Image Edit Tab",
|
||||
helpImageEdit1: "Layer-based image editor — compose images with multiple layers (Image, Text, Draw, Mask types) and export the composite",
|
||||
helpImageEdit2: "Loading images: drag & drop onto the canvas, Upload button, or send from the Gallery tab via the Image Edit button in the Gallery toolbar; the first image becomes Layer 1 (auto-locked); subsequent images are added as new layers scaled to fit the canvas",
|
||||
helpImageEdit3: "New button: create a blank canvas — prompts for WxH size (e.g. 512x768); clears all existing layers",
|
||||
helpImageEdit3: "New button: create a blank canvas — prompts for WxH size (e.g. 512x768); clears all existing layers and automatically adds an empty Layer 1",
|
||||
helpImageEditToolsTitle: "Tools",
|
||||
helpImageEdit4: "Select (V): click to select a layer; drag to move; drag corner handles to resize; drag the circle above the top edge to rotate; double-click a text layer to re-edit its content; Tool Options bar shows Flip H / Flip V / Rotate field",
|
||||
helpImageEdit5: "Draw (B): freehand brush drawing onto the active draw layer; Tool Options: color, brush size, blend mode",
|
||||
helpImageEdit5: "Draw (B): freehand brush drawing onto the active draw layer; Tool Options: color, brush size, blend mode; Properties pane includes a MASK EDITOR ONE (COLOR) section for ABR image brushes — always visible, header text is green when brushes are available, gray when none are imported yet; Select is disabled until at least one brush exists",
|
||||
helpImageEdit6: "Text (T): click on the canvas to place a text input overlay; configure font family, size, bold/italic, align, color in the Tool Options bar; click OK to place the text as an exact-size Text layer; double-click an existing text layer with the Select tool to re-edit",
|
||||
helpImageEdit7: "Shape (S): draw geometric shapes onto the canvas; each committed shape becomes an independent draw layer; Tool Options: Shape type (Rect / Ellipse / Line / FreeLine), Rounded checkbox (Rect / Ellipse only), Fill color + None toggle (hidden for Line / FreeLine), Stroke color + width + None toggle (None hidden for Line / FreeLine where stroke is always active), Opacity slider, ↩ Undo button; drag to draw — a blue dashed outline previews the shape; release to commit",
|
||||
helpImageEditLayerTitle: "Layer Panel",
|
||||
@@ -785,16 +812,25 @@ const LANGUAGES = {
|
||||
helpImageEdit29: "Mouse wheel: Zoom in / out",
|
||||
helpImageEdit30: "Double-click (Select tool on text layer): Re-edit text",
|
||||
helpImageEdit7b: "Blur (≈): apply Gaussian blur or mosaic to the active layer — whole-layer or region-based (drag a rectangle); see the Blur Tool card below for details",
|
||||
helpImageEdit7c: "BG Remove (⬚): remove the background from the active layer using Lightweight (@imgly, runs in browser) or BiRefNet (Python backend, coming soon); see the BG Remove Tool card below for details",
|
||||
helpImageEdit7d: "Mask (🎭): paint a white mask on the canvas; click \"M\" in the Layers header to add a mask layer — the Mask tool activates automatically; the mask is shown as a colored semi-transparent overlay; the Properties pane (left of the Layers panel) shows Paint controls; see the Mask Tool card below for details",
|
||||
helpImageEdit7c: "BG Remove (⬚): remove the background from the active layer using Lightweight (@imgly, runs in browser) or BiRefNet (requires Mask Editor One + birefnet.safetensors in ComfyUI/models/background_removal/); see the BG Remove Tool card below for details",
|
||||
helpImageEdit7d: "Mask (🎭): paint masks on a mask layer using 6 sub-tools — Paint (freehand), Color (flood-select by similar color), Alpha (extract from image transparency), Text (stamp text), Vector (Catmull-Rom spline polygon), Shape (rect / ellipse); SAM3 text-prompt segmentation is also available when Mask Editor One is installed; click \"M\" in the Layers header to add a mask layer; see the Mask Tool card below for details",
|
||||
helpImageEdit7e: "Inpaint (🩹): composites the visible layers plus a Mask layer into one RGBA image (mask baked into the alpha channel) and applies it to the first inpaint-capable LoadImage node in the workflow currently loaded in GenerateUI (a node whose MASK output feeds something like VAEEncodeForInpaint); enter Positive/Negative prompts, Grow Mask By (applied to the VAE Encode (for Inpainting) node), and Denoise (applied to KSampler) in the properties panel, then click Run to upload and generate without leaving the Image Edit tab — the result is shown back in the properties panel when done; requires a Mask layer to be painted first and an inpaint-capable workflow loaded in GenerateUI; also works with workflows built around the Mask Editor One custom node (comfyui-mask-editor-one) instead of LoadImage — image/mask are pushed to it via its node_id-keyed server cache and layer_data widget; \"Use dedicated workflow\" checkbox: when off, the workflow currently loaded in GenerateUI is used (unchanged); when on, pick a saved workflow from the dropdown — it is loaded, edited, and generated entirely in the background without disturbing the workflow shown in GenerateUI",
|
||||
helpImageEdit8b: "\"M\" button in the Layers header: adds a new mask layer above the current layer and automatically switches to the Mask tool",
|
||||
helpImageEdit12: "Type icons: 🖼 = image layer, T = text layer, ✏ = draw layer, ⬚ = mask layer",
|
||||
helpImageEditMaskTitle: "Mask Tool (🎭)",
|
||||
helpImageEditMask1: "Add a mask layer: click the \"M\" button in the Layers panel header; the new mask layer is inserted above the active layer and the Mask tool activates automatically",
|
||||
helpImageEditMask2: "Clicking a mask layer in the layer list automatically switches to the Mask tool",
|
||||
helpImageEditMask3: "Tool Options bar (Paint / Invert / Overlay / Blur): Paint button toggles the Paint sub-tool; Invert checkbox inverts the overlay preview (shows color where mask is absent); Overlay color picker changes the preview color (default red); Blur slider (0–50 px) softens the overlay edge",
|
||||
helpImageEditMask4: "Properties pane (left of the Layers panel, visible when Mask tool is active): Size (1–200 px), Hardness (0–100%), Mode — Add button draws white (mask present) / Erase button removes to transparent (mask absent); the active mode is highlighted in blue",
|
||||
helpImageEditMask3: "Tool Options bar — sub-tools: Paint / Color / Alpha / Text / Vector / Shape (all work without Mask Editor One) / SAM3 (requires Mask Editor One, disabled if not installed); Invert checkbox inverts the overlay preview; Overlay color picker changes the preview color (default red); Blur slider (0–50 px) softens the overlay edge; the overlay is only shown for the currently active mask layer — inactive mask layers stay hidden until selected",
|
||||
helpImageEditMask4: "Properties pane — Paint mode: Mode (Add / Erase), Size (1–200 px), Hardness (0–100%); MASK EDITOR ONE section (always visible — header text is green when ABR brushes are available, gray when none are imported yet): Select button opens the ABR brush library (disabled until at least one brush exists) — choosing a brush replaces the default circle brush; ✕ clears the brush back to Circle; when an image brush is active, Hardness is disabled and additional controls appear: Spacing (stamp interval 5–100%), Angle (rotation 0–359°), Sz Jitter (random size reduction per stamp 0–100%), Rot. Jitter (random rotation per stamp on/off)",
|
||||
helpImageEditMask5: "✂ button on a mask layer row: toggles the layer as a clipping mask — when enabled (blue), the mask clips the layer directly below it so only the painted area is visible; clipping is applied when saving PNG / Gallery / ComfyUI",
|
||||
helpImageEditMask6: "SAM3 (Mask Editor One required): text-prompt segmentation powered by the SAM3 model; enter a description of the object to segment (e.g. \"cat\", \"person\"), set Max (maximum mask candidates: 3/6/9/12), then click Segment",
|
||||
helpImageEditMask7: "SAM3 workflow: after Segment, candidate masks appear as thumbnails in the Properties pane — click to select (blue border + ✓); multiple masks can be selected; click Apply Selected (N) to apply them all; Mode (Add / Erase) controls how masks are merged into the current mask layer; a new mask layer is created automatically if the active layer is not a mask",
|
||||
helpImageEditMask8: "ABR Brush Library (Mask Editor One required, Paint mode only): click Select in the MASK EDITOR ONE section to open the brush picker — browse folders on the left, click a thumbnail to apply; \"Round Brush (default)\" restores the circle brush; brushes are shared with Mask Editor One and stored in its brushes/ folder",
|
||||
helpImageEditMask9: "Color sub-tool: click anywhere on the canvas to flood-select pixels similar in color to the clicked point — Properties pane: Mode (Add / Subtract), Tolerance (0–255, color similarity threshold), Feather % (0–100, soft edge falloff within tolerance range)",
|
||||
helpImageEditMask10: "Alpha sub-tool: extract the transparency of the image layers as a mask — Properties pane: Threshold (pixels with alpha ≥ threshold become full mask; 0 = all alpha included), Invert (reverse the extracted result), Extract Alpha button applies the operation; works on a composite of all visible non-mask layers",
|
||||
helpImageEditMask11: "Text sub-tool: click on the canvas to open a text stamp overlay; enter text, configure Font / Size / Bold / Italic / Align, choose Mode (Add = white stamp / Erase = cut mask), then click Stamp or press Ctrl+Enter; multi-line text supported (newline in textarea)",
|
||||
helpImageEditMask12: "Vector sub-tool: click to place control points connected by a Catmull-Rom spline; click the first point again (or press Enter) to close and fill the polygon; Backspace removes the last point; Esc resets all points; Properties pane shows current point count and Mode (Add / Erase)",
|
||||
helpImageEditMask13: "Shape sub-tool: drag to draw a rectangle or ellipse mask; hold Shift for a perfect square or circle; a blue dashed outline previews the shape while dragging; Properties pane: Mode (Add / Erase), Shape (Rect / Ellipse)",
|
||||
helpImageEditBlurTitle: "Blur Tool (≈)",
|
||||
helpImageEditBlur1: "Whole Blur: applies a Gaussian blur to the entire active layer — adjust the intensity slider (1–50 px) and click Apply",
|
||||
helpImageEditBlur2: "Whole Mosaic: applies a pixelation mosaic to the entire active layer — adjust the block size slider (5–100 px) and click Apply",
|
||||
@@ -804,7 +840,7 @@ const LANGUAGES = {
|
||||
helpImageEditBlur6: "All operations support Undo (Ctrl+Z)",
|
||||
helpImageEditBgRemoveTitle: "BG Remove Tool (⬚)",
|
||||
helpImageEditBgRemove1: "Model — Lightweight (@imgly): runs entirely in the browser using the @imgly/background-removal library loaded from CDN; no server required; first use downloads the model (~40 MB) and caches it for the session",
|
||||
helpImageEditBgRemove2: "Model — BiRefNet: high-quality background removal using the BiRefNet model via the Workflow Studio Python backend; requires birefnet.safetensors placed in ComfyUI/models/background_removal/ (coming soon)",
|
||||
helpImageEditBgRemove2: "Model — BiRefNet: high-quality background removal using the BiRefNet model; requires Mask Editor One to be installed and birefnet.safetensors placed in ComfyUI/models/background_removal/",
|
||||
helpImageEditBgRemove3: "New Layer (checked by default): the result is added as a new layer above the active layer at the same position and display size — the original layer is preserved",
|
||||
helpImageEditBgRemove4: "When New Layer is unchecked, the active layer's canvas is replaced in-place with the background-removed result",
|
||||
helpImageEditBgRemove5: "Click Remove BG to start processing; status text shows Loading model → Processing → Done; supports Undo (Ctrl+Z)",
|
||||
@@ -825,12 +861,13 @@ const LANGUAGES = {
|
||||
helpShortcuts4: "Double-click: Open detail modal",
|
||||
helpTroubleTitle: "Troubleshooting",
|
||||
helpTrouble1: "Cannot connect to ComfyUI: Check if ComfyUI can generate images, verify URL in Settings, try refreshing or restarting",
|
||||
helpTrouble2: "Cannot connect to AI assistant: Use the connection test button in Settings tab; for Ollama check it is running and models are downloaded; for LM Studio check the server is running and a model is loaded",
|
||||
helpTrouble2: "Cannot connect to AI assistant: Use the connection test button in Settings tab; for Ollama check it is running and models are downloaded; for LM Studio or Lemonade check the server is running and a model is loaded",
|
||||
helpTrouble3: "Workflows not showing: Click refresh button, check if loadable in ComfyUI, try restarting browser/ComfyUI",
|
||||
helpTrouble4: "Image generation fails: Check if specified models exist in ComfyUI, verify connection, try restarting",
|
||||
helpTrouble5: "LoRA Stack fails with 'No such file or directory' error: The LoRA may not be recognized by comfyui-lora-manager (known issue). Try a different LoRA or check if the file appears in Lora Manager's own UI",
|
||||
helpTrouble6: "Model loading error after moving or deleting models: ComfyUI caches file paths and may still reference old locations. Perform a Hard Reset from the ComfyUI menu (Queue → Hard Reset) or restart ComfyUI to clear the cache.",
|
||||
helpTrouble7: "Tagger tab shows no models: verify the model folder exists at ComfyUI/models/tagger/<model-name>/ and contains a .onnx or .h5 file; if onnxruntime is not installed, run: python_embeded\\python.exe -m pip install onnxruntime",
|
||||
helpTrouble8: "Model tab shows a checkpoint you didn't expect (e.g. always the same model regardless of the loaded workflow): the checkpoint saved in the workflow file is not installed, so it was silently replaced with another available model during loading — an error toast reports the original (missing) model name when this happens. Select the correct checkpoint manually in the Model tab, or enable \"Default Checkpoint\" in Settings to force a known-good model on every load.",
|
||||
helpSupportTitle: "Support",
|
||||
helpSupportDesc: "If you find this plugin useful, please consider supporting its development!",
|
||||
helpGithubDesc: "Report issues, request features, and contribute",
|
||||
@@ -854,6 +891,10 @@ const LANGUAGES = {
|
||||
comfyuiConnection: "ComfyUI Connection",
|
||||
comfyuiUrl: "ComfyUI URL",
|
||||
comfyuiUrlHint: "When running as ComfyUI plugin, leave empty to use same origin. Only set if ComfyUI is on a different server.",
|
||||
defaultCheckpointSettings: "Default Checkpoint",
|
||||
defaultCheckpointEnable: "Force default checkpoint on workflow load",
|
||||
defaultCheckpointModel: "Default checkpoint model",
|
||||
defaultCheckpointHint: "When enabled, the Checkpoint of every checkpoint loader node is overridden with this model whenever a workflow is loaded into GenerateUI — useful to avoid errors or garbled images caused by a mismatched model saved in the workflow file.",
|
||||
connectedCheck: "Connected \u2713",
|
||||
failedConnect: "Failed to connect \u2717",
|
||||
ollamaSettings: "AI Assistant Settings (Prompt Tab)",
|
||||
@@ -862,6 +903,8 @@ const LANGUAGES = {
|
||||
selectModel: "Select model...",
|
||||
noModelsFound: "No models found",
|
||||
failedLoadModels: "Failed to load models",
|
||||
modelNotFound: "not found",
|
||||
modelNotFoundHint: "The model saved in this workflow was not found among the installed models. Please select the correct one from the list.",
|
||||
saveOllama: "Save AI Assistant Settings",
|
||||
testConnection: "Test Connection",
|
||||
ollamaConnected: "Connected \u2713",
|
||||
@@ -971,7 +1014,7 @@ const LANGUAGES = {
|
||||
helpMetadata2: "Center column: Checkpoint, VAE, Diffusion Model, and Text Encoder lists extracted from the workflow",
|
||||
helpMetadata3: "Right column: LoRA list (with strength values) and Prompt list (click to view full text below)",
|
||||
helpMetadata4: "Prompt actions — Copy: copy to clipboard; GenUI:P/N: set GenerateUI positive/negative prompt; Prompt:P/N: set Prompt tab preset positive/negative",
|
||||
helpMetadata5: "Supported: ComfyUI PNG/WebP/JSON (standard + Flux.2 / Qwen-Image / Z-Image subgraph workflows), SD WebUI, SD Forge, Fooocus.",
|
||||
helpMetadata5: "Supported: ComfyUI PNG/WebP/JSON (standard + Flux.2 / Qwen-Image / Z-Image / Mage-Flow subgraph workflows), SD WebUI, SD Forge, Fooocus.",
|
||||
},
|
||||
|
||||
ja: {
|
||||
@@ -1060,6 +1103,7 @@ const LANGUAGES = {
|
||||
sendToCanvas: "キャンバスへ送る",
|
||||
copyAndSendCanvas: "コピー＆キャンバスへ送る",
|
||||
workflowSentToCanvas: "ワークフロー準備完了 — タイトルをキャンバスへドラッグ",
|
||||
workflowSentToCanvasDirect: "ワークフローをキャンバスへ送信しました",
|
||||
comfyUILoadTimeout: "ComfyUIの読み込みがタイムアウトしました",
|
||||
popupBlocked: "ポップアップがブロックされました。このサイトのポップアップを許可してください。",
|
||||
setAsDefault: "デフォルトに設定",
|
||||
@@ -1084,6 +1128,7 @@ const LANGUAGES = {
|
||||
deleteConfirm: (name) => `"${name}" を削除しますか？`,
|
||||
summaryGenerated: "要約を生成しました",
|
||||
summarizeError: "要約エラー",
|
||||
summarizeOllamaOnly: "要約機能はOllamaバックエンドのみ対応しています。設定でバックエンドを切り替えてください。",
|
||||
copied: "コピーしました",
|
||||
|
||||
// -- GenerateUI --
|
||||
@@ -1174,10 +1219,15 @@ const LANGUAGES = {
|
||||
unknownWorkflowFormat: "不明なワークフロー形式です",
|
||||
generationComplete: "生成が完了しました",
|
||||
generationError: (msg) => `生成エラー: ${msg}`,
|
||||
defaultCheckpointApplied: (name) => `デフォルトCheckpointを適用しました: ${name}`,
|
||||
checkpointSubstitutedWarning: (names) => `このワークフローのCheckpoint「${names}」が見つからず、無警告で別のモデルに差し替えられました。Modelタブを確認してください。`,
|
||||
rawJsonBypassNote: (list) => `バイパス中(除外・配線は再接続済み): ${list}`,
|
||||
rawJsonMutedNote: (list) => `ミュート中(除外): ${list}`,
|
||||
batchNoneSelected: (what) => `${what}が選択されていません`,
|
||||
batchItemFailed: (i, total, msg) => `[${i}/${total}] 失敗: ${msg}`,
|
||||
batchStopped: (completed, failed) => `バッチ停止 — 完了${completed}件、失敗${failed}件`,
|
||||
batchComplete: (completed, total, failed) => failed > 0 ? `バッチ完了: ${completed}/${total}件 (${failed}件失敗)` : `バッチ完了: ${completed}/${total}件`,
|
||||
batchLoraMissing: (count, total, sample) => `選択したLoRAのうち${count}/${total}件がComfyUIに認識されていません（例: ${sample}）。ComfyUIでRefreshするかサーバーを再起動してから再実行してください。`,
|
||||
connectedToComfyUI: "ComfyUIに接続しました",
|
||||
failedToConnect: "接続に失敗しました",
|
||||
modelListsRefreshed: "モデルリストを更新しました",
|
||||
@@ -1323,6 +1373,7 @@ const LANGUAGES = {
|
||||
modelsGenUIUnsupported: "このモデルタイプはGenerateUIに設定できません",
|
||||
modelsGenUINoWorkflow: "GenerateUIにワークフローが読み込まれていません",
|
||||
modelsGenUINoNode: (type) => `現在のワークフローに${type}ノードが見つかりません`,
|
||||
revertPromptTitle: "直前にApplyしたプロンプトに戻す",
|
||||
modelsCopyName: "クリックでモデル名をコピー",
|
||||
modelsCopiedName: "モデル名をコピーしました",
|
||||
modelsFilePath: "ファイルパス",
|
||||
@@ -1439,6 +1490,8 @@ const LANGUAGES = {
|
||||
gallerySelectImageFirst: "先に画像を選択してください",
|
||||
galleryNoLoadImageNode: "現在のワークフローにLoadImageノードがありません",
|
||||
gallerySentGenUI: "GenerateUI Imageタブへ送信しました",
|
||||
galleryCCNotAvailable: "Send CCはComfyUI Comic Creator内のギャラリーから開いた場合のみ使用できます",
|
||||
gallerySentCC: "ComfyUI Comic Creatorへ送信しました",
|
||||
galleryNoEmbeddedWorkflow: "この画像にはComfyUIワークフローが埋め込まれていません。",
|
||||
galleryBulkSelected: "件選択中",
|
||||
galleryBulkDeselectAll: "選択解除",
|
||||
@@ -1565,6 +1618,20 @@ const LANGUAGES = {
|
||||
aiStatusChatting: "考え中...",
|
||||
aiToastChatFailed: "チャット失敗: ",
|
||||
aiToastWcNoName: "ワイルドカード名を入力してください",
|
||||
aiStatusGeneratingImage: "画像を生成中...",
|
||||
aiChatNoWorkflowLoaded: "GenerateUIにワークフローが読み込まれていません",
|
||||
aiChatGenerateNotReady: "GenerateUIの準備ができていません",
|
||||
aiChatNoImageProduced: "生成は完了しましたが画像が出力されませんでした",
|
||||
aiToastImageGenFailed: "画像生成に失敗しました: ",
|
||||
aiChatSaveSvgToGallery: "Galleryに保存",
|
||||
aiChatSvgSaved: "SVGをGalleryに保存しました",
|
||||
aiChatSvgSaveFailed: "SVGの保存に失敗しました: ",
|
||||
aiChatImgGenToggle: "画像生成を許可する",
|
||||
aiSettingsChatGenTitle: "Chat画像生成",
|
||||
aiSettingsChatGenDedicated: "専用ワークフローを使用",
|
||||
aiSettingsChatI2IGenTitle: "Chat I2I生成",
|
||||
aiChatAttachmentLabel: "画像を添付中",
|
||||
aiChatNoLoadImageNode: "対象ワークフローにI2I用のLoadImageノードが見つかりません",
|
||||
|
||||
// -- Help & Support --
|
||||
tabHelp: "ヘルプ",
|
||||
@@ -1581,15 +1648,15 @@ const LANGUAGES = {
|
||||
helpWf6: "詳細モーダル：名前変更、お気に入り、サムネイル変更、バッジ付与、タグ、メモ、AI要約、キャンバスへ送る、生成UIに読み込み、デフォルト設定、削除",
|
||||
helpWf7: "バッジ管理：バッジの追加・名前変更・削除、カスタム色設定（Modelsタブと共有）— ⚙ Badgeボタン",
|
||||
helpGen1: "ComfyUIの接続・切断、接続状態の確認",
|
||||
helpGen2: "Workflowタブからワークフローを読み込み（App形式 .app.json は非対応）。Reset Workflowボタンは現在のワークフローファイルをディスクから再読込してエディタをリロード。Saveボタン（タブバー右端）はエディタでの編集を含む現在のワークフローを新しい.jsonファイルとしてWorkflowタブに保存（現在のワークフロー名を初期値としたファイル名ダイアログを表示）",
|
||||
helpGen2: "Workflowタブからワークフローを読み込み（サブグラフを含むワークフローにも対応 — Flux.2 / Qwen-Image / Z-Image / Mage-Flow 等のテンプレート含む；ComfyUIの簡略化App形式 [.app.json / Linear Mode] のみ非対応）。Reset Workflowボタンは現在のワークフローファイルをディスクから再読込してエディタをリロード。Saveボタン（タブバー右端）はエディタでの編集を含む現在のワークフローを新しい.jsonファイルとしてWorkflowタブに保存（現在のワークフロー名を初期値としたファイル名ダイアログを表示）",
|
||||
helpGen3: "5タブ構成 — Input（プロンプト＋画像）、Model、Settings、Feeder、Batch — Input/Model/SettingsタブにはRaw JSON列を常時表示",
|
||||
helpGen4: "Inputタブ：Prompt・Imageの内部タブ切り替え；PromptタブにはPositive Prompt・Negative Promptに加え最下部にEmbeddingsセレクタを表示（Filter＋セレクト＋Weight入力＋Pasteボタン）— Pasteは最後にフォーカスしたテキストエリアのカーソル位置に(embedding:Name:weight)を挿入（未フォーカス時はPositiveに追加）",
|
||||
helpGen4: "Inputタブ：Prompt・Imageの内部タブ切り替え；PromptタブにはPositive Prompt・Negative Promptに加え最下部にEmbeddingsセレクタを表示（Filter＋セレクト＋Weight入力＋Pasteボタン）— Pasteは最後にフォーカスしたテキストエリアのカーソル位置に(embedding:Name:weight)を挿入（未フォーカス時はPositiveに追加）；各Applyボタンの左隣の↺ボタンはテキストエリアをノードの現在の適用値に戻す；テキストを選択（または単語・括弧内にカーソルを置くだけでも可）してCtrl+↑/↓を押すと(text:weight)形式で強調weightを±0.05単位で調整（weightが1.0に戻ると括弧を自動解除）",
|
||||
helpGen5: "Modelタブ：Checkpoint/VAE/LoRA（Single/Stackタブ）/ControlNet/Diffusion Model（UNETLoader / UnetLoaderGGUF / LoaderGGUF対応）/Text Encoder（CLIPLoader / DualCLIPLoader / ClipLoaderGGUF / DualClipLoaderGGUF対応 — typeおよびdevice選択付き、DualCLIPは2段モデル選択）/Hypernetwork（Strength入力付き）のセレクタ（フィルタ検索付き）",
|
||||
helpGen6: "Settingsタブ：KSamplerとLatent Imageを横並び（各50%幅）",
|
||||
helpGen7: "Raw JSONを各タブの右列に常時表示 — 直接編集してApplyでワークフロー即時反映",
|
||||
helpGen7: "Raw JSONを各タブの右列に常時表示 — 直接編集してApplyでワークフロー即時反映；読み込んだワークフローにBypass/Muteノードがある場合、検索バー上部に一覧が表示される（Bypassは除外され配線が再接続される、Muteは除外されるが再接続はされない点はComfyUI本体と同じ）",
|
||||
helpGen8: "シード管理：ランダム / 固定 / 増加 / 減少",
|
||||
helpGen9: "画像生成、進捗表示、生成停止、結果表示",
|
||||
helpGen10: "Eagle連携：生成画像をEagleへ自動保存",
|
||||
helpGen10: "Eagle連携：生成画像をEagleへ自動保存（SVG出力にも対応 — 標準SaveSVGNodeおよびcomfyui-tosvgのSave SVG Stringノードの両方）",
|
||||
helpGen11: "Batchタブ — バッチキューのカラムヘッダーのチェックボックスで1種類だけ有効化；Generateで全キュー項目を順次処理；一時停止/再開・停止ボタンで制御可能",
|
||||
helpGen12: "Batchタブ — 左ペインは3タブ構成：Checkpoints（フォルダツリー、Filter/All/None、(root)ヘッダーで全選択）、Sampler（KSamplerのsampler_nameリスト、(root)チェックボックスで全選択）、Scheduler（KSamplerのschedulerリスト、(root)チェックボックスで全選択）；各タブにAll/Noneボタンも完備",
|
||||
helpGen13: "Batchタブ — 中央ペイン：グループ選択（Checkpoint | Lora | Prompt | Workflowの内部タブ）；Checkpoint/LoraグループはModelsタブ、PromptグループはPromptタブ、WorkflowグループはWorkflowタブの定義を反映 — グループヘッダーにチェックで全メンバーを選択、▶で展開して個別選択も可能",
|
||||
@@ -1597,6 +1664,8 @@ const LANGUAGES = {
|
||||
helpGen15: "Sampler/Schedulerバッチ：左ペインでサンプラーまたはスケジューラーを選択し、バッチキューの対応列を有効化してGenerateを実行；選択した値を順番にKSamplerノードに適用して生成；リストはComfyUIから取得（要接続）",
|
||||
helpGen16: "SPAサイドのワイルドカード展開（A1111スタイル）：ImpactWildcard系以外のノード（CLIPTextEncodeなど）のプロンプトに__name__構文が含まれる場合、生成時にSPA側がWFSワイルドカードフォルダの対応ファイルからランダムに1行選んで展開；ネストしたワイルドカードは最大5パスまで再展開；見つからないワイルドカードはそのまま送信；ImpactWildcardEncode/ProcessorノードはスキップしてComfyUIサーバー側（Impact Pack）が処理；単体生成・バッチ生成どちらでも機能",
|
||||
helpGen17: "スタイルバッチ：左ペインのStyleタブでスタイルを選択し、バッチキューのStyle列を有効化してGenerateを実行 — 選択した各スタイルをPositiveおよびNegativeプロンプトに順番に適用；ワークフローコピーに適用されるため読み込み済みワークフローは変更されない；スタイルファイルはページロードのたびに user/default/Workflow-Studio/style/*.json から再読み込み",
|
||||
helpGen18: "Applyボタンを Alt+Click すると Apply & Generate を1操作で実行 — 対象：Positive Prompt・Checkpoint・KSamplerの各Applyボタン；ワークフローに値を書き込んだ後、即座に生成をキューに追加；対象ノードが存在しない場合は何もしない",
|
||||
helpGen19: "Loraバッチ：各LoRA適用時にLora構文(<lora:名前:strength_model:strength_clip>)とCivitAIトリガーワードをPositiveプロンプトへ自動追加 — 毎回元のプロンプトを起点に再構築するため蓄積しない；バッチ完了・停止後はプロンプトを開始前の状態へ自動復元；選択したLoRAがComfyUIのモデル一覧にまだ認識されていない場合は警告トーストを表示（ComfyUIのRefreshまたは再起動が必要）",
|
||||
helpFeederTitle: "GenerateUI Tab — Feeder サブタブ",
|
||||
helpFeederDesc: "左ペイン上部の [Image Loop] / [Gallery] トグルで2つのモードを切り替えられます。",
|
||||
helpFeederImgloopTitle: "Image Loop モード",
|
||||
@@ -1619,7 +1688,7 @@ const LANGUAGES = {
|
||||
helpFeederGal5: "__Feeder__ グループ：自動で作成される予約グループ；名前変更・削除不可；ギャラリータブの各サムネイル上の F ボタンでこのグループに画像を追加",
|
||||
helpFeederGal6: "WFS_GalleryFeeder キャンバスコントロール：このノードには ComfyUI キャンバス上に直接 Run / Stop / After Gen ウィジェットが追加されており、WFM を開かずにギャラリーフィーダーループを実行できます",
|
||||
helpSearchPlaceholder: "ヘルプを検索...",
|
||||
helpPrompt1: "AIアシスタント（Ollama / LM Studio）：モデル選択、チャットでプロンプト相談、画像添付（ビジョンモデル対応）；バックエンドとURLは設定タブで設定",
|
||||
helpPrompt1: "AIアシスタント（Ollama / LM Studio / Lemonade）：モデル選択、チャットでプロンプト相談、画像添付（ビジョンモデル対応）；バックエンドとURLは設定タブで設定",
|
||||
helpPrompt2: "AIの応答をGenerateUIのプロンプトに適用",
|
||||
helpPrompt3: "翻訳機能：日⇔英、中⇔英",
|
||||
helpPrompt4: "プリセット管理：作成・編集、ポジティブ/ネガティブプロンプトのクリップボードコピー（PP/NP）",
|
||||
@@ -1632,7 +1701,7 @@ const LANGUAGES = {
|
||||
helpSettings2: "テーマ選択（13種プリセット）＋カスタマイズ：カラー調整、背景パターン（ストライプ、ポルカドット、チェック、SVGタイリング）、フォント選択（日本語デザインフォント含む16種のGoogle Fonts）",
|
||||
helpSettings3: "ワークフローデータフォルダのパス変更・リセット",
|
||||
helpSettings4: "ComfyUI接続URL設定と接続テスト",
|
||||
helpSettings5: "AI Assistant（プロンプトタブ）：バックエンド（Ollama / LM Studio）・API URL・デフォルトモデル・接続テスト",
|
||||
helpSettings5: "AI Assistant（プロンプトタブ）：バックエンド（Ollama / LM Studio / Lemonade）・API URL・デフォルトモデル・接続テスト",
|
||||
helpSettings6: "デフォルトワークフローの設定・解除",
|
||||
helpSettings7: "Eagle連携URL、自動保存の有効/無効",
|
||||
helpSettings8: "データ管理：設定・メタデータ・プロンプトなど全データをJSONにエクスポート、またはインポートして復元。インポート後はComfyUIを再起動してください。",
|
||||
@@ -1711,18 +1780,19 @@ const LANGUAGES = {
|
||||
helpSidepanel17: "Send to Canvas：WorkflowタブのSend to CanvasまたはGalleryタブのCopy & Send Canvasをクリックするとワークフローをキャンバスへ直接送信（UI形式・API形式どちらも対応）；ComfyUIのツールバーから開いていない場合はUI形式のみタイトルドラッグのフォールバック（タイトルが青くなり緑の●が表示される — ドラッグで読み込み）",
|
||||
helpAiTitle: "AI タブ（A）",
|
||||
helpAi1: "4ペインレイアウト — Translation | Chat | TOOLS | Settings — 全ペインが常時表示される",
|
||||
helpAi2: "翻訳ペイン：Ollama または LM Studio を使って日本語・英語・中国語・カスタム言語（Free）間でテキストを翻訳；⇄ ボタンで言語とテキストを同時入替；選択は自動保存",
|
||||
helpAi3: "Chat ペイン：LLM とのマルチターン会話；Enter で送信、Shift+Enter で改行；Clear ボタンで会話履歴をリセット",
|
||||
helpAi4: "TOOLS ペイン — VLM：画像（PNG/JPG/WebP）をドロップしてタスク（画像解説 / プロンプト作成 / タグ作成）を選んで Run；または「Create wildcards」を選んでカテゴリ名と件数を入力すると1行1エントリのワイルドカードを生成",
|
||||
helpAi5: "設定ペイン：バックエンド（Ollama / LM Studio）・API URL・接続テスト・モデル選択・Free 言語名を設定",
|
||||
helpAi6: "設定は localStorage に保存され、Library パネルの A タブと共有される",
|
||||
helpAi2: "翻訳ペイン：Ollama、LM Studio、または Lemonade を使って日本語・英語・中国語・カスタム言語（Free）間でテキストを翻訳；⇄ ボタンで言語とテキストを同時入替；選択は自動保存",
|
||||
helpAi3: "Chat ペイン：LLM とのマルチターン会話；Enter で送信、Shift+Enter で改行；Clear ボタンで会話履歴をリセット；モデルがtool callingに対応している場合、「猫の画像を作って」のように頼むとGenerateUIに読み込み中のワークフローで生成を実行し、結果をチャット内に表示する；ペインヘッダーの「画像生成を許可する」チェックボックスでこの機能のON/OFFを切り替えられる；画像が添付されている場合（TOOLSペインにドロップした画像）はLLMにもビジョン入力として送信され、generate_image呼び出し時はT2Iの代わりにI2I（image-to-image）の元画像として使われる；tool callingとビジョンの動作を確認済みのモデル: Gemma 4:e4b、Qwen 3.5:9b、Ministral 3:3b（Ollama）",
|
||||
helpAi4: "TOOLS ペイン — VLM：画像（PNG/JPG/WebP）をドロップしてタスク（画像解説 / プロンプト作成 / タグ作成）を選んで Run；または「Create wildcards」を選んでカテゴリ名と件数を入力すると1行1エントリのワイルドカードを生成；ドロップした画像はChatペインの添付としても共有され（Chat側にも表示、I2I生成に使用）、✕ボタンでクリアするまで保持される",
|
||||
helpAi5: "設定ペイン：バックエンド（Ollama / LM Studio / Lemonade）・API URL・接続テスト・モデル選択・Free 言語名を設定",
|
||||
helpAi6: "Settings ペイン：バックエンド（Ollama / LM Studio / Lemonade）の選択、APIのURL設定、接続テスト、モデル選択、Free言語名の設定；Chat Image Generationセクションでは、ChatからのT2I画像生成にGenerateUIの現在の読み込みワークフローの代わりに専用ワークフローを使うよう設定できる；Chat I2I Generationセクションは同様の設定を画像添付時のI2I生成向けに提供する；設定は localStorage に保存され、Library パネルの A タブと共有される",
|
||||
helpAi7: "Chat ペイン — SVG：LLMはComfyUIワークフローを一切使わず、SVGグラフィックをテキストとして直接生成することもできる；「SVGで〜を描いて」のように頼み、応答にSVGコードが含まれていれば自動でインラインプレビュー表示され、「Galleryに保存」ボタンでGalleryタブの出力フォルダに.svgファイルとして保存できる；tool calling（function calling）を使用しないため、tool calling非対応のモデルでも動作する",
|
||||
helpImageEditTitle: "Image Edit タブ",
|
||||
helpImageEdit1: "レイヤーベースの画像エディタ — 複数のレイヤー（画像・テキスト・描画・マスク）を重ね合わせて画像を合成・エクスポート",
|
||||
helpImageEdit2: "画像の読み込み：キャンバスへのドラッグ＆ドロップ、Uploadボタン、またはGalleryタブのImage Editボタンから送信；最初の画像はLayer 1として自動ロック；以降の画像はキャンバスサイズに合わせてスケールされ新規レイヤーとして追加",
|
||||
helpImageEdit3: "Newボタン：空白キャンバスを作成 — W×Hサイズを入力（例: 512x768）；既存レイヤーは全て削除",
|
||||
helpImageEdit3: "Newボタン：空白キャンバスを作成 — W×Hサイズを入力（例: 512x768）；既存レイヤーは全て削除し、空のLayer 1を自動追加",
|
||||
helpImageEditToolsTitle: "ツール",
|
||||
helpImageEdit4: "Select (V)：クリックでレイヤーを選択、ドラッグで移動、コーナーハンドルでリサイズ、上辺の円ハンドルで回転；テキストレイヤーをダブルクリックすると再編集可能；ツールオプションバーにFlip H / Flip V / 回転角度入力を表示",
|
||||
helpImageEdit5: "Draw (B)：アクティブな描画レイヤーにフリーハンドで描画；ツールオプション：カラー、ブラシサイズ、ブレンドモード",
|
||||
helpImageEdit5: "Draw (B)：アクティブな描画レイヤーにフリーハンドで描画；ツールオプション：カラー、ブラシサイズ、ブレンドモード；プロパティペインにABR画像ブラシ用のMASK EDITOR ONE (COLOR)セクションを常時表示 — ブラシが利用可能な場合は見出しが緑、未インポートの場合はグレー；ブラシが1つも無い間はSelectボタンが無効",
|
||||
helpImageEdit6: "Text (T)：キャンバス上をクリックしてテキスト入力オーバーレイを表示；ツールオプションバーでフォントファミリー・サイズ・太字/斜体・配置・カラーを設定；OKをクリックするとテキストの正確なサイズのテキストレイヤーとして配置；Selectツールで既存テキストレイヤーをダブルクリックすると再編集可能",
|
||||
helpImageEdit7: "Shape (S)：キャンバスに図形を描画；確定した図形は独立した描画レイヤーになる；ツールオプション：Shapeタイプ（Rect / Ellipse / Line / FreeLine）、Roundedチェック（Rect / Ellipseのみ）、Fillカラー + Noneトグル（Line / FreeLineでは非表示）、Strokeカラー + 幅 + Noneトグル（Line / FreeLineのNone非表示）、Opacityスライダー、↩ Undoボタン；ドラッグで形状プレビュー（青い破線）、離すと確定",
|
||||
helpImageEditLayerTitle: "レイヤーパネル",
|
||||
@@ -1753,15 +1823,24 @@ const LANGUAGES = {
|
||||
helpImageEdit29: "マウスホイール：ズームイン / アウト",
|
||||
helpImageEdit30: "ダブルクリック（Selectツールでテキストレイヤー）：テキストを再編集",
|
||||
helpImageEdit7b: "Blur (≈)：アクティブレイヤーにガウスぼかしまたはモザイクを適用 — 全体またはドラッグで矩形範囲指定；詳細は下の「Blur Tool」カードを参照",
|
||||
helpImageEdit7c: "BG Remove (⬚)：Lightweight（@imgly、ブラウザ内処理）またはBiRefNet（Pythonバックエンド、近日追加）でアクティブレイヤーの背景を除去；詳細は下の「BG Remove Tool」カードを参照",
|
||||
helpImageEdit7d: "Mask (🎭)：キャンバス上に白いマスクを描画；レイヤーヘッダーの「M」ボタンでマスクレイヤーを追加すると自動的にMaskツールに切り替わる；マスクはカラーの半透明オーバーレイとして表示；プロパティペイン（レイヤーパネル左隣）にPaintサブツールのコントロール；詳細は下の「Mask Tool」カードを参照",
|
||||
helpImageEdit7c: "BG Remove (⬚)：Lightweight（@imgly、ブラウザ内処理）またはBiRefNet（Mask Editor One + ComfyUI/models/background_removal/にbirefnet.safetensors必須）でアクティブレイヤーの背景を除去；詳細は下の「BG Remove Tool」カードを参照",
|
||||
helpImageEdit7d: "Mask (🎭)：6つのサブツールでマスクレイヤーにマスクを描画 — Paint（フリーハンド）・Color（色類似度フラッドセレクト）・Alpha（画像の透過チャンネル抽出）・Text（テキストスタンプ）・Vector（Catmull-Romスプライン多角形）・Shape（矩形/楕円）；Mask Editor OneインストールでSAM3テキストプロンプトセグメンテーションも利用可能；レイヤーヘッダーの「M」でマスクレイヤーを追加；詳細は下の「Mask Tool」カードを参照",
|
||||
helpImageEdit7e: "Inpaint (🩹)：表示中のレイヤーとマスクレイヤーを1枚のRGBA画像に合成（マスクをアルファチャンネルに焼き込み）し、GenerateUIで読み込み中のワークフロー内でインペイント対応の最初のLoadImageノード（MASK出力がVAEEncodeForInpaint等に接続されているノード）へ適用；プロパティパネルでポジ/ネガプロンプト、Grow Mask By（VAE Encode (for Inpainting)ノードへ反映）、Denoise（KSamplerへ反映）を入力してRunを押すと、Image Editタブに留まったままアップロード・生成を実行；完了後は結果画像がプロパティパネルに表示される；事前にマスクレイヤーの描画とインペイント対応ワークフローの読み込みが必要；LoadImageの代わりにMask Editor Oneカスタムノード（comfyui-mask-editor-one）を使ったワークフローにも対応（node_idキーのサーバーキャッシュとlayer_dataウィジェット経由で画像/マスクを反映）；「Use dedicated workflow」チェックボックス：OFF時はGenerateUIで読み込み中のワークフローを使用（従来通り）、ON時はドロップダウンから保存済みワークフローを選択すると、GenerateUIの表示状態には触れずバックグラウンドで読み込み・編集・生成を実行",
|
||||
helpImageEdit8b: "レイヤーヘッダーの「M」ボタン：アクティブレイヤーの上に新しいマスクレイヤーを追加し、自動的にMaskツールに切り替える",
|
||||
helpImageEditMaskTitle: "Mask ツール (🎭)",
|
||||
helpImageEditMask1: "マスクレイヤーの追加：レイヤーパネルヘッダーの「M」ボタンをクリック；新しいマスクレイヤーはアクティブレイヤーの上に挿入され、Maskツールが自動的に有効化される",
|
||||
helpImageEditMask2: "レイヤーリストでマスクレイヤーをクリックすると自動的にMaskツールに切り替わる",
|
||||
helpImageEditMask3: "ツールオプションバー（Paint / Invert / Overlay / Blur）：PaintボタンでPaintサブツールを切り替え；Invertチェックボックスでオーバーレイプレビューを反転（マスクがない部分にオーバーレイを表示）；Overlayカラーピッカーでプレビューカラーを変更（デフォルト赤）；Blurスライダー（0〜50 px）でオーバーレイプレビューの輪郭をぼかす",
|
||||
helpImageEditMask4: "プロパティペイン（レイヤーパネル左隣、Maskツール選択時に表示）：Sizeスライダー（1〜200 px）、Hardnessスライダー（0〜100%）、Modeボタン — Addボタン（白で描画/マスクあり）/ Eraseボタン（透明化/マスクなし）；アクティブなModeが青くハイライト",
|
||||
helpImageEditMask3: "ツールオプションバー — サブツール：Paint / Color / Alpha / Text / Vector / Shape（全てMask Editor One不要）/ SAM3（Mask Editor One必須・未インストール時は無効）；Invertチェックボックスでオーバーレイプレビューを反転；Overlayカラーピッカーでプレビューカラーを変更（デフォルト赤）；Blurスライダー（0〜50 px）でオーバーレイ輪郭をぼかす；オーバーレイは選択中（アクティブ）のマスクレイヤーのみ表示され、非アクティブなマスクは選択するまで非表示",
|
||||
helpImageEditMask4: "プロパティペイン — Paintモード：Mode（Add / Erase）・Size（1〜200 px）・Hardness（0〜100%）；MASK EDITOR ONEセクション（常時表示 — ABRブラシが利用可能な場合は見出しが緑、未インポートの場合はグレー）：Selectボタンでブラシピッカーを開く（ブラシが1つも無い間は無効）（選択したブラシがデフォルト円形に代わる）；✕でCircle（デフォルト）に戻す；画像ブラシ選択中はHardnessが無効になり追加コントロールが表示：Spacing（スタンプ間隔 5〜100%）・Angle（回転角 0〜359°）・Sz Jitter（スタンプごとのサイズランダム変動 0〜100%）・Rot. Jitter（スタンプごとの角度ランダム変動 on/off）",
|
||||
helpImageEditMask5: "マスクレイヤー行の ✂ ボタン：クリッピングマスクとして機能させるon/off切り替え — 有効（青）のとき、直下のレイヤーをマスクの描画範囲でクリッピングして表示；クリッピングはPNG保存 / Gallery / ComfyUI送信にも反映される",
|
||||
helpImageEditMask6: "SAM3（Mask Editor One必須）：SAM3モデルによるテキストプロンプトセグメンテーション；対象オブジェクトの説明（例：\"cat\"・\"person\"）を入力し、Max（マスク候補の最大数：3/6/9/12）を設定してSegmentをクリック",
|
||||
helpImageEditMask7: "SAM3の操作フロー：Segment後、候補マスクのサムネイルがプロパティペインに表示される — クリックして選択（青ボーダー + ✓）；複数選択可；Apply Selected（N）で選択したマスクを一括適用；Mode（Add / Erase）で現在のマスクレイヤーへの合成方法を制御；アクティブレイヤーがマスクでない場合は新規マスクレイヤーを自動作成",
|
||||
helpImageEditMask8: "ABRブラシライブラリ（Mask Editor One必須・Paintモードのみ）：MASK EDITOR ONEセクションのSelectボタンでブラシピッカーを開く — 左のフォルダツリーで絞り込み、サムネイルをクリックして適用；「Round Brush (default)」で円形ブラシに戻す；ブラシはMask Editor Oneと共有しその brushes/ フォルダに保存される",
|
||||
helpImageEditMask9: "Color サブツール：キャンバスをクリックするとクリック位置の色に近いピクセルをマスクとして選択 — プロパティペイン：Mode（Add / Subtract）・Tolerance（0〜255、色の許容範囲）・Feather %（0〜100、許容範囲内でのぼかし量）",
|
||||
helpImageEditMask10: "Alpha サブツール：画像レイヤーの透過チャンネルをマスクとして抽出 — プロパティペイン：Threshold（この値以上のアルファを持つピクセルが完全マスクになる；0 = 全アルファを含む）・Invert（抽出結果を反転）・「Extract Alpha」ボタンで実行；表示中の全非マスクレイヤーの合成から抽出",
|
||||
helpImageEditMask11: "Text サブツール：キャンバスをクリックするとテキストスタンプオーバーレイを表示；テキストを入力し Font / Size / Bold / Italic / Align と Mode（Add = 白スタンプ / Erase = マスク削除）を設定して「Stamp」またはCtrl+Enterで確定；テキストエリア内の改行で複数行対応",
|
||||
helpImageEditMask12: "Vector サブツール：クリックでCatmull-Romスプラインの制御点を追加；最初の点を再クリック（またはEnter）で閉じてポリゴンを塗りつぶし；Backspaceで直前の点を削除；Escで全点をリセット；プロパティペインに現在の点数とMode（Add / Erase）を表示",
|
||||
helpImageEditMask13: "Shape サブツール：ドラッグで矩形または楕円のマスクを描画；Shift押下で正方形/正円；ドラッグ中は青の点線でプレビュー表示；プロパティペイン：Mode（Add / Erase）・Shape（Rect / Ellipse）",
|
||||
helpImageEditBlurTitle: "Blur ツール (≈)",
|
||||
helpImageEditBlur1: "Whole Blur：アクティブレイヤー全体にガウスぼかしを適用 — 強度スライダー（1〜50 px）で調整してApplyをクリック",
|
||||
helpImageEditBlur2: "Whole Mosaic：アクティブレイヤー全体にピクセル化モザイクを適用 — ブロックサイズスライダー（5〜100 px）で調整してApplyをクリック",
|
||||
@@ -1771,7 +1850,7 @@ const LANGUAGES = {
|
||||
helpImageEditBlur6: "全操作でUndo（Ctrl+Z）に対応",
|
||||
helpImageEditBgRemoveTitle: "BG Remove ツール (⬚)",
|
||||
helpImageEditBgRemove1: "モデル — Lightweight（@imgly）：CDNから読み込む @imgly/background-removal ライブラリを使用してブラウザ内で処理；サーバー不要；初回使用時にモデル（約40 MB）をダウンロードしてセッション中にキャッシュ",
|
||||
helpImageEditBgRemove2: "モデル — BiRefNet：Workflow Studio Pythonバックエンド経由でBiRefNetモデルを使用する高品質な背景除去；ComfyUI/models/background_removal/ に birefnet.safetensors が必要（近日対応）",
|
||||
helpImageEditBgRemove2: "モデル — BiRefNet：BiRefNetモデルによる高品質な背景除去；Mask Editor Oneのインストールと ComfyUI/models/background_removal/ への birefnet.safetensors 配置が必要",
|
||||
helpImageEditBgRemove3: "New Layer（デフォルトON）：結果をアクティブレイヤーの上に同じ位置・表示サイズの新規レイヤーとして追加 — 元レイヤーは保持",
|
||||
helpImageEditBgRemove4: "New LayerをOFFにすると、アクティブレイヤーのキャンバスが背景除去済みの結果で直接置き換えられる",
|
||||
helpImageEditBgRemove5: "Remove BGをクリックして処理開始；ステータステキストに「Loading model → Processing → Done」と表示；Undo（Ctrl+Z）に対応",
|
||||
@@ -1792,12 +1871,13 @@ const LANGUAGES = {
|
||||
helpShortcuts4: "ダブルクリック：詳細モーダルを開く",
|
||||
helpTroubleTitle: "トラブルシューティング",
|
||||
helpTrouble1: "ComfyUIに接続できない：ComfyUIで画像生成できるか確認、設定タブでURL確認、ブラウザ更新・再起動",
|
||||
helpTrouble2: "AIアシスタントに接続できない：設定タブの接続テストボタンで確認；Ollamaの場合は起動とモデルのダウンロードを確認；LM Studioの場合はサーバー起動とモデルのロードを確認",
|
||||
helpTrouble2: "AIアシスタントに接続できない：設定タブの接続テストボタンで確認；Ollamaの場合は起動とモデルのダウンロードを確認；LM StudioまたはLemonadeの場合はサーバー起動とモデルのロードを確認",
|
||||
helpTrouble3: "ワークフローが表示されない：更新ボタン押下、ComfyUIで読み込めるか確認、ブラウザ・ComfyUI再起動",
|
||||
helpTrouble4: "画像生成が失敗する：指定モデルの存在確認、ComfyUI接続確認、再起動",
|
||||
helpTrouble5: "LoRAスタック実行時に「No such file or directory」エラー：comfyui-lora-managerが該当LoRAを認識していない可能性があります（既知の問題）。別のLoRAを試すか、Lora Manager自体のUIで該当ファイルが表示されるか確認してください",
|
||||
helpTrouble6: "モデルの移動・削除後にモデル読み込みエラーが発生する：ComfyUIがファイルパスをキャッシュしており、古い場所を参照することがあります。ComfyUIメニューのHard Reset（Queue → Hard Reset）またはComfyUIを再起動してキャッシュをクリアしてください。",
|
||||
helpTrouble7: "Taggerタブにモデルが表示されない：ComfyUI/models/tagger/<モデル名>/ フォルダの存在と .onnx または .h5 ファイルの有無を確認；onnxruntimeが未インストールの場合は python_embeded\\python.exe -m pip install onnxruntime を実行",
|
||||
helpTrouble8: "ModelタブのCheckpointが想定と違うモデルになっている（どのワークフローを読み込んでも同じモデルになる等）：ワークフローファイルに保存されたCheckpointが実際にはインストールされておらず、読み込み時に無警告で別のインストール済みモデルに差し替えられています。この場合、元の（見つからなかった）モデル名を含むエラートーストが表示されます。Modelタブで正しいCheckpointを手動選択するか、設定タブの「デフォルトCheckpoint」を有効にして、読み込み時に常に動作確認済みのモデルを強制適用してください。",
|
||||
helpSupportTitle: "サポート",
|
||||
helpSupportDesc: "このプラグインが役に立ったら、開発を支援していただけると嬉しいです！",
|
||||
helpGithubDesc: "バグ報告、機能リクエスト、コントリビュート",
|
||||
@@ -1821,6 +1901,10 @@ const LANGUAGES = {
|
||||
comfyuiConnection: "ComfyUI 接続",
|
||||
comfyuiUrl: "ComfyUI URL",
|
||||
comfyuiUrlHint: "ComfyUIプラグインとして動作する場合は空欄（同一オリジン推奨）。別サーバーの場合のみ設定してください。",
|
||||
defaultCheckpointSettings: "デフォルトCheckpoint",
|
||||
defaultCheckpointEnable: "ワークフロー読み込み時にデフォルトCheckpointを強制適用する",
|
||||
defaultCheckpointModel: "デフォルトCheckpointモデル",
|
||||
defaultCheckpointHint: "有効にすると、GenerateUIにワークフローを読み込むたびに、すべてのCheckpointローダーノードのモデルがこの値で上書きされます。ワークフローファイルに保存されたモデルが環境と合わず、生成エラーや不鮮明な画像が発生するのを防ぐための設定です。",
|
||||
connectedCheck: "接続成功 \u2713",
|
||||
failedConnect: "接続失敗 \u2717",
|
||||
ollamaSettings: "AI Assistant設定（プロンプトタブ）",
|
||||
@@ -1829,6 +1913,8 @@ const LANGUAGES = {
|
||||
selectModel: "モデルを選択...",
|
||||
noModelsFound: "モデルが見つかりません",
|
||||
failedLoadModels: "モデル一覧の取得に失敗",
|
||||
modelNotFound: "見つかりません",
|
||||
modelNotFoundHint: "このワークフローに保存されているモデルが、インストール済みモデルの中に見つかりませんでした。正しいモデルを一覧から選択してください。",
|
||||
saveOllama: "AI Assistant設定を保存",
|
||||
testConnection: "接続テスト",
|
||||
ollamaConnected: "接続成功 \u2713",
|
||||
@@ -1938,7 +2024,7 @@ const LANGUAGES = {
|
||||
helpMetadata2: "中列: ワークフローから抽出した Checkpoint・VAE・Diffusion Model・Text Encoder の一覧",
|
||||
helpMetadata3: "右列: LoRA 一覧（強度値付き）＋プロンプト一覧（クリックで下部に全文表示）",
|
||||
helpMetadata4: "プロンプトアクション — Copy: クリップボードにコピー; GenUI:P/N: GenerateUI のポジティブ/ネガティブプロンプトにセット; Prompt:P/N: Prompt タブ Presets のポジティブ/ネガティブにセット",
|
||||
helpMetadata5: "対応フォーマット: ComfyUI PNG/WebP/JSON（標準形式 ＋ Flux.2 / Qwen-Image / Z-Image サブグラフ形式）・SD WebUI・SD Forge・Fooocus。",
|
||||
helpMetadata5: "対応フォーマット: ComfyUI PNG/WebP/JSON（標準形式 ＋ Flux.2 / Qwen-Image / Z-Image / Mage-Flow サブグラフ形式）・SD WebUI・SD Forge・Fooocus。",
|
||||
},
|
||||
|
||||
zh: {
|
||||
@@ -2027,6 +2113,7 @@ const LANGUAGES = {
|
||||
sendToCanvas: "发送到画布",
|
||||
copyAndSendCanvas: "复制并发送到画布",
|
||||
workflowSentToCanvas: "工作流已就绪 — 将标题拖拽到画布",
|
||||
workflowSentToCanvasDirect: "工作流已发送到画布",
|
||||
comfyUILoadTimeout: "ComfyUI加载超时",
|
||||
popupBlocked: "弹窗被阻止。请允许此站点的弹窗。",
|
||||
setAsDefault: "设为默认",
|
||||
@@ -2051,6 +2138,7 @@ const LANGUAGES = {
|
||||
deleteConfirm: (name) => `确定删除 "${name}" 吗？`,
|
||||
summaryGenerated: "摘要已生成",
|
||||
summarizeError: "摘要错误",
|
||||
summarizeOllamaOnly: "摘要功能仅支持 Ollama 后端，请在设置中切换后端。",
|
||||
copied: "已复制",
|
||||
|
||||
// -- GenerateUI --
|
||||
@@ -2141,10 +2229,15 @@ const LANGUAGES = {
|
||||
unknownWorkflowFormat: "未知的工作流格式",
|
||||
generationComplete: "生成完成",
|
||||
generationError: (msg) => `生成错误: ${msg}`,
|
||||
defaultCheckpointApplied: (name) => `已应用默认 Checkpoint：${name}`,
|
||||
checkpointSubstitutedWarning: (names) => `此工作流中的 Checkpoint「${names}」未找到，已被静默替换为其他模型。请检查 Model 标签页。`,
|
||||
rawJsonBypassNote: (list) => `已绕过(排除，已重新连接布线): ${list}`,
|
||||
rawJsonMutedNote: (list) => `已静音(排除): ${list}`,
|
||||
batchNoneSelected: (what) => `未选择${what}`,
|
||||
batchItemFailed: (i, total, msg) => `[${i}/${total}] 失败: ${msg}`,
|
||||
batchStopped: (completed, failed) => `批处理已停止 — 完成${completed}个，失败${failed}个`,
|
||||
batchComplete: (completed, total, failed) => failed > 0 ? `批处理完成: ${completed}/${total}个 (${failed}个失败)` : `批处理完成: ${completed}/${total}个`,
|
||||
batchLoraMissing: (count, total, sample) => `所选LoRA中有${count}/${total}个尚未被ComfyUI识别（例如：${sample}）。请在ComfyUI中点击Refresh或重启服务器后再试。`,
|
||||
connectedToComfyUI: "已连接到ComfyUI",
|
||||
failedToConnect: "连接失败",
|
||||
modelListsRefreshed: "模型列表已刷新",
|
||||
@@ -2290,6 +2383,7 @@ const LANGUAGES = {
|
||||
modelsGenUIUnsupported: "此模型类型无法在GenerateUI中设置",
|
||||
modelsGenUINoWorkflow: "GenerateUI中未加载工作流",
|
||||
modelsGenUINoNode: (type) => `当前工作流中未找到${type}节点`,
|
||||
revertPromptTitle: "恢复到上次应用的提示词",
|
||||
modelsCopyName: "点击复制模型名称",
|
||||
modelsCopiedName: "模型名称已复制",
|
||||
modelsFilePath: "文件路径",
|
||||
@@ -2406,6 +2500,8 @@ const LANGUAGES = {
|
||||
gallerySelectImageFirst: "请先选择图像",
|
||||
galleryNoLoadImageNode: "当前工作流中没有LoadImage节点",
|
||||
gallerySentGenUI: "已发送至GenerateUI图像标签",
|
||||
galleryCCNotAvailable: "仅当从ComfyUI Comic Creator内的图库打开时才能使用Send CC",
|
||||
gallerySentCC: "已发送至ComfyUI Comic Creator",
|
||||
galleryNoEmbeddedWorkflow: "此图像中未嵌入ComfyUI工作流。",
|
||||
galleryBulkSelected: "项已选择",
|
||||
galleryBulkDeselectAll: "取消全选",
|
||||
@@ -2532,6 +2628,20 @@ const LANGUAGES = {
|
||||
aiStatusChatting: "思考中...",
|
||||
aiToastChatFailed: "聊天失败：",
|
||||
aiToastWcNoName: "请输入通配符名称",
|
||||
aiStatusGeneratingImage: "正在生成图像...",
|
||||
aiChatNoWorkflowLoaded: "GenerateUI 中未加载工作流",
|
||||
aiChatGenerateNotReady: "GenerateUI 尚未就绪",
|
||||
aiChatNoImageProduced: "生成完成但未产生图像",
|
||||
aiToastImageGenFailed: "图像生成失败：",
|
||||
aiChatSaveSvgToGallery: "保存到图库",
|
||||
aiChatSvgSaved: "SVG已保存到图库",
|
||||
aiChatSvgSaveFailed: "SVG保存失败：",
|
||||
aiChatImgGenToggle: "允许生成图像",
|
||||
aiSettingsChatGenTitle: "Chat 图像生成",
|
||||
aiSettingsChatGenDedicated: "使用专用工作流",
|
||||
aiSettingsChatI2IGenTitle: "Chat I2I 生成",
|
||||
aiChatAttachmentLabel: "已附加图像",
|
||||
aiChatNoLoadImageNode: "目标工作流中未找到用于图生图的 LoadImage 节点",
|
||||
|
||||
// -- Help & Support --
|
||||
tabHelp: "帮助",
|
||||
@@ -2548,15 +2658,15 @@ const LANGUAGES = {
|
||||
helpWf6: "详情弹窗：重命名、收藏、缩略图更换、徽章分配、标签、备注、AI摘要、发送到画布、加载到生成UI、设为默认、删除",
|
||||
helpWf7: "徽章管理：添加、重命名、删除徽章并自定义颜色（与Models标签共享）— ⚙ Badge按钮",
|
||||
helpGen1: "连接/断开ComfyUI，检查连接状态",
|
||||
helpGen2: "从工作流标签页加载工作流（不支持App格式.app.json）。Reset Workflow按钮从磁盘重新读取当前工作流文件并重新加载编辑器。Save按钮（标签栏右端）将当前工作流（包括在编辑器中所做的编辑）保存为新的.json文件到工作流标签页；会显示以当前工作流名称为默认值的文件名对话框",
|
||||
helpGen2: "从工作流标签页加载工作流（支持含子图的工作流，例如 Flux.2 / Qwen-Image / Z-Image / Mage-Flow 等模板；仅不支持ComfyUI的简化App格式 [.app.json / Linear Mode]）。Reset Workflow按钮从磁盘重新读取当前工作流文件并重新加载编辑器。Save按钮（标签栏右端）将当前工作流（包括在编辑器中所做的编辑）保存为新的.json文件到工作流标签页；会显示以当前工作流名称为默认值的文件名对话框",
|
||||
helpGen3: "5标签布局 — Input（提示词＋图像）、Model、Settings、Feeder、Batch — Input/Model/Settings各含实时预览和直接编辑的Raw JSON列",
|
||||
helpGen4: "Input标签：含Prompt和Image子标签（拖放上传）；Prompt标签显示Positive Prompt、Negative Prompt，以及底部的Embeddings选择器（过滤＋下拉＋权重＋Paste按钮）— Paste将(embedding:Name:weight)插入最后聚焦文本框的光标位置（未聚焦时默认追加到Positive）",
|
||||
helpGen4: "Input标签：含Prompt和Image子标签（拖放上传）；Prompt标签显示Positive Prompt、Negative Prompt，以及底部的Embeddings选择器（过滤＋下拉＋权重＋Paste按钮）— Paste将(embedding:Name:weight)插入最后聚焦文本框的光标位置（未聚焦时默认追加到Positive）；每个Apply按钮左侧的↺按钮可将文本框恢复为节点当前已应用的值；选中文字（或将光标置于单词/括号内也可）后按Ctrl+↑/↓，即可以(text:weight)语法以±0.05为单位调整强调权重（权重恢复为1.0时自动去除括号）",
|
||||
helpGen5: "Model标签：Checkpoint/VAE/LoRA（Single/Stack标签）/ControlNet/Diffusion Model（支持UNETLoader / UnetLoaderGGUF / LoaderGGUF）/Text Encoder（支持CLIPLoader / DualCLIPLoader / ClipLoaderGGUF / DualClipLoaderGGUF — 含type和device选择器，DualCLIP显示两段模型选择）/Hypernetwork（带Strength输入）选择器（含筛选）",
|
||||
helpGen6: "Settings标签：KSampler与Latent Image并排显示（各占50%宽度）",
|
||||
helpGen7: "Raw JSON在每个标签右列常驻显示 — 直接编辑并Apply即时重载工作流",
|
||||
helpGen7: "Raw JSON在每个标签右列常驻显示 — 直接编辑并Apply即时重载工作流；如果加载的工作流包含Bypass或Mute节点，搜索栏上方会显示列表(Bypass节点会被排除但其连线会重新连接；Mute节点会被排除且不重新连接，与ComfyUI本体行为一致)",
|
||||
helpGen8: "种子管理：随机/固定/递增/递减",
|
||||
helpGen9: "生成图片、进度显示、停止生成、查看结果",
|
||||
helpGen10: "Eagle集成：自动保存生成图片到Eagle",
|
||||
helpGen10: "Eagle集成：自动保存生成图片到Eagle（也支持SVG输出 — 标准SaveSVGNode节点和comfyui-tosvg的Save SVG String节点均可）",
|
||||
helpGen11: "Batch标签 — 勾选批次队列列标题复选框激活对应批次类型（每次仅一种）；Generate按顺序处理所有队列项目；支持暂停/继续/停止控制",
|
||||
helpGen12: "Batch标签 — 左窗格含3个标签：Checkpoints（文件树，Filter/All/None，(root)标题勾选全选）、Sampler（KSampler采样器列表，(root)复选框全选）、Scheduler（KSampler调度器列表，(root)复选框全选）；每个标签均有All/None按钮",
|
||||
helpGen13: "Batch标签 — 中央窗格：基于组的选择（含Checkpoint | Lora | Prompt | Workflow内部标签）；Checkpoint/Lora组来自Models标签，Prompt组来自Prompt标签，Workflow组来自Workflow标签 — 勾选组标题选中所有成员，▶展开后也可单独选择",
|
||||
@@ -2564,6 +2674,8 @@ const LANGUAGES = {
|
||||
helpGen15: "Sampler/Scheduler批次：在左窗格选择采样器或调度器，启用批次队列对应列后点击Generate；依次将每个值应用到KSampler节点逐一生成；列表从ComfyUI获取（需已连接）",
|
||||
helpGen16: "SPA端通配符展开（A1111风格）：当非ImpactWildcard系节点（如CLIPTextEncode）的提示词中含有__name__语法时，SPA在生成时从WFS通配符文件夹的对应文件中随机选取一行展开；嵌套通配符最多重复展开5次；未找到的通配符原样传递；ImpactWildcardEncode/Processor节点跳过（由ComfyUI服务端Impact Pack处理）；单次生成和批量生成均有效",
|
||||
helpGen17: "样式批处理：在左窗格Style标签中选择样式，启用批次队列Style列后点击Generate — 每个选中样式依次应用到正向和负向提示词；样式应用于工作流副本，不会修改已加载的工作流；每次页面加载时从 user/default/Workflow-Studio/style/*.json 重新读取样式文件",
|
||||
helpGen18: "Alt+单击Apply按钮（Positive Prompt / Checkpoint / KSampler）可一步完成Apply & Generate — 将参数写入工作流后立即排队生成；仅当工作流中存在目标节点时才触发生成",
|
||||
helpGen19: "Lora批处理：应用每个LoRA时，会自动将其语法(<lora:名称:strength_model:strength_clip>)和CivitAI触发词追加到Positive提示词 — 每次都基于原始提示词重新构建，不会累积；批处理完成或停止后提示词会自动恢复到批处理前的状态；若所选LoRA尚未被ComfyUI模型列表识别，会显示警告提示（需在ComfyUI中Refresh或重启）",
|
||||
helpFeederTitle: "GenerateUI Tab — Feeder 子标签",
|
||||
helpFeederDesc: "通过左侧面板顶部的 [图片循环] / [图库] 切换按钮可在两种模式间切换。",
|
||||
helpFeederImgloopTitle: "图片循环模式",
|
||||
@@ -2586,7 +2698,7 @@ const LANGUAGES = {
|
||||
helpFeederGal5: "__Feeder__ 分组：自动预先创建的保留分组；不可重命名或删除；在图库标签页中点击每个缩略图上的 F 按钮可将图片添加到此分组",
|
||||
helpFeederGal6: "WFS_GalleryFeeder 画布控件：该节点在 ComfyUI 画布上直接添加了 Run / Stop / After Gen 组件——与 WFM 界面中的控件功能相同，无需打开 WFM 即可运行图库供给循环",
|
||||
helpSearchPlaceholder: "搜索帮助...",
|
||||
helpPrompt1: "AI助手（Ollama / LM Studio）：模型选择、聊天咨询提示词、图片附件（视觉模型）；后端和URL在设置标签页配置",
|
||||
helpPrompt1: "AI助手（Ollama / LM Studio / Lemonade）：模型选择、聊天咨询提示词、图片附件（视觉模型）；后端和URL在设置标签页配置",
|
||||
helpPrompt2: "将AI回复应用到生成UI的提示词",
|
||||
helpPrompt3: "翻译功能：日\u2194英、中\u2194英",
|
||||
helpPrompt4: "预设管理：创建、编辑、正面/负面提示词剪贴板复制（PP/NP）",
|
||||
@@ -2599,7 +2711,7 @@ const LANGUAGES = {
|
||||
helpSettings2: "主题选择（13种预设）+ 自定义：颜色调整、背景图案（条纹、波点、棋盘格、SVG平铺）、字体选择（含日文显示字体在内的16种Google Fonts）",
|
||||
helpSettings3: "工作流数据文件夹路径更改/重置",
|
||||
helpSettings4: "ComfyUI连接URL设置和测试",
|
||||
helpSettings5: "AI助手（提示词标签页）：后端（Ollama / LM Studio）、API URL、默认模型、连接测试",
|
||||
helpSettings5: "AI助手（提示词标签页）：后端（Ollama / LM Studio / Lemonade）、API URL、默认模型、连接测试",
|
||||
helpSettings6: "默认工作流设置/取消",
|
||||
helpSettings7: "Eagle集成URL、自动保存开关",
|
||||
helpSettings8: "数据管理：将所有插件数据（设置、元数据、提示词等）导出为JSON文件，或导入以恢复。导入后请重启ComfyUI。",
|
||||
@@ -2678,18 +2790,19 @@ const LANGUAGES = {
|
||||
helpSidepanel17: "Send to Canvas：在Workflow标签点击'Send to Canvas'或Gallery标签点击'Copy & Send Canvas'，工作流直接发送到ComfyUI画布（支持UI和API所有格式）；若Workflow Studio不是从ComfyUI工具栏打开，UI格式工作流将回退到标题拖拽（标题变蓝并显示绿色●——拖拽到画布加载）",
|
||||
helpAiTitle: "AI 标签页（A）",
|
||||
helpAi1: "4 面板布局 — Translation | Chat | TOOLS | Settings — 所有面板始终可见",
|
||||
helpAi2: "翻译面板：使用 Ollama 或 LM Studio 在日语、英语、中文或自定义语言（Free）之间翻译；⇄ 按钮同时互换语言和文本内容；选择自动保存",
|
||||
helpAi3: "Chat 面板：与 LLM 进行多轮对话；Enter 发送消息，Shift+Enter 换行；Clear 按钮重置对话历史",
|
||||
helpAi4: "TOOLS 面板 — VLM：拖放图像（PNG/JPG/WebP）并选择任务（图像描述 / 提示词生成 / 标签生成），点击 Run；或选择「Create wildcards」，输入类别名称和数量生成纯文本通配符条目（每行一条）",
|
||||
helpAi5: "设置面板：选择后端（Ollama / LM Studio）、设置 API URL、测试连接、选择模型、配置 Free 语言名称",
|
||||
helpAi6: "设置保存至 localStorage，并与 Library 面板的 A 标签共享",
|
||||
helpAi2: "翻译面板：使用 Ollama、LM Studio 或 Lemonade 在日语、英语、中文或自定义语言（Free）之间翻译；⇄ 按钮同时互换语言和文本内容；选择自动保存",
|
||||
helpAi3: "Chat 面板：与 LLM 进行多轮对话；Enter 发送消息，Shift+Enter 换行；Clear 按钮重置对话历史；如果模型支持 tool calling，当你要求生成图像（例如\"生成一张猫的图片\"）时，会使用 GenerateUI 中当前加载的工作流执行生成，并在对话中显示结果；面板标题栏的\"允许生成图像\"复选框可开关此功能；如果附加了图像（在 TOOLS 面板中拖放的图像），该图像会作为视觉输入发送给 LLM，调用 generate_image 时会以该图像为基础执行图生图（I2I），而不是文生图；已验证可正常支持 tool calling 与视觉功能的模型：Gemma 4:e4b、Qwen 3.5:9b、Ministral 3:3b（Ollama）",
|
||||
helpAi4: "TOOLS 面板 — VLM：拖放图像（PNG/JPG/WebP）并选择任务（图像描述 / 提示词生成 / 标签生成），点击 Run；或选择「Create wildcards」，输入类别名称和数量生成纯文本通配符条目（每行一条）；拖放的图像也会作为 Chat 面板的附件共享（在该处显示并用于图生图生成），直到点击 ✕ 按钮清除",
|
||||
helpAi5: "设置面板：选择后端（Ollama / LM Studio / Lemonade）、设置 API URL、测试连接、选择模型、配置 Free 语言名称",
|
||||
helpAi6: "Settings 面板：选择后端（Ollama / LM Studio / Lemonade）、设置 API URL、测试连接、选择模型、配置 Free 语言名称；Chat 图像生成部分可让 Chat 触发的文生图使用专用工作流，而不是 GenerateUI 中当前加载的工作流；Chat I2I 生成部分提供相同设置，用于附加图像时的图生图生成；设置保存至 localStorage，并与 Library 面板的 A 标签共享",
|
||||
helpAi7: "Chat 面板 — SVG：LLM 还可以直接以文本形式生成 SVG 图形，完全不涉及 ComfyUI 工作流；只需要求它用 SVG 绘制内容，如果回复中包含 SVG 代码，会自动渲染为内嵌预览，并提供\"保存到图库\"按钮，将其保存为 .svg 文件到 Gallery 标签页的输出文件夹；该功能不使用 tool calling（函数调用），因此不支持 tool calling 的模型也可以使用",
|
||||
helpImageEditTitle: "图像编辑选项卡",
|
||||
helpImageEdit1: "基于图层的图像编辑器 — 通过多个图层（图像、文字、绘制、遮罩类型）合成图像并导出",
|
||||
helpImageEdit2: "加载图像：拖放到画布、点击Upload按钮、或通过Gallery标签工具栏的Image Edit按钮发送；第一张图像成为图层1（自动锁定）；后续图像缩放至画布大小作为新图层添加",
|
||||
helpImageEdit3: "New按钮：创建空白画布 — 输入宽高（如512x768）；清除所有现有图层",
|
||||
helpImageEdit3: "New按钮：创建空白画布 — 输入宽高（如512x768）；清除所有现有图层并自动添加空白Layer 1",
|
||||
helpImageEditToolsTitle: "工具",
|
||||
helpImageEdit4: "Select (V)：点击选择图层；拖动移动；拖动角点手柄调整大小；拖动顶边圆形手柄旋转；双击文字图层可重新编辑；工具选项栏显示翻转H / 翻转V / 旋转角度",
|
||||
helpImageEdit5: "Draw (B)：在当前绘制图层上自由绘画；工具选项：颜色、笔刷大小、混合模式",
|
||||
helpImageEdit5: "Draw (B)：在当前绘制图层上自由绘画；工具选项：颜色、笔刷大小、混合模式；属性面板包含用于ABR图像笔刷的MASK EDITOR ONE (COLOR)区域 — 始终显示，笔刷可用时标题为绿色，未导入笔刷时为灰色；没有任何笔刷时Select按钮为禁用状态",
|
||||
helpImageEdit6: "Text (T)：点击画布放置文字输入框；在工具选项栏设置字体、大小、粗体/斜体、对齐方式、颜色；点击OK后以精确文字边界框大小创建文字图层；用Select工具双击现有文字图层可重新编辑",
|
||||
helpImageEdit7: "Shape (S)：在画布上绘制几何图形；每个确认的图形成为独立的绘制图层；工具选项：图形类型（Rect / Ellipse / Line / FreeLine）、圆角复选框（仅Rect/Ellipse）、填充颜色+None切换（Line/FreeLine隐藏）、描边颜色+宽度+None切换（Line/FreeLine的None隐藏，始终有描边）、不透明度滑块、↩撤销按钮；拖动预览（蓝色虚线），释放确认",
|
||||
helpImageEditLayerTitle: "图层面板",
|
||||
@@ -2720,15 +2833,24 @@ const LANGUAGES = {
|
||||
helpImageEdit29: "鼠标滚轮：放大/缩小",
|
||||
helpImageEdit30: "双击（Select工具点击文字图层）：重新编辑文字",
|
||||
helpImageEdit7b: "Blur (≈)：对活动图层应用高斯模糊或马赛克 — 整层或拖动矩形区域；详细内容参见下方「Blur Tool」卡片",
|
||||
helpImageEdit7c: "BG Remove (⬚)：使用Lightweight（@imgly，在浏览器中运行）或BiRefNet（Python后端，即将推出）去除活动图层背景；详细内容参见下方「BG Remove Tool」卡片",
|
||||
helpImageEdit7d: "Mask (🎭)：在画布上绘制白色遮罩；点击图层标题栏的「M」按钮添加遮罩图层，自动切换至Mask工具；遮罩以彩色半透明叠加方式显示；属性面板（图层面板左侧）显示Paint子工具控件；详细内容参见下方「Mask Tool」卡片",
|
||||
helpImageEdit7c: "BG Remove (⬚)：使用Lightweight（@imgly，在浏览器中运行）或BiRefNet（需要Mask Editor One + ComfyUI/models/background_removal/中的birefnet.safetensors）去除活动图层背景；详细内容参见下方「BG Remove Tool」卡片",
|
||||
helpImageEdit7d: "Mask (🎭)：使用6种子工具在遮罩图层上绘制遮罩 — Paint（徒手绘制）、Color（按颜色相似度泛选）、Alpha（从图像透明度提取）、Text（文字图章）、Vector（Catmull-Rom样条多边形）、Shape（矩形/椭圆）；安装Mask Editor One后还可使用SAM3文本提示分割；点击图层标题栏的「M」添加遮罩图层；详细内容参见下方「Mask Tool」卡片",
|
||||
helpImageEdit7e: "Inpaint (🩹)：将可见图层与遮罩图层合成为一张RGBA图像（遮罩烘焙进alpha通道），并应用到GenerateUI当前加载的工作流中第一个支持内绘的LoadImage节点（其MASK输出连接到VAEEncodeForInpaint等节点）；在属性面板中输入正/负向提示词、Grow Mask By（应用到VAE Encode (for Inpainting)节点）、Denoise（应用到KSampler）后点击Run，即可在不离开Image Edit标签的情况下完成上传与生成；完成后结果图像会显示在属性面板中；需先绘制遮罩图层并在GenerateUI中加载支持内绘的工作流；同样支持基于Mask Editor One自定义节点（comfyui-mask-editor-one）而非LoadImage构建的工作流（通过其按node_id缓存的服务端图像与layer_data组件写入图像/遮罩）；「Use dedicated workflow」复选框：关闭时使用GenerateUI当前加载的工作流（与之前相同）；开启时可从下拉列表选择已保存的工作流，将在后台加载、编辑并生成，不影响GenerateUI中显示的工作流",
|
||||
helpImageEdit8b: "图层标题栏的「M」按钮：在当前活动图层上方添加新的遮罩图层，并自动切换至Mask工具",
|
||||
helpImageEditMaskTitle: "Mask 工具 (🎭)",
|
||||
helpImageEditMask1: "添加遮罩图层：点击图层面板标题栏的「M」按钮；新遮罩图层插入到活动图层上方，Mask工具自动激活",
|
||||
helpImageEditMask2: "在图层列表中点击遮罩图层会自动切换至Mask工具",
|
||||
helpImageEditMask3: "顶部工具栏（Paint / Invert / Overlay / Blur）：Paint按钮切换Paint子工具（默认激活）；Invert复选框反转叠加预览（在遮罩缺失处显示颜色）；Overlay拾色器更改预览颜色（默认红色）；Blur滑块（0–50 px）柔化叠加边缘",
|
||||
helpImageEditMask4: "属性面板（图层面板左侧，Mask工具激活时显示）：Size滑块（1–200 px）、Hardness滑块（0–100%）、Mode按钮 — Add按钮（绘制白色/遮罩存在）/ Erase按钮（擦除至透明/遮罩缺失）；当前激活模式以蓝色高亮显示",
|
||||
helpImageEditMask3: "顶部工具栏 — 子工具：Paint / Color / Alpha / Text / Vector / Shape（均无需Mask Editor One）/ SAM3（需要Mask Editor One，未安装时不可用）；Invert复选框反转叠加预览；Overlay拾色器更改预览颜色（默认红色）；Blur滑块（0–50 px）柔化叠加边缘；叠加显示仅在当前激活的蒙版图层上显示，未激活的蒙版图层在被选中前保持隐藏",
|
||||
helpImageEditMask4: "属性面板 — Paint模式：Mode（Add / Erase）、Size（1–200 px）、Hardness（0–100%）；MASK EDITOR ONE区域（始终显示 — 有可用的ABR笔刷时标题为绿色，尚未导入笔刷时为灰色）：Select按钮打开ABR笔刷库（没有任何笔刷时禁用） — 选择笔刷将替换默认圆形笔刷；✕恢复Circle（默认）；选择图像笔刷后Hardness禁用，并显示额外控件：Spacing（印章间距 5–100%）、Angle（旋转角度 0–359°）、Sz Jitter（每个印章的随机大小变化 0–100%）、Rot. Jitter（每个印章的随机旋转 on/off）",
|
||||
helpImageEditMask5: "遮罩图层行的 ✂ 按钮：切换是否作为剪贴蒙版使用 — 启用（蓝色）时，遮罩将裁剪其正下方图层，仅显示已绘制区域；剪贴效果在保存PNG / Gallery / 发送至ComfyUI时均会生效",
|
||||
helpImageEditMask6: "SAM3（需要Mask Editor One）：由SAM3模型驱动的文本提示分割；输入目标对象描述（如\"cat\"、\"person\"），设置Max（最大蒙版候选数：3/6/9/12），然后点击Segment",
|
||||
helpImageEditMask7: "SAM3操作流程：Segment后，候选蒙版缩略图显示在属性面板 — 点击选择（蓝色边框 + ✓）；可多选；点击Apply Selected（N）批量应用；Mode（Add / Erase）控制蒙版与当前遮罩图层的合并方式；若活动图层非遮罩图层则自动创建新遮罩图层",
|
||||
helpImageEditMask8: "ABR笔刷库（需要Mask Editor One，仅Paint模式）：点击MASK EDITOR ONE区域的Select按钮打开笔刷选择器 — 左侧浏览文件夹，点击缩略图应用；「Round Brush (default)」恢复圆形笔刷；笔刷与Mask Editor One共享，存储在其brushes/文件夹",
|
||||
helpImageEditMask9: "Color子工具：点击画布中任意位置，选取与该点颜色相近的像素作为遮罩 — 属性面板：Mode（Add / Subtract）、Tolerance（0–255，颜色容差）、Feather %（0–100，容差范围内的边缘柔化量）",
|
||||
helpImageEditMask10: "Alpha子工具：将图像图层的透明通道提取为遮罩 — 属性面板：Threshold（Alpha ≥ 此值的像素成为完整遮罩；0 = 包含全部透明度信息）、Invert（反转提取结果）、Extract Alpha按钮执行操作；基于所有可见非遮罩图层的合成结果提取",
|
||||
helpImageEditMask11: "Text子工具：点击画布打开文字图章面板；输入文字，设置Font / Size / Bold / Italic / Align及Mode（Add = 白色图章 / Erase = 消除遮罩），点击Stamp或按Ctrl+Enter确认；支持多行文字（在文本框中换行）",
|
||||
helpImageEditMask12: "Vector子工具：点击添加Catmull-Rom样条控制点；点击第一个控制点（或按Enter）关闭并填充多边形；Backspace删除最后一个点；Esc重置所有点；属性面板显示当前点数及Mode（Add / Erase）",
|
||||
helpImageEditMask13: "Shape子工具：拖动绘制矩形或椭圆遮罩；按住Shift可绘制正方形/正圆；拖动时蓝色虚线预览形状；属性面板：Mode（Add / Erase）、Shape（Rect / Ellipse）",
|
||||
helpImageEditBlurTitle: "Blur 工具 (≈)",
|
||||
helpImageEditBlur1: "Whole Blur：对整个活动图层应用高斯模糊 — 调整强度滑块（1–50 px），点击Apply",
|
||||
helpImageEditBlur2: "Whole Mosaic：对整个活动图层应用像素化马赛克 — 调整块大小滑块（5–100 px），点击Apply",
|
||||
@@ -2738,7 +2860,7 @@ const LANGUAGES = {
|
||||
helpImageEditBlur6: "所有操作均支持撤销（Ctrl+Z）",
|
||||
helpImageEditBgRemoveTitle: "BG Remove 工具 (⬚)",
|
||||
helpImageEditBgRemove1: "模型 — Lightweight（@imgly）：使用从CDN加载的@imgly/background-removal库在浏览器内处理；无需服务器；首次使用时下载模型（约40 MB）并在会话期间缓存",
|
||||
helpImageEditBgRemove2: "模型 — BiRefNet：通过Workflow Studio Python后端使用BiRefNet模型进行高质量背景去除；需要将birefnet.safetensors放置在ComfyUI/models/background_removal/（即将支持）",
|
||||
helpImageEditBgRemove2: "模型 — BiRefNet：使用BiRefNet模型进行高质量背景去除；需要安装Mask Editor One并将birefnet.safetensors放置在ComfyUI/models/background_removal/",
|
||||
helpImageEditBgRemove3: "New Layer（默认勾选）：结果作为新图层添加到活动图层上方，位置和显示尺寸相同 — 原始图层保留",
|
||||
helpImageEditBgRemove4: "取消勾选New Layer时，活动图层的画布将被去除背景的结果直接替换",
|
||||
helpImageEditBgRemove5: "点击Remove BG开始处理；状态文字显示「Loading model → Processing → Done」；支持撤销（Ctrl+Z）",
|
||||
@@ -2759,12 +2881,13 @@ const LANGUAGES = {
|
||||
helpShortcuts4: "双击：打开详情弹窗",
|
||||
helpTroubleTitle: "故障排除",
|
||||
helpTrouble1: "无法连接ComfyUI：确认ComfyUI能否生成图片、在设置中验证URL、尝试刷新或重启",
|
||||
helpTrouble2: "无法连接AI助手：使用设置标签页的连接测试按钮；Ollama需确认已启动且模型已下载；LM Studio需确认服务器已启动且模型已加载",
|
||||
helpTrouble2: "无法连接AI助手：使用设置标签页的连接测试按钮；Ollama需确认已启动且模型已下载；LM Studio或Lemonade需确认服务器已启动且模型已加载",
|
||||
helpTrouble3: "工作流不显示：点击刷新按钮、确认能在ComfyUI中加载、尝试重启浏览器/ComfyUI",
|
||||
helpTrouble4: "图片生成失败：确认指定模型存在、验证ComfyUI连接、尝试重启",
|
||||
helpTrouble5: "LoRA Stack出现「No such file or directory」错误：该LoRA可能未被comfyui-lora-manager识别（已知问题）。请尝试其他LoRA，或检查该文件是否显示在Lora Manager自身的界面中",
|
||||
helpTrouble6: "移动或删除模型后出现模型加载错误：ComfyUI会缓存文件路径，可能仍引用旧位置。请通过ComfyUI菜单执行Hard Reset（Queue → Hard Reset）或重启ComfyUI以清除缓存。",
|
||||
helpTrouble7: "Tagger标签不显示模型：确认ComfyUI/models/tagger/<模型名>/文件夹存在且包含.onnx或.h5文件；如未安装onnxruntime，请运行：python_embeded\\python.exe -m pip install onnxruntime",
|
||||
helpTrouble8: "Model 标签页显示的 Checkpoint 与预期不符（例如无论加载哪个工作流都显示相同模型）：工作流文件中保存的 Checkpoint 实际未安装，加载时已被静默替换为其他已安装模型，此时会弹出包含原始（未找到）模型名称的错误提示。请在 Model 标签页手动选择正确的 Checkpoint，或在设置标签页启用\"默认 Checkpoint\"，在每次加载时强制应用一个已验证可用的模型。",
|
||||
helpSupportTitle: "支持",
|
||||
helpSupportDesc: "如果您觉得这个插件有用，请考虑支持它的开发！",
|
||||
helpGithubDesc: "报告问题、请求功能和贡献代码",
|
||||
@@ -2788,6 +2911,10 @@ const LANGUAGES = {
|
||||
comfyuiConnection: "ComfyUI 连接",
|
||||
comfyuiUrl: "ComfyUI URL",
|
||||
comfyuiUrlHint: "作为ComfyUI插件运行时留空（推荐同源）。仅在不同服务器时设置。",
|
||||
defaultCheckpointSettings: "默认 Checkpoint",
|
||||
defaultCheckpointEnable: "加载工作流时强制应用默认 Checkpoint",
|
||||
defaultCheckpointModel: "默认 Checkpoint 模型",
|
||||
defaultCheckpointHint: "启用后，每次将工作流加载到 GenerateUI 时，所有 Checkpoint 加载节点的模型都会被覆盖为此值，用于避免工作流文件中保存的模型与当前环境不匹配导致生成错误或图像模糊。",
|
||||
connectedCheck: "已连接 \u2713",
|
||||
failedConnect: "连接失败 \u2717",
|
||||
ollamaSettings: "AI助手设置（提示词标签页）",
|
||||
@@ -2796,6 +2923,8 @@ const LANGUAGES = {
|
||||
selectModel: "选择模型...",
|
||||
noModelsFound: "未找到模型",
|
||||
failedLoadModels: "获取模型列表失败",
|
||||
modelNotFound: "未找到",
|
||||
modelNotFoundHint: "此工作流中保存的模型在已安装的模型列表中未找到，请从列表中选择正确的模型。",
|
||||
saveOllama: "保存AI助手设置",
|
||||
testConnection: "测试连接",
|
||||
ollamaConnected: "已连接 \u2713",
|
||||
@@ -2905,7 +3034,7 @@ const LANGUAGES = {
|
||||
helpMetadata2: "中列：从工作流中提取的 Checkpoint、VAE、扩散模型、文本编码器列表",
|
||||
helpMetadata3: "右列：LoRA 列表（含强度值）和提示词列表（点击在下方显示全文）",
|
||||
helpMetadata4: "提示词操作 — Copy：复制到剪贴板；GenUI:P/N：设置 GenerateUI 正/负向提示；Prompt:P/N：设置 Prompt 标签页预设正/负向提示",
|
||||
helpMetadata5: "支持格式：ComfyUI PNG/WebP/JSON（标准格式 + Flux.2 / Qwen-Image / Z-Image 子图工作流）、SD WebUI、SD Forge、Fooocus。",
|
||||
helpMetadata5: "支持格式：ComfyUI PNG/WebP/JSON（标准格式 + Flux.2 / Qwen-Image / Z-Image / Mage-Flow 子图工作流）、SD WebUI、SD Forge、Fooocus。",
|
||||
},
|
||||
};
|
||||
|
||||
|
||||
+1756
-99
File diff suppressed because it is too large
Load Diff
@@ -2,6 +2,7 @@
|
||||
* Image Edit Tab - Draw Tool
|
||||
* Inspired by comfyui-mask-editor-one PaintTool.js
|
||||
* Supports color drawing and erasing with a soft round brush.
|
||||
* Also supports image brushes loaded from Mask Editor One's ABR brush library.
|
||||
*/
|
||||
|
||||
export class DrawTool {
|
||||
@@ -13,47 +14,93 @@ export class DrawTool {
|
||||
this.opacity = 1.0;
|
||||
this.color = "#ff0000";
|
||||
this.mode = "draw"; // "draw" | "erase"
|
||||
this.spacing = 0.25; // stamp interval as fraction of brushSize (image brush only)
|
||||
this.angle = 0; // degrees [0, 359]
|
||||
this.sizeJitter = false;
|
||||
this.sizeJitterAmount = 0.5;
|
||||
this.rotationJitter = false;
|
||||
|
||||
// Image brush from ABR library (null = default circle brush)
|
||||
this.brushImage = null;
|
||||
this.brushName = "Circle";
|
||||
|
||||
this._drawing = false;
|
||||
this._lastX = 0;
|
||||
this._lastY = 0;
|
||||
|
||||
// Cached stamp canvas
|
||||
// Cached circle stamp
|
||||
this._stamp = null;
|
||||
this._stampSize = 0;
|
||||
this._stampHard = 0;
|
||||
this._stampColor = null;
|
||||
|
||||
// Cached image stamp
|
||||
this._imgStamp = null;
|
||||
this._imgStampSize = 0;
|
||||
this._imgStampImg = null;
|
||||
this._imgStampColor = null;
|
||||
|
||||
// Stroke buffer: prevents intra-stroke opacity accumulation (image brush only)
|
||||
this._baseCanvas = null;
|
||||
this._strokeCanvas = null;
|
||||
this._strokeCtx = null;
|
||||
|
||||
this._onChange = null;
|
||||
}
|
||||
|
||||
setCanvas(canvas) {
|
||||
this.canvas = canvas;
|
||||
this.ctx = canvas.getContext("2d");
|
||||
this._stamp = null;
|
||||
this._stamp = null;
|
||||
this._imgStamp = null;
|
||||
}
|
||||
|
||||
onChange(fn) { this._onChange = fn; }
|
||||
|
||||
setImageBrush(img, name) {
|
||||
this.brushImage = img;
|
||||
this.brushName = name;
|
||||
this._imgStamp = null;
|
||||
}
|
||||
|
||||
clearImageBrush() {
|
||||
this.brushImage = null;
|
||||
this.brushName = "Circle";
|
||||
this._stamp = null;
|
||||
this._imgStamp = null;
|
||||
}
|
||||
|
||||
activate() {
|
||||
if (this.canvas) this.canvas.style.cursor = "none";
|
||||
}
|
||||
|
||||
deactivate() {
|
||||
this._drawing = false;
|
||||
this._clearStrokeBuffer();
|
||||
if (this.canvas) this.canvas.style.cursor = "";
|
||||
}
|
||||
|
||||
onMouseDown(x, y) {
|
||||
this._drawing = true;
|
||||
this._lastX = x;
|
||||
this._lastY = y;
|
||||
this._paint(x, y);
|
||||
this._lastX = x;
|
||||
this._lastY = y;
|
||||
if (this.brushImage) {
|
||||
this._initStrokeBuffer();
|
||||
this._paintToStroke(x, y);
|
||||
this._mergeStroke();
|
||||
} else {
|
||||
this._paint(x, y);
|
||||
}
|
||||
}
|
||||
|
||||
onMouseMove(x, y) {
|
||||
if (!this._drawing) return;
|
||||
this._paintLine(this._lastX, this._lastY, x, y);
|
||||
if (this.brushImage) {
|
||||
this._paintLineToStroke(this._lastX, this._lastY, x, y);
|
||||
this._mergeStroke();
|
||||
} else {
|
||||
this._paintLine(this._lastX, this._lastY, x, y);
|
||||
}
|
||||
this._lastX = x;
|
||||
this._lastY = y;
|
||||
}
|
||||
@@ -61,6 +108,7 @@ export class DrawTool {
|
||||
onMouseUp() {
|
||||
if (this._drawing) {
|
||||
this._drawing = false;
|
||||
this._clearStrokeBuffer();
|
||||
if (this._onChange) this._onChange();
|
||||
}
|
||||
}
|
||||
@@ -69,6 +117,83 @@ export class DrawTool {
|
||||
if (this._drawing) this.onMouseUp();
|
||||
}
|
||||
|
||||
// ── Stroke buffer (image brush only) ─────────────────────────────
|
||||
|
||||
_initStrokeBuffer() {
|
||||
const w = this.canvas.width;
|
||||
const h = this.canvas.height;
|
||||
this._baseCanvas = document.createElement("canvas");
|
||||
this._baseCanvas.width = w;
|
||||
this._baseCanvas.height = h;
|
||||
this._baseCanvas.getContext("2d").drawImage(this.canvas, 0, 0);
|
||||
this._strokeCanvas = document.createElement("canvas");
|
||||
this._strokeCanvas.width = w;
|
||||
this._strokeCanvas.height = h;
|
||||
this._strokeCtx = this._strokeCanvas.getContext("2d");
|
||||
}
|
||||
|
||||
_clearStrokeBuffer() {
|
||||
this._baseCanvas = null;
|
||||
this._strokeCanvas = null;
|
||||
this._strokeCtx = null;
|
||||
}
|
||||
|
||||
_mergeStroke() {
|
||||
const ctx = this.ctx;
|
||||
const w = this.canvas.width;
|
||||
const h = this.canvas.height;
|
||||
ctx.clearRect(0, 0, w, h);
|
||||
ctx.drawImage(this._baseCanvas, 0, 0);
|
||||
ctx.save();
|
||||
if (this.mode === "erase") {
|
||||
ctx.globalCompositeOperation = "destination-out";
|
||||
} else {
|
||||
ctx.globalCompositeOperation = "source-over";
|
||||
}
|
||||
ctx.globalAlpha = this.opacity;
|
||||
ctx.drawImage(this._strokeCanvas, 0, 0);
|
||||
ctx.restore();
|
||||
}
|
||||
|
||||
_paintToStroke(x, y) {
|
||||
const saved = this.ctx;
|
||||
this.ctx = this._strokeCtx;
|
||||
|
||||
if (this.sizeJitter || this.rotationJitter) {
|
||||
const savedSize = this.brushSize;
|
||||
const savedAngle = this.angle;
|
||||
const savedStamp = this._imgStamp;
|
||||
const savedStampSize = this._imgStampSize;
|
||||
if (this.sizeJitter) {
|
||||
this.brushSize = Math.max(1, savedSize * (1 - Math.random() * this.sizeJitterAmount));
|
||||
}
|
||||
if (this.rotationJitter) {
|
||||
this.angle = Math.random() * 360;
|
||||
}
|
||||
this._paintImageBrush(x, y);
|
||||
this.brushSize = savedSize;
|
||||
this.angle = savedAngle;
|
||||
this._imgStamp = savedStamp;
|
||||
this._imgStampSize = savedStampSize;
|
||||
} else {
|
||||
this._paintImageBrush(x, y);
|
||||
}
|
||||
|
||||
this.ctx = saved;
|
||||
}
|
||||
|
||||
_paintLineToStroke(x0, y0, x1, y1) {
|
||||
const dist = Math.hypot(x1 - x0, y1 - y0);
|
||||
const step = Math.max(1, this.brushSize * this.spacing);
|
||||
const steps = Math.ceil(dist / step);
|
||||
for (let i = 1; i <= steps; i++) {
|
||||
const t = i / steps;
|
||||
this._paintToStroke(x0 + (x1 - x0) * t, y0 + (y1 - y0) * t);
|
||||
}
|
||||
}
|
||||
|
||||
// ── Circle brush ─────────────────────────────────────────────────
|
||||
|
||||
_getStamp() {
|
||||
if (
|
||||
this._stamp &&
|
||||
@@ -122,6 +247,93 @@ export class DrawTool {
|
||||
}
|
||||
}
|
||||
|
||||
// ── Image brush ──────────────────────────────────────────────────
|
||||
|
||||
_getImageStamp(size) {
|
||||
size = Math.max(1, size);
|
||||
if (
|
||||
this._imgStamp &&
|
||||
this._imgStampSize === size &&
|
||||
this._imgStampImg === this.brushImage &&
|
||||
this._imgStampColor === this.color
|
||||
) return this._imgStamp;
|
||||
|
||||
const img = this.brushImage;
|
||||
const srcW = img.naturalWidth || img.width;
|
||||
const srcH = img.naturalHeight || img.height;
|
||||
const aspect = (srcW > 0 && srcH > 0) ? srcW / srcH : 1;
|
||||
|
||||
const stampH = size;
|
||||
const stampW = Math.max(1, Math.round(size * aspect));
|
||||
|
||||
const sc = document.createElement("canvas");
|
||||
sc.width = stampW;
|
||||
sc.height = stampH;
|
||||
const stx = sc.getContext("2d");
|
||||
stx.drawImage(img, 0, 0, stampW, stampH);
|
||||
|
||||
const imgData = stx.getImageData(0, 0, stampW, stampH);
|
||||
const d = imgData.data;
|
||||
|
||||
// Detect alpha channel (ABR-exported PNGs carry alpha = brush density)
|
||||
let hasAlpha = false;
|
||||
for (let i = 3; i < d.length; i += 4) {
|
||||
if (d[i] < 250) { hasAlpha = true; break; }
|
||||
}
|
||||
|
||||
let invertLum = false;
|
||||
if (!hasAlpha) {
|
||||
const corners = [0, stampW - 1, stampW * (stampH - 1), stampW * stampH - 1];
|
||||
let bgLum = 0;
|
||||
for (const ci of corners) {
|
||||
const ii = ci * 4;
|
||||
bgLum += (d[ii] * 0.299 + d[ii + 1] * 0.587 + d[ii + 2] * 0.114) / 255;
|
||||
}
|
||||
invertLum = (bgLum / corners.length) > 0.5;
|
||||
}
|
||||
|
||||
// Parse target color
|
||||
const hex = this.color.replace("#", "");
|
||||
const cr = parseInt(hex.slice(0, 2), 16);
|
||||
const cg = parseInt(hex.slice(2, 4), 16);
|
||||
const cb = parseInt(hex.slice(4, 6), 16);
|
||||
|
||||
// Convert to target color pixels; alpha = brush density
|
||||
for (let i = 0; i < d.length; i += 4) {
|
||||
let alpha;
|
||||
if (hasAlpha) {
|
||||
alpha = d[i + 3] / 255;
|
||||
} else {
|
||||
const lum = (d[i] * 0.299 + d[i + 1] * 0.587 + d[i + 2] * 0.114) / 255;
|
||||
alpha = invertLum ? 1 - lum : lum;
|
||||
}
|
||||
d[i] = cr; d[i + 1] = cg; d[i + 2] = cb;
|
||||
d[i + 3] = Math.round(alpha * 255);
|
||||
}
|
||||
stx.putImageData(imgData, 0, 0);
|
||||
|
||||
this._imgStamp = sc;
|
||||
this._imgStampSize = size;
|
||||
this._imgStampImg = this.brushImage;
|
||||
this._imgStampColor = this.color;
|
||||
return sc;
|
||||
}
|
||||
|
||||
_paintImageBrush(x, y) {
|
||||
const stamp = this._getImageStamp(Math.round(this.brushSize));
|
||||
this.ctx.globalCompositeOperation = "source-over";
|
||||
if (this.angle) {
|
||||
this.ctx.save();
|
||||
this.ctx.translate(Math.round(x), Math.round(y));
|
||||
this.ctx.rotate((this.angle * Math.PI) / 180);
|
||||
this.ctx.drawImage(stamp, -stamp.width / 2, -stamp.height / 2);
|
||||
this.ctx.restore();
|
||||
} else {
|
||||
this.ctx.drawImage(stamp, Math.round(x - stamp.width / 2), Math.round(y - stamp.height / 2));
|
||||
}
|
||||
this.ctx.globalCompositeOperation = "source-over";
|
||||
}
|
||||
|
||||
static getCanvasPos(canvas, event) {
|
||||
const rect = canvas.getBoundingClientRect();
|
||||
const scaleX = canvas.width / rect.width;
|
||||
|
||||
@@ -28,6 +28,7 @@ export class Layer {
|
||||
this.textProps = null; // テキストレイヤー用プロパティ（再編集・再描画に使用）
|
||||
this.locked = false; // ロック中は SelectTool の変形を禁止
|
||||
this.maskApply = false; // マスクレイヤー: true=クリッピングマスクとして機能
|
||||
this.operation = "add"; // マスクレイヤー合成モード: "add" | "subtract"
|
||||
}
|
||||
|
||||
clear() {
|
||||
@@ -39,13 +40,23 @@ export class Layer {
|
||||
thumb.width = size;
|
||||
thumb.height = size;
|
||||
const ctx = thumb.getContext("2d");
|
||||
ctx.fillStyle = "#aaa";
|
||||
ctx.fillRect(0, 0, size, size);
|
||||
ctx.fillStyle = "#fff";
|
||||
for (let x = 0; x < size; x += 8)
|
||||
for (let y = 0; y < size; y += 8)
|
||||
if ((x / 8 + y / 8) % 2 === 0) ctx.fillRect(x, y, 8, 8);
|
||||
ctx.drawImage(this.canvas, 0, 0, size, size);
|
||||
|
||||
if (this.type === "mask") {
|
||||
// マスクレイヤー: 黒背景に白マスクのグレースケール表示
|
||||
ctx.fillStyle = "#000";
|
||||
ctx.fillRect(0, 0, size, size);
|
||||
ctx.drawImage(this.canvas, 0, 0, size, size);
|
||||
} else {
|
||||
// 通常レイヤー: チェッカーボード背景（透過表示用）
|
||||
ctx.fillStyle = "#aaa";
|
||||
ctx.fillRect(0, 0, size, size);
|
||||
ctx.fillStyle = "#fff";
|
||||
for (let x = 0; x < size; x += 8)
|
||||
for (let y = 0; y < size; y += 8)
|
||||
if ((x / 8 + y / 8) % 2 === 0) ctx.fillRect(x, y, 8, 8);
|
||||
ctx.drawImage(this.canvas, 0, 0, size, size);
|
||||
}
|
||||
|
||||
return thumb.toDataURL("image/png");
|
||||
}
|
||||
|
||||
@@ -59,6 +70,7 @@ export class Layer {
|
||||
textProps: this.textProps ?? null,
|
||||
locked: this.locked ?? false,
|
||||
maskApply: this.maskApply ?? false,
|
||||
operation: this.operation ?? "add",
|
||||
};
|
||||
}
|
||||
|
||||
@@ -80,6 +92,7 @@ export class Layer {
|
||||
layer.textProps = json.textProps ?? null;
|
||||
layer.locked = json.locked ?? false;
|
||||
layer.maskApply = json.maskApply ?? false;
|
||||
layer.operation = json.operation ?? "add";
|
||||
|
||||
if (json.imageData) {
|
||||
return new Promise(resolve => {
|
||||
@@ -182,6 +195,14 @@ export class LayerManager {
|
||||
if (layer && layer.type === "mask") { layer.maskApply = !layer.maskApply; this._emit("change"); }
|
||||
}
|
||||
|
||||
toggleOperation(id) {
|
||||
const layer = this.layers.find(l => l.id === id);
|
||||
if (layer && layer.type === "mask") {
|
||||
layer.operation = layer.operation === "add" ? "subtract" : "add";
|
||||
this._emit("change");
|
||||
}
|
||||
}
|
||||
|
||||
setOpacity(id, opacity) {
|
||||
const layer = this.layers.find(l => l.id === id);
|
||||
if (layer) { layer.opacity = Math.max(0, Math.min(1, opacity)); this._emit("change"); }
|
||||
|
||||
@@ -0,0 +1,529 @@
|
||||
/**
|
||||
* Image Edit Tab - Mask Editor One 互換追加ツール
|
||||
* Color, Alpha, Text, Vector, Shape の各マスクツール。
|
||||
* マスクレイヤー canvas に直接白（add）または destination-out（erase）で描画する。
|
||||
*/
|
||||
|
||||
// ── Color Tool ───────────────────────────────────────────────────────────────
|
||||
// bgCanvas（背景合成画像）のクリック色に近いピクセルをマスク選択する。
|
||||
export class MaskColorTool {
|
||||
constructor() {
|
||||
this.tolerance = 40; // 0-255
|
||||
this.feather = 5; // 0-100 (tolerance に対する%)
|
||||
this.mode = "add"; // "add" | "subtract"
|
||||
this._canvas = null;
|
||||
this._ctx = null;
|
||||
this._bgCanvas = null;
|
||||
this._onChange = null;
|
||||
}
|
||||
|
||||
setCanvas(canvas) { this._canvas = canvas; this._ctx = canvas.getContext("2d"); }
|
||||
setBgCanvas(canvas) { this._bgCanvas = canvas; }
|
||||
onChange(fn) { this._onChange = fn; }
|
||||
|
||||
activate() { if (this._canvas) this._canvas.style.cursor = "crosshair"; }
|
||||
deactivate() { if (this._canvas) this._canvas.style.cursor = ""; }
|
||||
|
||||
onMouseDown(x, y) { this._selectByColor(Math.round(x), Math.round(y)); }
|
||||
onMouseMove() {}
|
||||
onMouseUp() {}
|
||||
onMouseLeave() {}
|
||||
|
||||
_selectByColor(px, py) {
|
||||
if (!this._bgCanvas || !this._ctx || !this._canvas) return;
|
||||
const bgCtx = this._bgCanvas.getContext("2d");
|
||||
const bw = this._bgCanvas.width;
|
||||
const bh = this._bgCanvas.height;
|
||||
if (bw === 0 || bh === 0) return;
|
||||
|
||||
const srcData = bgCtx.getImageData(0, 0, bw, bh);
|
||||
const dw = this._canvas.width;
|
||||
const dh = this._canvas.height;
|
||||
const sx = bw / dw;
|
||||
const sy = bh / dh;
|
||||
|
||||
const bpx = Math.min(bw - 1, Math.round(px * sx));
|
||||
const bpy = Math.min(bh - 1, Math.round(py * sy));
|
||||
const idx = (bpy * bw + bpx) * 4;
|
||||
if (idx < 0 || idx + 3 >= srcData.data.length) return;
|
||||
|
||||
const tr = srcData.data[idx];
|
||||
const tg = srcData.data[idx + 1];
|
||||
const tb = srcData.data[idx + 2];
|
||||
|
||||
const outData = new Uint8ClampedArray(dw * dh * 4);
|
||||
const tol = this.tolerance;
|
||||
|
||||
for (let dy = 0; dy < dh; dy++) {
|
||||
for (let dx = 0; dx < dw; dx++) {
|
||||
const bx = Math.min(bw - 1, Math.round(dx * sx));
|
||||
const by = Math.min(bh - 1, Math.round(dy * sy));
|
||||
const si = (by * bw + bx) * 4;
|
||||
const r = srcData.data[si];
|
||||
const g = srcData.data[si + 1];
|
||||
const b = srcData.data[si + 2];
|
||||
const dist = Math.sqrt((r - tr) ** 2 + (g - tg) ** 2 + (b - tb) ** 2);
|
||||
|
||||
let alpha;
|
||||
if (tol <= 0) {
|
||||
alpha = dist === 0 ? 255 : 0;
|
||||
} else {
|
||||
const fStart = tol * (1 - this.feather / 100);
|
||||
if (dist <= fStart) alpha = 255;
|
||||
else if (dist <= tol) alpha = Math.round(255 * (1 - (dist - fStart) / (tol - fStart)));
|
||||
else alpha = 0;
|
||||
}
|
||||
|
||||
const j = (dy * dw + dx) * 4;
|
||||
outData[j] = outData[j + 1] = outData[j + 2] = 255;
|
||||
outData[j + 3] = alpha;
|
||||
}
|
||||
}
|
||||
|
||||
const tmp = document.createElement("canvas");
|
||||
tmp.width = dw; tmp.height = dh;
|
||||
tmp.getContext("2d").putImageData(new ImageData(outData, dw, dh), 0, 0);
|
||||
|
||||
const ctx = this._ctx;
|
||||
ctx.globalCompositeOperation = this.mode === "subtract" ? "destination-out" : "lighten";
|
||||
ctx.drawImage(tmp, 0, 0);
|
||||
ctx.globalCompositeOperation = "source-over";
|
||||
|
||||
if (this._onChange) this._onChange();
|
||||
}
|
||||
}
|
||||
|
||||
// ── Alpha Tool ───────────────────────────────────────────────────────────────
|
||||
// 元画像のアルファチャンネルをマスクとして抽出する。
|
||||
export class MaskAlphaTool {
|
||||
constructor() {
|
||||
this.threshold = 128; // 0-255
|
||||
this.invert = false;
|
||||
this._canvas = null;
|
||||
this._ctx = null;
|
||||
this._srcImg = null; // HTMLImageElement or HTMLCanvasElement
|
||||
this._onChange = null;
|
||||
}
|
||||
|
||||
setCanvas(canvas) { this._canvas = canvas; this._ctx = canvas.getContext("2d"); }
|
||||
setSourceImage(img) { this._srcImg = img; }
|
||||
onChange(fn) { this._onChange = fn; }
|
||||
|
||||
activate() { if (this._canvas) this._canvas.style.cursor = "default"; }
|
||||
deactivate() { if (this._canvas) this._canvas.style.cursor = ""; }
|
||||
|
||||
onMouseDown() {}
|
||||
onMouseMove() {}
|
||||
onMouseUp() {}
|
||||
onMouseLeave() {}
|
||||
|
||||
extract() {
|
||||
if (!this._srcImg || !this._ctx || !this._canvas) return;
|
||||
const w = this._canvas.width;
|
||||
const h = this._canvas.height;
|
||||
const tmp = document.createElement("canvas");
|
||||
tmp.width = w; tmp.height = h;
|
||||
tmp.getContext("2d").drawImage(this._srcImg, 0, 0, w, h);
|
||||
const src = tmp.getContext("2d").getImageData(0, 0, w, h);
|
||||
const out = new Uint8ClampedArray(w * h * 4);
|
||||
for (let i = 0; i < src.data.length; i += 4) {
|
||||
let a = src.data[i + 3];
|
||||
if (this.threshold > 0) a = a >= this.threshold ? 255 : 0;
|
||||
if (this.invert) a = 255 - a;
|
||||
out[i] = out[i + 1] = out[i + 2] = 255;
|
||||
out[i + 3] = a;
|
||||
}
|
||||
this._ctx.clearRect(0, 0, w, h);
|
||||
this._ctx.putImageData(new ImageData(out, w, h), 0, 0);
|
||||
if (this._onChange) this._onChange();
|
||||
}
|
||||
}
|
||||
|
||||
// ── Text Tool ────────────────────────────────────────────────────────────────
|
||||
// クリック位置にテキストを白（add）または消去（erase）でスタンプする。
|
||||
export const MASK_TEXT_FONTS = [
|
||||
"Arial", "Arial Black", "Georgia", "Times New Roman",
|
||||
"Courier New", "Verdana", "Trebuchet MS", "Impact",
|
||||
"Comic Sans MS", "Helvetica", "Tahoma",
|
||||
];
|
||||
|
||||
export class MaskTextTool {
|
||||
constructor() {
|
||||
this.text = "Hello";
|
||||
this.fontFamily = "Arial";
|
||||
this.fontSize = 64;
|
||||
this.bold = false;
|
||||
this.italic = false;
|
||||
this.align = "left";
|
||||
this.mode = "add";
|
||||
this._canvas = null;
|
||||
this._ctx = null;
|
||||
this._overlay = null;
|
||||
this._onChange = null;
|
||||
}
|
||||
|
||||
setCanvas(canvas) { this._canvas = canvas; this._ctx = canvas.getContext("2d"); }
|
||||
onChange(fn) { this._onChange = fn; }
|
||||
|
||||
activate() { if (this._canvas) this._canvas.style.cursor = "crosshair"; }
|
||||
deactivate() { this._closeOverlay(); if (this._canvas) this._canvas.style.cursor = ""; }
|
||||
|
||||
onMouseDown(x, y) {
|
||||
if (this._overlay) { this._closeOverlay(); return; }
|
||||
this._showOverlay(x, y);
|
||||
}
|
||||
onMouseMove() {}
|
||||
onMouseUp() {}
|
||||
onMouseLeave() {}
|
||||
|
||||
_getFont() {
|
||||
const parts = [];
|
||||
if (this.italic) parts.push("italic");
|
||||
if (this.bold) parts.push("bold");
|
||||
parts.push(`${this.fontSize}px`);
|
||||
parts.push(`"${this.fontFamily}", sans-serif`);
|
||||
return parts.join(" ");
|
||||
}
|
||||
|
||||
_showOverlay(canvasX, canvasY) {
|
||||
const cv = this._canvas;
|
||||
const rect = cv.getBoundingClientRect();
|
||||
const cssX = Math.round(canvasX * (rect.width / cv.width)) + rect.left;
|
||||
const cssY = Math.round(canvasY * (rect.height / cv.height)) + rect.top;
|
||||
|
||||
const overlay = document.createElement("div");
|
||||
overlay.style.cssText = [
|
||||
`position:fixed;left:${cssX}px;top:${cssY}px;`,
|
||||
"background:var(--wfm-surface,#2a2a2a);",
|
||||
"border:1px solid var(--wfm-border,#444);",
|
||||
"border-radius:4px;padding:6px;z-index:99999;",
|
||||
"box-shadow:0 4px 16px rgba(0,0,0,0.5);min-width:200px;",
|
||||
].join("");
|
||||
|
||||
const ta = document.createElement("textarea");
|
||||
ta.value = this.text;
|
||||
ta.rows = 3;
|
||||
ta.placeholder = "Enter text…";
|
||||
ta.style.cssText = [
|
||||
"width:100%;resize:vertical;box-sizing:border-box;",
|
||||
"background:var(--wfm-bg,#1a1a1a);color:var(--wfm-text,#ddd);",
|
||||
"border:1px solid var(--wfm-border,#444);border-radius:3px;",
|
||||
"padding:4px;font-size:12px;",
|
||||
].join("");
|
||||
overlay.appendChild(ta);
|
||||
|
||||
const btnRow = document.createElement("div");
|
||||
btnRow.style.cssText = "display:flex;gap:4px;margin-top:4px;";
|
||||
|
||||
const okBtn = document.createElement("button");
|
||||
okBtn.textContent = "Stamp";
|
||||
okBtn.className = "wfm-btn wfm-btn-sm wfm-btn-primary";
|
||||
okBtn.style.flex = "1";
|
||||
okBtn.onclick = () => {
|
||||
if (ta.value.trim()) { this.text = ta.value; this._stamp(canvasX, canvasY); }
|
||||
this._closeOverlay();
|
||||
};
|
||||
|
||||
const cancelBtn = document.createElement("button");
|
||||
cancelBtn.textContent = "Cancel";
|
||||
cancelBtn.className = "wfm-btn wfm-btn-sm";
|
||||
cancelBtn.style.flex = "1";
|
||||
cancelBtn.onclick = () => this._closeOverlay();
|
||||
|
||||
btnRow.appendChild(okBtn);
|
||||
btnRow.appendChild(cancelBtn);
|
||||
overlay.appendChild(btnRow);
|
||||
|
||||
const hint = document.createElement("div");
|
||||
hint.textContent = "Ctrl+Enter: Stamp / Esc: Cancel";
|
||||
hint.style.cssText = "font-size:10px;color:var(--wfm-text-secondary,#888);margin-top:3px;";
|
||||
overlay.appendChild(hint);
|
||||
|
||||
ta.addEventListener("keydown", e => {
|
||||
if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) { e.preventDefault(); okBtn.click(); }
|
||||
else if (e.key === "Escape") cancelBtn.click();
|
||||
e.stopPropagation();
|
||||
});
|
||||
overlay.addEventListener("mousedown", e => e.stopPropagation());
|
||||
|
||||
document.body.appendChild(overlay);
|
||||
this._overlay = overlay;
|
||||
ta.focus(); ta.select();
|
||||
}
|
||||
|
||||
_closeOverlay() {
|
||||
if (this._overlay) { this._overlay.remove(); this._overlay = null; }
|
||||
}
|
||||
|
||||
_stamp(x, y) {
|
||||
const ctx = this._ctx;
|
||||
ctx.save();
|
||||
ctx.font = this._getFont();
|
||||
ctx.textAlign = this.align;
|
||||
ctx.textBaseline = "top";
|
||||
if (this.mode === "erase") {
|
||||
ctx.globalCompositeOperation = "destination-out";
|
||||
ctx.fillStyle = "rgba(0,0,0,1)";
|
||||
} else {
|
||||
ctx.globalCompositeOperation = "source-over";
|
||||
ctx.fillStyle = "white";
|
||||
}
|
||||
const lines = this.text.split("\n");
|
||||
const lineHeight = this.fontSize * 1.2;
|
||||
for (let i = 0; i < lines.length; i++) ctx.fillText(lines[i], x, y + i * lineHeight);
|
||||
ctx.restore();
|
||||
if (this._onChange) this._onChange();
|
||||
}
|
||||
}
|
||||
|
||||
// ── Vector Tool ──────────────────────────────────────────────────────────────
|
||||
// クリックでポイント追加、Catmull-Rom スプラインで閉じたパスを塗りつぶす。
|
||||
const VECTOR_CLOSE_R = 12;
|
||||
|
||||
export class MaskVectorTool {
|
||||
constructor() {
|
||||
this.mode = "add";
|
||||
this._canvas = null;
|
||||
this._ctx = null;
|
||||
this._previewCanvas = null;
|
||||
this._points = [];
|
||||
this._hoverX = null;
|
||||
this._hoverY = null;
|
||||
this.onBeforeCommit = null;
|
||||
this._onChange = null;
|
||||
}
|
||||
|
||||
setCanvas(canvas) { this._canvas = canvas; this._ctx = canvas.getContext("2d"); }
|
||||
setPreviewCanvas(canvas) { this._previewCanvas = canvas; }
|
||||
onChange(fn) { this._onChange = fn; }
|
||||
|
||||
activate() { if (this._canvas) this._canvas.style.cursor = "crosshair"; this._renderPreview(); }
|
||||
deactivate() { if (this._canvas) this._canvas.style.cursor = ""; this._clearPreview(); }
|
||||
|
||||
reset() { this._points = []; this._hoverX = null; this._hoverY = null; this._clearPreview(); }
|
||||
|
||||
onMouseDown(x, y) {
|
||||
if (this._points.length >= 3) {
|
||||
const f = this._points[0];
|
||||
if (Math.hypot(x - f.x, y - f.y) <= VECTOR_CLOSE_R) { this._commitPath(true); return; }
|
||||
}
|
||||
this._points.push({ x, y });
|
||||
this._renderPreview();
|
||||
}
|
||||
|
||||
onMouseMove(x, y) { this._hoverX = x; this._hoverY = y; this._renderPreview(); }
|
||||
onMouseLeave() { this._hoverX = null; this._hoverY = null; this._renderPreview(); }
|
||||
onMouseUp() {}
|
||||
|
||||
onKeyDown(e) {
|
||||
if (e.key === "Escape") {
|
||||
e.preventDefault(); this.reset();
|
||||
} else if (e.key === "Enter" && this._points.length >= 2) {
|
||||
e.preventDefault(); this._commitPath(false);
|
||||
} else if ((e.key === "Backspace" || e.key === "Delete") && this._points.length > 0) {
|
||||
e.preventDefault(); this._points.pop(); this._renderPreview();
|
||||
}
|
||||
}
|
||||
|
||||
_commitPath(closed) {
|
||||
if (this._points.length < 2) return;
|
||||
if (this.onBeforeCommit) this.onBeforeCommit();
|
||||
const ctx = this._ctx;
|
||||
ctx.save();
|
||||
if (this.mode === "erase") {
|
||||
ctx.globalCompositeOperation = "destination-out";
|
||||
ctx.fillStyle = "rgba(0,0,0,1)";
|
||||
} else {
|
||||
ctx.globalCompositeOperation = "source-over";
|
||||
ctx.fillStyle = "white";
|
||||
}
|
||||
ctx.beginPath();
|
||||
this._buildSpline(ctx, this._points, closed);
|
||||
ctx.fill();
|
||||
ctx.restore();
|
||||
this.reset();
|
||||
if (this._onChange) this._onChange();
|
||||
}
|
||||
|
||||
_buildSpline(ctx, pts, closed) {
|
||||
const n = pts.length;
|
||||
if (n === 0) return;
|
||||
if (n === 1) { ctx.moveTo(pts[0].x, pts[0].y); return; }
|
||||
if (n === 2) {
|
||||
ctx.moveTo(pts[0].x, pts[0].y); ctx.lineTo(pts[1].x, pts[1].y);
|
||||
if (closed) ctx.closePath(); return;
|
||||
}
|
||||
let ext;
|
||||
if (closed) {
|
||||
ext = [pts[n - 1], ...pts, pts[0], pts[1]];
|
||||
} else {
|
||||
ext = [
|
||||
{ x: 2 * pts[0].x - pts[1].x, y: 2 * pts[0].y - pts[1].y },
|
||||
...pts,
|
||||
{ x: 2 * pts[n-1].x - pts[n-2].x, y: 2 * pts[n-1].y - pts[n-2].y },
|
||||
];
|
||||
}
|
||||
ctx.moveTo(ext[1].x, ext[1].y);
|
||||
const count = closed ? n : n - 1;
|
||||
for (let i = 0; i < count; i++) {
|
||||
const [p0, p1, p2, p3] = [ext[i], ext[i+1], ext[i+2], ext[i+3]];
|
||||
ctx.bezierCurveTo(
|
||||
p1.x + (p2.x - p0.x) / 6, p1.y + (p2.y - p0.y) / 6,
|
||||
p2.x - (p3.x - p1.x) / 6, p2.y - (p3.y - p1.y) / 6,
|
||||
p2.x, p2.y,
|
||||
);
|
||||
}
|
||||
if (closed) ctx.closePath();
|
||||
}
|
||||
|
||||
_renderPreview() {
|
||||
if (!this._previewCanvas) return;
|
||||
const pctx = this._previewCanvas.getContext("2d");
|
||||
const w = this._previewCanvas.width, h = this._previewCanvas.height;
|
||||
pctx.clearRect(0, 0, w, h);
|
||||
const pts = this._points, hx = this._hoverX, hy = this._hoverY;
|
||||
if (pts.length === 0 && hx === null) return;
|
||||
|
||||
if (pts.length >= 2) {
|
||||
pctx.save();
|
||||
pctx.strokeStyle = "rgba(255,210,40,0.9)"; pctx.lineWidth = 1.5; pctx.setLineDash([]);
|
||||
pctx.beginPath(); this._buildSpline(pctx, pts, false); pctx.stroke();
|
||||
pctx.restore();
|
||||
}
|
||||
|
||||
if (pts.length >= 1 && hx !== null) {
|
||||
const canClose = pts.length >= 3 && Math.hypot(hx - pts[0].x, hy - pts[0].y) <= VECTOR_CLOSE_R;
|
||||
pctx.save();
|
||||
if (canClose) {
|
||||
pctx.strokeStyle = "rgba(255,100,100,0.55)"; pctx.lineWidth = 1.5; pctx.setLineDash([4, 3]);
|
||||
pctx.beginPath(); this._buildSpline(pctx, pts, true); pctx.stroke();
|
||||
} else {
|
||||
pctx.strokeStyle = "rgba(255,210,40,0.5)"; pctx.lineWidth = 1; pctx.setLineDash([4, 3]);
|
||||
pctx.beginPath();
|
||||
pctx.moveTo(pts[pts.length - 1].x, pts[pts.length - 1].y);
|
||||
pctx.lineTo(hx, hy); pctx.stroke();
|
||||
}
|
||||
pctx.restore();
|
||||
}
|
||||
|
||||
for (let i = 0; i < pts.length; i++) {
|
||||
const p = pts[i], isFirst = i === 0;
|
||||
const closeable = isFirst && pts.length >= 3 && hx !== null && Math.hypot(hx - p.x, hy - p.y) <= VECTOR_CLOSE_R;
|
||||
pctx.beginPath();
|
||||
pctx.arc(p.x, p.y, closeable ? 7 : (isFirst ? 5 : 4), 0, Math.PI * 2);
|
||||
pctx.fillStyle = closeable ? "rgba(255,80,80,0.95)" : (isFirst ? "rgba(255,210,40,0.95)" : "rgba(255,210,40,0.8)");
|
||||
pctx.strokeStyle = "rgba(0,0,0,0.6)"; pctx.lineWidth = 1;
|
||||
pctx.fill(); pctx.stroke();
|
||||
}
|
||||
|
||||
if (hx !== null) {
|
||||
const onFirst = pts.length >= 3 && Math.hypot(hx - pts[0].x, hy - pts[0].y) <= VECTOR_CLOSE_R;
|
||||
if (!onFirst) {
|
||||
pctx.beginPath(); pctx.arc(hx, hy, 3, 0, Math.PI * 2);
|
||||
pctx.fillStyle = "rgba(255,255,255,0.6)"; pctx.strokeStyle = "rgba(200,200,200,0.5)"; pctx.lineWidth = 1;
|
||||
pctx.fill(); pctx.stroke();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
_clearPreview() {
|
||||
if (!this._previewCanvas) return;
|
||||
const c = this._previewCanvas;
|
||||
c.getContext("2d").clearRect(0, 0, c.width, c.height);
|
||||
}
|
||||
}
|
||||
|
||||
// ── Shape Tool ───────────────────────────────────────────────────────────────
|
||||
// ドラッグで矩形または楕円をマスクとして描画する（Shift = 正方形/正円）。
|
||||
export class MaskShapeTool {
|
||||
constructor() {
|
||||
this.mode = "add";
|
||||
this.shape = "rect"; // "rect" | "ellipse"
|
||||
this._canvas = null;
|
||||
this._ctx = null;
|
||||
this._previewCanvas = null;
|
||||
this._pCtx = null;
|
||||
this._startX = 0;
|
||||
this._startY = 0;
|
||||
this._curX = 0;
|
||||
this._curY = 0;
|
||||
this._curShift = false;
|
||||
this._drawing = false;
|
||||
this._onChange = null;
|
||||
}
|
||||
|
||||
setCanvas(canvas) { this._canvas = canvas; this._ctx = canvas.getContext("2d"); }
|
||||
setPreviewCanvas(canvas) { this._previewCanvas = canvas; this._pCtx = canvas.getContext("2d"); }
|
||||
onChange(fn) { this._onChange = fn; }
|
||||
|
||||
activate() { if (this._canvas) this._canvas.style.cursor = "crosshair"; }
|
||||
deactivate() { this._drawing = false; this._clearPreview(); if (this._canvas) this._canvas.style.cursor = ""; }
|
||||
|
||||
onMouseDown(x, y) {
|
||||
this._startX = x; this._startY = y;
|
||||
this._curX = x; this._curY = y; this._curShift = false;
|
||||
this._drawing = true;
|
||||
this._drawPreview(x, y, false);
|
||||
}
|
||||
|
||||
onMouseMove(x, y, e) {
|
||||
if (!this._drawing) return;
|
||||
this._curX = x; this._curY = y; this._curShift = e?.shiftKey ?? false;
|
||||
this._drawPreview(x, y, this._curShift);
|
||||
}
|
||||
|
||||
// x/y を省略した場合は最後に記録した座標を使用（mouseupイベント非経由での呼び出し対応）
|
||||
onMouseUp(x, y, e) {
|
||||
if (!this._drawing) return;
|
||||
const cx = x ?? this._curX;
|
||||
const cy = y ?? this._curY;
|
||||
const shift = e?.shiftKey ?? this._curShift;
|
||||
this._drawing = false;
|
||||
this._clearPreview();
|
||||
this._commit(cx, cy, shift);
|
||||
if (this._onChange) this._onChange();
|
||||
}
|
||||
|
||||
onMouseLeave() {}
|
||||
|
||||
_getRect(x, y, shift) {
|
||||
const sx = this._startX, sy = this._startY;
|
||||
if (shift) {
|
||||
const half = Math.max(Math.abs(x - sx), Math.abs(y - sy));
|
||||
return { x: sx - half, y: sy - half, w: half * 2, h: half * 2 };
|
||||
}
|
||||
return { x: Math.min(sx, x), y: Math.min(sy, y), w: Math.abs(x - sx), h: Math.abs(y - sy) };
|
||||
}
|
||||
|
||||
_drawPreview(x, y, shift) {
|
||||
if (!this._pCtx) return;
|
||||
const pc = this._previewCanvas;
|
||||
this._pCtx.clearRect(0, 0, pc.width, pc.height);
|
||||
const { x: rx, y: ry, w, h } = this._getRect(x, y, shift);
|
||||
if (w < 1 || h < 1) return;
|
||||
this._pCtx.save();
|
||||
this._pCtx.strokeStyle = "rgba(0,180,255,0.9)"; this._pCtx.lineWidth = 1.5; this._pCtx.setLineDash([5, 3]);
|
||||
this._pCtx.beginPath();
|
||||
if (this.shape === "rect") this._pCtx.rect(rx, ry, w, h);
|
||||
else this._pCtx.ellipse(rx + w / 2, ry + h / 2, w / 2, h / 2, 0, 0, Math.PI * 2);
|
||||
this._pCtx.stroke(); this._pCtx.restore();
|
||||
}
|
||||
|
||||
_clearPreview() {
|
||||
if (!this._pCtx) return;
|
||||
this._pCtx.clearRect(0, 0, this._previewCanvas.width, this._previewCanvas.height);
|
||||
}
|
||||
|
||||
_commit(x, y, shift) {
|
||||
const { x: rx, y: ry, w, h } = this._getRect(x, y, shift);
|
||||
if (w < 1 || h < 1) return;
|
||||
const ctx = this._ctx;
|
||||
ctx.save();
|
||||
ctx.globalCompositeOperation = this.mode === "erase" ? "destination-out" : "source-over";
|
||||
ctx.fillStyle = "white";
|
||||
ctx.beginPath();
|
||||
if (this.shape === "rect") ctx.rect(rx, ry, w, h);
|
||||
else ctx.ellipse(rx + w / 2, ry + h / 2, w / 2, h / 2, 0, 0, Math.PI * 2);
|
||||
ctx.fill(); ctx.restore();
|
||||
}
|
||||
}
|
||||
@@ -3,6 +3,9 @@
|
||||
* White-paint / erase brush for mask layers.
|
||||
* paint mode: draws white (opaque) = mask present
|
||||
* erase mode: destination-out (transparent) = mask absent
|
||||
*
|
||||
* Supports circular soft brush (built-in) and image brushes loaded
|
||||
* from Mask Editor One's ABR brush library (optional).
|
||||
*/
|
||||
|
||||
export class MaskTool {
|
||||
@@ -11,34 +14,69 @@ export class MaskTool {
|
||||
this.ctx = canvas?.getContext("2d");
|
||||
this.brushSize = 30;
|
||||
this.hardness = 0.85;
|
||||
this.spacing = 0.25; // stamp interval as fraction of brushSize (image brush only)
|
||||
this.mode = "paint"; // "paint" | "erase"
|
||||
|
||||
// Image brush from ABR library (null = default circle brush)
|
||||
this.brushImage = null;
|
||||
this.brushName = "Circle";
|
||||
this.angle = 0; // degrees [0, 359]
|
||||
this.sizeJitter = false;
|
||||
this.sizeJitterAmount = 0.5; // 0–1: fraction of brushSize that can be removed
|
||||
this.rotationJitter = false;
|
||||
|
||||
this._drawing = false;
|
||||
this._lastX = 0;
|
||||
this._lastY = 0;
|
||||
|
||||
// Cached circle stamp
|
||||
this._stamp = null;
|
||||
this._stampSize = 0;
|
||||
this._stampHard = 0;
|
||||
this._stampMode = null;
|
||||
|
||||
// Cached image stamp
|
||||
this._imgStamp = null;
|
||||
this._imgStampSize = 0;
|
||||
this._imgStampImg = null;
|
||||
|
||||
// Stroke buffer: prevents intra-stroke opacity accumulation (image brush only)
|
||||
this._baseCanvas = null;
|
||||
this._strokeCanvas = null;
|
||||
this._strokeCtx = null;
|
||||
|
||||
this._onChange = null;
|
||||
}
|
||||
|
||||
setCanvas(canvas) {
|
||||
this.canvas = canvas;
|
||||
this.ctx = canvas.getContext("2d");
|
||||
this._stamp = null;
|
||||
this._stamp = null;
|
||||
this._imgStamp = null;
|
||||
}
|
||||
|
||||
onChange(fn) { this._onChange = fn; }
|
||||
|
||||
setImageBrush(img, name) {
|
||||
this.brushImage = img;
|
||||
this.brushName = name;
|
||||
this._imgStamp = null;
|
||||
}
|
||||
|
||||
clearImageBrush() {
|
||||
this.brushImage = null;
|
||||
this.brushName = "Circle";
|
||||
this._stamp = null;
|
||||
this._imgStamp = null;
|
||||
}
|
||||
|
||||
activate() {
|
||||
if (this.canvas) this.canvas.style.cursor = "none";
|
||||
}
|
||||
|
||||
deactivate() {
|
||||
this._drawing = false;
|
||||
this._clearStrokeBuffer();
|
||||
if (this.canvas) this.canvas.style.cursor = "";
|
||||
}
|
||||
|
||||
@@ -46,12 +84,23 @@ export class MaskTool {
|
||||
this._drawing = true;
|
||||
this._lastX = x;
|
||||
this._lastY = y;
|
||||
this._paint(x, y);
|
||||
if (this.brushImage) {
|
||||
this._initStrokeBuffer();
|
||||
this._paintToStroke(x, y);
|
||||
this._mergeStroke();
|
||||
} else {
|
||||
this._paint(x, y);
|
||||
}
|
||||
}
|
||||
|
||||
onMouseMove(x, y) {
|
||||
if (!this._drawing) return;
|
||||
this._paintLine(this._lastX, this._lastY, x, y);
|
||||
if (this.brushImage) {
|
||||
this._paintLineToStroke(this._lastX, this._lastY, x, y);
|
||||
this._mergeStroke();
|
||||
} else {
|
||||
this._paintLine(this._lastX, this._lastY, x, y);
|
||||
}
|
||||
this._lastX = x;
|
||||
this._lastY = y;
|
||||
}
|
||||
@@ -59,6 +108,7 @@ export class MaskTool {
|
||||
onMouseUp() {
|
||||
if (this._drawing) {
|
||||
this._drawing = false;
|
||||
this._clearStrokeBuffer();
|
||||
if (this._onChange) this._onChange();
|
||||
}
|
||||
}
|
||||
@@ -67,6 +117,77 @@ export class MaskTool {
|
||||
if (this._drawing) this.onMouseUp();
|
||||
}
|
||||
|
||||
// ── Stroke buffer (image brush only) ─────────────────────────────
|
||||
|
||||
_initStrokeBuffer() {
|
||||
const w = this.canvas.width;
|
||||
const h = this.canvas.height;
|
||||
this._baseCanvas = document.createElement("canvas");
|
||||
this._baseCanvas.width = w;
|
||||
this._baseCanvas.height = h;
|
||||
this._baseCanvas.getContext("2d").drawImage(this.canvas, 0, 0);
|
||||
this._strokeCanvas = document.createElement("canvas");
|
||||
this._strokeCanvas.width = w;
|
||||
this._strokeCanvas.height = h;
|
||||
this._strokeCtx = this._strokeCanvas.getContext("2d");
|
||||
}
|
||||
|
||||
_clearStrokeBuffer() {
|
||||
this._baseCanvas = null;
|
||||
this._strokeCanvas = null;
|
||||
this._strokeCtx = null;
|
||||
}
|
||||
|
||||
_mergeStroke() {
|
||||
const ctx = this.ctx;
|
||||
const w = this.canvas.width;
|
||||
const h = this.canvas.height;
|
||||
ctx.clearRect(0, 0, w, h);
|
||||
ctx.drawImage(this._baseCanvas, 0, 0);
|
||||
ctx.globalCompositeOperation = this.mode === "erase" ? "destination-out" : "lighten";
|
||||
ctx.drawImage(this._strokeCanvas, 0, 0);
|
||||
ctx.globalCompositeOperation = "source-over";
|
||||
}
|
||||
|
||||
_paintToStroke(x, y) {
|
||||
const saved = this.ctx;
|
||||
this.ctx = this._strokeCtx;
|
||||
|
||||
if (this.sizeJitter || this.rotationJitter) {
|
||||
const savedSize = this.brushSize;
|
||||
const savedAngle = this.angle;
|
||||
const savedStamp = this._imgStamp;
|
||||
const savedStampSize = this._imgStampSize;
|
||||
if (this.sizeJitter) {
|
||||
this.brushSize = Math.max(1, savedSize * (1 - Math.random() * this.sizeJitterAmount));
|
||||
}
|
||||
if (this.rotationJitter) {
|
||||
this.angle = Math.random() * 360;
|
||||
}
|
||||
this._paintImageBrush(x, y);
|
||||
this.brushSize = savedSize;
|
||||
this.angle = savedAngle;
|
||||
this._imgStamp = savedStamp;
|
||||
this._imgStampSize = savedStampSize;
|
||||
} else {
|
||||
this._paintImageBrush(x, y);
|
||||
}
|
||||
|
||||
this.ctx = saved;
|
||||
}
|
||||
|
||||
_paintLineToStroke(x0, y0, x1, y1) {
|
||||
const dist = Math.hypot(x1 - x0, y1 - y0);
|
||||
const step = Math.max(1, this.brushSize * this.spacing);
|
||||
const steps = Math.ceil(dist / step);
|
||||
for (let i = 1; i <= steps; i++) {
|
||||
const t = i / steps;
|
||||
this._paintToStroke(x0 + (x1 - x0) * t, y0 + (y1 - y0) * t);
|
||||
}
|
||||
}
|
||||
|
||||
// ── Circle brush ─────────────────────────────────────────────────
|
||||
|
||||
_getStamp() {
|
||||
if (
|
||||
this._stamp &&
|
||||
@@ -121,4 +242,83 @@ export class MaskTool {
|
||||
this._paint(x0 + (x1 - x0) * t, y0 + (y1 - y0) * t);
|
||||
}
|
||||
}
|
||||
|
||||
// ── Image brush ──────────────────────────────────────────────────
|
||||
|
||||
_getImageStamp(size) {
|
||||
size = Math.max(1, size);
|
||||
if (
|
||||
this._imgStamp &&
|
||||
this._imgStampSize === size &&
|
||||
this._imgStampImg === this.brushImage
|
||||
) return this._imgStamp;
|
||||
|
||||
const img = this.brushImage;
|
||||
const srcW = img.naturalWidth || img.width;
|
||||
const srcH = img.naturalHeight || img.height;
|
||||
const aspect = (srcW > 0 && srcH > 0) ? srcW / srcH : 1;
|
||||
|
||||
const stampH = size;
|
||||
const stampW = Math.max(1, Math.round(size * aspect));
|
||||
|
||||
const sc = document.createElement("canvas");
|
||||
sc.width = stampW;
|
||||
sc.height = stampH;
|
||||
const stx = sc.getContext("2d");
|
||||
stx.drawImage(img, 0, 0, stampW, stampH);
|
||||
|
||||
const imgData = stx.getImageData(0, 0, stampW, stampH);
|
||||
const d = imgData.data;
|
||||
|
||||
// Detect alpha channel (ABR-exported PNGs carry alpha = brush density)
|
||||
let hasAlpha = false;
|
||||
for (let i = 3; i < d.length; i += 4) {
|
||||
if (d[i] < 250) { hasAlpha = true; break; }
|
||||
}
|
||||
|
||||
let invertLum = false;
|
||||
if (!hasAlpha) {
|
||||
const corners = [0, stampW - 1, stampW * (stampH - 1), stampW * stampH - 1];
|
||||
let bgLum = 0;
|
||||
for (const ci of corners) {
|
||||
const ii = ci * 4;
|
||||
bgLum += (d[ii] * 0.299 + d[ii + 1] * 0.587 + d[ii + 2] * 0.114) / 255;
|
||||
}
|
||||
invertLum = (bgLum / corners.length) > 0.5;
|
||||
}
|
||||
|
||||
// Convert to white pixels; alpha = brush density
|
||||
for (let i = 0; i < d.length; i += 4) {
|
||||
let alpha;
|
||||
if (hasAlpha) {
|
||||
alpha = d[i + 3] / 255;
|
||||
} else {
|
||||
const lum = (d[i] * 0.299 + d[i + 1] * 0.587 + d[i + 2] * 0.114) / 255;
|
||||
alpha = invertLum ? 1 - lum : lum;
|
||||
}
|
||||
d[i] = d[i + 1] = d[i + 2] = 255;
|
||||
d[i + 3] = Math.round(alpha * 255);
|
||||
}
|
||||
stx.putImageData(imgData, 0, 0);
|
||||
|
||||
this._imgStamp = sc;
|
||||
this._imgStampSize = size;
|
||||
this._imgStampImg = this.brushImage;
|
||||
return sc;
|
||||
}
|
||||
|
||||
_paintImageBrush(x, y) {
|
||||
const stamp = this._getImageStamp(Math.round(this.brushSize));
|
||||
this.ctx.globalCompositeOperation = "source-over";
|
||||
if (this.angle) {
|
||||
this.ctx.save();
|
||||
this.ctx.translate(Math.round(x), Math.round(y));
|
||||
this.ctx.rotate((this.angle * Math.PI) / 180);
|
||||
this.ctx.drawImage(stamp, -stamp.width / 2, -stamp.height / 2);
|
||||
this.ctx.restore();
|
||||
} else {
|
||||
this.ctx.drawImage(stamp, Math.round(x - stamp.width / 2), Math.round(y - stamp.height / 2));
|
||||
}
|
||||
this.ctx.globalCompositeOperation = "source-over";
|
||||
}
|
||||
}
|
||||
|
||||
+46
-12
@@ -6,6 +6,7 @@
|
||||
|
||||
import { t } from "./i18n.js";
|
||||
import { escapeHtml } from "./util.js";
|
||||
import { comfyWorkflow } from "./comfyui-workflow.js";
|
||||
|
||||
// ── File size limit ───────────────────────────────────────────
|
||||
const MAX_FILE_SIZE = 50 * 1024 * 1024;
|
||||
@@ -244,11 +245,22 @@ function extractPromptsFromNodeSet(nodes, links) {
|
||||
if (!inp || inp.link == null) continue;
|
||||
const originId = linkOrigin.get(inp.link);
|
||||
if (originId == null) continue;
|
||||
const name = inp.name ?? "";
|
||||
const isPos = name === "positive" || name.startsWith("positive");
|
||||
const isNeg = name === "negative" || name.startsWith("negative");
|
||||
if (!isPos && !isNeg) continue;
|
||||
// TextEncodeMageFlowEdit — one node carries both prompt & negative_prompt
|
||||
// directly, so textMap (single text per node) can't represent both roles.
|
||||
const srcNode = nodeMap.get(originId);
|
||||
if (srcNode?.type === "TextEncodeMageFlowEdit") {
|
||||
const widgetIdx = isPos ? 0 : 1; // widgets_values: [prompt, negative_prompt, ...]
|
||||
const text = srcNode.widgets_values?.[widgetIdx];
|
||||
if (text && typeof text === "string") { if (isPos) pos.add(text); else neg.add(text); }
|
||||
continue;
|
||||
}
|
||||
const text = textMap.get(originId);
|
||||
if (!text) continue;
|
||||
const name = inp.name ?? "";
|
||||
if (name === "positive" || name.startsWith("positive")) pos.add(text);
|
||||
else if (name === "negative" || name.startsWith("negative")) neg.add(text);
|
||||
if (isPos) pos.add(text); else neg.add(text);
|
||||
}
|
||||
}
|
||||
if (!foundSampler) return null;
|
||||
@@ -346,10 +358,20 @@ function extractPromptsAPI(wf) {
|
||||
foundSampler = true;
|
||||
for (const [key, val] of Object.entries(n.inputs ?? {})) {
|
||||
if (!Array.isArray(val)) continue;
|
||||
const isPos = key === "positive" || key.startsWith("positive");
|
||||
const isNeg = key === "negative" || key.startsWith("negative");
|
||||
if (!isPos && !isNeg) continue;
|
||||
// TextEncodeMageFlowEdit — one node carries both prompt & negative_prompt
|
||||
// directly, so textMap (single text per node) can't represent both roles.
|
||||
const srcNode = wf[String(val[0])];
|
||||
if (srcNode?.class_type === "TextEncodeMageFlowEdit") {
|
||||
const text = isPos ? srcNode.inputs?.prompt : srcNode.inputs?.negative_prompt;
|
||||
if (text && typeof text === "string") { if (isPos) pos.add(text); else neg.add(text); }
|
||||
continue;
|
||||
}
|
||||
const text = textMap.get(String(val[0]));
|
||||
if (!text) continue;
|
||||
if (key === "positive" || key.startsWith("positive")) pos.add(text);
|
||||
else if (key === "negative" || key.startsWith("negative")) neg.add(text);
|
||||
if (isPos) pos.add(text); else neg.add(text);
|
||||
}
|
||||
}
|
||||
if (!foundSampler || (pos.size === 0 && neg.size === 0)) { const all = [...textMap.values()].filter(t => t && t.trim()); return { positives: [], negatives: [], texts: all }; }
|
||||
@@ -451,10 +473,22 @@ async function extractAllMetadata(file) {
|
||||
const isJSON = file.type === "application/json" || name.endsWith(".json");
|
||||
const isWebP = file.type === "image/webp" || name.endsWith(".webp");
|
||||
|
||||
function fromWorkflow(wf, source) {
|
||||
async function fromWorkflow(originalWf, source) {
|
||||
let wf = originalWf;
|
||||
// サブグラフを持つワークフローは、外側のサブグラフノードに実際に設定された値
|
||||
// (ユーザーが見ている値)が内部ノードのwidgets_valuesへ反映されていないことがある
|
||||
// (テンプレートの古いデフォルト値のまま)。convertUiToApi() はこの注入も含めて
|
||||
// 正しく解決するため、そちらを経由してから抽出する。通常のワークフローには影響しない。
|
||||
if (Array.isArray(wf?.nodes) && wf.definitions?.subgraphs?.length > 0) {
|
||||
try {
|
||||
const apiWf = await comfyWorkflow.convertUiToApi(wf);
|
||||
if (apiWf && Object.keys(apiWf).length > 0) wf = apiWf;
|
||||
} catch { /* 変換失敗時は元のUI形式のまま抽出（既存ロジックにフォールバック） */ }
|
||||
}
|
||||
const base = { source, checkpoints: extractCheckpoints(wf), vaes: extractVAEs(wf), diffusionModels: extractDiffusionModels(wf), textEncoders: extractTextEncoders(wf), loras: extractLoRAs(wf), ...extractPrompts(wf) };
|
||||
// MarkdownNote からモデル情報を補完（subgraph形式の flux/qwen/z-image など）
|
||||
const mdm = extractMarkdownNoteModels(wf);
|
||||
// MarkdownNote からモデル情報を補完（subgraph形式の flux/qwen/z-image など）。
|
||||
// API変換後は nodes 情報が失われるため、常に元のUI形式ワークフローから抽出する。
|
||||
const mdm = extractMarkdownNoteModels(originalWf);
|
||||
if (mdm) {
|
||||
if (!base.checkpoints.length) base.checkpoints = mdm.checkpoints;
|
||||
if (!base.vaes.length) base.vaes = mdm.vaes;
|
||||
@@ -467,20 +501,20 @@ async function extractAllMetadata(file) {
|
||||
|
||||
if (isJSON) {
|
||||
let wf; try { wf = JSON.parse(sanitizeJSON(await file.text())); } catch { return null; }
|
||||
return wf ? fromWorkflow(wf, "comfyui") : null;
|
||||
return wf ? await fromWorkflow(wf, "comfyui") : null;
|
||||
}
|
||||
if (isWebP) {
|
||||
const exif = await readWebPEXIFChunk(file);
|
||||
if (!exif) return null;
|
||||
const wf = extractWorkflowFromEXIF(exif);
|
||||
return wf ? fromWorkflow(wf, "comfyui") : null;
|
||||
return wf ? await fromWorkflow(wf, "comfyui") : null;
|
||||
}
|
||||
// PNG
|
||||
const chunks = await readAllPNGTextChunks(file);
|
||||
if (!chunks) return null;
|
||||
|
||||
if (chunks.prompt) { let wf; try { wf = JSON.parse(sanitizeJSON(chunks.prompt)); } catch { return null; } return wf ? fromWorkflow(wf, "comfyui") : null; }
|
||||
if (chunks.workflow) { let wf; try { wf = JSON.parse(sanitizeJSON(chunks.workflow)); } catch { return null; } return wf ? fromWorkflow(wf, "comfyui") : null; }
|
||||
if (chunks.prompt) { let wf; try { wf = JSON.parse(sanitizeJSON(chunks.prompt)); } catch { return null; } return wf ? await fromWorkflow(wf, "comfyui") : null; }
|
||||
if (chunks.workflow) { let wf; try { wf = JSON.parse(sanitizeJSON(chunks.workflow)); } catch { return null; } return wf ? await fromWorkflow(wf, "comfyui") : null; }
|
||||
|
||||
if (chunks.fooocus_scheme === "fooocus" && chunks.parameters) {
|
||||
const f = parseFooocusMetadata(chunks.parameters);
|
||||
|
||||
@@ -130,7 +130,7 @@ function applyToGenUI(modelName, modelType) {
|
||||
};
|
||||
comfyUI.currentWorkflow[nodeId].inputs.text = `<lora:${stem}:1:1>`;
|
||||
} else {
|
||||
comfyUI.currentWorkflow[nodeId].inputs.lora_name = modelName;
|
||||
comfyUI.currentWorkflow[nodeId].inputs.lora_name = comfyEditor.resolveLoraName(modelName);
|
||||
}
|
||||
|
||||
// Disable all Stack models and switch to Single tab
|
||||
@@ -1386,6 +1386,7 @@ function openDetailModal(modelName) {
|
||||
? `<button class="wfm-btn wfm-btn-sm" id="wfm-modal-genui-model" title="${t("modelsGenUITitle")}">${t("modelsGenUIBtn")}</button>`
|
||||
: "")}
|
||||
<button class="wfm-btn wfm-btn-sm wfm-btn-danger" id="wfm-modal-model-delete" style="margin-left:auto;">${t("modelsDelete")}</button>
|
||||
<button class="wfm-btn wfm-btn-sm" id="wfm-modal-model-close">${t("close")}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>`;
|
||||
@@ -1446,6 +1447,11 @@ function openDetailModal(modelName) {
|
||||
applyEmbeddingToPrompt(modelName, "negative");
|
||||
});
|
||||
|
||||
// Close button (連続作業時にXボタンまでマウス移動しなくて済むように)
|
||||
document.getElementById("wfm-modal-model-close")?.addEventListener("click", () => {
|
||||
closeModal();
|
||||
});
|
||||
|
||||
// Delete model button
|
||||
document.getElementById("wfm-modal-model-delete")?.addEventListener("click", async () => {
|
||||
const confirmMsg = t("modelBulkDeleteConfirm").replace("{count}", "1");
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
|
||||
import { showToast } from "./app.js";
|
||||
import { t } from "./i18n.js";
|
||||
import { readJsonStorage } from "./util.js";
|
||||
import { readJsonStorage, getAiBackendDefaultUrl } from "./util.js";
|
||||
|
||||
// ============================================
|
||||
// State
|
||||
@@ -390,7 +390,7 @@ let _promptAiBackendForModels = null;
|
||||
function getPromptAiConfig() {
|
||||
const s = loadPromptAiSettings();
|
||||
const backend = s.backend || "ollama";
|
||||
const url = (s.backendUrl || (backend === "ollama" ? "http://localhost:11434" : "http://localhost:1234")).replace(/\/$/, "");
|
||||
const url = (s.backendUrl || getAiBackendDefaultUrl(backend)).replace(/\/$/, "");
|
||||
return { backend, url };
|
||||
}
|
||||
|
||||
@@ -418,7 +418,7 @@ async function chatWithAi(model, messages) {
|
||||
if (!res.ok) throw new Error(`HTTP ${res.status}`);
|
||||
return (await res.json()).message?.content || "";
|
||||
} else {
|
||||
// LM Studio: convert Ollama-style messages (with .images) to OpenAI content arrays
|
||||
// LM Studio / Lemonade (OpenAI-compatible): convert Ollama-style messages (with .images) to OpenAI content arrays
|
||||
const openAiMessages = messages.map(msg => {
|
||||
if (msg.images?.length) {
|
||||
return {
|
||||
|
||||
@@ -6,7 +6,7 @@ import { showToast } from "./app.js";
|
||||
import { comfyUI } from "./comfyui-client.js";
|
||||
import { t, getLang, getSummaryLang, setLang, setSummaryLang, getLanguageOptions, getSummaryLanguageOptions } from "./i18n.js";
|
||||
|
||||
import { getSettings, readJsonStorage } from "./util.js";
|
||||
import { getSettings, readJsonStorage, getAiBackendDefaultUrl } from "./util.js";
|
||||
|
||||
const SETTINGS_KEY = "wfm_settings";
|
||||
|
||||
@@ -637,6 +637,30 @@ export async function initSettingsTab() {
|
||||
<div id="wfm-settings-url-status" style="font-size:12px;margin-top:4px;"></div>
|
||||
</details>
|
||||
|
||||
<!-- Default Checkpoint -->
|
||||
<details class="wfm-settings-section">
|
||||
<summary class="wfm-settings-summary">${t("defaultCheckpointSettings")}</summary>
|
||||
<div class="wfm-form-group">
|
||||
<label style="display:flex;align-items:center;gap:6px;cursor:pointer;">
|
||||
<input type="checkbox" id="wfm-settings-default-ckpt-enabled" ${serverSettings.default_checkpoint_enabled ? "checked" : ""}>
|
||||
<span id="wfm-settings-default-ckpt-enable-label">${t("defaultCheckpointEnable")}</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="wfm-form-group">
|
||||
<label id="wfm-settings-default-ckpt-model-label">${t("defaultCheckpointModel")}</label>
|
||||
<div style="display:flex;gap:8px;">
|
||||
<select class="wfm-select" id="wfm-settings-default-ckpt-select" style="flex:1;">
|
||||
<option value="">${t("selectModel")}</option>
|
||||
</select>
|
||||
<button class="wfm-btn wfm-btn-sm" id="wfm-settings-default-ckpt-refresh">${t("refresh")}</button>
|
||||
</div>
|
||||
<small id="wfm-settings-default-ckpt-hint" style="color:var(--wfm-text-secondary);font-size:11px;display:block;margin-top:4px;">
|
||||
${t("defaultCheckpointHint")}
|
||||
</small>
|
||||
</div>
|
||||
<button class="wfm-btn wfm-btn-primary wfm-btn-sm" id="wfm-settings-default-ckpt-save">${t("save")}</button>
|
||||
</details>
|
||||
|
||||
<!-- AI Assistant Settings (Prompt Tab) -->
|
||||
<details class="wfm-settings-section">
|
||||
<summary class="wfm-settings-summary">${t("ollamaSettings")}</summary>
|
||||
@@ -649,6 +673,9 @@ export async function initSettingsTab() {
|
||||
<label class="wfm-ai-radio-label">
|
||||
<input type="radio" name="wfm-prompt-ai-backend" value="lmstudio"> LM Studio
|
||||
</label>
|
||||
<label class="wfm-ai-radio-label">
|
||||
<input type="radio" name="wfm-prompt-ai-backend" value="lemonade"> Lemonade
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wfm-form-group">
|
||||
@@ -1101,14 +1128,14 @@ export async function initSettingsTab() {
|
||||
const promptAiUrlEl = document.getElementById("wfm-settings-prompt-ai-url");
|
||||
if (promptAiUrlEl) {
|
||||
promptAiUrlEl.value = promptAiSaved.backendUrl || "";
|
||||
promptAiUrlEl.placeholder = promptAiBackendSaved === "ollama" ? "http://localhost:11434" : "http://localhost:1234";
|
||||
promptAiUrlEl.placeholder = getAiBackendDefaultUrl(promptAiBackendSaved);
|
||||
}
|
||||
|
||||
// Backend change → update URL placeholder
|
||||
// Backend change → switch URL to the new backend's default
|
||||
document.querySelectorAll('input[name="wfm-prompt-ai-backend"]').forEach(r => {
|
||||
r.addEventListener("change", () => {
|
||||
const backend = document.querySelector('input[name="wfm-prompt-ai-backend"]:checked')?.value || "ollama";
|
||||
if (promptAiUrlEl) promptAiUrlEl.placeholder = backend === "ollama" ? "http://localhost:11434" : "http://localhost:1234";
|
||||
if (promptAiUrlEl) promptAiUrlEl.value = getAiBackendDefaultUrl(backend);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1117,7 +1144,7 @@ export async function initSettingsTab() {
|
||||
const select = document.getElementById("wfm-settings-prompt-ai-model");
|
||||
if (!select) return;
|
||||
const backend = document.querySelector('input[name="wfm-prompt-ai-backend"]:checked')?.value || "ollama";
|
||||
const url = (promptAiUrlEl?.value.trim() || (backend === "ollama" ? "http://localhost:11434" : "http://localhost:1234")).replace(/\/$/, "");
|
||||
const url = (promptAiUrlEl?.value.trim() || getAiBackendDefaultUrl(backend)).replace(/\/$/, "");
|
||||
try {
|
||||
let models = [];
|
||||
if (backend === "ollama") {
|
||||
@@ -1142,7 +1169,7 @@ export async function initSettingsTab() {
|
||||
document.getElementById("wfm-settings-prompt-ai-test")?.addEventListener("click", async () => {
|
||||
const statusEl = document.getElementById("wfm-settings-prompt-ai-status");
|
||||
const backend = document.querySelector('input[name="wfm-prompt-ai-backend"]:checked')?.value || "ollama";
|
||||
const url = (promptAiUrlEl?.value.trim() || (backend === "ollama" ? "http://localhost:11434" : "http://localhost:1234")).replace(/\/$/, "");
|
||||
const url = (promptAiUrlEl?.value.trim() || getAiBackendDefaultUrl(backend)).replace(/\/$/, "");
|
||||
if (statusEl) { statusEl.textContent = t("aiStatusConnecting"); statusEl.style.color = "var(--wfm-text-secondary)"; }
|
||||
try {
|
||||
let count = 0;
|
||||
@@ -1210,6 +1237,35 @@ export async function initSettingsTab() {
|
||||
statusEl.style.color = ok ? "var(--wfm-success)" : "var(--wfm-danger)";
|
||||
});
|
||||
|
||||
// Default Checkpoint
|
||||
const defaultCkptSelect = document.getElementById("wfm-settings-default-ckpt-select");
|
||||
|
||||
async function loadDefaultCkptOptions() {
|
||||
if (!defaultCkptSelect) return;
|
||||
try {
|
||||
const list = await comfyUI.fetchCheckpoints();
|
||||
const saved = serverSettings.default_checkpoint_name || "";
|
||||
defaultCkptSelect.innerHTML = `<option value="">${t("selectModel")}</option>` +
|
||||
(list || []).map((m) => `<option value="${m}" ${m === saved ? "selected" : ""}>${m}</option>`).join("");
|
||||
} catch { /* ignore */ }
|
||||
}
|
||||
loadDefaultCkptOptions();
|
||||
|
||||
document.getElementById("wfm-settings-default-ckpt-refresh")?.addEventListener("click", loadDefaultCkptOptions);
|
||||
|
||||
document.getElementById("wfm-settings-default-ckpt-save")?.addEventListener("click", async () => {
|
||||
const enabled = !!document.getElementById("wfm-settings-default-ckpt-enabled")?.checked;
|
||||
const ckptName = defaultCkptSelect?.value || "";
|
||||
try {
|
||||
await saveServerSettings({ default_checkpoint_enabled: enabled, default_checkpoint_name: ckptName });
|
||||
serverSettings.default_checkpoint_enabled = enabled;
|
||||
serverSettings.default_checkpoint_name = ckptName;
|
||||
showToast(t("aiToastSettingsSaved"), "success");
|
||||
} catch (err) {
|
||||
showToast(`${t("saveError")}: ${err.message}`, "error");
|
||||
}
|
||||
});
|
||||
|
||||
// Test Eagle URL (via server proxy to avoid CORS)
|
||||
document.getElementById("wfm-settings-test-eagle")?.addEventListener("click", async () => {
|
||||
const urlInput = document.getElementById("wfm-settings-eagle-url");
|
||||
|
||||
@@ -27,6 +27,17 @@ export function getSettings() {
|
||||
return readJsonStorage("wfm_settings");
|
||||
}
|
||||
|
||||
// AIバックエンド(Ollama/LM Studio/Lemonade)ごとのデフォルトURL
|
||||
export const AI_BACKEND_DEFAULT_URLS = {
|
||||
ollama: "http://localhost:11434",
|
||||
lmstudio: "http://localhost:1234",
|
||||
lemonade: "http://localhost:13305",
|
||||
};
|
||||
|
||||
export function getAiBackendDefaultUrl(backend) {
|
||||
return AI_BACKEND_DEFAULT_URLS[backend] || AI_BACKEND_DEFAULT_URLS.ollama;
|
||||
}
|
||||
|
||||
/**
|
||||
* 検索inputにオーバーレイXボタンを設定する。
|
||||
* @param {string} inputId - 検索inputのID
|
||||
|
||||
@@ -51,7 +51,7 @@ function sendToCanvas(workflowData) {
|
||||
// window.opener経由でComfyUIキャンバスに直接ロード（推奨）
|
||||
if (window.opener && typeof window.opener.wfmReceiveWorkflow === "function") {
|
||||
window.opener.wfmReceiveWorkflow(workflowData);
|
||||
showToast(t("workflowSentToCanvas"), "success");
|
||||
showToast(t("workflowSentToCanvasDirect"), "success");
|
||||
return;
|
||||
}
|
||||
// フォールバック: localStorage + タイトルドラッグ（UI形式のみ）
|
||||
@@ -270,6 +270,85 @@ async function getRawWorkflow(filename) {
|
||||
return await res.json();
|
||||
}
|
||||
|
||||
// ============================================
|
||||
// AI Summary — structured extraction (not raw JSON dump)
|
||||
// ============================================
|
||||
|
||||
// analyzeWorkflow() の結果をコンパクトなテキストに整形する。
|
||||
// 生JSONをそのままLLMに渡すと、MarkdownNoteの長文やUI座標情報などのノイズで
|
||||
// 文字数制限に達し、肝心のノード構成情報(サブグラフ内含む)が切り捨てられやすい。
|
||||
function _buildStructuredSummaryText(analysis) {
|
||||
const lines = [];
|
||||
|
||||
if (analysis.checkpoint_nodes.length) {
|
||||
lines.push(`Checkpoint: ${analysis.checkpoint_nodes.map((n) => n.ckpt_name).filter(Boolean).join(", ")}`);
|
||||
}
|
||||
if (analysis.diffusion_model_nodes.length) {
|
||||
lines.push(`Diffusion Model (UNET): ${analysis.diffusion_model_nodes.map((n) => n.unet_name).filter(Boolean).join(", ")}`);
|
||||
}
|
||||
if (analysis.text_encoder_nodes.length) {
|
||||
lines.push(`Text Encoder (CLIP): ${analysis.text_encoder_nodes.map((n) => [n.clip_name1, n.clip_name2].filter(Boolean).join("+")).join(", ")}`);
|
||||
}
|
||||
if (analysis.vae_nodes.length) {
|
||||
lines.push(`VAE: ${analysis.vae_nodes.map((n) => n.vae_name).filter(Boolean).join(", ")}`);
|
||||
}
|
||||
if (analysis.lora_nodes.length) {
|
||||
lines.push(`LoRA: ${analysis.lora_nodes.map((n) => {
|
||||
if (n.is_lora_manager) return "(LoraManager)";
|
||||
const strengths = n.strength_clip !== undefined
|
||||
? `model:${n.strength_model}, clip:${n.strength_clip}`
|
||||
: `model:${n.strength_model}`;
|
||||
return `${n.lora_name} (${strengths})`;
|
||||
}).join(", ")}`);
|
||||
}
|
||||
if (analysis.controlnet_nodes.length) {
|
||||
lines.push(`ControlNet: ${analysis.controlnet_nodes.map((n) => n.control_net_name).filter(Boolean).join(", ")}`);
|
||||
}
|
||||
if (analysis.hypernetwork_nodes.length) {
|
||||
lines.push(`Hypernetwork: ${analysis.hypernetwork_nodes.map((n) => n.hypernetwork_name).filter(Boolean).join(", ")}`);
|
||||
}
|
||||
|
||||
const positives = analysis.prompt_nodes.filter((n) => n.role === "positive").map((n) => n.text).filter(Boolean);
|
||||
const negatives = analysis.prompt_nodes.filter((n) => n.role === "negative").map((n) => n.text).filter(Boolean);
|
||||
if (positives.length) lines.push(`Positive Prompt: ${positives.join(" / ")}`);
|
||||
if (negatives.length) lines.push(`Negative Prompt: ${negatives.join(" / ")}`);
|
||||
|
||||
if (analysis.sampler_nodes.length) {
|
||||
const s = analysis.sampler_nodes[0];
|
||||
lines.push(`Sampler: steps=${s.steps}, cfg=${s.cfg}, sampler=${s.sampler_name}, scheduler=${s.scheduler}, denoise=${s.denoise}`);
|
||||
}
|
||||
if (analysis.latent_nodes.length) {
|
||||
const l = analysis.latent_nodes[0];
|
||||
lines.push(`Latent size: ${l.width ?? "?"}x${l.height ?? "?"}, batch=${l.batch_size ?? "?"}`);
|
||||
}
|
||||
|
||||
if (analysis.all_nodes.length) {
|
||||
const nodeTypes = [...new Set(analysis.all_nodes.map((n) => n.type))];
|
||||
lines.push(`Node types used (${analysis.all_nodes.length} nodes total): ${nodeTypes.join(", ")}`);
|
||||
}
|
||||
|
||||
return lines.join("\n");
|
||||
}
|
||||
|
||||
// ワークフロー(UI/API/サブグラフ入りいずれの形式でも)から要約用テキストを組み立てる。
|
||||
// 変換・解析に失敗した場合は、従来通り生JSON先頭部分にフォールバックする。
|
||||
async function _buildSummarySourceText(wfJson, filename) {
|
||||
try {
|
||||
const fmt = comfyWorkflow.detectFormat(wfJson, filename);
|
||||
let apiWf = wfJson;
|
||||
if (fmt === "ui") {
|
||||
apiWf = await comfyWorkflow.convertUiToApi(wfJson);
|
||||
} else if (fmt !== "api") {
|
||||
return JSON.stringify(wfJson).substring(0, 4000);
|
||||
}
|
||||
const analysis = comfyWorkflow.analyzeWorkflow(apiWf);
|
||||
const text = _buildStructuredSummaryText(analysis);
|
||||
return text || JSON.stringify(wfJson).substring(0, 4000);
|
||||
} catch {
|
||||
return JSON.stringify(wfJson).substring(0, 4000);
|
||||
}
|
||||
}
|
||||
|
||||
// ============================================
|
||||
// Rendering Helpers
|
||||
// ============================================
|
||||
@@ -1128,11 +1207,20 @@ function openDetailModal(wf) {
|
||||
btn.textContent = t("summarizing");
|
||||
try {
|
||||
const wfJson = await getRawWorkflow(wf.filename);
|
||||
const promptText = getSummaryPrompt() + JSON.stringify(wfJson).substring(0, 4000);
|
||||
const sourceText = await _buildSummarySourceText(wfJson, wf.filename);
|
||||
const promptText = getSummaryPrompt() + sourceText;
|
||||
const aiCfg = readJsonStorage("wfm_prompt_ai_settings", {});
|
||||
if (aiCfg.backend && aiCfg.backend !== "ollama") {
|
||||
throw new Error(t("summarizeOllamaOnly"));
|
||||
}
|
||||
const chatRes = await fetch("/api/wfm/ollama/chat", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({ messages: [{ role: "user", content: promptText }] }),
|
||||
body: JSON.stringify({
|
||||
url: aiCfg.backendUrl || undefined,
|
||||
model: aiCfg.model || undefined,
|
||||
messages: [{ role: "user", content: promptText }],
|
||||
}),
|
||||
});
|
||||
const chatData = await chatRes.json();
|
||||
if (chatData.error) throw new Error(chatData.error);
|
||||
|
||||
+88
-17
@@ -751,6 +751,7 @@
|
||||
<span class="wfm-gen-rawjson-label">Raw JSON</span>
|
||||
<button id="wfm-gen-apply-raw-btn" class="wfm-btn wfm-btn-sm">Apply</button>
|
||||
</div>
|
||||
<div id="wfm-gen-rawjson-bypass-note" class="wfm-gen-rawjson-bypass-note" style="display:none;"></div>
|
||||
<div class="wfm-rawjson-search">
|
||||
<input type="text" id="wfm-gen-raw-search" class="wfm-rawjson-search-input" placeholder="Search...">
|
||||
<span id="wfm-gen-raw-search-count" class="wfm-rawjson-search-count"></span>
|
||||
@@ -1086,15 +1087,15 @@
|
||||
<h3>GenerateUI Tab</h3>
|
||||
<ul>
|
||||
<li id="wfm-help-gen-1">Connect/disconnect ComfyUI and check connection status</li>
|
||||
<li id="wfm-help-gen-2">Load workflows from Workflow tab (App format .app.json not supported); Reset Workflow button re-reads the current workflow file from disk and reloads the editor; <b>Save</b> button (right end of the tab bar) saves the current workflow — including any edits made in the editor — as a new .json file to the Workflow tab; a filename dialog appears with the current workflow name as the default; <b>Style</b> checkbox and dropdown (next to Reset Workflow): enable to apply a Fooocus-style JSON style to the positive and negative prompts at generation time — style files are loaded from <code>user/default/Workflow-Studio/style/*.json</code>; the style's <code>{prompt}</code> placeholder is replaced with the original prompt, or the style text is appended if no placeholder exists</li>
|
||||
<li id="wfm-help-gen-2">Load workflows from Workflow tab (subgraph-containing workflows are supported, e.g. Flux.2 / Qwen-Image / Z-Image / Mage-Flow templates; only ComfyUI's simplified App format [.app.json / Linear Mode] is not); Reset Workflow button re-reads the current workflow file from disk and reloads the editor; <b>Save</b> button (right end of the tab bar) saves the current workflow — including any edits made in the editor — as a new .json file to the Workflow tab; a filename dialog appears with the current workflow name as the default; <b>Style</b> checkbox and dropdown (next to Reset Workflow): enable to apply a Fooocus-style JSON style to the positive and negative prompts at generation time — style files are loaded from <code>user/default/Workflow-Studio/style/*.json</code>; the style's <code>{prompt}</code> placeholder is replaced with the original prompt, or the style text is appended if no placeholder exists</li>
|
||||
<li id="wfm-help-gen-3">5-tab layout — Input (Prompt + Image), Model, Settings, Feeder, Batch — Input/Model/Settings each include a Raw JSON column for instant preview and direct editing</li>
|
||||
<li id="wfm-help-gen-4">Input tab: inner tabs — <b>Prompt</b> and <b>Image</b> (drag-and-drop upload); Prompt tab has Positive Prompt, Negative Prompt, and an <b>Embeddings</b> selector at the bottom — select a model, set Weight (default 1.0), then click <b>Paste</b> to insert <code>(embedding:Name:weight)</code> at the cursor position of the last focused textarea (defaults to Positive if neither is focused)</li>
|
||||
<li id="wfm-help-gen-4">Input tab: inner tabs — <b>Prompt</b> and <b>Image</b> (drag-and-drop upload); Prompt tab has Positive Prompt, Negative Prompt, and an <b>Embeddings</b> selector at the bottom — select a model, set Weight (default 1.0), then click <b>Paste</b> to insert <code>(embedding:Name:weight)</code> at the cursor position of the last focused textarea (defaults to Positive if neither is focused); a <b>↺</b> button next to each Apply button reverts the textarea to the node's currently applied value; select text (or just place the cursor on a word/parenthesis block) and press <b>Ctrl+↑/↓</b> to adjust its emphasis weight in <code>(text:weight)</code> syntax by ±0.05 — the parentheses are removed automatically when the weight returns to 1.0</li>
|
||||
<li id="wfm-help-gen-5">Model tab: Checkpoint, VAE, LoRA (Single/Stack tabs), ControlNet, Diffusion Model (UNETLoader / UnetLoaderGGUF / LoaderGGUF), Text Encoder (CLIPLoader / DualCLIPLoader / ClipLoaderGGUF / DualClipLoaderGGUF — type and device selectors; DualCLIP shows two clip selectors), Hypernetwork (with Strength field) selectors with filter; LoRA Stack — Apply writes all active LoRAs to the target node and simultaneously inserts LoRA syntax and CivitAI trigger words into the Positive prompt; re-applying updates the prompt by removing inactive LoRAs and re-adding active ones</li>
|
||||
<li id="wfm-help-gen-6">Settings tab: KSampler and Latent Image side by side, each at 50% width</li>
|
||||
<li id="wfm-help-gen-7">Raw JSON always visible in the right column of each tab — edit directly and Apply to reload the workflow</li>
|
||||
<li id="wfm-help-gen-7">Raw JSON always visible in the right column of each tab — edit directly and Apply to reload the workflow; if the loaded workflow has Bypass or Mute nodes, a note listing them appears above the search bar (Bypass nodes are excluded with their wires reconnected around them; Mute nodes are excluded with no reconnection, matching ComfyUI itself)</li>
|
||||
<li id="wfm-help-gen-8">Seed control: random, fixed, increment, decrement — seed input and mode selector stacked vertically for readability</li>
|
||||
<li id="wfm-help-gen-9">Generate, progress display, stop, and view results</li>
|
||||
<li id="wfm-help-gen-10">Eagle integration: auto-save generated images to Eagle</li>
|
||||
<li id="wfm-help-gen-10">Eagle integration: auto-save generated images to Eagle (SVG output supported too — both the standard SaveSVGNode and comfyui-tosvg's Save SVG String node)</li>
|
||||
<li id="wfm-help-gen-11">Batch tab — enable one batch type at a time by checking the checkbox in the Batch Queue column header; Generate then runs through all queued items sequentially with Pause/Resume and Stop controls</li>
|
||||
<li id="wfm-help-gen-12">Batch tab — Left pane has 4 tabs: <b>Checkpoints</b> (folder tree with Filter/All/None; (root) header checkbox selects all), <b>Sampler</b> (KSampler sampler_name list with (root) checkbox), <b>Scheduler</b> (KSampler scheduler list with (root) checkbox), <b>Style</b> (flat list of all styles loaded from <code>Workflow-Studio/style/</code> with All/None buttons); All/None toolbar buttons available for each tab</li>
|
||||
<li id="wfm-help-gen-13">Batch tab — Center pane: group-based selection with inner tabs (Checkpoint | Lora | Prompt | Workflow); Checkpoint tab shows groups defined in the Models tab — check a group header to select all its members, or expand ▶ to check individual models; group membership always reflects the current Models tab state</li>
|
||||
@@ -1102,6 +1103,8 @@
|
||||
<li id="wfm-help-gen-15">Sampler/Scheduler batch: select one or more samplers or schedulers from the left pane, enable the column in Batch Queue, then Generate to run each value through the KSampler node sequentially; sampler/scheduler lists are fetched from ComfyUI (requires connection)</li>
|
||||
<li id="wfm-help-gen-17">Style batch: select styles in the left pane Style tab, enable the Style column in Batch Queue, then Generate — each selected style is applied in sequence to the positive and negative prompts; styles are applied to workflow copies so the loaded workflow is not modified; style files are re-read each time the page loads from <code>user/default/Workflow-Studio/style/*.json</code></li>
|
||||
<li id="wfm-help-gen-16">SPA-side wildcard expansion (A1111-style): when prompt text in non-ImpactWildcard nodes (e.g. CLIPTextEncode) contains __name__ syntax, the SPA expands it at generation time by randomly picking a line from the matching file in the WFS wildcard folder; nested wildcards are re-expanded up to 5 passes; unresolved wildcards are passed through unchanged; ImpactWildcardEncode/Processor nodes are skipped (handled server-side by Impact Pack); works in both single and batch generation</li>
|
||||
<li id="wfm-help-gen-18">Alt+Click any Apply button (Positive Prompt / Checkpoint / KSampler) to Apply & Generate in one step — applies the parameter to the workflow then immediately queues a generation; only fires when the target node exists in the loaded workflow</li>
|
||||
<li id="wfm-help-gen-19">Lora batch: for each LoRA, its syntax (<lora:name:strength_model:strength_clip>) and CivitAI trained words are automatically appended to the Positive prompt — rebuilt from the original prompt each time, not accumulated; the prompt is automatically restored to its pre-batch state when the batch completes or is stopped; if a selected LoRA is not yet recognized by ComfyUI's model list, a warning toast is shown (Refresh or restart ComfyUI)</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1164,7 +1167,7 @@
|
||||
<li id="wfm-help-metadata-2">Center column: Checkpoint, VAE, Diffusion Model, and Text Encoder lists extracted from the workflow</li>
|
||||
<li id="wfm-help-metadata-3">Right column: LoRA list (with strength values) and Prompt list (click to view full text below)</li>
|
||||
<li id="wfm-help-metadata-4">Prompt actions — Copy: copy to clipboard; GenUI:P/N: set GenerateUI positive/negative prompt; Prompt:P/N: set Prompt tab preset positive/negative</li>
|
||||
<li id="wfm-help-metadata-5">Supported: ComfyUI PNG/WebP/JSON (standard + Flux.2 / Qwen-Image / Z-Image subgraph workflows), SD WebUI, SD Forge, Fooocus. Model extraction covers UNETLoader, UnetLoaderGGUF, UNETLoaderGGUF (e.g. HiDream GGUF), CLIPLoader, DualCLIPLoader, TripleCLIPLoader, and QuadrupleCLIPLoader (e.g. HiDream 4-CLIP).</li>
|
||||
<li id="wfm-help-metadata-5">Supported: ComfyUI PNG/WebP/JSON (standard + Flux.2 / Qwen-Image / Z-Image / Mage-Flow subgraph workflows), SD WebUI, SD Forge, Fooocus. Model extraction covers UNETLoader, UnetLoaderGGUF, UNETLoaderGGUF (e.g. HiDream GGUF), CLIPLoader, DualCLIPLoader, TripleCLIPLoader, and QuadrupleCLIPLoader (e.g. HiDream 4-CLIP).</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1269,7 +1272,7 @@
|
||||
<li id="wfm-help-sidepanel-13">I tab (Information): drop a ComfyUI PNG/WebP/JSON to inspect model, LoRA, and prompt metadata in the side panel — sub-tabs: model / lora / Prompts; supports UnetLoaderGGUF and QuadrupleCLIPLoader node types</li>
|
||||
<li id="wfm-help-sidepanel-14">Information tab — drag items to canvas: model sub-tab places the loader node (Checkpoint → CheckpointLoaderSimple, VAE → VAELoader, Diffusion Model → UNETLoader, Text Encoder → CLIPLoader); double-click also places at canvas center</li>
|
||||
<li id="wfm-help-sidepanel-15">Information tab — LoRA sub-tab: drag individual LoRA to place LoraLoader; "Multiple LORA" section at bottom places all LoRAs in a single Lora Loader (LoraManager) node; Prompts sub-tab: drag a prompt to place CLIPTextEncode node with text pre-filled; click prompt to view full text and copy</li>
|
||||
<li id="wfm-help-sidepanel-16">AI TOOL tab: Translation, Chat, TOOLS, and Settings sub-tabs powered by Ollama or LM Studio; Chat supports multi-turn conversations; TOOLS includes VLM image analysis and wildcard generation; settings shared with the SPA AI TOOL tab via localStorage</li>
|
||||
<li id="wfm-help-sidepanel-16">AI TOOL tab: Translation, Chat, TOOLS, and Settings sub-tabs powered by Ollama, LM Studio, or Lemonade; Chat supports multi-turn conversations; TOOLS includes VLM image analysis and wildcard generation; settings shared with the SPA AI TOOL tab via localStorage</li>
|
||||
<li id="wfm-help-sidepanel-17">Title drag (Send to Canvas): after clicking 'Send to Canvas' (Workflow tab) or 'Copy & Send Canvas' (Gallery tab), the 'Workflow Studio Library' title turns blue with a green ● — drag it onto the canvas to load the workflow; title resets automatically after loading</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -1280,11 +1283,12 @@
|
||||
<h3 id="wfm-help-ai-title">AI TOOL Tab</h3>
|
||||
<ul>
|
||||
<li id="wfm-help-ai-1">4-pane layout — Translation | Chat | TOOLS | Settings — all panes are always visible simultaneously</li>
|
||||
<li id="wfm-help-ai-2">Translation pane: translate text between Japanese, English, Chinese, or a custom Free language using Ollama or LM Studio; ⇄ swap button swaps both language selectors and text content; selections are saved automatically</li>
|
||||
<li id="wfm-help-ai-3">Chat pane: multi-turn conversation with the LLM; Enter to send a message, Shift+Enter for a newline; Clear button resets the conversation history</li>
|
||||
<li id="wfm-help-ai-4">TOOLS pane — VLM: drop an image (PNG/JPG/WebP) and select a task (Describe Image, Create Prompt, Create Tags), then click Run to analyze with a vision model; result shown with Copy button</li>
|
||||
<li id="wfm-help-ai-2">Translation pane: translate text between Japanese, English, Chinese, or a custom Free language using Ollama, LM Studio, or Lemonade; ⇄ swap button swaps both language selectors and text content; selections are saved automatically</li>
|
||||
<li id="wfm-help-ai-3">Chat pane: multi-turn conversation with the LLM; Enter to send a message, Shift+Enter for a newline; Clear button resets the conversation history; if the model supports tool calling and asks for an image ("generate a cat picture", etc.) it will run generation on the workflow currently loaded in GenerateUI and show the result inline; the "Allow image generation" checkbox in the pane header toggles this on/off; if an image is attached (dropped in the TOOLS pane) it is sent to the LLM as vision input and, when generate_image is called, used as the base for image-to-image generation instead of text-to-image; models verified to work well for tool calling and vision: Gemma 4:e4b, Qwen 3.5:9b, Ministral 3:3b (Ollama)</li>
|
||||
<li id="wfm-help-ai-4">TOOLS pane — VLM: drop an image (PNG/JPG/WebP) and select a task (Describe Image, Create Prompt, Create Tags), then click Run to analyze with a vision model; result shown with Copy button; the dropped image is also shared with the Chat pane as its attachment (shown there and used for image-to-image generation) until cleared with the ✕ button</li>
|
||||
<li id="wfm-help-ai-5">TOOLS pane — Wildcards: select "Create wildcards" from the dropdown, enter a category name and count, click Run to generate plain-text wildcard entries one per line</li>
|
||||
<li id="wfm-help-ai-6">Settings pane: choose backend (Ollama / LM Studio), set API URL, test connection, select model, configure Free language names; settings are shared with the Library panel's A tab via localStorage</li>
|
||||
<li id="wfm-help-ai-6">Settings pane: choose backend (Ollama / LM Studio / Lemonade), set API URL, test connection, select model, configure Free language names; Chat Image Generation section lets you enable a dedicated workflow for Chat-triggered text-to-image generation instead of the one currently loaded in GenerateUI; Chat I2I Generation section is the same but for image-to-image generation when an image is attached; settings are shared with the Library panel's A tab via localStorage</li>
|
||||
<li id="wfm-help-ai-7">Chat pane — SVG: the LLM can also produce SVG graphics directly as text, with no ComfyUI workflow involved; ask it to draw something in SVG and, if the reply contains SVG code, it is rendered inline as a preview with a "Save to Gallery" button that writes it as a .svg file to the Gallery tab's output folder; this does not use tool calling, so it works with any model regardless of tool-calling support</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1312,19 +1316,20 @@
|
||||
<ul>
|
||||
<li id="wfm-help-imageedit-1">Layer-based image editor — compose images with multiple layers (Image, Text, Draw, Mask types) and export the composite</li>
|
||||
<li id="wfm-help-imageedit-2">Loading images: drag & drop onto the canvas, Upload button, or send from the Gallery tab via the Image Edit button in the Gallery toolbar; the first image becomes Layer 1 (auto-locked); subsequent images are added as new layers scaled to fit the canvas</li>
|
||||
<li id="wfm-help-imageedit-3">New button: create a blank canvas — prompts for WxH size (e.g. 512x768); clears all existing layers</li>
|
||||
<li id="wfm-help-imageedit-3">New button: create a blank canvas — prompts for WxH size (e.g. 512x768); clears all existing layers and automatically adds an empty Layer 1</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="wfm-help-card">
|
||||
<h3 id="wfm-help-imageedit-tools-title">Tools</h3>
|
||||
<ul>
|
||||
<li id="wfm-help-imageedit-4">Select (V): click to select a layer; drag to move; drag corner handles to resize; drag the circle above the top edge to rotate; double-click a text layer to re-edit its content; Tool Options bar shows Flip H / Flip V / Rotate field</li>
|
||||
<li id="wfm-help-imageedit-5">Draw (B): freehand brush drawing onto the active draw layer; Tool Options: color, brush size, blend mode</li>
|
||||
<li id="wfm-help-imageedit-5">Draw (B): freehand brush drawing onto the active draw layer; Tool Options: color, brush size, blend mode; Properties pane includes a MASK EDITOR ONE (COLOR) section for ABR image brushes — always visible, header text is green when brushes are available, gray when none are imported yet; Select is disabled until at least one brush exists</li>
|
||||
<li id="wfm-help-imageedit-6">Text (T): click on the canvas to place a text input overlay; configure font family, size, bold/italic, align, color in the Tool Options bar; click OK to place the text as an exact-size Text layer; double-click an existing text layer with the Select tool to re-edit</li>
|
||||
<li id="wfm-help-imageedit-7">Shape (S): draw geometric shapes onto the canvas; each committed shape becomes an independent draw layer; Tool Options: Shape type (Rect / Ellipse / Line / FreeLine), Rounded checkbox (Rect / Ellipse only), Fill color + None toggle (hidden for Line / FreeLine), Stroke color + width + None toggle (None hidden for Line / FreeLine where stroke is always active), Opacity slider, ↩ Undo button; drag to draw — a blue dashed outline previews the shape; release to commit</li>
|
||||
<li id="wfm-help-imageedit-7b">Blur (≈): apply Gaussian blur or mosaic to the active layer — whole-layer or region-based (drag a rectangle); see the Blur Tool card below for details</li>
|
||||
<li id="wfm-help-imageedit-7c">BG Remove (⬚): remove the background from the active layer using Lightweight (@imgly, runs in browser) or BiRefNet (Python backend, coming soon); see the BG Remove Tool card below for details</li>
|
||||
<li id="wfm-help-imageedit-7d">Mask (🎭): paint a white mask on the canvas; click "M" in the Layers header to add a mask layer — the Mask tool activates automatically; the mask is shown as a colored semi-transparent overlay; the Properties pane (left of the Layers panel) shows Paint controls; see the Mask Tool card below for details</li>
|
||||
<li id="wfm-help-imageedit-7c">BG Remove (⬚): remove the background from the active layer using Lightweight (@imgly, runs in browser) or BiRefNet (requires Mask Editor One + birefnet.safetensors in ComfyUI/models/background_removal/); see the BG Remove Tool card below for details</li>
|
||||
<li id="wfm-help-imageedit-7d">Mask (🎭): paint masks on a mask layer using 6 sub-tools — Paint (freehand), Color (flood-select by similar color), Alpha (extract from image transparency), Text (stamp text), Vector (Catmull-Rom spline polygon), Shape (rect / ellipse); SAM3 text-prompt segmentation is also available when Mask Editor One is installed; click "M" in the Layers header to add a mask layer; see the Mask Tool card below for details</li>
|
||||
<li id="wfm-help-imageedit-7e">Inpaint (🩹): composites the visible layers plus a Mask layer into one RGBA image (mask baked into the alpha channel) and applies it to the first inpaint-capable LoadImage node in the workflow currently loaded in GenerateUI (a node whose MASK output feeds something like VAEEncodeForInpaint); enter Positive/Negative prompts, Grow Mask By (applied to the VAE Encode (for Inpainting) node), and Denoise (applied to KSampler) in the properties panel, then click Run to upload and generate without leaving the Image Edit tab — the result is shown back in the properties panel when done; requires a Mask layer to be painted first and an inpaint-capable workflow loaded in GenerateUI; also works with workflows built around the Mask Editor One custom node (comfyui-mask-editor-one) instead of LoadImage — image/mask are pushed to it via its node_id-keyed server cache and layer_data widget; "Use dedicated workflow" checkbox: when off, the workflow currently loaded in GenerateUI is used (unchanged); when on, pick a saved workflow from the dropdown — it is loaded, edited, and generated entirely in the background without disturbing the workflow shown in GenerateUI</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="wfm-help-card">
|
||||
@@ -1354,7 +1359,7 @@
|
||||
<h3 id="wfm-help-imageedit-bgremove-title">BG Remove Tool (⬚)</h3>
|
||||
<ul>
|
||||
<li id="wfm-help-imageedit-bgremove-1">Model — Lightweight (@imgly): runs entirely in the browser using the @imgly/background-removal library loaded from CDN; no server required; first use downloads the model (~40 MB) and caches it for the session</li>
|
||||
<li id="wfm-help-imageedit-bgremove-2">Model — BiRefNet: high-quality background removal using the BiRefNet model via the Workflow Studio Python backend; requires birefnet.safetensors placed in ComfyUI/models/background_removal/ (coming soon)</li>
|
||||
<li id="wfm-help-imageedit-bgremove-2">Model — BiRefNet: high-quality background removal using the BiRefNet model; requires Mask Editor One to be installed and birefnet.safetensors placed in ComfyUI/models/background_removal/</li>
|
||||
<li id="wfm-help-imageedit-bgremove-3">New Layer (checked by default): the result is added as a new layer above the active layer at the same position and display size — the original layer is preserved</li>
|
||||
<li id="wfm-help-imageedit-bgremove-4">When New Layer is unchecked, the active layer's canvas is replaced in-place with the background-removed result</li>
|
||||
<li id="wfm-help-imageedit-bgremove-5">Click Remove BG to start processing; status text shows Loading model → Processing → Done; supports Undo (Ctrl+Z)</li>
|
||||
@@ -1365,9 +1370,17 @@
|
||||
<ul>
|
||||
<li id="wfm-help-imageedit-mask-1">Add a mask layer: click the "M" button in the Layers panel header; the new mask layer is inserted above the active layer and the Mask tool activates automatically</li>
|
||||
<li id="wfm-help-imageedit-mask-2">Clicking a mask layer in the layer list automatically switches to the Mask tool</li>
|
||||
<li id="wfm-help-imageedit-mask-3">Tool Options bar (Paint / Invert / Overlay / Blur): Paint button toggles the Paint sub-tool; Invert checkbox inverts the overlay preview (shows color where mask is absent); Overlay color picker changes the preview color (default red); Blur slider (0–50 px) softens the overlay edge</li>
|
||||
<li id="wfm-help-imageedit-mask-4">Properties pane (left of the Layers panel, visible when Mask tool is active): Size (1–200 px), Hardness (0–100%), Mode — Add button draws white (mask present) / Erase button removes to transparent (mask absent); the active mode is highlighted in blue</li>
|
||||
<li id="wfm-help-imageedit-mask-3">Tool Options bar — sub-tools: Paint / Color / Alpha / Text / Vector / Shape (all work without Mask Editor One) / SAM3 (requires Mask Editor One, disabled if not installed); Invert checkbox inverts the overlay preview; Overlay color picker changes the preview color (default red); Blur slider (0–50 px) softens the overlay edge; the overlay is only shown for the currently active mask layer — inactive mask layers stay hidden until selected</li>
|
||||
<li id="wfm-help-imageedit-mask-4">Properties pane — Paint mode: Mode (Add / Erase), Size (1–200 px), Hardness (0–100%); MASK EDITOR ONE section (always visible — header text is green when ABR brushes are available, gray when none are imported yet): Select button opens the ABR brush library (disabled until at least one brush exists) — choosing a brush replaces the default circle brush; ✕ clears the brush back to Circle; when an image brush is active, Hardness is disabled and additional controls appear: Spacing (stamp interval 5–100%), Angle (rotation 0–359°), Sz Jitter (random size reduction per stamp 0–100%), Rot. Jitter (random rotation per stamp on/off)</li>
|
||||
<li id="wfm-help-imageedit-mask-5">✂ button on a mask layer row: toggles the layer as a clipping mask — when enabled (blue), the mask clips the layer directly below it so only the painted area is visible; clipping is applied when saving PNG / Gallery / ComfyUI</li>
|
||||
<li id="wfm-help-imageedit-mask-6">SAM3 (Mask Editor One required): text-prompt segmentation powered by the SAM3 model; enter a description of the object to segment (e.g. "cat", "person"), set Max (maximum mask candidates: 3/6/9/12), then click Segment</li>
|
||||
<li id="wfm-help-imageedit-mask-7">SAM3 workflow: after Segment, candidate masks appear as thumbnails in the Properties pane — click to select (blue border + ✓); multiple masks can be selected; click Apply Selected (N) to apply them all; Mode (Add / Erase) controls how masks are merged into the current mask layer; a new mask layer is created automatically if the active layer is not a mask</li>
|
||||
<li id="wfm-help-imageedit-mask-8">ABR Brush Library (Mask Editor One required, Paint mode only): click Select in the MASK EDITOR ONE section to open the brush picker — browse folders on the left, click a thumbnail to apply; "Round Brush (default)" restores the circle brush; brushes are shared with Mask Editor One and stored in its brushes/ folder</li>
|
||||
<li id="wfm-help-imageedit-mask-9">Color sub-tool: click anywhere on the canvas to flood-select pixels similar in color to the clicked point — Properties pane: Mode (Add / Subtract), Tolerance (0–255, color similarity threshold), Feather % (0–100, soft edge falloff within tolerance range)</li>
|
||||
<li id="wfm-help-imageedit-mask-10">Alpha sub-tool: extract the transparency of the image layers as a mask — Properties pane: Threshold (pixels with alpha ≥ threshold become full mask; 0 = all alpha included), Invert (reverse the extracted result), Extract Alpha button applies the operation; works on a composite of all visible non-mask layers</li>
|
||||
<li id="wfm-help-imageedit-mask-11">Text sub-tool: click on the canvas to open a text stamp overlay; enter text, configure Font / Size / Bold / Italic / Align, choose Mode (Add = white stamp / Erase = cut mask), then click Stamp or press Ctrl+Enter; multi-line text supported (newline in textarea)</li>
|
||||
<li id="wfm-help-imageedit-mask-12">Vector sub-tool: click to place control points connected by a Catmull-Rom spline; click the first point again (or press Enter) to close and fill the polygon; Backspace removes the last point; Esc resets all points; Properties pane shows current point count and Mode (Add / Erase)</li>
|
||||
<li id="wfm-help-imageedit-mask-13">Shape sub-tool: drag to draw a rectangle or ellipse mask; hold Shift for a perfect square or circle; a blue dashed outline previews the shape while dragging; Properties pane: Mode (Add / Erase), Shape (Rect / Ellipse)</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="wfm-help-card">
|
||||
@@ -1457,6 +1470,7 @@
|
||||
<li id="wfm-help-trouble-5">LoRA Stack fails with "No such file or directory" error: The LoRA may not be recognized by comfyui-lora-manager (known issue). Try a different LoRA or check if the file appears in Lora Manager's own UI</li>
|
||||
<li id="wfm-help-trouble-6">Model loading error after moving or deleting models: ComfyUI caches file paths and may still reference old locations. Perform a Hard Reset from the ComfyUI menu (Queue → Hard Reset) or restart ComfyUI to clear the cache.</li>
|
||||
<li id="wfm-help-trouble-7"></li>
|
||||
<li id="wfm-help-trouble-8"></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1480,6 +1494,20 @@
|
||||
<div class="wfm-help-link-desc" id="wfm-help-kofi-desc">Buy me a coffee to support development</div>
|
||||
</div>
|
||||
</a>
|
||||
<a href="https://github.com/ketle-man/comfyui-image-feeder" target="_blank" rel="noopener noreferrer" class="wfm-help-link wfm-help-link-github">
|
||||
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor"><path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/></svg>
|
||||
<div>
|
||||
<div class="wfm-help-link-title">ComfyUI Image Feeder</div>
|
||||
<div class="wfm-help-link-desc">Complementary image input node — works with WFS Gallery Feeder mode</div>
|
||||
</div>
|
||||
</a>
|
||||
<a href="https://github.com/ketle-man/comfyui-mask-editor-one" target="_blank" rel="noopener noreferrer" class="wfm-help-link wfm-help-link-github">
|
||||
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor"><path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/></svg>
|
||||
<div>
|
||||
<div class="wfm-help-link-title">Mask Editor One</div>
|
||||
<div class="wfm-help-link-desc">Mask editor with ABR brushes, SAM3 segmentation, BiRefNet BG removal and more</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<p class="wfm-help-thanks" id="wfm-help-thanks">Thank you for using Workflow Studio!</p>
|
||||
</div>
|
||||
@@ -1520,6 +1548,7 @@
|
||||
<button id="wfm-gallery-refresh-btn" class="wfm-btn wfm-btn-sm">Refresh</button>
|
||||
<button id="wfm-gallery-send-image-edit-btn" class="wfm-btn wfm-btn-sm" title="Send selected image to Image Edit tab">Image Edit</button>
|
||||
<button id="wfm-gallery-send-genui-image-btn" class="wfm-btn wfm-btn-sm" title="Send selected image to GenerateUI Image input">Send GenUI Image</button>
|
||||
<button id="wfm-gallery-send-cc-btn" class="wfm-btn wfm-btn-sm" title="Send selected image to ComfyUI Comic Creator's selected panel" style="display:none;">Send CC</button>
|
||||
<button id="wfm-gallery-clear-filters-btn" class="wfm-btn wfm-btn-sm" title="Clear all filters"></button>
|
||||
</div>
|
||||
<!-- 複数選択時の一括操作バー -->
|
||||
@@ -1645,6 +1674,7 @@
|
||||
<button class="ie-tool-btn" data-tool="blur" title="Blur">≈</button>
|
||||
<button class="ie-tool-btn" data-tool="filter" title="Filter">★</button>
|
||||
<button class="ie-tool-btn" data-tool="bgremove" title="BG Remove">⬚</button>
|
||||
<button class="ie-tool-btn" data-tool="inpaint" title="Inpaint">🩹</button>
|
||||
</div>
|
||||
|
||||
<!-- Center -->
|
||||
@@ -1975,11 +2005,20 @@
|
||||
<div class="wfm-ai-chat-container">
|
||||
<div class="wfm-ai-chat-messages" id="wfm-ai-chat-messages"></div>
|
||||
<div class="wfm-ai-chat-input-area">
|
||||
<div id="wfm-ai-chat-attachment" class="wfm-ai-chat-attachment" style="display:none;">
|
||||
<img id="wfm-ai-chat-attachment-thumb" class="wfm-ai-chat-attachment-thumb">
|
||||
<span id="wfm-ai-chat-attachment-label">Image attached</span>
|
||||
<button id="wfm-ai-chat-attachment-clear" class="wfm-ai-chat-attachment-clear" title="Close">✕</button>
|
||||
</div>
|
||||
<textarea id="wfm-ai-chat-input" class="wfm-ai-chat-input" placeholder="Type a message... (Enter to send, Shift+Enter for newline)"></textarea>
|
||||
<div class="wfm-ai-chat-actions">
|
||||
<button id="wfm-ai-chat-send-btn" class="wfm-btn wfm-btn-primary">Send</button>
|
||||
<button id="wfm-ai-chat-clear-btn" class="wfm-btn">Clear</button>
|
||||
<span id="wfm-ai-chat-status" class="wfm-ai-trans-status"></span>
|
||||
<label class="wfm-ai-chat-toggle-label" for="wfm-ai-chat-imggen-toggle">
|
||||
<input type="checkbox" id="wfm-ai-chat-imggen-toggle" checked>
|
||||
<span id="wfm-ai-chat-imggen-label-text">Allow image generation</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1993,6 +2032,7 @@
|
||||
<img id="wfm-ai-vlm-preview" style="display:none;max-width:100%;max-height:100%;object-fit:contain;pointer-events:none;">
|
||||
<span id="wfm-ai-vlm-label" class="wfm-ai-vlm-label">Drop or click PNG / JPG / WebP</span>
|
||||
<input type="file" id="wfm-ai-vlm-file" accept="image/png,image/jpeg,image/webp" style="display:none;">
|
||||
<button id="wfm-ai-vlm-clear" class="wfm-ai-vlm-clear" style="display:none;" title="Close">✕</button>
|
||||
</div>
|
||||
<div class="wfm-ai-wc-inputs" id="wfm-ai-wc-inputs" style="display:none">
|
||||
<div class="wfm-ai-wc-row">
|
||||
@@ -2032,6 +2072,9 @@
|
||||
<label class="wfm-ai-radio-label">
|
||||
<input type="radio" name="wfm-ai-backend" value="lmstudio"> LM Studio
|
||||
</label>
|
||||
<label class="wfm-ai-radio-label">
|
||||
<input type="radio" name="wfm-ai-backend" value="lemonade"> Lemonade
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wfm-ai-settings-section">
|
||||
@@ -2065,6 +2108,34 @@
|
||||
<input type="text" id="wfm-ai-free-dst-lang" class="wfm-input" placeholder="e.g. German">
|
||||
</div>
|
||||
</div>
|
||||
<div class="wfm-ai-settings-section">
|
||||
<div class="wfm-ai-settings-title" id="wfm-ai-settings-chatgen-title">Chat Image Generation</div>
|
||||
<div class="wfm-ai-settings-row">
|
||||
<label class="wfm-ai-label" style="display:flex;align-items:center;gap:6px;cursor:pointer;">
|
||||
<input type="checkbox" id="wfm-ai-chatgen-dedicated-checkbox">
|
||||
<span id="wfm-ai-chatgen-dedicated-label">Use dedicated workflow</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="wfm-ai-settings-row" id="wfm-ai-chatgen-dedicated-row" style="display:none;">
|
||||
<select id="wfm-ai-chatgen-dedicated-select" class="wfm-select">
|
||||
<option value="">-- select workflow --</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wfm-ai-settings-section">
|
||||
<div class="wfm-ai-settings-title" id="wfm-ai-settings-chatgen-i2i-title">Chat I2I Generation</div>
|
||||
<div class="wfm-ai-settings-row">
|
||||
<label class="wfm-ai-label" style="display:flex;align-items:center;gap:6px;cursor:pointer;">
|
||||
<input type="checkbox" id="wfm-ai-chatgen-i2i-dedicated-checkbox">
|
||||
<span id="wfm-ai-chatgen-i2i-dedicated-label">Use dedicated workflow</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="wfm-ai-settings-row" id="wfm-ai-chatgen-i2i-dedicated-row" style="display:none;">
|
||||
<select id="wfm-ai-chatgen-i2i-dedicated-select" class="wfm-select">
|
||||
<option value="">-- select workflow --</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wfm-ai-settings-section">
|
||||
<button id="wfm-ai-settings-save-btn" class="wfm-btn wfm-btn-primary">Save</button>
|
||||
</div>
|
||||
|
||||
@@ -3003,6 +3003,14 @@ const renderInfoTab = (container) => {
|
||||
|
||||
const AI_SETTINGS_KEY = "wfm_ai_settings";
|
||||
const AI_LANG_NAMES = { ja: "Japanese", en: "English", zh: "Chinese" };
|
||||
const AI_BACKEND_DEFAULT_URLS = {
|
||||
ollama: "http://localhost:11434",
|
||||
lmstudio: "http://localhost:1234",
|
||||
lemonade: "http://localhost:13305",
|
||||
};
|
||||
function getAiBackendDefaultUrl(backend) {
|
||||
return AI_BACKEND_DEFAULT_URLS[backend] || AI_BACKEND_DEFAULT_URLS.ollama;
|
||||
}
|
||||
|
||||
function isValidAiUrl(url) {
|
||||
try {
|
||||
@@ -3184,6 +3192,7 @@ const renderAiTab = (container) => {
|
||||
<div class="wfm-nlp-ai-radio-row">
|
||||
<label class="wfm-nlp-ai-radio"><input type="radio" name="wfm-nlp-ai-backend" value="ollama"> Ollama</label>
|
||||
<label class="wfm-nlp-ai-radio"><input type="radio" name="wfm-nlp-ai-backend" value="lmstudio"> LM Studio</label>
|
||||
<label class="wfm-nlp-ai-radio"><input type="radio" name="wfm-nlp-ai-backend" value="lemonade"> Lemonade</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wfm-nlp-ai-sec">
|
||||
@@ -3244,6 +3253,13 @@ const setupAiHandlers = (container) => {
|
||||
if (urlInput && cfg.backendUrl) urlInput.value = cfg.backendUrl;
|
||||
else if (urlInput) urlInput.value = "http://localhost:11434";
|
||||
|
||||
// Backend change → switch URL to the new backend's default
|
||||
backendRadios.forEach(r => {
|
||||
r.addEventListener("change", () => {
|
||||
if (urlInput) urlInput.value = getAiBackendDefaultUrl(r.value);
|
||||
});
|
||||
});
|
||||
|
||||
const freeSrcInput = container.querySelector("#wfm-nlp-ai-free-src");
|
||||
const freeDstInput = container.querySelector("#wfm-nlp-ai-free-dst");
|
||||
if (freeSrcInput && cfg.freeSrcLang) freeSrcInput.value = cfg.freeSrcLang;
|
||||
@@ -3273,7 +3289,7 @@ const setupAiHandlers = (container) => {
|
||||
|
||||
const c = loadAiCfg();
|
||||
const backend = c.backend || "ollama";
|
||||
const url = c.backendUrl || (backend === "ollama" ? "http://localhost:11434" : "http://localhost:1234");
|
||||
const url = c.backendUrl || getAiBackendDefaultUrl(backend);
|
||||
const model = c.model;
|
||||
if (!isValidAiUrl(url)) { showToast("URLは http:// または https:// で始まる必要があります", "error"); return; }
|
||||
if (!model) { showToast("Please select a model in Settings", "error"); return; }
|
||||
@@ -3403,7 +3419,7 @@ const setupAiHandlers = (container) => {
|
||||
if (!text) return;
|
||||
const c = loadAiCfg();
|
||||
const backend = c.backend || "ollama";
|
||||
const url = c.backendUrl || (backend === "ollama" ? "http://localhost:11434" : "http://localhost:1234");
|
||||
const url = c.backendUrl || getAiBackendDefaultUrl(backend);
|
||||
const model = c.model;
|
||||
if (!isValidAiUrl(url)) { showToast("URLは http:// または https:// で始まる必要があります", "error"); return; }
|
||||
if (!model) { showToast("Please select a model in Settings", "error"); return; }
|
||||
@@ -3497,7 +3513,7 @@ const setupAiHandlers = (container) => {
|
||||
const task = vlmTaskSel?.value || "describe";
|
||||
const c = loadAiCfg();
|
||||
const backend = c.backend || "ollama";
|
||||
const url = c.backendUrl || (backend === "ollama" ? "http://localhost:11434" : "http://localhost:1234");
|
||||
const url = c.backendUrl || getAiBackendDefaultUrl(backend);
|
||||
const model = c.model;
|
||||
if (!isValidAiUrl(url)) { showToast("URLは http:// または https:// で始まる必要があります", "error"); return; }
|
||||
if (!model) { showToast("Please select a model in Settings", "error"); return; }
|
||||
|
||||
@@ -611,27 +611,55 @@ app.registerExtension({
|
||||
{ tooltip: NODE_SETS_TOOLTIP, className: "wfm-node-sets-btn", getIcon: getNodeSetsIcon, styles: null },
|
||||
];
|
||||
|
||||
const replaceButtonIcons = () => {
|
||||
const applyIconToButton = (btn, cfg) => {
|
||||
// Skip if the SVG icon is already in place
|
||||
if (btn.querySelector("svg")) return;
|
||||
btn.classList.add(cfg.className);
|
||||
btn.innerHTML = cfg.getIcon();
|
||||
btn.style.borderRadius = "4px";
|
||||
btn.style.padding = "6px";
|
||||
if (cfg.styles) Object.assign(btn.style, cfg.styles);
|
||||
const svg = btn.querySelector("svg");
|
||||
if (svg) {
|
||||
svg.style.width = "20px";
|
||||
svg.style.height = "20px";
|
||||
}
|
||||
};
|
||||
|
||||
// Initial application — retry until buttons are rendered by Vue
|
||||
const pollUntilFound = () => {
|
||||
let foundAny = false;
|
||||
for (const cfg of buttonConfigs) {
|
||||
document.querySelectorAll(`button[aria-label="${cfg.tooltip}"]`).forEach((btn) => {
|
||||
foundAny = true;
|
||||
btn.classList.add(cfg.className);
|
||||
btn.innerHTML = cfg.getIcon();
|
||||
btn.style.borderRadius = "4px";
|
||||
btn.style.padding = "6px";
|
||||
if (cfg.styles) Object.assign(btn.style, cfg.styles);
|
||||
const svg = btn.querySelector("svg");
|
||||
if (svg) {
|
||||
svg.style.width = "20px";
|
||||
svg.style.height = "20px";
|
||||
}
|
||||
applyIconToButton(btn, cfg);
|
||||
});
|
||||
}
|
||||
if (!foundAny) {
|
||||
requestAnimationFrame(replaceButtonIcons);
|
||||
requestAnimationFrame(pollUntilFound);
|
||||
}
|
||||
};
|
||||
requestAnimationFrame(replaceButtonIcons);
|
||||
requestAnimationFrame(pollUntilFound);
|
||||
|
||||
// MutationObserver: re-apply icons after Vue re-renders the action bar
|
||||
// (e.g. when the Properties Panel is toggled inside a subgraph)
|
||||
if (typeof MutationObserver !== "undefined") {
|
||||
const observer = new MutationObserver(() => {
|
||||
for (const cfg of buttonConfigs) {
|
||||
document.querySelectorAll(`button[aria-label="${cfg.tooltip}"]`).forEach((btn) => {
|
||||
// Only re-apply when Vue has reset innerHTML back to <i>
|
||||
if (btn.querySelector("i")) {
|
||||
applyIconToButton(btn, cfg);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
const watchNode =
|
||||
document.querySelector("[data-testid='action-bar-buttons']") ||
|
||||
document.querySelector(".actionbar-container") ||
|
||||
document.body;
|
||||
observer.observe(watchNode, { childList: true, subtree: true });
|
||||
window.__wfmIconObserver = observer;
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
@@ -0,0 +1,665 @@
|
||||
{
|
||||
"id": "6d392e45-b20b-4dee-a422-0b4a18e645cd",
|
||||
"revision": 0,
|
||||
"last_node_id": 35,
|
||||
"last_link_id": 102,
|
||||
"nodes": [
|
||||
{
|
||||
"id": 8,
|
||||
"type": "VAEDecode",
|
||||
"pos": [
|
||||
1351.4570000000006,
|
||||
197.9979999999999
|
||||
],
|
||||
"size": [
|
||||
210,
|
||||
46
|
||||
],
|
||||
"flags": {},
|
||||
"order": 6,
|
||||
"mode": 0,
|
||||
"inputs": [
|
||||
{
|
||||
"localized_name": "samples",
|
||||
"name": "samples",
|
||||
"type": "LATENT",
|
||||
"link": 42
|
||||
},
|
||||
{
|
||||
"localized_name": "vae",
|
||||
"name": "vae",
|
||||
"type": "VAE",
|
||||
"link": 84
|
||||
}
|
||||
],
|
||||
"outputs": [
|
||||
{
|
||||
"localized_name": "IMAGE",
|
||||
"name": "IMAGE",
|
||||
"type": "IMAGE",
|
||||
"slot_index": 0,
|
||||
"links": [
|
||||
22
|
||||
]
|
||||
}
|
||||
],
|
||||
"properties": {
|
||||
"Node name for S&R": "VAEDecode",
|
||||
"cnr_id": "comfy-core",
|
||||
"ver": "0.3.18",
|
||||
"ue_properties": {
|
||||
"widget_ue_connectable": {},
|
||||
"version": "7.8",
|
||||
"input_ue_unconnectable": {}
|
||||
}
|
||||
},
|
||||
"widgets_values": []
|
||||
},
|
||||
{
|
||||
"id": 29,
|
||||
"type": "CheckpointLoaderSimple",
|
||||
"pos": [
|
||||
-35,
|
||||
161
|
||||
],
|
||||
"size": [
|
||||
315,
|
||||
98
|
||||
],
|
||||
"flags": {},
|
||||
"order": 0,
|
||||
"mode": 0,
|
||||
"inputs": [
|
||||
{
|
||||
"localized_name": "ckpt_name",
|
||||
"name": "ckpt_name",
|
||||
"type": "COMBO",
|
||||
"widget": {
|
||||
"name": "ckpt_name"
|
||||
},
|
||||
"link": null
|
||||
}
|
||||
],
|
||||
"outputs": [
|
||||
{
|
||||
"localized_name": "MODEL",
|
||||
"name": "MODEL",
|
||||
"type": "MODEL",
|
||||
"slot_index": 0,
|
||||
"links": [
|
||||
80
|
||||
]
|
||||
},
|
||||
{
|
||||
"localized_name": "CLIP",
|
||||
"name": "CLIP",
|
||||
"type": "CLIP",
|
||||
"slot_index": 1,
|
||||
"links": [
|
||||
81,
|
||||
82
|
||||
]
|
||||
},
|
||||
{
|
||||
"localized_name": "VAE",
|
||||
"name": "VAE",
|
||||
"type": "VAE",
|
||||
"slot_index": 2,
|
||||
"links": [
|
||||
84,
|
||||
90
|
||||
]
|
||||
}
|
||||
],
|
||||
"properties": {
|
||||
"Node name for S&R": "CheckpointLoaderSimple",
|
||||
"cnr_id": "comfy-core",
|
||||
"ver": "0.3.18",
|
||||
"ue_properties": {
|
||||
"widget_ue_connectable": {},
|
||||
"version": "7.8",
|
||||
"input_ue_unconnectable": {}
|
||||
}
|
||||
},
|
||||
"widgets_values": [
|
||||
"anime\\merge\\hayochamixIDXL_v11+_blueberryPlus_v10-amanatsuIllustrious_v11_x0.1_trainDifference.safetensors"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": 7,
|
||||
"type": "CLIPTextEncode",
|
||||
"pos": [
|
||||
330,
|
||||
369
|
||||
],
|
||||
"size": [
|
||||
412.2799987792969,
|
||||
88
|
||||
],
|
||||
"flags": {},
|
||||
"order": 3,
|
||||
"mode": 0,
|
||||
"inputs": [
|
||||
{
|
||||
"localized_name": "clip",
|
||||
"name": "clip",
|
||||
"type": "CLIP",
|
||||
"link": 82
|
||||
},
|
||||
{
|
||||
"localized_name": "text",
|
||||
"name": "text",
|
||||
"type": "STRING",
|
||||
"widget": {
|
||||
"name": "text"
|
||||
},
|
||||
"link": null
|
||||
}
|
||||
],
|
||||
"outputs": [
|
||||
{
|
||||
"localized_name": "CONDITIONING",
|
||||
"name": "CONDITIONING",
|
||||
"type": "CONDITIONING",
|
||||
"slot_index": 0,
|
||||
"links": [
|
||||
6
|
||||
]
|
||||
}
|
||||
],
|
||||
"properties": {
|
||||
"Node name for S&R": "CLIPTextEncode",
|
||||
"cnr_id": "comfy-core",
|
||||
"ver": "0.3.18",
|
||||
"ue_properties": {
|
||||
"widget_ue_connectable": {},
|
||||
"version": "7.8",
|
||||
"input_ue_unconnectable": {}
|
||||
}
|
||||
},
|
||||
"widgets_values": [
|
||||
"w\n"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": 32,
|
||||
"type": "LoadImage",
|
||||
"pos": [
|
||||
-20.402179424849777,
|
||||
348.01722821269084
|
||||
],
|
||||
"size": [
|
||||
282.798828125,
|
||||
314
|
||||
],
|
||||
"flags": {},
|
||||
"order": 1,
|
||||
"mode": 0,
|
||||
"inputs": [
|
||||
{
|
||||
"localized_name": "image",
|
||||
"name": "image",
|
||||
"type": "COMBO",
|
||||
"widget": {
|
||||
"name": "image"
|
||||
},
|
||||
"link": null
|
||||
},
|
||||
{
|
||||
"localized_name": "choose file to upload",
|
||||
"name": "upload",
|
||||
"type": "IMAGEUPLOAD",
|
||||
"widget": {
|
||||
"name": "upload"
|
||||
},
|
||||
"link": null
|
||||
}
|
||||
],
|
||||
"outputs": [
|
||||
{
|
||||
"localized_name": "IMAGE",
|
||||
"name": "IMAGE",
|
||||
"type": "IMAGE",
|
||||
"links": [
|
||||
101
|
||||
]
|
||||
},
|
||||
{
|
||||
"localized_name": "MASK",
|
||||
"name": "MASK",
|
||||
"type": "MASK",
|
||||
"links": [
|
||||
102
|
||||
]
|
||||
}
|
||||
],
|
||||
"properties": {
|
||||
"Node name for S&R": "LoadImage",
|
||||
"ue_properties": {
|
||||
"widget_ue_connectable": {},
|
||||
"input_ue_unconnectable": {},
|
||||
"version": "7.8"
|
||||
},
|
||||
"image": "clipspace/clipspace-painted-masked-1784801792090.png [input]"
|
||||
},
|
||||
"widgets_values": [
|
||||
"clipspace/clipspace-painted-masked-1784801792090.png [input]",
|
||||
"image"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": 3,
|
||||
"type": "KSampler",
|
||||
"pos": [
|
||||
997,
|
||||
174
|
||||
],
|
||||
"size": [
|
||||
315,
|
||||
474
|
||||
],
|
||||
"flags": {},
|
||||
"order": 5,
|
||||
"mode": 0,
|
||||
"inputs": [
|
||||
{
|
||||
"localized_name": "model",
|
||||
"name": "model",
|
||||
"type": "MODEL",
|
||||
"link": 80
|
||||
},
|
||||
{
|
||||
"localized_name": "positive",
|
||||
"name": "positive",
|
||||
"type": "CONDITIONING",
|
||||
"link": 4
|
||||
},
|
||||
{
|
||||
"localized_name": "negative",
|
||||
"name": "negative",
|
||||
"type": "CONDITIONING",
|
||||
"link": 6
|
||||
},
|
||||
{
|
||||
"localized_name": "latent_image",
|
||||
"name": "latent_image",
|
||||
"type": "LATENT",
|
||||
"link": 72
|
||||
},
|
||||
{
|
||||
"localized_name": "seed",
|
||||
"name": "seed",
|
||||
"type": "INT",
|
||||
"widget": {
|
||||
"name": "seed"
|
||||
},
|
||||
"link": null
|
||||
},
|
||||
{
|
||||
"localized_name": "steps",
|
||||
"name": "steps",
|
||||
"type": "INT",
|
||||
"widget": {
|
||||
"name": "steps"
|
||||
},
|
||||
"link": null
|
||||
},
|
||||
{
|
||||
"localized_name": "cfg",
|
||||
"name": "cfg",
|
||||
"type": "FLOAT",
|
||||
"widget": {
|
||||
"name": "cfg"
|
||||
},
|
||||
"link": null
|
||||
},
|
||||
{
|
||||
"localized_name": "sampler_name",
|
||||
"name": "sampler_name",
|
||||
"type": "COMBO",
|
||||
"widget": {
|
||||
"name": "sampler_name"
|
||||
},
|
||||
"link": null
|
||||
},
|
||||
{
|
||||
"localized_name": "scheduler",
|
||||
"name": "scheduler",
|
||||
"type": "COMBO",
|
||||
"widget": {
|
||||
"name": "scheduler"
|
||||
},
|
||||
"link": null
|
||||
},
|
||||
{
|
||||
"localized_name": "denoise",
|
||||
"name": "denoise",
|
||||
"type": "FLOAT",
|
||||
"widget": {
|
||||
"name": "denoise"
|
||||
},
|
||||
"link": null
|
||||
}
|
||||
],
|
||||
"outputs": [
|
||||
{
|
||||
"localized_name": "LATENT",
|
||||
"name": "LATENT",
|
||||
"type": "LATENT",
|
||||
"slot_index": 0,
|
||||
"links": [
|
||||
42
|
||||
]
|
||||
}
|
||||
],
|
||||
"properties": {
|
||||
"Node name for S&R": "KSampler",
|
||||
"cnr_id": "comfy-core",
|
||||
"ver": "0.3.18",
|
||||
"ue_properties": {
|
||||
"widget_ue_connectable": {},
|
||||
"version": "7.8",
|
||||
"input_ue_unconnectable": {}
|
||||
}
|
||||
},
|
||||
"widgets_values": [
|
||||
1008854893628621,
|
||||
"randomize",
|
||||
30,
|
||||
4,
|
||||
"ddim",
|
||||
"simple",
|
||||
1
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": 26,
|
||||
"type": "VAEEncodeForInpaint",
|
||||
"pos": [
|
||||
759,
|
||||
169
|
||||
],
|
||||
"size": [
|
||||
226.8000030517578,
|
||||
98
|
||||
],
|
||||
"flags": {},
|
||||
"order": 4,
|
||||
"mode": 0,
|
||||
"inputs": [
|
||||
{
|
||||
"localized_name": "pixels",
|
||||
"name": "pixels",
|
||||
"type": "IMAGE",
|
||||
"link": 101
|
||||
},
|
||||
{
|
||||
"localized_name": "vae",
|
||||
"name": "vae",
|
||||
"type": "VAE",
|
||||
"link": 90
|
||||
},
|
||||
{
|
||||
"localized_name": "mask",
|
||||
"name": "mask",
|
||||
"type": "MASK",
|
||||
"link": 102
|
||||
},
|
||||
{
|
||||
"localized_name": "grow_mask_by",
|
||||
"name": "grow_mask_by",
|
||||
"type": "INT",
|
||||
"widget": {
|
||||
"name": "grow_mask_by"
|
||||
},
|
||||
"link": null
|
||||
}
|
||||
],
|
||||
"outputs": [
|
||||
{
|
||||
"localized_name": "LATENT",
|
||||
"name": "LATENT",
|
||||
"type": "LATENT",
|
||||
"slot_index": 0,
|
||||
"links": [
|
||||
72
|
||||
]
|
||||
}
|
||||
],
|
||||
"properties": {
|
||||
"Node name for S&R": "VAEEncodeForInpaint",
|
||||
"cnr_id": "comfy-core",
|
||||
"ver": "0.3.18",
|
||||
"ue_properties": {
|
||||
"widget_ue_connectable": {},
|
||||
"version": "7.8",
|
||||
"input_ue_unconnectable": {}
|
||||
}
|
||||
},
|
||||
"widgets_values": [
|
||||
6
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": 9,
|
||||
"type": "SaveImage",
|
||||
"pos": [
|
||||
1362.0710000000008,
|
||||
369.32099999999986
|
||||
],
|
||||
"size": [
|
||||
210,
|
||||
270
|
||||
],
|
||||
"flags": {},
|
||||
"order": 7,
|
||||
"mode": 0,
|
||||
"inputs": [
|
||||
{
|
||||
"localized_name": "images",
|
||||
"name": "images",
|
||||
"type": "IMAGE",
|
||||
"link": 22
|
||||
},
|
||||
{
|
||||
"localized_name": "filename_prefix",
|
||||
"name": "filename_prefix",
|
||||
"type": "STRING",
|
||||
"widget": {
|
||||
"name": "filename_prefix"
|
||||
},
|
||||
"link": null
|
||||
}
|
||||
],
|
||||
"outputs": [
|
||||
{
|
||||
"localized_name": "images",
|
||||
"name": "images",
|
||||
"type": "IMAGE",
|
||||
"links": null
|
||||
}
|
||||
],
|
||||
"properties": {
|
||||
"Node name for S&R": "SaveImage",
|
||||
"cnr_id": "comfy-core",
|
||||
"ver": "0.3.18",
|
||||
"ue_properties": {
|
||||
"widget_ue_connectable": {},
|
||||
"version": "7.8",
|
||||
"input_ue_unconnectable": {}
|
||||
}
|
||||
},
|
||||
"widgets_values": [
|
||||
"ComfyUI"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": 6,
|
||||
"type": "CLIPTextEncode",
|
||||
"pos": [
|
||||
326.97,
|
||||
160
|
||||
],
|
||||
"size": [
|
||||
422.8500061035156,
|
||||
164.30999755859375
|
||||
],
|
||||
"flags": {},
|
||||
"order": 2,
|
||||
"mode": 0,
|
||||
"inputs": [
|
||||
{
|
||||
"localized_name": "clip",
|
||||
"name": "clip",
|
||||
"type": "CLIP",
|
||||
"link": 81
|
||||
},
|
||||
{
|
||||
"localized_name": "text",
|
||||
"name": "text",
|
||||
"type": "STRING",
|
||||
"widget": {
|
||||
"name": "text"
|
||||
},
|
||||
"link": null
|
||||
}
|
||||
],
|
||||
"outputs": [
|
||||
{
|
||||
"localized_name": "CONDITIONING",
|
||||
"name": "CONDITIONING",
|
||||
"type": "CONDITIONING",
|
||||
"slot_index": 0,
|
||||
"links": [
|
||||
4
|
||||
]
|
||||
}
|
||||
],
|
||||
"properties": {
|
||||
"Node name for S&R": "CLIPTextEncode",
|
||||
"cnr_id": "comfy-core",
|
||||
"ver": "0.3.18",
|
||||
"ue_properties": {
|
||||
"widget_ue_connectable": {},
|
||||
"version": "7.8",
|
||||
"input_ue_unconnectable": {}
|
||||
}
|
||||
},
|
||||
"widgets_values": [
|
||||
"smile"
|
||||
]
|
||||
}
|
||||
],
|
||||
"links": [
|
||||
[
|
||||
4,
|
||||
6,
|
||||
0,
|
||||
3,
|
||||
1,
|
||||
"CONDITIONING"
|
||||
],
|
||||
[
|
||||
6,
|
||||
7,
|
||||
0,
|
||||
3,
|
||||
2,
|
||||
"CONDITIONING"
|
||||
],
|
||||
[
|
||||
22,
|
||||
8,
|
||||
0,
|
||||
9,
|
||||
0,
|
||||
"IMAGE"
|
||||
],
|
||||
[
|
||||
42,
|
||||
3,
|
||||
0,
|
||||
8,
|
||||
0,
|
||||
"LATENT"
|
||||
],
|
||||
[
|
||||
72,
|
||||
26,
|
||||
0,
|
||||
3,
|
||||
3,
|
||||
"LATENT"
|
||||
],
|
||||
[
|
||||
80,
|
||||
29,
|
||||
0,
|
||||
3,
|
||||
0,
|
||||
"MODEL"
|
||||
],
|
||||
[
|
||||
81,
|
||||
29,
|
||||
1,
|
||||
6,
|
||||
0,
|
||||
"CLIP"
|
||||
],
|
||||
[
|
||||
82,
|
||||
29,
|
||||
1,
|
||||
7,
|
||||
0,
|
||||
"CLIP"
|
||||
],
|
||||
[
|
||||
84,
|
||||
29,
|
||||
2,
|
||||
8,
|
||||
1,
|
||||
"VAE"
|
||||
],
|
||||
[
|
||||
90,
|
||||
29,
|
||||
2,
|
||||
26,
|
||||
1,
|
||||
"VAE"
|
||||
],
|
||||
[
|
||||
101,
|
||||
32,
|
||||
0,
|
||||
26,
|
||||
0,
|
||||
"IMAGE"
|
||||
],
|
||||
[
|
||||
102,
|
||||
32,
|
||||
1,
|
||||
26,
|
||||
2,
|
||||
"MASK"
|
||||
]
|
||||
],
|
||||
"groups": [],
|
||||
"config": {},
|
||||
"extra": {
|
||||
"ds": {
|
||||
"scale": 0.9229599817706418,
|
||||
"offset": [
|
||||
365.6203139679832,
|
||||
118.10373545614928
|
||||
]
|
||||
},
|
||||
"ue_links": [],
|
||||
"links_added_by_ue": []
|
||||
},
|
||||
"version": 0.4
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 134 KiB |
File diff suppressed because one or more lines are too long
Binary file not shown.
|
After Width: | Height: | Size: 250 KiB |
Reference in New Issue
Block a user