nodes/rgthree-rgthree-comfy
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

When going to a group from a fast groups node, zoom out if needed to see the whole group. Resolves #107.

Browse Source
This commit is contained in:
rgthree
2024-01-15 15:34:25 -05:00
parent 77a5f8faab
commit 06a67bfd74
3 changed files with 33 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src_web/comfyui/fast_groups_muter.ts
+14 -4
View File
@@ -458,10 +458,20 @@ export class FastGroupsMuter extends RgthreeBaseNode {
node.properties?.[PROPERTY_SHOW_NAV] !== false &&
pos[0] >= node.size[0] - 15 - 28 - 1
) {
const canvas = app.canvas as TLGraphCanvas;
const lowQuality = (canvas.ds?.scale || 1) <= 0.5;
if (!lowQuality) {
// Clicked on right half with nav arrow, go to the group.
app.canvas.centerOnNode(group);
// Clicked on right half with nav arrow, go to the group, center on group and set
// zoom to see it all.
canvas.centerOnNode(group);
const zoomCurrent = canvas.ds?.scale || 1;
const zoomX = canvas.canvas.width / group._size[0] - 0.02;
const zoomY = canvas.canvas.height / group._size[1] - 0.02;
canvas.setZoom(Math.min(zoomCurrent, zoomX, zoomY), [
canvas.canvas.width / 2,
canvas.canvas.height / 2,
]);
canvas.setDirty(true, true);
}
} else {
this.value = !this.value;
@@ -540,12 +550,12 @@ export class FastGroupsMuter extends RgthreeBaseNode {
override async handleAction(action: string) {
if (action === "Mute all" || action === "Bypass all") {
const alwaysOne = this.properties?.[PROPERTY_RESTRICTION] === 'always one';
const alwaysOne = this.properties?.[PROPERTY_RESTRICTION] === "always one";
for (const [index, widget] of this.widgets.entries()) {
(widget as any)?.doModeChange(alwaysOne && !index ? true : false, true);
}
} else if (action === "Enable all") {
const onlyOne = this.properties?.[PROPERTY_RESTRICTION].includes(' one');
const onlyOne = this.properties?.[PROPERTY_RESTRICTION].includes(" one");
for (const [index, widget] of this.widgets.entries()) {
(widget as any)?.doModeChange(onlyOne && index > 0 ? false : true, true);
}
src_web/typings/litegraph.d.ts
Vendored
+6 -1
View File
@@ -1180,6 +1180,10 @@ export declare class LGraphGroup {
_size: Vector2;
// @rgthree
graph: LGraph;
// @rgthree - apparently it is available?
size: Vector2;
// @rgthree - apparently it is available?
pos: Vector2;
configure(o: SerializedLGraphGroup): void;
@@ -1494,7 +1498,8 @@ export declare class LGraphCanvas {
deleteSelectedNodes(): void;
/** centers the camera on a given node */
centerOnNode(node: LGraphNode): void;
// @rgthree - narrow parameter
centerOnNode(node: {pos: Vector2, size: Vector2}): void;
/** changes the zoom level of the graph (default is 1), you can pass also a place used to pivot the zoom */
setZoom(value: number, center: Vector2): void;
/** brings a node to front (above all other nodes) */
web/comfyui/fast_groups_muter.js
+13 -4
View File
@@ -325,13 +325,22 @@ export class FastGroupsMuter extends RgthreeBaseNode {
return this.value;
},
mouse(event, pos, node) {
var _a, _b;
var _a, _b, _c;
if (event.type == "pointerdown") {
if (((_a = node.properties) === null || _a === void 0 ? void 0 : _a[PROPERTY_SHOW_NAV]) !== false &&
pos[0] >= node.size[0] - 15 - 28 - 1) {
const canvas = app.canvas;
const lowQuality = (((_b = canvas.ds) === null || _b === void 0 ? void 0 : _b.scale) || 1) <= 0.5;
if (!lowQuality) {
app.canvas.centerOnNode(group);
canvas.centerOnNode(group);
const zoomCurrent = ((_c = canvas.ds) === null || _c === void 0 ? void 0 : _c.scale) || 1;
const zoomX = canvas.canvas.width / group._size[0] - 0.02;
const zoomY = canvas.canvas.height / group._size[1] - 0.02;
canvas.setZoom(Math.min(zoomCurrent, zoomX, zoomY), [
canvas.canvas.width / 2,
canvas.canvas.height / 2,
]);
canvas.setDirty(true, true);
}
}
else {
@@ -409,13 +418,13 @@ export class FastGroupsMuter extends RgthreeBaseNode {
async handleAction(action) {
var _a, _b;
if (action === "Mute all" || action === "Bypass all") {
const alwaysOne = ((_a = this.properties) === null || _a === void 0 ? void 0 : _a[PROPERTY_RESTRICTION]) === 'always one';
const alwaysOne = ((_a = this.properties) === null || _a === void 0 ? void 0 : _a[PROPERTY_RESTRICTION]) === "always one";
for (const [index, widget] of this.widgets.entries()) {
widget === null || widget === void 0 ? void 0 : widget.doModeChange(alwaysOne && !index ? true : false, true);
}
}
else if (action === "Enable all") {
const onlyOne = (_b = this.properties) === null || _b === void 0 ? void 0 : _b[PROPERTY_RESTRICTION].includes(' one');
const onlyOne = (_b = this.properties) === null || _b === void 0 ? void 0 : _b[PROPERTY_RESTRICTION].includes(" one");
for (const [index, widget] of this.widgets.entries()) {
widget === null || widget === void 0 ? void 0 : widget.doModeChange(onlyOne && index > 0 ? false : true, true);
}