diff --git a/AnimateDiffInpaint.py b/SequentialImageLoader.py similarity index 100% rename from AnimateDiffInpaint.py rename to SequentialImageLoader.py diff --git a/__init__.py b/__init__.py index b7a0bc3..4f47eff 100644 --- a/__init__.py +++ b/__init__.py @@ -1,16 +1,16 @@ import os, shutil import folder_paths -from .AnimateDiffInpaint import LoadImagesFromDirInpaint +from .SequentialImageLoader import LoadImagesFromDirInpaint NODE_CLASS_MAPPINGS = { "VFrame Loader With Mask Editor" : LoadImagesFromDirInpaint } -NODE_DISPLAY_NAME_MAPPINGS = { "VFrame Loader With Mask Editor" : "AnimateDiffInpaint" } +NODE_DISPLAY_NAME_MAPPINGS = { "VFrame Loader With Mask Editor" : "SequentialImageLoader" } __all__ = ['NODE_CLASS_MAPPINGS', 'NODE_DISPLAY_NAME_MAPPINGS'] module_js_directory = os.path.join(os.path.dirname(os.path.realpath(__file__)), "js") application_root_directory = os.path.dirname(folder_paths.__file__) -application_web_extensions_directory = os.path.join(application_root_directory, "web", "extensions", "AnimateDiffInpaint") +application_web_extensions_directory = os.path.join(application_root_directory, "web", "extensions", "SequentialImageLoader") if os.path.exists(application_web_extensions_directory): shutil.rmtree(application_web_extensions_directory) diff --git a/js/MaskEditorForVframes.js b/js/MaskEditorForVframes.js index f1ab133..04f1004 100644 --- a/js/MaskEditorForVframes.js +++ b/js/MaskEditorForVframes.js @@ -260,24 +260,8 @@ class MaskEditorDialog extends ComfyDialog { this.maskCanvas.getContext('2d').drawImage(prevBack, 0, 0, prevBack.width, prevBack.height); } }); - var prevButton = this.createLeftButton("Prev", - () => { - if (this.#selectedIndex > 0) { - this.storeActiveToBack(); - const params = new URLSearchParams(this.#paths[--this.#selectedIndex]); - this.image.src = new URL(api.apiURL("/view?" + params.toString()), window.location.href); - this.updateFrameNumberText(); - } - }); - var nextButton = this.createLeftButton("Next", - () => { - if (this.#selectedIndex < this.#paths.length - 1) { - this.storeActiveToBack(); - const params = new URLSearchParams(this.#paths[++this.#selectedIndex]); - this.image.src = new URL(api.apiURL("/view?" + params.toString()), window.location.href); - this.updateFrameNumberText(); - } - }); + var prevButton = this.createLeftButton("Prev", () => this.moveToPrev()); + var nextButton = this.createLeftButton("Next", () => this.moveToNext()); var cancelButton = this.createRightButton("Cancel", () => { document.removeEventListener("mouseup", MaskEditorDialog.handleMouseUp); document.removeEventListener("keydown", MaskEditorDialog.handleKeyDown); @@ -549,6 +533,10 @@ class MaskEditorDialog extends ComfyDialog { self.brush_size = Math.max(self.brush_size-2, 1); } else if(event.key === 'Enter') { self.save(); + } else if (event.key == 'ArrowLeft') { + self.moveToPrev(); + } else if (event.key == 'ArrowRight') { + self.moveToNext(); } self.updateBrushPreview(self); @@ -764,6 +752,24 @@ class MaskEditorDialog extends ComfyDialog { this.frameNumberText.innerText = `${String(this.#selectedIndex + 1)} / ${String(this.#paths.length)}`; } + moveToPrev() { + if (this.#selectedIndex > 0) { + this.storeActiveToBack(); + const params = new URLSearchParams(this.#paths[--this.#selectedIndex]); + this.image.src = new URL(api.apiURL("/view?" + params.toString()), window.location.href); + this.updateFrameNumberText(); + } + } + + moveToNext() { + if (this.#selectedIndex < this.#paths.length - 1) { + this.storeActiveToBack(); + const params = new URLSearchParams(this.#paths[++this.#selectedIndex]); + this.image.src = new URL(api.apiURL("/view?" + params.toString()), window.location.href); + this.updateFrameNumberText(); + } + } + async save() { this.storeActiveToBack(); diff --git a/js/main.js b/js/main.js index c78dec0..15cf9fc 100644 --- a/js/main.js +++ b/js/main.js @@ -4,9 +4,11 @@ import { ComfyApp } from "../../../scripts/app.js"; import { api } from "../../../scripts/api.js"; import MaskEditorForVframes from "./MaskEditorForVframes.js"; +let sequentialimageloader_getExtraMenuOptionsOverrided = false; + app.registerExtension({ - name: "ComfyUI.animatediff.inpaint", + name: "ComfyUI.sequentialimageloader.inpaint", async init(app) { @@ -38,25 +40,28 @@ app.registerExtension({ { if (nodeData.name !== "VFrame Loader With Mask Editor") return; - - // menu initializing - const originalProto = nodeType.prototype.getExtraMenuOptions; - nodeType.prototype.getExtraMenuOptions = function (_, options){ - // do original processing - originalProto.bind(this)(_, options); - // add mask menu - if (this.extVframes) { - options.push({ - content: "Open in MaskEditor", - callback: (obj) => { - // ComfyApp.copyToClipspace(this); - // ComfyApp.clipspace_return_node = this; - - ComfyApp.ext_open_maskeditor_for_vframes(this.widgets[0]); - } - }); + if (!sequentialimageloader_getExtraMenuOptionsOverrided) { + // menu initializing + const originalProto = nodeType.prototype.getExtraMenuOptions; + nodeType.prototype.getExtraMenuOptions = function (_, options){ + // do original processing + originalProto.bind(this)(_, options); + + // add mask menu + if (this.extVframes) { + options.push({ + content: "Open in MaskEditor", + callback: (obj) => { + // ComfyApp.copyToClipspace(this); + // ComfyApp.clipspace_return_node = this; + + ComfyApp.ext_open_maskeditor_for_vframes(this.widgets[0]); + } + }); + } } + sequentialimageloader_getExtraMenuOptionsOverrided = true; } // head image drawing