wangbo/ComfyUI
1
0
Fork 0
mirror of https://github.com/comfyanonymous/ComfyUI.git synced 2026-01-10 14:20:49 +08:00
Code Issues Actions 11 Packages Projects Releases Wiki Activity

* add settings for preview_format

Browse Source 
* default value is ''(= don't reencode)
This commit is contained in:
Lt.Dr.Data 2023-06-05 14:15:12 +09:00
parent 72a3aef0c2
commit 755add449a
4 changed files with 29 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/extensions/core/maskeditor.js
View File

@ -41,7 +41,7 @@ async function uploadMask(filepath, formData) {
}); });
ComfyApp.clipspace.imgs[ComfyApp.clipspace['selectedIndex']] = new Image(); ComfyApp.clipspace.imgs[ComfyApp.clipspace['selectedIndex']] = new Image();
ComfyApp.clipspace.imgs[ComfyApp.clipspace['selectedIndex']].src = "/view?" + new URLSearchParams(filepath).toString() + "&preview="+app.preview_format; ComfyApp.clipspace.imgs[ComfyApp.clipspace['selectedIndex']].src = "/view?" + new URLSearchParams(filepath).toString() + app.getPreviewFormatParam();
if(ComfyApp.clipspace.images) if(ComfyApp.clipspace.images)
ComfyApp.clipspace.images[ComfyApp.clipspace['selectedIndex']] = filepath; ComfyApp.clipspace.images[ComfyApp.clipspace['selectedIndex']] = filepath;

22
web/scripts/app.js
View File

@ -49,20 +49,14 @@ export class ComfyApp {
* @type {boolean} * @type {boolean}
*/ */
this.shiftDown = false; this.shiftDown = false;
}
/** getPreviewFormatParam() {
* file format for preview let preview_format = this.ui.settings.getSettingValue("Comfy.PreviewFormat");
* if(preview_format)
* L?;format;quality return `&preview=${preview_format}`;
* else
* ex) return "";
* L;webp;50 -> grayscale, webp, quality 50
* jpeg;80 -> rgb, jpeg, quality 80
* png -> rgb, png, default quality(=90)
*
* @type {string}
*/
this.preview_format = "webp";
} }
static isImageNode(node) { static isImageNode(node) {
@ -385,7 +379,7 @@ export class ComfyApp {
const img = new Image(); const img = new Image();
img.onload = () => r(img); img.onload = () => r(img);
img.onerror = () => r(null); img.onerror = () => r(null);
img.src = "/view?" + new URLSearchParams(src).toString() + "&preview="+app.preview_format; img.src = "/view?" + new URLSearchParams(src).toString() + app.getPreviewFormatParam();
}); });
}) })
).then((imgs) => { ).then((imgs) => {

19
web/scripts/ui.js
View File

@ -462,6 +462,25 @@ export class ComfyUI {
defaultValue: true, defaultValue: true,
}); });
/**
* file format for preview
*
* L?;format;quality
*
* ex)
* L;webp;50 -> grayscale, webp, quality 50
* jpeg;80 -> rgb, jpeg, quality 80
* png -> rgb, png, default quality(=90)
*
* @type {string}
*/
const previewImage = this.settings.addSetting({
id: "Comfy.PreviewFormat",
name: "When displaying a preview in the image widget, convert it to a lightweight image. (webp, jpeg, webp;50, ...)",
type: "string",
defaultValue: "",
});
const fileInput = $el("input", { const fileInput = $el("input", {
id: "comfy-file-input", id: "comfy-file-input",
type: "file", type: "file",

2
web/scripts/widgets.js
View File

@ -303,7 +303,7 @@ export const ComfyWidgets = {
subfolder = name.substring(0, folder_separator); subfolder = name.substring(0, folder_separator);
name = name.substring(folder_separator + 1); name = name.substring(folder_separator + 1);
} }
img.src = `/view?filename=${name}&type=input&subfolder=${subfolder}&preview=${app.preview_format}`; img.src = `/view?filename=${name}&type=input&subfolder=${subfolder}${app.getPreviewFormatParam()}`;
node.setSizeForImage?.(); node.setSizeForImage?.();
} }