mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-04-29 10:42:44 +00:00
Type LGraphNode.addDOMWidget (#2548)
This commit is contained in:
@@ -1,5 +1,6 @@
|
|||||||
import { LGraphCanvas, LGraphNode, LiteGraph } from '@comfyorg/litegraph'
|
import { LGraphCanvas, LGraphNode, LiteGraph } from '@comfyorg/litegraph'
|
||||||
import type { Size, Vector4 } from '@comfyorg/litegraph'
|
import type { Size, Vector4 } from '@comfyorg/litegraph'
|
||||||
|
import type { ISerialisedNode } from '@comfyorg/litegraph/dist/types/serialisation'
|
||||||
import type {
|
import type {
|
||||||
ICustomWidget,
|
ICustomWidget,
|
||||||
IWidget,
|
IWidget,
|
||||||
@@ -201,7 +202,7 @@ function computeSize(this: LGraphNode, size: Size): void {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// Override the compute visible nodes function to allow us to hide/show DOM elements when the node goes offscreen
|
// Override the compute visible nodes function to allow us to hide/show DOM elements when the node goes offscreen
|
||||||
const elementWidgets = new Set()
|
const elementWidgets = new Set<LGraphNode>()
|
||||||
const computeVisibleNodes = LGraphCanvas.prototype.computeVisibleNodes
|
const computeVisibleNodes = LGraphCanvas.prototype.computeVisibleNodes
|
||||||
LGraphCanvas.prototype.computeVisibleNodes = function (
|
LGraphCanvas.prototype.computeVisibleNodes = function (
|
||||||
nodes?: LGraphNode[],
|
nodes?: LGraphNode[],
|
||||||
@@ -380,6 +381,7 @@ LGraphNode.prototype.addDOMWidget = function <
|
|||||||
T extends HTMLElement,
|
T extends HTMLElement,
|
||||||
V extends object | string
|
V extends object | string
|
||||||
>(
|
>(
|
||||||
|
this: LGraphNode,
|
||||||
name: string,
|
name: string,
|
||||||
type: string,
|
type: string,
|
||||||
element: T,
|
element: T,
|
||||||
@@ -427,23 +429,26 @@ LGraphNode.prototype.addDOMWidget = function <
|
|||||||
elementWidgets.add(this)
|
elementWidgets.add(this)
|
||||||
|
|
||||||
const collapse = this.collapse
|
const collapse = this.collapse
|
||||||
this.collapse = function (force?: boolean) {
|
this.collapse = function (this: LGraphNode, force?: boolean) {
|
||||||
collapse.call(this, force)
|
collapse.call(this, force)
|
||||||
if (this.flags?.collapsed) {
|
if (this.collapsed) {
|
||||||
element.hidden = true
|
element.hidden = true
|
||||||
element.style.display = 'none'
|
element.style.display = 'none'
|
||||||
}
|
}
|
||||||
element.dataset.collapsed = this.flags?.collapsed ? 'true' : 'false'
|
element.dataset.collapsed = this.collapsed ? 'true' : 'false'
|
||||||
}
|
}
|
||||||
|
|
||||||
const { onConfigure } = this
|
const { onConfigure } = this
|
||||||
this.onConfigure = function (serializedNode: any) {
|
this.onConfigure = function (
|
||||||
|
this: LGraphNode,
|
||||||
|
serializedNode: ISerialisedNode
|
||||||
|
) {
|
||||||
onConfigure?.call(this, serializedNode)
|
onConfigure?.call(this, serializedNode)
|
||||||
element.dataset.collapsed = this.flags?.collapsed ? 'true' : 'false'
|
element.dataset.collapsed = this.collapsed ? 'true' : 'false'
|
||||||
}
|
}
|
||||||
|
|
||||||
const onRemoved = this.onRemoved
|
const onRemoved = this.onRemoved
|
||||||
this.onRemoved = function () {
|
this.onRemoved = function (this: LGraphNode) {
|
||||||
element.remove()
|
element.remove()
|
||||||
elementWidgets.delete(this)
|
elementWidgets.delete(this)
|
||||||
onRemoved?.call(this)
|
onRemoved?.call(this)
|
||||||
@@ -454,7 +459,7 @@ LGraphNode.prototype.addDOMWidget = function <
|
|||||||
// @ts-ignore index with symbol
|
// @ts-ignore index with symbol
|
||||||
this[SIZE] = true
|
this[SIZE] = true
|
||||||
const onResize = this.onResize
|
const onResize = this.onResize
|
||||||
this.onResize = function (size: Size) {
|
this.onResize = function (this: LGraphNode, size: Size) {
|
||||||
options.beforeResize?.call(widget, this)
|
options.beforeResize?.call(widget, this)
|
||||||
computeSize.call(this, size)
|
computeSize.call(this, size)
|
||||||
onResize?.call(this, size)
|
onResize?.call(this, size)
|
||||||
|
|||||||
Reference in New Issue
Block a user