diff --git a/src/LGraph.ts b/src/LGraph.ts index 98ee09e87..e03770346 100644 --- a/src/LGraph.ts +++ b/src/LGraph.ts @@ -364,7 +364,6 @@ export class LGraph implements LinkNetwork, Serialisable { this.starttime = LiteGraph.getTime() this.last_update_time = this.starttime interval ||= 0 - const that = this // execute once per frame if ( @@ -372,24 +371,24 @@ export class LGraph implements LinkNetwork, Serialisable { typeof window != "undefined" && window.requestAnimationFrame ) { - function on_frame() { - if (that.execution_timer_id != -1) return + const on_frame = () => { + if (this.execution_timer_id != -1) return window.requestAnimationFrame(on_frame) - that.onBeforeStep?.() - that.runStep(1, !that.catch_errors) - that.onAfterStep?.() + this.onBeforeStep?.() + this.runStep(1, !this.catch_errors) + this.onAfterStep?.() } this.execution_timer_id = -1 on_frame() } else { // execute every 'interval' ms // @ts-expect-error - this.execution_timer_id = setInterval(function () { + this.execution_timer_id = setInterval(() => { // execute - that.onBeforeStep?.() - that.runStep(1, !that.catch_errors) - that.onAfterStep?.() + this.onBeforeStep?.() + this.runStep(1, !this.catch_errors) + this.onAfterStep?.() }, interval) } } @@ -468,11 +467,11 @@ export class LGraph implements LinkNetwork, Serialisable { this.onAfterExecute?.() this.errors_in_execution = false - } catch (err) { + } catch (error) { this.errors_in_execution = true - if (LiteGraph.throw_errors) throw err + if (LiteGraph.throw_errors) throw error - if (LiteGraph.debug) console.log("Error during execution: " + err) + if (LiteGraph.debug) console.log("Error during execution: " + error) this.stop() } } @@ -661,7 +660,7 @@ export class LGraph implements LinkNetwork, Serialisable { for (let i = 0; i < current.inputs.length; ++i) { const input = current.getInputNode(i) - if (input && ancestors.indexOf(input) == -1) { + if (input && !ancestors.includes(input)) { pending.push(input) } } @@ -1128,8 +1127,8 @@ export class LGraph implements LinkNetwork, Serialisable { newnode.graph = this this._nodes_by_id[newnode.id] = newnode - if (node.inputs) newnode.inputs = node.inputs.concat() - if (node.outputs) newnode.outputs = node.outputs.concat() + if (node.inputs) newnode.inputs = [...node.inputs] + if (node.outputs) newnode.outputs = [...node.outputs] } this.updateExecutionOrder() } @@ -1707,7 +1706,7 @@ export class LGraph implements LinkNetwork, Serialisable { const req = new XMLHttpRequest() req.open("GET", url, true) req.send(null) - req.onload = function () { + req.addEventListener("load", function () { if (req.status !== 200) { console.error("Error loading graph:", req.status, req.response) return @@ -1715,7 +1714,7 @@ export class LGraph implements LinkNetwork, Serialisable { const data = JSON.parse(req.response) that.configure(data) callback?.() - } + }) req.onerror = function (err) { console.error("Error loading graph:", err) } diff --git a/src/LGraphCanvas.ts b/src/LGraphCanvas.ts index edbce1dd3..e86c5c9d2 100644 --- a/src/LGraphCanvas.ts +++ b/src/LGraphCanvas.ts @@ -6959,7 +6959,13 @@ export class LGraphCanvas implements ConnectionColorContext { value_element.addEventListener("click", function (event) { const values = options.values || [] const propname = this.parentNode.dataset["property"] - const elem_that = this + const inner_clicked = (v) => { + // node.setProperty(propname,v); + // graphcanvas.dirty_canvas = true; + this.textContent = v + innerChange(propname, v) + return false + } new LiteGraph.ContextMenu( values, { @@ -6970,13 +6976,6 @@ export class LGraphCanvas implements ConnectionColorContext { // @ts-expect-error ref_window, ) - function inner_clicked(v) { - // node.setProperty(propname,v); - // graphcanvas.dirty_canvas = true; - elem_that.textContent = v - innerChange(propname, v) - return false - } }) } @@ -7004,24 +7003,23 @@ export class LGraphCanvas implements ConnectionColorContext { this.SELECTED_NODE = node this.closePanels() const ref_window = this.getCanvasWindow() - const graphcanvas = this const panel = this.createPanel(node.title || "", { closable: true, window: ref_window, - onOpen: function () { - graphcanvas.NODEPANEL_IS_OPEN = true + onOpen: () => { + this.NODEPANEL_IS_OPEN = true }, - onClose: function () { - graphcanvas.NODEPANEL_IS_OPEN = false - graphcanvas.node_panel = null + onClose: () => { + this.NODEPANEL_IS_OPEN = false + this.node_panel = null }, }) - graphcanvas.node_panel = panel + this.node_panel = panel panel.id = "node-panel" panel.node = node panel.classList.add("settings") - function inner_refresh() { + const inner_refresh = () => { // clear panel.content.innerHTML = "" // @ts-expect-error ctor props @@ -7029,8 +7027,8 @@ export class LGraphCanvas implements ConnectionColorContext { panel.addHTML("

Properties

") - const fUpdate = function (name, value) { - graphcanvas.graph.beforeChange(node) + const fUpdate = (name, value) => { + this.graph.beforeChange(node) switch (name) { case "Title": node.title = value @@ -7056,8 +7054,8 @@ export class LGraphCanvas implements ConnectionColorContext { node.setProperty(name, value) break } - graphcanvas.graph.afterChange() - graphcanvas.dirty_canvas = true + this.graph.afterChange() + this.dirty_canvas = true } panel.addWidget("string", "Title", node.title, {}, fUpdate) @@ -7311,7 +7309,6 @@ export class LGraphCanvas implements ConnectionColorContext { } processContextMenu(node: LGraphNode, event: CanvasMouseEvent): void { - const that = this const canvas = LGraphCanvas.active_canvas const ref_window = canvas.getCanvasWindow() @@ -7404,6 +7401,12 @@ export class LGraphCanvas implements ConnectionColorContext { // @ts-expect-error Remove param ref_window - unused new LiteGraph.ContextMenu(menu_info, options, ref_window) + const createDialog = (options: IDialogOptions) => this.createDialog( + "Name", + options, + ) + const setDirty = () => this.setDirty(true) + function inner_option_clicked(v, options) { if (!v) return @@ -7432,10 +7435,8 @@ export class LGraphCanvas implements ConnectionColorContext { const slot_info = info.input ? node.getInputInfo(info.slot) : node.getOutputInfo(info.slot) - const dialog = that.createDialog( - "Name", - options, - ) + const dialog = createDialog(options) + const input = dialog.querySelector("input") if (input && slot_info) { input.value = slot_info.label || "" @@ -7446,7 +7447,7 @@ export class LGraphCanvas implements ConnectionColorContext { if (slot_info) { slot_info.label = input.value } - that.setDirty(true) + setDirty() } dialog.close() node.graph.afterChange() diff --git a/src/LGraphNode.ts b/src/LGraphNode.ts index 129e84d42..445ced6b8 100644 --- a/src/LGraphNode.ts +++ b/src/LGraphNode.ts @@ -2762,10 +2762,10 @@ export class LGraphNode implements Positionable, IPinnable, IColorable { img.src = LiteGraph.node_images_path + url img.ready = false - const that = this + const dirty = () => this.setDirtyCanvas(true) img.onload = function (this: AsyncImageElement) { this.ready = true - that.setDirtyCanvas(true) + dirty() } return img }