From f79133659fe81b504c60fb55c8afd44e15080b34 Mon Sep 17 00:00:00 2001 From: filtered <176114999+webfiltered@users.noreply.github.com> Date: Fri, 22 Nov 2024 02:11:53 +1100 Subject: [PATCH] Clean up JSDoc (#327) * Convert comments to JSDoc * Clean JSdoc * nit * Clean up all JSDoc & ESLint warnings Disables max-len for now Removes redundant JSDoc tags (empty, same name, wrong name, etc) --- eslint.config.js | 10 +- src/CanvasPointer.ts | 4 +- src/ContextMenu.ts | 24 ++-- src/LGraph.ts | 110 +++++++------------ src/LGraphCanvas.ts | 144 ++++++++++-------------- src/LGraphGroup.ts | 12 +- src/LGraphNode.ts | 220 ++++++++++++++++--------------------- src/LiteGraphGlobal.ts | 214 +++++++++++++++++++++++------------- src/Reroute.ts | 2 - src/interfaces.ts | 3 +- src/measure.ts | 5 +- src/types/serialisation.ts | 2 +- src/types/widgets.ts | 1 - 13 files changed, 359 insertions(+), 392 deletions(-) diff --git a/eslint.config.js b/eslint.config.js index 9dd4d5590..990aa12e6 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -66,8 +66,14 @@ export default tseslint.config( // "@typescript-eslint/no-unsafe-function-type": "off", "@stylistic/max-len": [ - "warn", - { code: 100, comments: 130, ignoreStrings: true }, + "off", + { + code: 100, + comments: 130, + ignoreStrings: true, + ignoreTemplateLiterals: true, + ignoreComments: true, + }, ], // "@stylistic/multiline-comment-style": ["warn", "starred-block"], diff --git a/src/CanvasPointer.ts b/src/CanvasPointer.ts index eaec9219e..23462f072 100644 --- a/src/CanvasPointer.ts +++ b/src/CanvasPointer.ts @@ -12,8 +12,7 @@ import { dist2 } from "./measure" * - {@link onDrag} * - {@link onDragEnd} * - {@link finally} - * - * @seealso + * @see * - {@link LGraphCanvas.processMouseDown} * - {@link LGraphCanvas.processMouseMove} * - {@link LGraphCanvas.processMouseUp} @@ -222,7 +221,6 @@ export class CanvasPointer { /** * Checks whether the pointer is currently past the max click drift threshold. - * @param e The latest pointer event * @returns `true` if the latest pointer event is past the the click drift threshold */ #isDoubleClick(): boolean { diff --git a/src/ContextMenu.ts b/src/ContextMenu.ts index 656033032..10c985241 100644 --- a/src/ContextMenu.ts +++ b/src/ContextMenu.ts @@ -7,22 +7,16 @@ interface ContextMenuDivElement extends HTMLDivElement { closing_timer?: number } +// TODO: Replace this pattern with something more modern. +// eslint-disable-next-line @typescript-eslint/no-unsafe-declaration-merging export interface ContextMenu { constructor: new (...args: ConstructorParameters) => ContextMenu } /** * ContextMenu from LiteGUI - * - * @class ContextMenu - * @constructor - * @param {Array} values (allows object { title: "Nice text", callback: function ... }) - * @param {Object} options [optional] Some options:\ - * - title: title to show on top of the menu - * - callback: function to call when an option is clicked, it receives the item information - * - ignore_item_callbacks: ignores the callback inside the item, it just calls the options.callback - * - event: you can pass a MouseEvent, this way the ContextMenu appears in that position */ +// eslint-disable-next-line @typescript-eslint/no-unsafe-declaration-merging export class ContextMenu { options?: IContextMenuOptions parentMenu?: ContextMenu @@ -30,8 +24,16 @@ export class ContextMenu { current_submenu?: ContextMenu lock?: boolean - // TODO: Interface for values requires functionality change - currently accepts - // an array of strings, functions, objects, nulls, or undefined. + /** + * @todo Interface for values requires functionality change - currently accepts + * an array of strings, functions, objects, nulls, or undefined. + * @param values (allows object { title: "Nice text", callback: function ... }) + * @param options [optional] Some options:\ + * - title: title to show on top of the menu + * - callback: function to call when an option is clicked, it receives the item information + * - ignore_item_callbacks: ignores the callback inside the item, it just calls the options.callback + * - event: you can pass a MouseEvent, this way the ContextMenu appears in that position + */ constructor(values: (IContextMenuValue | string)[], options: IContextMenuOptions) { options ||= {} this.options = options diff --git a/src/LGraph.ts b/src/LGraph.ts index 568e29ac8..e14fd417c 100644 --- a/src/LGraph.ts +++ b/src/LGraph.ts @@ -66,9 +66,9 @@ export interface LGraphConfig { /** * LGraph is the class that contain a full graph. We instantiate one and add nodes to it, and then we can run the execution loop. * supported callbacks: - + onNodeAdded: when a new node is added to the graph - + onNodeRemoved: when a node inside this graph is removed - + onNodeConnectionChange: some connection has changed in the graph (connected or disconnected) + * + onNodeAdded: when a new node is added to the graph + * + onNodeRemoved: when a node inside this graph is removed + * + onNodeConnectionChange: some connection has changed in the graph (connected or disconnected) */ export class LGraph implements LinkNetwork, Serialisable { static serialisedSchemaVersion = 1 as const @@ -308,7 +308,6 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Attach Canvas to this graph - * @param {GraphCanvas} graph_canvas */ attachCanvas(graphcanvas: LGraphCanvas): void { if (graphcanvas.constructor != LGraphCanvas) @@ -324,7 +323,6 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Detach Canvas from this graph - * @param {GraphCanvas} graph_canvas */ detachCanvas(graphcanvas: LGraphCanvas): void { if (!this.list_of_graphcanvas) return @@ -338,7 +336,7 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Starts running this graph every interval milliseconds. - * @param {number} interval amount of milliseconds between executions, if 0 then it renders to the monitor refresh rate + * @param interval amount of milliseconds between executions, if 0 then it renders to the monitor refresh rate */ start(interval?: number): void { if (this.status == LGraph.STATUS_RUNNING) return @@ -403,9 +401,9 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Run N steps (cycles) of the graph - * @param {number} num number of steps to run, default is 1 - * @param {Boolean} do_not_catch_errors [optional] if you want to try/catch errors - * @param {number} limit max number of nodes to execute (used to execute from start to a node) + * @param num number of steps to run, default is 1 + * @param do_not_catch_errors [optional] if you want to try/catch errors + * @param limit max number of nodes to execute (used to execute from start to a node) */ runStep(num: number, do_not_catch_errors: boolean, limit?: number): void { num = num || 1 @@ -524,8 +522,8 @@ export class LGraph implements LinkNetwork, Serialisable { // is a starting node S.push(node) if (set_level) node._level = 1 - } // num of input links - else { + } else { + // num of input links if (set_level) node._level = 0 remaining_links[node.id] = num } @@ -625,7 +623,7 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Returns all the nodes that could affect this one (ancestors) by crawling all the inputs recursively. * It doesn't include the node itself - * @return {Array} an array with all the LGraphNodes that affect this node, in order of execution + * @returns an array with all the LGraphNodes that affect this node, in order of execution */ getAncestors(node: LGraphNode): LGraphNode[] { const ancestors: LGraphNode[] = [] @@ -697,7 +695,7 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Returns the amount of time the graph has been running in milliseconds - * @return {number} number of milliseconds the graph has been running + * @returns number of milliseconds the graph has been running */ getTime(): number { return this.globaltime @@ -706,7 +704,7 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Returns the amount of time accumulated using the fixedtime_lapse var. * This is used in context where the time increments should be constant - * @return {number} number of milliseconds the graph has been running + * @returns number of milliseconds the graph has been running */ getFixedTime(): number { return this.fixedtime @@ -716,7 +714,7 @@ export class LGraph implements LinkNetwork, Serialisable { * Returns the amount of time it took to compute the latest iteration. * Take into account that this number could be not correct * if the nodes are using graphical actions - * @return {number} number of milliseconds it took the last cycle + * @returns number of milliseconds it took the last cycle */ getElapsedTime(): number { return this.elapsed_time @@ -724,8 +722,8 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Sends an event to all the nodes, useful to trigger stuff - * @param {String} eventname the name of the event (function to be called) - * @param {Array} params parameters in array format + * @param eventname the name of the event (function to be called) + * @param params parameters in array format */ sendEventToAllNodes( eventname: string, @@ -783,7 +781,7 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Adds a new node instance to this graph - * @param {LGraphNode} node the instance of the node + * @param node the instance of the node */ add( node: LGraphNode | LGraphGroup, @@ -861,7 +859,7 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Removes a node from the graph - * @param {LGraphNode} node the instance of the node + * @param node the instance of the node */ remove(node: LGraphNode | LGraphGroup): void { // LEGACY: This was changed from constructor === LiteGraph.LGraphGroup @@ -935,7 +933,6 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Returns a node by its id. - * @param {Number} id */ getNodeById(id: NodeId): LGraphNode | null { return id != null @@ -945,8 +942,8 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Returns a list of nodes that matches a class - * @param {Class} classObject the class itself (not an string) - * @return {Array} a list with all the nodes of this type + * @param classObject the class itself (not an string) + * @returns a list with all the nodes of this type */ // eslint-disable-next-line @typescript-eslint/no-unsafe-function-type findNodesByClass(classObject: Function, result?: LGraphNode[]): LGraphNode[] { @@ -961,8 +958,8 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Returns a list of nodes that matches a type - * @param {String} type the name of the node type - * @return {Array} a list with all the nodes of this type + * @param type the name of the node type + * @returns a list with all the nodes of this type */ findNodesByType(type: string, result: LGraphNode[]): LGraphNode[] { const matchType = type.toLowerCase() @@ -977,8 +974,8 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Returns the first node that matches a name in its title - * @param {String} name the name of the node to search - * @return {Node} the node or null + * @param title the name of the node to search + * @returns the node or null */ findNodeByTitle(title: string): LGraphNode | null { for (let i = 0, l = this._nodes.length; i < l; ++i) { @@ -990,8 +987,8 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Returns a list of nodes that matches a name - * @param {String} name the name of the node to search - * @return {Array} a list with all the nodes with this name + * @param title the name of the node to search + * @returns a list with all the nodes with this name */ findNodesByTitle(title: string): LGraphNode[] { const result: LGraphNode[] = [] @@ -1004,10 +1001,10 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Returns the top-most node in this position of the canvas - * @param {number} x the x coordinate in canvas space - * @param {number} y the y coordinate in canvas space - * @param {Array} nodeList a list with all the nodes to search from, by default is all the nodes in the graph - * @return {LGraphNode} the node at this position or null + * @param x the x coordinate in canvas space + * @param y the y coordinate in canvas space + * @param nodeList a list with all the nodes to search from, by default is all the nodes in the graph + * @returns the node at this position or null */ getNodeOnPos( x: number, @@ -1027,7 +1024,7 @@ export class LGraph implements LinkNetwork, Serialisable { * Returns the top-most group in that position * @param x The x coordinate in canvas space * @param y The y coordinate in canvas space - * @return The group or null + * @returns The group or null */ getGroupOnPos(x: number, y: number): LGraphGroup | undefined { return this._groups.toReversed().find(g => g.isPointInside(x, y)) @@ -1037,7 +1034,7 @@ export class LGraph implements LinkNetwork, Serialisable { * Returns the top-most group with a titlebar in the provided position. * @param x The x coordinate in canvas space * @param y The y coordinate in canvas space - * @return The group or null + * @returns The group or null */ getGroupTitlebarOnPos(x: number, y: number): LGraphGroup | undefined { return this._groups.toReversed().find(g => g.isPointInTitlebar(x, y)) @@ -1065,7 +1062,7 @@ export class LGraph implements LinkNetwork, Serialisable { * * When {@link config}.{@link LGraphConfig.alwaysSnapToGrid alwaysSnapToGrid} is enabled * and the grid size is falsy, a default of 1 is used. - * @param items The items to snap to the grid + * @param items The items to be snapped to the grid * @todo Currently only snaps nodes. */ snapToGrid(items: Set): void { @@ -1139,9 +1136,6 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Tell this graph it has a global graph input of this type - * @param {String} name - * @param {String} type - * @param {*} value [optional] */ addInput(name: string, type: string, value?: unknown): void { const input = this.inputs[name] @@ -1159,8 +1153,6 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Assign a data to the global graph input - * @param {String} name - * @param {*} data */ setInputData(name: string, data: unknown): void { const input = this.inputs[name] @@ -1170,8 +1162,6 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Returns the current value of a global graph input - * @param {String} name - * @return {*} the data */ getInputData(name: string): unknown { const input = this.inputs[name] @@ -1182,8 +1172,6 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Changes the name of a global graph input - * @param {String} old_name - * @param {String} new_name */ renameInput(old_name: string, name: string): boolean | undefined { if (name == old_name) return @@ -1205,8 +1193,6 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Changes the type of a global graph input - * @param {String} name - * @param {String} type */ changeInputType(name: string, type: string): boolean | undefined { if (!this.inputs[name]) return false @@ -1225,8 +1211,6 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Removes a global graph input - * @param {String} name - * @param {String} type */ removeInput(name: string): boolean { if (!this.inputs[name]) return false @@ -1241,9 +1225,6 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Creates a global graph output - * @param {String} name - * @param {String} type - * @param {*} value */ addOutput(name: string, type: string, value: unknown): void { this.outputs[name] = { name: name, type: type, value: value } @@ -1256,8 +1237,6 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Assign a data to the global output - * @param {String} name - * @param {String} value */ setOutputData(name: string, value: unknown): void { const output = this.outputs[name] @@ -1267,8 +1246,6 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Returns the current value of a global graph output - * @param {String} name - * @return {*} the data */ getOutputData(name: string): unknown { const output = this.outputs[name] @@ -1278,8 +1255,6 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Renames a global graph output - * @param {String} old_name - * @param {String} new_name */ renameOutput(old_name: string, name: string): boolean | undefined { if (!this.outputs[old_name]) return false @@ -1300,8 +1275,6 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Changes the type of a global graph output - * @param {String} name - * @param {String} type */ changeOutputType(name: string, type: string): boolean | undefined { if (!this.outputs[name]) return false @@ -1320,7 +1293,6 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Removes a global graph output - * @param {String} name */ removeOutput(name: string): boolean { if (!this.outputs[name]) return false @@ -1400,9 +1372,7 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Configures a reroute on the graph where ID is already known (probably deserialisation). * Creates the object if it does not exist. - * @param id Reroute ID - * @param pos Position in graph space - * @param linkIds IDs of links that pass through this reroute + * @param serialisedReroute See {@link SerialisableReroute} */ setReroute({ id, parentId, pos, linkIds }: SerialisableReroute): Reroute { id ??= ++this.state.lastRerouteId @@ -1417,9 +1387,8 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Creates a new reroute and adds it to the graph. * @param pos Position in graph space - * @param links The links that will use this reroute (e.g. if from an output with multiple outputs, and all will use it) - * @param afterRerouteId If set, this reroute will be shown after the specified ID. - * Otherwise, the reroute will be added as the last on the link. + * @param before The existing link segment (reroute, link) that will be after this reroute, + * going from the node output to input. * @returns The newly created reroute - typically ignored. */ createReroute(pos: Point, before: LinkSegment): Reroute { @@ -1467,7 +1436,6 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Destroys a link - * @param {Number} link_id */ removeLink(link_id: LinkId): void { const link = this._links.get(link_id) @@ -1482,8 +1450,7 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Creates a Object containing all the info about this graph, it can be serialized * @deprecated Use {@link asSerialisable}, which returns the newer schema version. - * - * @return {Object} value of the node + * @returns value of the node */ serialize(option?: { sortNodes: boolean }): ISerialisedGraph { const { config, state, groups, nodes, reroutes, extra } = this.asSerialisable(option) @@ -1549,8 +1516,9 @@ export class LGraph implements LinkNetwork, Serialisable { /** * Configure a graph from a JSON string - * @param {String} str configure a graph from a JSON string - * @param {Boolean} returns if there was any error parsing + * @param data The deserialised object to configure this graph from + * @param keep_old If `true`, the graph will not be cleared prior to + * adding the configuration. */ configure( data: ISerialisedGraph | SerialisableGraph, diff --git a/src/LGraphCanvas.ts b/src/LGraphCanvas.ts index d545e8c62..22d81933f 100644 --- a/src/LGraphCanvas.ts +++ b/src/LGraphCanvas.ts @@ -175,13 +175,9 @@ interface ClipboardPasteResult { /** * This class is in charge of rendering one graph inside a canvas. And provides all the interaction required. * Valid callbacks are: onNodeSelected, onNodeDeselected, onShowNodePanel, onNodeDblClicked - * - * @param {HTMLCanvas} canvas the canvas where you want to render (it accepts a selector in string format or the canvas element itself) - * @param {LGraph} graph [optional] - * @param {Object} options [optional] { skip_rendering, autoresize, viewport } */ export class LGraphCanvas { - /* Interaction */ + // Optimised buffers used during rendering static #temp = new Float32Array(4) static #temp_vec2 = new Float32Array(2) static #tmp_area = new Float32Array(4) @@ -510,7 +506,7 @@ export class LGraphCanvas { this.options = options // if(graph === undefined) - // throw ("No graph assigned"); + // throw ("No graph assigned"); this.background_image = LGraphCanvas.DEFAULT_BACKGROUND_IMAGE this.ds = new DragAndScale() @@ -644,8 +640,8 @@ export class LGraphCanvas { /** * @deprecated Functionality moved to {@link getBoundaryNodes}. The new function returns null on failure, instead of an object with all null properties. * Determines the furthest nodes in each direction - * @param {Dictionary} nodes the nodes to from which boundary nodes will be extracted - * @return {{left: LGraphNode, top: LGraphNode, right: LGraphNode, bottom: LGraphNode}} + * @param nodes the nodes to from which boundary nodes will be extracted + * @returns */ static getBoundaryNodes( nodes: LGraphNode[] | Dictionary, @@ -663,9 +659,9 @@ export class LGraphCanvas { /** * @deprecated Functionality moved to {@link alignNodes}. The new function does not set dirty canvas. - * @param {Dictionary} nodes a list of nodes - * @param {"top"|"bottom"|"left"|"right"} direction Direction to align the nodes - * @param {LGraphNode?} align_to Node to align to (if null, align to the furthest node in the given direction) + * @param nodes a list of nodes + * @param direction Direction to align the nodes + * @param align_to Node to align to (if null, align to the furthest node in the given direction) */ static alignNodes( nodes: Dictionary, @@ -1584,8 +1580,7 @@ export class LGraphCanvas { /** * assigns a graph, you can reassign graphs to the same canvas - * - * @param {LGraph} graph + * @param graph */ setGraph(graph: LGraph, skip_clear: boolean): void { if (this.graph == graph) return @@ -1606,9 +1601,7 @@ export class LGraphCanvas { } /** - * returns the top level graph (in case there are subgraphs open on the canvas) - * - * @return {LGraph} graph + * @returns the top level graph (in case there are subgraphs open on the canvas) */ getTopGraph(): LGraph { return this._graph_stack.length @@ -1617,8 +1610,7 @@ export class LGraphCanvas { } /** - * returns the visually active graph (in case there are more in the stack) - * @return {LGraph} the active graph + * @returns the visually active graph (in case there are more in the stack) */ getCurrentGraph(): LGraph { return this.graph @@ -1644,7 +1636,6 @@ export class LGraphCanvas { /** * Sets the current HTML canvas element. * Calls bindEvents to add input event listeners, and (re)creates the background canvas. - * * @param canvas The canvas element to assign, or its HTML element ID. If null or undefined, the current reference is cleared. * @param skip_events If true, events on the previous canvas will not be removed. Has no effect on the first invocation. */ @@ -1708,7 +1699,7 @@ export class LGraphCanvas { /** * binds mouse, keyboard, touch and drag events to the canvas - **/ + */ bindEvents(): void { if (this._events_binded) { console.warn("LGraphCanvas: events already binded") @@ -1763,7 +1754,7 @@ export class LGraphCanvas { /** * unbinds mouse events from the canvas - **/ + */ unbindEvents(): void { if (!this._events_binded) { console.warn("LGraphCanvas: no events binded") @@ -1804,7 +1795,7 @@ export class LGraphCanvas { /** * this function allows to render the canvas using WebGL instead of Canvas2D * this is useful if you plant to render 3D objects inside your nodes, it uses litegl.js for webgl and canvas2DtoWebGL to emulate the Canvas2D calls in webGL - **/ + */ enableWebGL(): void { // TODO: Delete or move all webgl to a module and never load it. // @ts-expect-error @@ -1836,7 +1827,6 @@ export class LGraphCanvas { * Ensures the canvas will be redrawn on the next frame by setting the dirty flag(s). * Without parameters, this function does nothing. * @todo Impl. `setDirty()` or similar as shorthand to redraw everything. - * * @param fgcanvas If true, marks the foreground canvas as dirty (nodes and anything drawn on top of them). Default: false * @param bgcanvas If true, mark the background canvas as dirty (background, groups, links). Default: false */ @@ -1853,8 +1843,7 @@ export class LGraphCanvas { /** * Used to attach the canvas in a popup - * - * @return {window} returns the window where the canvas is attached (the DOM root node) + * @returns returns the window where the canvas is attached (the DOM root node) */ getCanvasWindow(): Window { if (!this.canvas) return window @@ -1952,8 +1941,8 @@ export class LGraphCanvas { * Clears highlight and mouse-over information from nodes that should not have it. * * Intended to be called when the pointer moves away from a node. - * @param {LGraphNode} node The node that the mouse is now over - * @param {MouseEvent} e MouseEvent that is triggering this + * @param node The node that the mouse is now over + * @param e MouseEvent that is triggering this */ updateMouseOverNodes(node: LGraphNode, e: CanvasMouseEvent): void { const nodes = this.graph._nodes @@ -2266,8 +2255,8 @@ export class LGraphCanvas { /** * Processes a pointerdown event inside the bounds of a node. Part of {@link processMouseDown}. - * @param ctrlOrMeta Ctrl or meta key is pressed * @param e The pointerdown event + * @param ctrlOrMeta Ctrl or meta key is pressed * @param node The node to process a click event for */ #processNodeClick( @@ -2734,7 +2723,7 @@ export class LGraphCanvas { /** * Called when a mouse move event has to be processed - **/ + */ processMouseMove(e: PointerEvent): void { if (this.autoresize) this.resize() @@ -3042,7 +3031,7 @@ export class LGraphCanvas { /** * Called when a mouse up event has to be processed - **/ + */ processMouseUp(e: PointerEvent): void { // early exit for extra pointer if (e.isPrimary === false) return @@ -3219,7 +3208,7 @@ export class LGraphCanvas { /** * Called when a mouse wheel event has to be processed - **/ + */ processMouseWheel(e: WheelEvent): void { if (!this.graph || !this.allow_dragcanvas) return @@ -3247,7 +3236,7 @@ export class LGraphCanvas { /** * returns the INDEX if a position (in graph space) is on top of a node input slot - **/ + */ isOverNodeInput( node: LGraphNode, canvasx: number, @@ -3296,7 +3285,7 @@ export class LGraphCanvas { /** * returns the INDEX if a position (in graph space) is on top of a node output slot - **/ + */ isOverNodeOutput( node: LGraphNode, canvasx: number, @@ -3340,7 +3329,7 @@ export class LGraphCanvas { /** * process a key event - **/ + */ processKey(e: KeyboardEvent): boolean | null { this.#shiftDown = e.shiftKey if (!this.graph) return @@ -3365,10 +3354,8 @@ export class LGraphCanvas { this.node_panel?.close() this.options_panel?.close() block_default = true - } - - // select all Control A - else if (e.keyCode == 65 && e.ctrlKey) { + } else if (e.keyCode == 65 && e.ctrlKey) { + // select all Control A this.selectItems() block_default = true } else if (e.keyCode === 67 && (e.metaKey || e.ctrlKey) && !e.shiftKey) { @@ -3380,10 +3367,8 @@ export class LGraphCanvas { } else if (e.keyCode === 86 && (e.metaKey || e.ctrlKey)) { // paste this.pasteFromClipboard(e.shiftKey) - } - - // delete or backspace - else if (e.keyCode == 46 || e.keyCode == 8) { + } else if (e.keyCode == 46 || e.keyCode == 8) { + // delete or backspace // @ts-expect-error if (e.target.localName != "input" && e.target.localName != "textarea") { this.deleteSelected() @@ -3643,7 +3628,7 @@ export class LGraphCanvas { /** * process a item drop event on top the canvas - **/ + */ processDrop(e: DragEvent): boolean { e.preventDefault() this.adjustMouseEvent(e) @@ -3909,7 +3894,7 @@ export class LGraphCanvas { /** * selects several nodes (or adds them to the current selection) * @deprecated See {@link LGraphCanvas.selectItems} - **/ + */ selectNodes(nodes?: LGraphNode[], add_to_current_selection?: boolean): void { this.selectItems(nodes, add_to_current_selection) } @@ -3967,7 +3952,6 @@ export class LGraphCanvas { /** * Deletes all selected items from the graph. - * * @todo Refactor deletion task to LGraph. Selection is a canvas property, delete is a graph action. */ deleteSelected(): void { @@ -4002,14 +3986,14 @@ export class LGraphCanvas { /** * deletes all nodes in the current selection from the graph * @deprecated See {@link LGraphCanvas.deleteSelected} - **/ + */ deleteSelectedNodes(): void { this.deleteSelected() } /** * centers the camera on a given node - **/ + */ centerOnNode(node: LGraphNode): void { const dpi = window?.devicePixelRatio || 1 this.ds.offset[0] = @@ -4025,7 +4009,7 @@ export class LGraphCanvas { /** * adds some useful properties to a mouse event, like the position in graph coordinates - **/ + */ adjustMouseEvent( e: T & Partial, ): asserts e is T & CanvasMouseEvent { @@ -4057,7 +4041,7 @@ export class LGraphCanvas { /** * changes the zoom level of the graph (default is 1), you can pass also a place used to pivot the zoom - **/ + */ setZoom(value: number, zooming_center: Point) { this.ds.changeScale(value, zooming_center) this.#dirty() @@ -4065,7 +4049,7 @@ export class LGraphCanvas { /** * converts a coordinate from graph coordinates to canvas2D coordinates - **/ + */ convertOffsetToCanvas(pos: Point, out: Point): Point { // @ts-expect-error Unused param return this.ds.convertOffsetToCanvas(pos, out) @@ -4073,7 +4057,7 @@ export class LGraphCanvas { /** * converts a coordinate from Canvas2D coordinates to graph space - **/ + */ convertCanvasToOffset(pos: Point, out?: Point): Point { return this.ds.convertCanvasToOffset(pos, out) } @@ -4090,7 +4074,7 @@ export class LGraphCanvas { /** * brings a node to front (above all other nodes) - **/ + */ bringToFront(node: LGraphNode): void { const i = this.graph._nodes.indexOf(node) if (i == -1) return @@ -4101,7 +4085,7 @@ export class LGraphCanvas { /** * sends a node to the back (below all other nodes) - **/ + */ sendToBack(node: LGraphNode): void { const i = this.graph._nodes.indexOf(node) if (i == -1) return @@ -4114,7 +4098,7 @@ export class LGraphCanvas { * Determines which nodes are visible and populates {@link out} with the results. * @param nodes The list of nodes to check - if falsy, all nodes in the graph will be checked * @param out Array to write visible nodes into - if falsy, a new array is created instead - * @returns {LGraphNode[]} Array passed ({@link out}), or a new array containing all visible nodes + * @returns Array passed ({@link out}), or a new array containing all visible nodes */ computeVisibleNodes(nodes?: LGraphNode[], out?: LGraphNode[]): LGraphNode[] { const visible_nodes = out || [] @@ -4133,7 +4117,7 @@ export class LGraphCanvas { /** * renders the whole canvas content, by rendering in two separated canvas, one containing the background grid and the connections, and one containing the nodes) - **/ + */ draw(force_canvas?: boolean, force_bgcanvas?: boolean): void { if (!this.canvas || this.canvas.width == 0 || this.canvas.height == 0) return @@ -4166,7 +4150,7 @@ export class LGraphCanvas { /** * draws the front canvas (the one containing all the nodes) - **/ + */ drawFrontCanvas(): void { this.dirty_canvas = false @@ -4481,7 +4465,7 @@ export class LGraphCanvas { /** * draws some useful stats in the corner of the canvas - **/ + */ renderInfo(ctx: CanvasRenderingContext2D, x: number, y: number): void { x = x || 10 y = y || this.canvas.offsetHeight - 80 @@ -4506,7 +4490,7 @@ export class LGraphCanvas { /** * draws the back canvas (the one containing the background and the connections) - **/ + */ drawBackCanvas(): void { const canvas = this.bgcanvas if ( @@ -4669,7 +4653,7 @@ export class LGraphCanvas { /** * draws the given node inside the canvas - **/ + */ drawNode(node: LGraphNode, ctx: CanvasRenderingContext2D): void { this.current_node = node @@ -5043,7 +5027,6 @@ export class LGraphCanvas { * @param fgcolor Foreground colour - used for text * @param bgcolor Background colour of the node * @param selected Whether to render the node as selected. Likely to be removed in future, as current usage is simply the selected property of the node. - * @param mouse_over Deprecated */ drawNodeShape( node: LGraphNode, @@ -5330,15 +5313,6 @@ export class LGraphCanvas { /** * Draws the selection bounding of an area. - * @param {CanvasRenderingContext2D} ctx - * @param {Vector4} area - * @param {{ - * shape: LiteGraph.Shape, - * title_height: number, - * title_mode: LiteGraph.TitleMode, - * fgcolor: string, - * padding: number, - * }} options */ drawSelectionBounding( ctx: CanvasRenderingContext2D, @@ -5417,7 +5391,7 @@ export class LGraphCanvas { * item would land if dropped. * @param ctx The 2D canvas context to draw on * @param item The item to draw a snap guide for - * @param snapTo The grid size to snap to + * @param shape The shape of the snap guide to draw * @todo Update to align snapping with boundingRect * @todo Shapes */ @@ -5647,15 +5621,14 @@ export class LGraphCanvas { /** * draws a link between two points * @param ctx Canvas 2D rendering context - * @param {vec2} a start pos - * @param {vec2} b end pos - * @param {Object} link the link object with all the link info - * @param {boolean} skip_border ignore the shadow of the link - * @param {boolean} flow show flow animation (for events) - * @param {string} color the color for the link - * @param {LinkDirection} start_dir the direction enum - * @param {LinkDirection} end_dir the direction enum - * @param {number} num_sublines number of sublines (useful to represent vec3 or rgb) + * @param a start pos + * @param b end pos + * @param link the link object with all the link info + * @param skip_border ignore the shadow of the link + * @param flow show flow animation (for events) + * @param color the color for the link + * @param start_dir the direction enum + * @param end_dir the direction enum */ renderLink( ctx: CanvasRenderingContext2D, @@ -6036,7 +6009,7 @@ export class LGraphCanvas { /** * draws the widgets stored inside a node - **/ + */ drawNodeWidgets( node: LGraphNode, posY: number, @@ -6304,7 +6277,7 @@ export class LGraphCanvas { /** * draws every group area in the background - **/ + */ drawGroups(canvas: HTMLCanvasElement, ctx: CanvasRenderingContext2D): void { if (!this.graph) return @@ -6342,7 +6315,7 @@ export class LGraphCanvas { /** * resizes the canvas to a given size, if no size is passed, then it tries to fill the parentNode * @todo Remove or rewrite - **/ + */ resize(width?: number, height?: number): void { if (!width && !height) { const parent = this.canvas.parentElement @@ -6363,7 +6336,6 @@ export class LGraphCanvas { /** * Determines the furthest nodes in each direction for the currently selected nodes - * @return {{left: LGraphNode, top: LGraphNode, right: LGraphNode, bottom: LGraphNode}} */ boundaryNodesForSelection(): NullableProperties { return LGraphCanvas.getBoundaryNodes(this.selected_nodes) @@ -7543,8 +7515,8 @@ export class LGraphCanvas { } else if (options.event) { offsetx += options.event.clientX offsety += options.event.clientY - } // centered - else { + } else { + // centered offsetx += this.canvas.width * 0.5 offsety += this.canvas.height * 0.5 } @@ -8277,7 +8249,6 @@ export class LGraphCanvas { /** * Starts an animation to fit the view around the specified selection of nodes. * @param bounds The bounds to animate the view to, defined by a rectangle. - * @param animationParameters Various parameters for the camera movement animation. */ animateToBounds( bounds: ReadOnlyRect, @@ -8357,5 +8328,6 @@ export type AnimationOptions = { duration?: number /** Relative target zoom level. 1 means the view is fit exactly on the bounding box. */ zoom?: number + /** The animation easing function (curve) */ easing?: EaseFunction } diff --git a/src/LGraphGroup.ts b/src/LGraphGroup.ts index 6ad5b2dd0..ee46f1740 100644 --- a/src/LGraphGroup.ts +++ b/src/LGraphGroup.ts @@ -42,6 +42,7 @@ export class LGraphGroup implements Positionable, IPinnable { LGraphGroup.minWidth, LGraphGroup.minHeight, ]) + _pos: Point = this._bounding.subarray(0, 2) _size: Size = this._bounding.subarray(2, 4) /** @deprecated See {@link _children} */ @@ -107,7 +108,7 @@ export class LGraphGroup implements Positionable, IPinnable { /** * Prevents the group being accidentally moved or resized by mouse interaction. * Toggles pinned state if no value is provided. - **/ + */ pin(value?: boolean): void { const newState = value === undefined ? !this.pinned : value @@ -142,8 +143,8 @@ export class LGraphGroup implements Positionable, IPinnable { /** * Draws the group on the canvas - * @param {LGraphCanvas} graphCanvas - * @param {CanvasRenderingContext2D} ctx + * @param graphCanvas + * @param ctx */ draw(graphCanvas: LGraphCanvas, ctx: CanvasRenderingContext2D): void { const { padding, resizeLength, defaultColour } = LGraphGroup @@ -269,9 +270,8 @@ export class LGraphGroup implements Positionable, IPinnable { /** * Add nodes to the group and adjust the group's position and size accordingly - * @param {LGraphNode[]} nodes - The nodes to add to the group - * @param {number} [padding=10] - The padding around the group - * @returns {void} + * @param nodes The nodes to add to the group + * @param padding The padding around the group */ addNodes(nodes: LGraphNode[], padding: number = 10): void { if (!this._nodes && nodes.length === 0) return diff --git a/src/LGraphNode.ts b/src/LGraphNode.ts index 2cb861759..dd559773b 100644 --- a/src/LGraphNode.ts +++ b/src/LGraphNode.ts @@ -96,8 +96,8 @@ flags object: supported callbacks: + onAdded: when added to graph (warning: this is called BEFORE the node is configured when loading) + onRemoved: when removed from graph - + onStart: when the graph starts playing - + onStop: when the graph stops playing + + onStart: when the graph starts playing + + onStop: when the graph stops playing + onDrawForeground: render the inside widgets inside the node + onDrawBackground: render the background area inside the node (only in edit mode) + onMouseDown @@ -126,14 +126,16 @@ supported callbacks: + getExtraMenuOptions: to add option to context menu */ +// eslint-disable-next-line @typescript-eslint/no-unsafe-declaration-merging export interface LGraphNode { constructor: LGraphNodeConstructor } /** * Base Class for all the node type classes - * @param {String} name a name for the node + * @param {string} name a name for the node */ +// eslint-disable-next-line @typescript-eslint/no-unsafe-declaration-merging export class LGraphNode implements Positionable, IPinnable { // Static properties used by dynamic child classes static title?: string @@ -515,8 +517,8 @@ export class LGraphNode implements Positionable, IPinnable { } else { this[j] = LiteGraph.cloneObject(info[j], this[j]) } - } // value - else { + } else { + // value this[j] = info[j] } } @@ -678,8 +680,8 @@ export class LGraphNode implements Positionable, IPinnable { /** * sets the value of a property - * @param {String} name - * @param {*} value + * @param name + * @param value */ setProperty(name: string, value: TWidgetValue): void { this.properties ||= {} @@ -707,15 +709,15 @@ export class LGraphNode implements Positionable, IPinnable { /** * sets the output data - * @param {number} slot - * @param {*} data + * @param slot + * @param data */ setOutputData(slot: number, data: unknown): void { if (!this.outputs) return // this maybe slow and a niche case // if(slot && slot.constructor === String) - // slot = this.findOutputSlot(slot); + // slot = this.findOutputSlot(slot); if (slot == -1 || slot >= this.outputs.length) return const output_info = this.outputs[slot] @@ -736,8 +738,6 @@ export class LGraphNode implements Positionable, IPinnable { /** * sets the output data type, useful when you want to be able to overwrite the data type - * @param {number} slot - * @param {String} datatype */ setOutputDataType(slot: number, type: ISlotType): void { if (!this.outputs) return @@ -758,9 +758,9 @@ export class LGraphNode implements Positionable, IPinnable { /** * Retrieves the input data (data traveling through the connection) from one slot - * @param {number} slot - * @param {boolean} force_update if set to true it will force the connected node of this slot to output data into this link - * @return {*} data or if it is not connected returns undefined + * @param slot + * @param force_update if set to true it will force the connected node of this slot to output data into this link + * @returns data or if it is not connected returns undefined */ getInputData(slot: number, force_update?: boolean): unknown { if (!this.inputs) return @@ -789,8 +789,8 @@ export class LGraphNode implements Positionable, IPinnable { /** * Retrieves the input data type (in case this supports multiple input types) - * @param {number} slot - * @return {String} datatype in string format + * @param slot + * @returns datatype in string format */ getInputDataType(slot: number): ISlotType { if (!this.inputs) return null @@ -812,9 +812,9 @@ export class LGraphNode implements Positionable, IPinnable { /** * Retrieves the input data from one slot using its name instead of slot number - * @param {String} slot_name - * @param {boolean} force_update if set to true it will force the connected node of this slot to output data into this link - * @return {*} data or if it is not connected returns null + * @param slot_name + * @param force_update if set to true it will force the connected node of this slot to output data into this link + * @returns data or if it is not connected returns null */ getInputDataByName(slot_name: string, force_update: boolean): unknown { const slot = this.findInputSlot(slot_name) @@ -825,8 +825,8 @@ export class LGraphNode implements Positionable, IPinnable { /** * tells you if there is a connection in one input slot - * @param {number} slot - * @return {boolean} + * @param slot The 0-based index of the input to check + * @returns `true` if the input slot has a link ID (does not perform validation) */ isInputConnected(slot: number): boolean { if (!this.inputs) return false @@ -835,8 +835,7 @@ export class LGraphNode implements Positionable, IPinnable { /** * tells you info about an input connection (which node, type, etc) - * @param {number} slot - * @return {Object} object or null { link: id, name: string, type: string or 0 } + * @returns object or null { link: id, name: string, type: string or 0 } */ getInputInfo(slot: number): INodeInputSlot { return !this.inputs || !(slot < this.inputs.length) @@ -846,8 +845,7 @@ export class LGraphNode implements Positionable, IPinnable { /** * Returns the link info in the connection of an input slot - * @param {number} slot - * @return {LLink} object or null + * @returns object or null */ getInputLink(slot: number): LLink | null { if (!this.inputs) return null @@ -860,8 +858,7 @@ export class LGraphNode implements Positionable, IPinnable { /** * returns the node connected in the input slot - * @param {number} slot - * @return {LGraphNode} node or null + * @returns node or null */ getInputNode(slot: number): LGraphNode { if (!this.inputs) return null @@ -878,8 +875,7 @@ export class LGraphNode implements Positionable, IPinnable { /** * returns the value of an input with this name, otherwise checks if there is a property with that name - * @param {string} name - * @return {*} value + * @returns value */ getInputOrProperty(name: string): unknown { if (!this.inputs || !this.inputs.length) { @@ -898,8 +894,7 @@ export class LGraphNode implements Positionable, IPinnable { /** * tells you the last output data that went in that slot - * @param {number} slot - * @return {Object} object or null + * @returns object or null */ getOutputData(slot: number): unknown { if (!this.outputs) return null @@ -911,8 +906,7 @@ export class LGraphNode implements Positionable, IPinnable { /** * tells you info about an output connection (which node, type, etc) - * @param {number} slot - * @return {Object} object or null { name: string, type: string, links: [ ids of links in number ] } + * @returns object or null { name: string, type: string, links: [ ids of links in number ] } */ getOutputInfo(slot: number): INodeOutputSlot { return !this.outputs || !(slot < this.outputs.length) @@ -922,8 +916,6 @@ export class LGraphNode implements Positionable, IPinnable { /** * tells you if there is a connection in one output slot - * @param {number} slot - * @return {boolean} */ isOutputConnected(slot: number): boolean { if (!this.outputs) return false @@ -932,7 +924,6 @@ export class LGraphNode implements Positionable, IPinnable { /** * tells you if there is any connection in the output slots - * @return {boolean} */ isAnyOutputConnected(): boolean { if (!this.outputs) return false @@ -947,8 +938,6 @@ export class LGraphNode implements Positionable, IPinnable { /** * retrieves all the nodes connected to this output slot - * @param {number} slot - * @return {array} */ getOutputNodes(slot: number): LGraphNode[] { if (!this.outputs || this.outputs.length == 0) return null @@ -1039,8 +1028,6 @@ export class LGraphNode implements Positionable, IPinnable { /** * Triggers the node code execution, place a boolean/counter to mark the node as being executed - * @param {*} param - * @param {*} options */ doExecute(param?: unknown, options?: { action_call?: any }): void { options = options || {} @@ -1065,8 +1052,7 @@ export class LGraphNode implements Positionable, IPinnable { /** * Triggers an action, wrapped by logics to control execution flow - * @param {String} action name - * @param {*} param + * @param action name */ actionDo( action: string, @@ -1094,8 +1080,7 @@ export class LGraphNode implements Positionable, IPinnable { /** * Triggers an event in this node, this will trigger any output with the same name - * @param {String} event name ( "on_play", ... ) if action is equivalent to false then the event is send to all - * @param {*} param + * @param action name ( "on_play", ... ) if action is equivalent to false then the event is send to all */ trigger( action: string, @@ -1122,9 +1107,8 @@ export class LGraphNode implements Positionable, IPinnable { /** * Triggers a slot event in this node: cycle output slots and launch execute/action on connected nodes - * @param {Number} slot the index of the output slot - * @param {*} param - * @param {Number} link_id [optional] in case you want to trigger and specific output link in a slot + * @param slot the index of the output slot + * @param link_id [optional] in case you want to trigger and specific output link in a slot */ triggerSlot( slot: number, @@ -1186,8 +1170,8 @@ export class LGraphNode implements Positionable, IPinnable { /** * clears the trigger slot animation - * @param {Number} slot the index of the output slot - * @param {Number} link_id [optional] in case you want to trigger and specific output link in a slot + * @param slot the index of the output slot + * @param link_id [optional] in case you want to trigger and specific output link in a slot */ clearTriggeredSlot(slot: number, link_id: number): void { if (!this.outputs) return @@ -1214,7 +1198,6 @@ export class LGraphNode implements Positionable, IPinnable { /** * changes node size and triggers callback - * @param {vec2} size */ setSize(size: Size): void { this.size = size @@ -1223,10 +1206,8 @@ export class LGraphNode implements Positionable, IPinnable { /** * add a new property to this node - * @param {string} name - * @param {*} default_value - * @param {string} type string defining the output type ("vec3","number",...) - * @param {Object} extra_info this can be used to have special properties of the property (like values, etc) + * @param type string defining the output type ("vec3","number",...) + * @param extra_info this can be used to have special properties of the property (like values, etc) */ addProperty( name: string, @@ -1253,9 +1234,8 @@ export class LGraphNode implements Positionable, IPinnable { /** * add a new output slot to use in this node - * @param {string} name - * @param {string} type string defining the output type ("vec3","number",...) - * @param {Object} extra_info this can be used to have special properties of an output (label, special color, position, etc) + * @param type string defining the output type ("vec3","number",...) + * @param extra_info this can be used to have special properties of an output (label, special color, position, etc) */ addOutput( name?: string, @@ -1283,7 +1263,7 @@ export class LGraphNode implements Positionable, IPinnable { /** * add a new output slot to use in this node - * @param {Array} array of triplets like [[name,type,extra_info],[...]] + * @param array of triplets like [[name,type,extra_info],[...]] */ addOutputs(array: [string, ISlotType, Record][]): void { for (let i = 0; i < array.length; ++i) { @@ -1309,7 +1289,6 @@ export class LGraphNode implements Positionable, IPinnable { /** * remove an existing output slot - * @param {number} slot */ removeOutput(slot: number): void { this.disconnectOutput(slot) @@ -1333,9 +1312,8 @@ export class LGraphNode implements Positionable, IPinnable { /** * add a new input slot to use in this node - * @param {string} name - * @param {string} type string defining the input type ("vec3","number",...), it its a generic one use 0 - * @param {Object} extra_info this can be used to have special properties of an input (label, color, position, etc) + * @param type string defining the input type ("vec3","number",...), it its a generic one use 0 + * @param extra_info this can be used to have special properties of an input (label, color, position, etc) */ addInput(name: string, type: ISlotType, extra_info?: object): INodeInputSlot { type = type || 0 @@ -1359,7 +1337,7 @@ export class LGraphNode implements Positionable, IPinnable { /** * add several new input slots in this node - * @param {Array} array of triplets like [[name,type,extra_info],[...]] + * @param array of triplets like [[name,type,extra_info],[...]] */ addInputs(array: [string, ISlotType, Record][]): void { for (let i = 0; i < array.length; ++i) { @@ -1385,7 +1363,6 @@ export class LGraphNode implements Positionable, IPinnable { /** * remove an existing input slot - * @param {number} slot */ removeInput(slot: number): void { this.disconnectInput(slot) @@ -1405,10 +1382,9 @@ export class LGraphNode implements Positionable, IPinnable { /** * add an special connection to this node (used for special kinds of graphs) - * @param {string} name - * @param {string} type string defining the input type ("vec3","number",...) - * @param {[x,y]} pos position of the connection inside the node - * @param {string} direction if is input or output + * @param type string defining the input type ("vec3","number",...) + * @param pos position of the connection inside the node + * @param direction if is input or output */ addConnection(name: string, type: string, pos: Point, direction: string) { const o = { @@ -1424,8 +1400,7 @@ export class LGraphNode implements Positionable, IPinnable { /** * computes the minimum size of a node according to its inputs and output slots - * @param out - * @return the total size + * @returns the total size */ computeSize(out?: Size): Size { const ctorSize = this.constructor.size @@ -1522,9 +1497,8 @@ export class LGraphNode implements Positionable, IPinnable { /** * returns all the info available about a property of this node. - * - * @param {String} property name of the property - * @return {Object} the object with all the available info + * @param property name of the property + * @returns the object with all the available info */ getPropertyInfo(property: string) { let info = null @@ -1560,13 +1534,12 @@ export class LGraphNode implements Positionable, IPinnable { /** * Defines a widget inside the node, it will be rendered on top of the node, you can control lots of properties - * - * @param {String} type the widget type (could be "number","string","combo" - * @param {String} name the text to show on the widget - * @param {String} value the default value - * @param {Function|String} callback function to call when it changes (optionally, it can be the name of the property to modify) - * @param {Object} options the object that contains special properties of this widget - * @return {Object} the created widget object + * @param type the widget type (could be "number","string","combo" + * @param name the text to show on the widget + * @param value the default value + * @param callback function to call when it changes (optionally, it can be the name of the property to modify) + * @param options the object that contains special properties of this widget + * @returns the created widget object */ addWidget( type: string, @@ -1666,7 +1639,7 @@ export class LGraphNode implements Positionable, IPinnable { * @param out {Float32Array[4]?} [optional] a place to store the output, to free garbage * @param includeExternal {boolean?} [optional] set to true to * include the shadow and connection points in the bounding calculation - * @return {Float32Array[4]} the bounding box in format of [topleft_cornerx, topleft_cornery, width, height] + * @returns the bounding box in format of [topleft_cornerx, topleft_cornery, width, height] */ getBounding(out?: Rect, includeExternal?: boolean): Rect { out ||= new Float32Array(4) @@ -1702,9 +1675,6 @@ export class LGraphNode implements Positionable, IPinnable { /** * checks if a point is inside the shape of a node - * @param {number} x - * @param {number} y - * @return {boolean} */ isPointInside(x: number, y: number): boolean { return isInRect(x, y, this.boundingRect) @@ -1802,7 +1772,7 @@ export class LGraphNode implements Positionable, IPinnable { /** * Returns the input slot with a given name (used for dynamic slots), -1 if not found - * @param name the name of the slot + * @param name the name of the slot to find * @param returnObj if the obj itself wanted * @returns the slot (-1 if not found) */ @@ -1821,9 +1791,9 @@ export class LGraphNode implements Positionable, IPinnable { /** * returns the output slot with a given name (used for dynamic slots), -1 if not found - * @param {string} name the name of the slot - * @param {boolean} returnObj if the obj itself wanted - * @return {number | INodeOutputSlot} the slot (-1 if not found) + * @param name the name of the slot to find + * @param returnObj if the obj itself wanted + * @returns the slot (-1 if not found) */ findOutputSlot(name: string, returnObj?: TReturn): number findOutputSlot(name: string, returnObj?: TReturn): INodeOutputSlot @@ -1840,8 +1810,8 @@ export class LGraphNode implements Positionable, IPinnable { /** * Finds the first free input slot. - * @param {object} optsIn - * @return The index of the first matching slot, the slot itself if returnObj is true, or -1 if not found. + * @param optsIn + * @returns The index of the first matching slot, the slot itself if returnObj is true, or -1 if not found. */ findInputSlotFree( optsIn?: FindFreeSlotOptions & { returnObj?: TReturn }, @@ -1855,8 +1825,8 @@ export class LGraphNode implements Positionable, IPinnable { /** * Finds the first free output slot. - * @param {object} optsIn - * @return The index of the first matching slot, the slot itself if returnObj is true, or -1 if not found. + * @param optsIn + * @returns The index of the first matching slot, the slot itself if returnObj is true, or -1 if not found. */ findOutputSlotFree( optsIn?: FindFreeSlotOptions & { returnObj?: TReturn }, @@ -1871,7 +1841,6 @@ export class LGraphNode implements Positionable, IPinnable { /** * Finds the next free slot * @param slots The slots to search, i.e. this.inputs or this.outputs - * @param options Options */ #findFreeSlot( slots: TSlot[], @@ -1956,11 +1925,11 @@ export class LGraphNode implements Positionable, IPinnable { /** * returns the output (or input) slot with a given type, -1 if not found - * @param {boolean} input uise inputs instead of outputs - * @param {string} type the type of the slot - * @param {boolean} returnObj if the obj itself wanted - * @param {boolean} preferFreeSlot if we want a free slot (if not found, will return the first of the type anyway) - * @return {number_or_object} the slot (-1 if not found) + * @param input uise inputs instead of outputs + * @param type the type of the slot to find + * @param returnObj if the obj itself wanted + * @param preferFreeSlot if we want a free slot (if not found, will return the first of the type anyway) + * @returns the slot (-1 if not found) */ findSlotByType( input: TSlot, @@ -2067,7 +2036,6 @@ export class LGraphNode implements Positionable, IPinnable { /** * Determines the slot index to connect to when attempting to connect by type. - * * @param findInputs If true, searches for an input. Otherwise, an output. * @param node The node at the other end of the connection. * @param slotType The type of slot at the other end of the connection. @@ -2127,10 +2095,10 @@ export class LGraphNode implements Positionable, IPinnable { /** * connect this node output to the input of another node BY TYPE - * @param {number} slot (could be the number of the slot or the string with the name of the slot) - * @param {LGraphNode} target_node the target node - * @param {string} target_slotType the input slot type of the target node - * @return {Object} the link_info is created, otherwise null + * @param slot (could be the number of the slot or the string with the name of the slot) + * @param target_node the target node + * @param target_slotType the input slot type of the target node + * @returns the link_info is created, otherwise null */ connectByType( slot: number | string, @@ -2153,11 +2121,10 @@ export class LGraphNode implements Positionable, IPinnable { /** * connect this node input to the output of another node BY TYPE - * @method connectByType - * @param {number | string} slot (could be the number of the slot or the string with the name of the slot) - * @param {LGraphNode} source_node the target node - * @param {string} source_slotType the output slot type of the target node - * @return {Object} the link_info is created, otherwise null + * @param slot (could be the number of the slot or the string with the name of the slot) + * @param source_node the target node + * @param source_slotType the output slot type of the target node + * @returns the link_info is created, otherwise null */ connectByTypeOutput( slot: number | string, @@ -2185,10 +2152,10 @@ export class LGraphNode implements Positionable, IPinnable { /** * Connect an output of this node to an input of another node - * @param {number | string} slot (could be the number of the slot or the string with the name of the slot) - * @param {LGraphNode} target_node the target node - * @param {number | string} target_slot the input slot of the target node (could be the number of the slot or the string with the name of the slot, or -1 to connect a trigger) - * @return {Object} the link_info is created, otherwise null + * @param slot (could be the number of the slot or the string with the name of the slot) + * @param target_node the target node + * @param target_slot the input slot of the target node (could be the number of the slot or the string with the name of the slot, or -1 to connect a trigger) + * @returns the link_info is created, otherwise null */ connect( slot: number | string, @@ -2371,10 +2338,10 @@ export class LGraphNode implements Positionable, IPinnable { /** * disconnect one output to an specific node - * @param {number_or_string} slot (could be the number of the slot or the string with the name of the slot) - * @param {LGraphNode} target_node the target node to which this slot is connected [Optional, + * @param slot (could be the number of the slot or the string with the name of the slot) + * @param target_node the target node to which this slot is connected [Optional, * if not target_node is specified all nodes will be disconnected] - * @return {boolean} if it was disconnected successfully + * @returns if it was disconnected successfully */ disconnectOutput(slot: string | number, target_node?: LGraphNode): boolean { if (typeof slot === "string") { @@ -2434,8 +2401,8 @@ export class LGraphNode implements Positionable, IPinnable { break } } - } // all the links in this output slot - else { + } else { + // all the links in this output slot for (let i = 0, l = output.links.length; i < l; i++) { const link_id = output.links[i] const link_info = graph._links.get(link_id) @@ -2484,7 +2451,7 @@ export class LGraphNode implements Positionable, IPinnable { * Disconnect one input * @param slot Input slot index, or the name of the slot * @param keepReroutes If `true`, reroutes will not be garbage collected. - * @return true if disconnected successfully or already disconnected, otherwise false + * @returns true if disconnected successfully or already disconnected, otherwise false */ disconnectInput(slot: number | string, keepReroutes?: boolean): boolean { // Allow search by string @@ -2555,11 +2522,11 @@ export class LGraphNode implements Positionable, IPinnable { /** * returns the center of a connection point in canvas coords - * @param {boolean} is_input true if if a input slot, false if it is an output - * @param {number_or_string} slot (could be the number of the slot or the string with the name of the slot) - * @param {vec2} out [optional] a place to store the output, to free garbage - * @return {[x,y]} the position - **/ + * @param is_input true if if a input slot, false if it is an output + * @param slot_number (could be the number of the slot or the string with the name of the slot) + * @param out [optional] a place to store the output, to free garbage + * @returns the position + */ getConnectionPos(is_input: boolean, slot_number: number, out?: Point): Point { out ||= new Float32Array(2) @@ -2697,7 +2664,7 @@ export class LGraphNode implements Positionable, IPinnable { /** * Toggle node collapse (makes it smaller on the canvas) - **/ + */ collapse(force?: boolean): void { if (!this.collapsible && !force) return this.graph._version++ @@ -2729,7 +2696,7 @@ export class LGraphNode implements Positionable, IPinnable { /** * Prevents the node being accidentally moved or resized by mouse interaction. * Toggles pinned state if no value is provided. - **/ + */ pin(v?: boolean): void { this.graph._version++ this.flags.pinned = v === undefined @@ -2791,7 +2758,6 @@ export class LGraphNode implements Positionable, IPinnable { * * If {@link flags}.{@link INodeFlags.keepAllLinksOnBypass keepAllLinksOnBypass} is `undefined`, it will fall back to * the static {@link keepAllLinksOnBypass}. - * * @returns `true` if any new links were established, otherwise `false`. * @todo Decision: Change API to return array of new links instead? */ diff --git a/src/LiteGraphGlobal.ts b/src/LiteGraphGlobal.ts index b779113a9..f1651c389 100644 --- a/src/LiteGraphGlobal.ts +++ b/src/LiteGraphGlobal.ts @@ -68,9 +68,12 @@ export class LiteGraphGlobal { EVENT_LINK_COLOR = "#A86" CONNECTING_LINK_COLOR = "#AFA" - MAX_NUMBER_OF_NODES = 10000 // avoid infinite loops - DEFAULT_POSITION = [100, 100] // default node position - VALID_SHAPES = ["default", "box", "round", "card"] // ,"circle" + /** avoid infinite loops */ + MAX_NUMBER_OF_NODES = 10000 + /** default node position */ + DEFAULT_POSITION = [100, 100] + /** ,"circle" */ + VALID_SHAPES = ["default", "box", "round", "card"] // shapes are used for nodes but also for slots BOX_SHAPE = RenderShape.BOX @@ -78,18 +81,23 @@ export class LiteGraphGlobal { CIRCLE_SHAPE = RenderShape.CIRCLE CARD_SHAPE = RenderShape.CARD ARROW_SHAPE = RenderShape.ARROW - GRID_SHAPE = RenderShape.GRID // intended for slot arrays + /** intended for slot arrays */ + GRID_SHAPE = RenderShape.GRID // enums INPUT = NodeSlotType.INPUT OUTPUT = NodeSlotType.OUTPUT // TODO: -1 can lead to ambiguity in JS; these should be updated to a more explicit constant or Symbol. - EVENT = -1 as const // for outputs - ACTION = -1 as const // for inputs + /** for outputs */ + EVENT = -1 as const + /** for inputs */ + ACTION = -1 as const - NODE_MODES = ["Always", "On Event", "Never", "On Trigger"] // helper, will add "On Request" and more in the future - NODE_MODES_COLORS = ["#666", "#422", "#333", "#224", "#626"] // use with node_box_coloured_by_mode + /** helper, will add "On Request" and more in the future */ + NODE_MODES = ["Always", "On Event", "Never", "On Trigger"] + /** use with node_box_coloured_by_mode */ + NODE_MODES_COLORS = ["#666", "#422", "#333", "#224", "#626"] ALWAYS = LGraphEventMode.ALWAYS ON_EVENT = LGraphEventMode.ON_EVENT NEVER = LGraphEventMode.NEVER @@ -101,7 +109,8 @@ export class LiteGraphGlobal { RIGHT = LinkDirection.RIGHT CENTER = LinkDirection.CENTER - LINK_RENDER_MODES = ["Straight", "Linear", "Spline"] // helper + /** helper */ + LINK_RENDER_MODES = ["Straight", "Linear", "Spline"] HIDDEN_LINK = LinkRenderType.HIDDEN_LINK STRAIGHT_LINK = LinkRenderType.STRAIGHT_LINK LINEAR_LINK = LinkRenderType.LINEAR_LINK @@ -112,63 +121,114 @@ export class LiteGraphGlobal { TRANSPARENT_TITLE = TitleMode.TRANSPARENT_TITLE AUTOHIDE_TITLE = TitleMode.AUTOHIDE_TITLE - VERTICAL_LAYOUT = "vertical" // arrange nodes vertically + /** arrange nodes vertically */ + VERTICAL_LAYOUT = "vertical" - proxy = null // used to redirect calls + /** used to redirect calls */ + proxy = null node_images_path = "" debug = false catch_exceptions = true throw_errors = true allow_scripts = false // if set to true some nodes like Formula would be allowed to evaluate code that comes from unsafe sources (like node configuration), which could lead to exploits - registered_node_types: Record = {} // nodetypes by string - node_types_by_file_extension = {} // used for dropping files in the canvas - Nodes: Record = {} // node types by classname - Globals = {} // used to store vars between graphs + /** nodetypes by string */ + registered_node_types: Record = {} + /** used for dropping files in the canvas */ + node_types_by_file_extension = {} + /** node types by classname */ + Nodes: Record = {} + /** used to store vars between graphs */ + Globals = {} - searchbox_extras = {} // used to add extra features to the search box - auto_sort_node_types = false // [true!] If set to true, will automatically sort node types / categories in the context menus + /** used to add extra features to the search box */ + searchbox_extras = {} + /** [true!] If set to true, will automatically sort node types / categories in the context menus */ + auto_sort_node_types = false - node_box_coloured_when_on = false // [true!] this make the nodes box (top left circle) coloured when triggered (execute/action), visual feedback - node_box_coloured_by_mode = false // [true!] nodebox based on node mode, visual feedback + /** [true!] this make the nodes box (top left circle) coloured when triggered (execute/action), visual feedback */ + node_box_coloured_when_on = false + /** [true!] nodebox based on node mode, visual feedback */ + node_box_coloured_by_mode = false - dialog_close_on_mouse_leave = false // [false on mobile] better true if not touch device, TODO add an helper/listener to close if false + /** [false on mobile] better true if not touch device, TODO add an helper/listener to close if false */ + dialog_close_on_mouse_leave = false dialog_close_on_mouse_leave_delay = 500 - shift_click_do_break_link_from = false // [false!] prefer false if results too easy to break links - implement with ALT or TODO custom keys - click_do_break_link_to = false // [false!]prefer false, way too easy to break links - ctrl_alt_click_do_break_link = true // [true!] who accidentally ctrl-alt-clicks on an in/output? nobody! that's who! - snaps_for_comfy = true // [true!] snaps links when dragging connections over valid targets - snap_highlights_node = true // [true!] renders a partial border to highlight when a dragged link is snapped to a node + /** [false!] prefer false if results too easy to break links - implement with ALT or TODO custom keys */ + shift_click_do_break_link_from = false + /** [false!]prefer false, way too easy to break links */ + click_do_break_link_to = false + /** [true!] who accidentally ctrl-alt-clicks on an in/output? nobody! that's who! */ + ctrl_alt_click_do_break_link = true + /** [true!] snaps links when dragging connections over valid targets */ + snaps_for_comfy = true + /** [true!] renders a partial border to highlight when a dragged link is snapped to a node */ + snap_highlights_node = true - search_hide_on_mouse_leave = true // [false on mobile] better true if not touch device, TODO add an helper/listener to close if false - search_filter_enabled = false // [true!] enable filtering slots type in the search widget, !requires auto_load_slot_types or manual set registered_slot_[in/out]_types and slot_types_[in/out] - search_show_all_on_open = true // [true!] opens the results list when opening the search widget + /** [false on mobile] better true if not touch device, TODO add an helper/listener to close if false */ + search_hide_on_mouse_leave = true + /** + * [true!] enable filtering slots type in the search widget + * !requires auto_load_slot_types or manual set registered_slot_[in/out]_types and slot_types_[in/out] + */ + search_filter_enabled = false + /** [true!] opens the results list when opening the search widget */ + search_show_all_on_open = true - auto_load_slot_types = false // [if want false, use true, run, get vars values to be statically set, than disable] nodes types and nodeclass association with node types need to be calculated, if dont want this, calculate once and set registered_slot_[in/out]_types and slot_types_[in/out] + /** + * [if want false, use true, run, get vars values to be statically set, than disable] + * nodes types and nodeclass association with node types need to be calculated, + * if dont want this, calculate once and set registered_slot_[in/out]_types and slot_types_[in/out] + */ + auto_load_slot_types = false // set these values if not using auto_load_slot_types - registered_slot_in_types: Record = {} // slot types for nodeclass - registered_slot_out_types: Record = {} // slot types for nodeclass - slot_types_in: string[] = [] // slot types IN - slot_types_out: string[] = [] // slot types OUT - slot_types_default_in: Record = {} // specify for each IN slot type a(/many) default node(s), use single string, array, or object (with node, title, parameters, ..) like for search - slot_types_default_out: Record = {} // specify for each OUT slot type a(/many) default node(s), use single string, array, or object (with node, title, parameters, ..) like for search + /** slot types for nodeclass */ + registered_slot_in_types: Record = {} + /** slot types for nodeclass */ + registered_slot_out_types: Record = {} + /** slot types IN */ + slot_types_in: string[] = [] + /** slot types OUT */ + slot_types_out: string[] = [] + /** + * specify for each IN slot type a(/many) default node(s), use single string, array, or object + * (with node, title, parameters, ..) like for search + */ + slot_types_default_in: Record = {} + /** + * specify for each OUT slot type a(/many) default node(s), use single string, array, or object + * (with node, title, parameters, ..) like for search + */ + slot_types_default_out: Record = {} - alt_drag_do_clone_nodes = false // [true!] very handy, ALT click to clone and drag the new node + /** [true!] very handy, ALT click to clone and drag the new node */ + alt_drag_do_clone_nodes = false - do_add_triggers_slots = false // [true!] will create and connect event slots when using action/events connections, !WILL CHANGE node mode when using onTrigger (enable mode colors), onExecuted does not need this + /** + * [true!] will create and connect event slots when using action/events connections, + * !WILL CHANGE node mode when using onTrigger (enable mode colors), onExecuted does not need this + */ + do_add_triggers_slots = false - allow_multi_output_for_events = true // [false!] being events, it is strongly reccomended to use them sequentially, one by one + /** [false!] being events, it is strongly reccomended to use them sequentially, one by one */ + allow_multi_output_for_events = true - middle_click_slot_add_default_node = false // [true!] allows to create and connect a ndoe clicking with the third button (wheel) + /** [true!] allows to create and connect a ndoe clicking with the third button (wheel) */ + middle_click_slot_add_default_node = false - release_link_on_empty_shows_menu = false // [true!] dragging a link to empty space will open a menu, add from list, search or defaults + /** [true!] dragging a link to empty space will open a menu, add from list, search or defaults */ + release_link_on_empty_shows_menu = false - pointerevents_method = "pointer" // "mouse"|"pointer" use mouse for retrocompatibility issues? (none found @ now) + /** "mouse"|"pointer" use mouse for retrocompatibility issues? (none found @ now) */ + pointerevents_method = "pointer" - // TODO implement pointercancel, gotpointercapture, lostpointercapture, (pointerover, pointerout if necessary) - ctrl_shift_v_paste_connect_unselected_outputs = true // [true!] allows ctrl + shift + v to paste nodes with the outputs of the unselected nodes connected with the inputs of the newly pasted nodes + /** + * [true!] allows ctrl + shift + v to paste nodes with the outputs of the unselected nodes connected + * with the inputs of the newly pasted nodes + */ + ctrl_shift_v_paste_connect_unselected_outputs = true // if true, all newly created nodes/links will use string UUIDs for their id fields instead of integers. // use this if you must have node IDs that are unique across all graphs and subgraphs. @@ -219,8 +279,8 @@ export class LiteGraphGlobal { /** * Register a node class so it can be listed when the user wants to create a new one - * @param {String} type name of the node and path - * @param {Class} base_class class containing the structure of a node + * @param type name of the node and path + * @param base_class class containing the structure of a node */ registerNodeType(type: string, base_class: typeof LGraphNode): void { if (!base_class.prototype) @@ -302,7 +362,7 @@ export class LiteGraphGlobal { /** * removes a node type from the system - * @param {String|Object} type name of the node or the node constructor itself + * @param type name of the node or the node constructor itself */ unregisterNodeType(type: string | typeof LGraphNode): void { const base_class = typeof type === "string" @@ -318,8 +378,8 @@ export class LiteGraphGlobal { /** * Save a slot type and his node - * @param {String|Object} type name of the node or the node constructor itself - * @param {String} slot_type name of the slot type (variable type), eg. string, number, array, boolean, .. + * @param type name of the node or the node constructor itself + * @param slot_type name of the slot type (variable type), eg. string, number, array, boolean, .. */ registerNodeAndSlotType( type: LGraphNode, @@ -371,12 +431,12 @@ export class LiteGraphGlobal { * Create a new nodetype by passing a function, it wraps it with a proper class and * generates inputs according to the parameters of the function. * Useful to wrap simple methods that do not require properties, and that only process some input to generate an output. - * @param {String} name node name with namespace (p.e.: 'math/sum') - * @param {Function} func - * @param {Array} param_types [optional] an array containing the type of every parameter, + * @param name node name with namespace (p.e.: 'math/sum') + * @param func + * @param param_types [optional] an array containing the type of every parameter, * otherwise parameters will accept any type - * @param {String} return_type [optional] string with the return type, otherwise it will be generic - * @param {Object} properties [optional] properties to be configurable + * @param return_type [optional] string with the return type, otherwise it will be generic + * @param properties [optional] properties to be configurable */ wrapFunctionAsNode( name: string, @@ -423,7 +483,6 @@ export class LiteGraphGlobal { /** * Adds this method to all nodetypes, existing and to be created * (You can add it to LGraphNode.prototype but then existing node types wont have it) - * @param {Function} func */ // eslint-disable-next-line @typescript-eslint/no-unsafe-function-type addNodeMethod(name: string, func: Function): void { @@ -438,9 +497,9 @@ export class LiteGraphGlobal { /** * Create a node of a given type with a name. The node is not attached to any graph yet. - * @param {String} type full name of the node class. p.e. "math/sin" - * @param {String} name a name to distinguish from other nodes - * @param {Object} options to set options + * @param type full name of the node class. p.e. "math/sin" + * @param title a name to distinguish from other nodes + * @param options to set options */ createNode( type: string, @@ -493,8 +552,8 @@ export class LiteGraphGlobal { /** * Returns a registered node type with a given name - * @param {String} type full name of the node class. p.e. "math/sin" - * @return {Class} the node class + * @param type full name of the node class. p.e. "math/sin" + * @returns the node class */ getNodeType(type: string): typeof LGraphNode { return this.registered_node_types[type] @@ -502,8 +561,8 @@ export class LiteGraphGlobal { /** * Returns a list of node types matching one category - * @param {String} category category name - * @return {Array} array with all the node classes + * @param category category name + * @returns array with all the node classes */ getNodeTypesInCategory(category: string, filter: any) { const r = [] @@ -529,8 +588,8 @@ export class LiteGraphGlobal { /** * Returns a list with all the node type categories - * @param {String} filter only nodes with ctor.filter equal can be shown - * @return {Array} array with all the names of the categories + * @param filter only nodes with ctor.filter equal can be shown + * @returns array with all the names of the categories */ getNodeTypesCategories(filter: string): string[] { const categories = { "": 1 } @@ -606,9 +665,9 @@ export class LiteGraphGlobal { /** * Returns if the types of two slots are compatible (taking into account wildcards, etc) - * @param {String} type_a output - * @param {String} type_b input - * @return {Boolean} true if they can be connected + * @param type_a output + * @param type_b input + * @returns true if they can be connected */ isValidConnection(type_a: ISlotType, type_b: ISlotType): boolean { if (type_a == "" || type_a === "*") type_a = 0 @@ -647,10 +706,9 @@ export class LiteGraphGlobal { /** * Register a string in the search box so when the user types it it will recommend this node - * @param {String} node_type the node recommended - * @param {String} description text to show next to it - * @param {Object} data it could contain info of how the node should be configured - * @return {Boolean} true if they can be connected + * @param node_type the node recommended + * @param description text to show next to it + * @param data it could contain info of how the node should be configured */ registerSearchboxExtra(node_type: any, description: string, data: any): void { this.searchbox_extras[description.toLowerCase()] = { @@ -662,11 +720,11 @@ export class LiteGraphGlobal { /** * Wrapper to load files (from url using fetch or from file using FileReader) - * @param {String|File|Blob} url the url of the file (or the file itself) - * @param {String} type an string to know how to fetch it: "text","arraybuffer","json","blob" - * @param {Function} on_complete callback(data) - * @param {Function} on_error in case of an error - * @return {FileReader|Promise} returns the object used to + * @param url the url of the file (or the file itself) + * @param type an string to know how to fetch it: "text","arraybuffer","json","blob" + * @param on_complete callback(data) + * @param on_error in case of an error + * @returns returns the object used to */ fetchFile( url: string | URL | Request | Blob, @@ -883,8 +941,8 @@ export class LiteGraphGlobal { } // Convert a hex value to its decimal value - the inputted hex must be in the - // format of a hex triplet - the kind we use for HTML colours. The function - // will return an array with three values. + // format of a hex triplet - the kind we use for HTML colours. The function + // will return an array with three values. hex2num(hex: string): number[] { if (hex.charAt(0) == "#") { hex = hex.slice(1) @@ -904,7 +962,7 @@ export class LiteGraphGlobal { } // Give a array with three values as the argument and the function will return - // the corresponding hex triplet. + // the corresponding hex triplet. num2hex(triplet: number[]): string { const hex_alphabets = "0123456789ABCDEF" let hex = "#" diff --git a/src/Reroute.ts b/src/Reroute.ts index 94f58ee0a..0e71aa659 100644 --- a/src/Reroute.ts +++ b/src/Reroute.ts @@ -274,8 +274,6 @@ export class Reroute implements Positionable, LinkSegment, Serialisable extends Record