Comfy-Org/ComfyUI_frontend
1
0
Fork 0
mirror of https://github.com/Comfy-Org/ComfyUI_frontend.git synced 2026-02-03 06:47:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add pin icon to end of title (#120)

Browse Source
This commit is contained in:
Chenlei Hu
2024-09-04 15:13:10 -04:00
committed by GitHub
parent 6636f9869b
commit 67f486fff7
2 changed files with 16 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
public/litegraph.d.ts vendored
View File

@@ -964,6 +964,8 @@ export declare class LGraphNode {
loadImage(url: string): void;
/** Allows to get onMouseMove and onMouseUp events even if the mouse is out of focus */
captureInput(v: any): void;
get collapsible(): boolean;
/** Collapse the node to make it smaller on the canvas */
collapse(force: boolean): void;

32
src/litegraph.js
View File

@@ -4755,13 +4755,17 @@ const globalExport = {};
}
}
get collapsible() {
return !this.pinned && this.constructor.collapsable;
}
/**
* Collapse the node to make it smaller on the canvas
* @method collapse
**/
collapse(force) {
this.graph._version++;
if (this.constructor.collapsable === false && !force) {
if (this.collapsible && !force) {
return;
}
if (!this.flags.collapsed) {
@@ -4777,7 +4781,7 @@ const globalExport = {};
}
/**
* Forces the node to do not move or realign on Z
* Forces the node to do not move or realign on Z or resize
* @method pin
**/
pin(v) {
@@ -4927,7 +4931,7 @@ const globalExport = {};
const font_size = this.font_size || LiteGraph.DEFAULT_GROUP_FONT_SIZE;
ctx.font = font_size + "px Arial";
ctx.textAlign = "left";
ctx.fillText(this.title, x + padding, y + font_size);
ctx.fillText(this.title + (this.pinned ? "📌" : ""), x + padding, y + font_size);
if (LiteGraph.highlight_selected_group && this.selected) {
graphCanvas.drawSelectionBounding(ctx, this._bounding, {
@@ -4938,12 +4942,6 @@ const globalExport = {};
padding,
});
}
if (this.pinned) {
const iconFontSize = font_size * 0.5;
ctx.font = iconFontSize + "px Arial";
ctx.fillText("📌", x + width - iconFontSize - padding, y + iconFontSize);
}
}
resize(width, height) {
@@ -10031,7 +10029,7 @@ const globalExport = {};
}
if (!low_quality) {
ctx.font = this.title_text_font;
var title = String(node.getTitle());
var title = String(node.getTitle()) + (node.pinned ? "📌" : "");
if (title) {
if (selected) {
ctx.fillStyle = LiteGraph.NODE_SELECTED_TITLE_COLOR;
@@ -10106,10 +10104,6 @@ const globalExport = {};
);
}
if (node.pinned) {
ctx.fillText("📌", node.getBounding()[2] - 20, -10);
}
// these counter helps in conditioning drawing based on if the node has been executed or an action occurred
if (node.execute_triggered > 0) node.execute_triggered--;
if (node.action_triggered > 0) node.action_triggered--;
@@ -13128,11 +13122,13 @@ const globalExport = {};
content: "Resize", callback: LGraphCanvas.onMenuResizeNode
});
}
options.push(
{
content: "Collapse",
if (node.collapsible) {
options.push({
content: node.collapsed ? "Expand" : "Collapse",
callback: LGraphCanvas.onMenuNodeCollapse
},
});
}
options.push(
{
content: node.pinned ? "Unpin" : "Pin",
callback: LGraphCanvas.onMenuNodePin