added shortcuts to move it to previous/next frame on mask editor.
This commit is contained in:
+3
-3
@@ -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)
|
||||
|
||||
+24
-18
@@ -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();
|
||||
|
||||
|
||||
+23
-18
@@ -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
|
||||
|
||||
Reference in New Issue
Block a user