wangbo/ComfyUI
1
0
Fork 0
mirror of https://github.com/comfyanonymous/ComfyUI.git synced 2026-02-09 21:12:36 +08:00
Code Issues Actions 12 Packages Projects Releases Wiki Activity

make default img_paste_mode to 'selected'

Browse Source 
refactor space -> tab
This commit is contained in:
Dr.Lt.Data 2023-05-01 08:39:05 +09:00
parent 5ea39fed9c
commit 06d8ffb71e
2 changed files with 98 additions and 98 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

126
web/extensions/core/clipspace.js
View File

@ -19,42 +19,39 @@ export class ClipspaceDialog extends ComfyDialog {
} }
static invalidatePreview() { static invalidatePreview() {
if(ComfyApp.clipspace && ComfyApp.clipspace.imgs && ComfyApp.clipspace.imgs.length > 0) { if(ComfyApp.clipspace && ComfyApp.clipspace.imgs && ComfyApp.clipspace.imgs.length > 0) {
const img_preview = document.getElementById("clipspace_preview"); const img_preview = document.getElementById("clipspace_preview");
if(img_preview) { if(img_preview) {
img_preview.src = ComfyApp.clipspace.imgs[ComfyApp.clipspace['selectedIndex']].src; img_preview.src = ComfyApp.clipspace.imgs[ComfyApp.clipspace['selectedIndex']].src;
img_preview.style.maxHeight = "100%"; img_preview.style.maxHeight = "100%";
img_preview.style.maxWidth = "100%"; img_preview.style.maxWidth = "100%";
} }
} }
} }
static invalidate() { static invalidate() {
if(ClipspaceDialog.instance) { if(ClipspaceDialog.instance) {
const self = ClipspaceDialog.instance; const self = ClipspaceDialog.instance;
// allow reconstruct controls when copying from non-image to image content. // allow reconstruct controls when copying from non-image to image content.
const children = $el("div.comfy-modal-content",[ const children = $el("div.comfy-modal-content", [ self.createImgSettings(), ...self.createButtons() ]);
self.createImgSettings(),
...self.createButtons()
]);
if(self.element) { if(self.element) {
// update // update
self.element.removeChild(self.element.firstChild); self.element.removeChild(self.element.firstChild);
self.element.appendChild(children); self.element.appendChild(children);
} }
else { else {
// new // new
self.element = $el("div.comfy-modal", { parent: document.body }, [children,]); self.element = $el("div.comfy-modal", { parent: document.body }, [children,]);
} }
if(self.element.children[0].children.length <= 1) { if(self.element.children[0].children.length <= 1) {
self.element.children[0].appendChild($el("p", {}, ["Unable to find the features to edit content of a format stored in the current Clipspace."])); self.element.children[0].appendChild($el("p", {}, ["Unable to find the features to edit content of a format stored in the current Clipspace."]));
} }
ClipspaceDialog.invalidatePreview(); ClipspaceDialog.invalidatePreview();
} }
} }
constructor() { constructor() {
super(); super();
@ -66,7 +63,7 @@ export class ClipspaceDialog extends ComfyDialog {
for(let idx in ClipspaceDialog.items) { for(let idx in ClipspaceDialog.items) {
const item = ClipspaceDialog.items[idx]; const item = ClipspaceDialog.items[idx];
if(!item.contextPredicate || item.contextPredicate()) if(!item.contextPredicate || item.contextPredicate())
buttons.push(ClipspaceDialog.items[idx]); buttons.push(ClipspaceDialog.items[idx]);
} }
buttons.push( buttons.push(
@ -82,7 +79,7 @@ export class ClipspaceDialog extends ComfyDialog {
createImgSettings() { createImgSettings() {
if(ComfyApp.clipspace.imgs) { if(ComfyApp.clipspace.imgs) {
const combo_items = []; const combo_items = [];
const imgs = ComfyApp.clipspace.imgs; const imgs = ComfyApp.clipspace.imgs;
for(let i=0; i < imgs.length; i++) { for(let i=0; i < imgs.length; i++) {
@ -95,36 +92,39 @@ export class ClipspaceDialog extends ComfyDialog {
ClipspaceDialog.invalidatePreview(); ClipspaceDialog.invalidatePreview();
} }, combo_items); } }, combo_items);
const row1 = const row1 =
$el("tr", {},[ $el("tr", {},
$el("td", {}, [$el("font", {color:"white"}, ["Select Image"])]), [
$el("td", {}, [combo1]) $el("td", {}, [$el("font", {color:"white"}, ["Select Image"])]),
]); $el("td", {}, [combo1])
]);
const combo2 = $el("select", const combo2 = $el("select",
{id:"clipspace_img_paste_mode", onchange:(event) => { {id:"clipspace_img_paste_mode", onchange:(event) => {
ComfyApp.clipspace['img_paste_mode'] = event.target.value; ComfyApp.clipspace['img_paste_mode'] = event.target.value;
} }, } },
[ [
$el("option", {value:'all'}, 'all'), $el("option", {value:'selected'}, 'selected'),
$el("option", {value:'selected'}, 'selected') $el("option", {value:'all'}, 'all')
]); ]);
combo2.value = ComfyApp.clipspace['img_paste_mode'];
const row2 = const row2 =
$el("tr", {},[ $el("tr", {},
$el("td", {}, [$el("font", {color:"white"}, ["Paste Mode"])]), [
$el("td", {}, [combo2]) $el("td", {}, [$el("font", {color:"white"}, ["Paste Mode"])]),
]); $el("td", {}, [combo2])
]);
const td = $el("td", {align:'center', width:'100px', height:'100px', colSpan:'2'}, const td = $el("td", {align:'center', width:'100px', height:'100px', colSpan:'2'},
[ $el("img",{id:"clipspace_preview"},[]) ] [ $el("img",{id:"clipspace_preview"},[]) ]
); );
const row3 = const row3 =
$el("tr", {}, [td]); $el("tr", {}, [td]);
return $el("table", {}, [row1, row2, row3]); return $el("table", {}, [row1, row2, row3]);
} }
else { else {
return []; return [];
@ -153,15 +153,15 @@ app.registerExtension({
app.openClipspace = app.openClipspace =
function () { function () {
if(!ClipspaceDialog.instance) { if(!ClipspaceDialog.instance) {
ClipspaceDialog.instance = new ClipspaceDialog(app); ClipspaceDialog.instance = new ClipspaceDialog(app);
ComfyApp.clipspace_invalidate_handler = ClipspaceDialog.invalidate; ComfyApp.clipspace_invalidate_handler = ClipspaceDialog.invalidate;
} }
if(ComfyApp.clipspace) { if(ComfyApp.clipspace) {
ClipspaceDialog.instance.show(); ClipspaceDialog.instance.show();
} }
else else
app.ui.dialog.show("Clipspace is Empty!"); app.ui.dialog.show("Clipspace is Empty!");
}; };
} }
}); });

70
web/scripts/app.js
View File

@ -144,7 +144,7 @@ export class ComfyApp {
callback: (obj) => { callback: (obj) => {
var widgets = null; var widgets = null;
if(this.widgets) { if(this.widgets) {
widgets = this.widgets.map(({ type, name, value }) => ({ type, name, value })); widgets = this.widgets.map(({ type, name, value }) => ({ type, name, value }));
} }
var imgs = undefined; var imgs = undefined;
@ -166,12 +166,12 @@ export class ComfyApp {
'original_imgs': orig_imgs, 'original_imgs': orig_imgs,
'images': this.images, 'images': this.images,
'selectedIndex': 0, 'selectedIndex': 0,
'img_paste_mode': 'all' 'img_paste_mode': 'selected' // reset to default im_paste_mode state on copy action
}; };
if(ComfyApp.clipspace_invalidate_handler) { if(ComfyApp.clipspace_invalidate_handler) {
ComfyApp.clipspace_invalidate_handler(); ComfyApp.clipspace_invalidate_handler();
} }
} }
}); });
@ -185,30 +185,30 @@ export class ComfyApp {
if(ComfyApp.clipspace.imgs && this.imgs) { if(ComfyApp.clipspace.imgs && this.imgs) {
var filename = ""; var filename = "";
if(this.images && ComfyApp.clipspace.images) { if(this.images && ComfyApp.clipspace.images) {
if(ComfyApp.clipspace['img_paste_mode'] == 'selected') { if(ComfyApp.clipspace['img_paste_mode'] == 'selected') {
app.nodeOutputs[this.id + ""].images = this.images = [ComfyApp.clipspace.images[ComfyApp.clipspace['selectedIndex']]]; app.nodeOutputs[this.id + ""].images = this.images = [ComfyApp.clipspace.images[ComfyApp.clipspace['selectedIndex']]];
} }
else else
app.nodeOutputs[this.id + ""].images = this.images = ComfyApp.clipspace.images; app.nodeOutputs[this.id + ""].images = this.images = ComfyApp.clipspace.images;
} }
if(ComfyApp.clipspace.imgs) { if(ComfyApp.clipspace.imgs) {
// deep-copy to cut link with clipspace // deep-copy to cut link with clipspace
if(ComfyApp.clipspace['img_paste_mode'] == 'selected') { if(ComfyApp.clipspace['img_paste_mode'] == 'selected') {
const img = new Image(); const img = new Image();
img.src = ComfyApp.clipspace.imgs[ComfyApp.clipspace['selectedIndex']].src; img.src = ComfyApp.clipspace.imgs[ComfyApp.clipspace['selectedIndex']].src;
this.imgs = [img]; this.imgs = [img];
} }
else { else {
const imgs = []; const imgs = [];
for(let i=0; i<ComfyApp.clipspace.imgs.length; i++) { for(let i=0; i<ComfyApp.clipspace.imgs.length; i++) {
imgs[i] = new Image(); imgs[i] = new Image();
imgs[i].src = ComfyApp.clipspace.imgs[i].src; imgs[i].src = ComfyApp.clipspace.imgs[i].src;
this.imgs = imgs; this.imgs = imgs;
} }
} }
} }
if(ComfyApp.clipspace.images) { if(ComfyApp.clipspace.images) {
const clip_image = ComfyApp.clipspace.images[ComfyApp.clipspace['selectedIndex']]; const clip_image = ComfyApp.clipspace.images[ComfyApp.clipspace['selectedIndex']];
@ -223,15 +223,15 @@ export class ComfyApp {
} }
} }
// for Load Image node. // for Load Image node.
if(this.widgets) { if(this.widgets) {
const index = this.widgets.findIndex(obj => obj.name === 'image'); const index = this.widgets.findIndex(obj => obj.name === 'image');
if(index >= 0 && filename != "") { if(index >= 0 && filename != "") {
this.widgets[index].value = filename; this.widgets[index].value = filename;
if(this.widgets_values != undefined) { if(this.widgets_values != undefined) {
this.widgets_values[index] = filename; this.widgets_values[index] = filename;
} }
} }
} }
} }