mirror of
https://github.com/comfyanonymous/ComfyUI.git
synced 2025-09-14 21:45:06 +00:00
New Menu & Workflow Management (#3112)
* menu * wip * wip * wip * wip * wip * workflow saving/loading * Support inserting workflows Move buttosn to top of lists * fix session storage implement renaming * temp * refactor, better workflow instance management * wip * progress on progress * added send to workflow various fixes * Support multiple image loaders * Support dynamic size breakpoints based on content * various fixes add close unsaved warning * Add filtering tree * prevent renaming unsaved * fix zindex on hover * fix top offset * use filename as workflow name * resize on setting change * hide element until it is drawn * remove glow * Fix export name * Fix test, revert accidental changes to groupNode * Fix colors on all themes * show hover items on smaller screen (mobile) * remove debugging code * dialog fix * Dont reorder open workflows Allow elements around canvas * Toggle body display on setting change * Fix menu disappearing on chrome * Increase delay when typing, remove margin on Safari, fix dialog location * Fix overflow issue on iOS * Add reset view button Prevent view changes causing history entries * Bottom menu wip * Various fixes * Fix merge * Fix breaking old menu position * Fix merge adding restore view to loadGraphData
This commit is contained in:
@@ -6,17 +6,22 @@ import { ComfySettingsDialog } from "./ui/settings.js";
|
||||
export const ComfyDialog = _ComfyDialog;
|
||||
|
||||
/**
|
||||
*
|
||||
* @param { string } tag HTML Element Tag and optional classes e.g. div.class1.class2
|
||||
* @param { string | Element | Element[] | {
|
||||
* @template { string | (keyof HTMLElementTagNameMap) } K
|
||||
* @typedef { K extends keyof HTMLElementTagNameMap ? HTMLElementTagNameMap[K] : HTMLElement } ElementType
|
||||
*/
|
||||
|
||||
/**
|
||||
* @template { string | (keyof HTMLElementTagNameMap) } K
|
||||
* @param { K } tag HTML Element Tag and optional classes e.g. div.class1.class2
|
||||
* @param { string | Element | Element[] | ({
|
||||
* parent?: Element,
|
||||
* $?: (el: Element) => void,
|
||||
* $?: (el: ElementType<K>) => void,
|
||||
* dataset?: DOMStringMap,
|
||||
* style?: CSSStyleDeclaration,
|
||||
* style?: Partial<CSSStyleDeclaration>,
|
||||
* for?: string
|
||||
* } | undefined } propsOrChildren
|
||||
* @param { Element[] | undefined } [children]
|
||||
* @returns
|
||||
* } & Omit<Partial<ElementType<K>>, "style">) | undefined } [propsOrChildren]
|
||||
* @param { string | Element | Element[] | undefined } [children]
|
||||
* @returns { ElementType<K> }
|
||||
*/
|
||||
export function $el(tag, propsOrChildren, children) {
|
||||
const split = tag.split(".");
|
||||
@@ -54,7 +59,7 @@ export function $el(tag, propsOrChildren, children) {
|
||||
|
||||
Object.assign(element, propsOrChildren);
|
||||
if (children) {
|
||||
element.append(...(children instanceof Array ? children : [children]));
|
||||
element.append(...(children instanceof Array ? children.filter(Boolean) : [children]));
|
||||
}
|
||||
|
||||
if (parent) {
|
||||
@@ -102,6 +107,8 @@ function dragElement(dragEl, settings) {
|
||||
}
|
||||
|
||||
function positionElement() {
|
||||
if(dragEl.style.display === "none") return;
|
||||
|
||||
const halfWidth = document.body.clientWidth / 2;
|
||||
const anchorRight = newPosX + dragEl.clientWidth / 2 > halfWidth;
|
||||
|
||||
@@ -191,6 +198,8 @@ function dragElement(dragEl, settings) {
|
||||
document.onmouseup = null;
|
||||
document.onmousemove = null;
|
||||
}
|
||||
|
||||
return restorePos;
|
||||
}
|
||||
|
||||
class ComfyList {
|
||||
@@ -372,6 +381,8 @@ export class ComfyUI {
|
||||
},
|
||||
});
|
||||
|
||||
this.loadFile = () => fileInput.click();
|
||||
|
||||
const autoQueueModeEl = toggleSwitch(
|
||||
"autoQueueMode",
|
||||
[
|
||||
@@ -592,6 +603,7 @@ export class ComfyUI {
|
||||
onclick: () => app.refreshComboInNodes()
|
||||
}),
|
||||
$el("button", {id: "comfy-clipspace-button", textContent: "Clipspace", onclick: () => app.openClipspace()}),
|
||||
$el("button", {id: "comfy-reset-view-button", textContent: "Reset View", onclick: () => app.resetView()}),
|
||||
$el("button", {
|
||||
id: "comfy-clear-button", textContent: "Clear", onclick: () => {
|
||||
if (!confirmClear.value || confirm("Clear workflow?")) {
|
||||
@@ -621,10 +633,10 @@ export class ComfyUI {
|
||||
name: "Enable Dev mode Options",
|
||||
type: "boolean",
|
||||
defaultValue: false,
|
||||
onChange: function(value) { document.getElementById("comfy-dev-save-api-button").style.display = value ? "block" : "none"},
|
||||
onChange: function(value) { document.getElementById("comfy-dev-save-api-button").style.display = value ? "flex" : "none"},
|
||||
});
|
||||
|
||||
dragElement(this.menuContainer, this.settings);
|
||||
this.restoreMenuPosition = dragElement(this.menuContainer, this.settings);
|
||||
|
||||
this.setStatus({exec_info: {queue_remaining: "X"}});
|
||||
}
|
||||
|
Reference in New Issue
Block a user