Objetos de Comfy

LiteGraph

La interfaz de Comfy UI está construida sobre LiteGraph. Gran parte de la funcionalidad de Comfy la proporciona LiteGraph, así que si desarrollas nodos más complejos, probablemente te resulte útil clonar ese repositorio y explorar la documentación, que se encuentra en doc/index.html.

ComfyApp

El objeto app (siempre accesible mediante import { app } from "../../scripts/app.js";) representa la aplicación de Comfy que se ejecuta en el navegador y contiene varias propiedades y funciones útiles, algunas de las cuales se enumeran a continuación.

Obsoleto: Secuestrar o parchear funciones de forma manual (monkey-patching) en app o en sus prototipos está obsoleto y puede cambiar en cualquier momento en un futuro cercano. En su lugar, usa los ganchos de extensión y la API del Menú Contextual oficiales.

No se recomienda secuestrar funciones en app, ya que Comfy está en constante desarrollo y el comportamiento del núcleo puede cambiar.

Propiedades

Entre las propiedades importantes de app se incluyen (esta no es una lista exhaustiva):

propiedad	contenido
`canvas`	Un objeto LGraphCanvas que representa la interfaz de usuario actual. Contiene algunas propiedades potencialmente interesantes, como `node_over` y `selected_nodes`.
`canvasEl`	El elemento DOM `<canvas>`
`graph`	Una referencia al objeto LGraph que describe el gráfico actual
`runningNodeId`	Durante la ejecución, el nodo que se está ejecutando en ese momento
`ui`	Proporciona acceso a algunos elementos de la interfaz de usuario, como la cola, el menú y los diálogos

canvas (para los elementos gráficos) y graph (para las conexiones lógicas) son probablemente los que más querrás consultar.

Funciones

De nuevo, hay muchas. Algunas de las más importantes son:

función	notas
graphToPrompt	Convierte el gráfico en un prompt que se puede enviar al servidor de Python
loadGraphData	Carga un gráfico
queuePrompt	Envía un prompt a la cola
registerExtension	Ya lo has visto: se usa para agregar una extensión

LGraph

El objeto LGraph forma parte del framework LiteGraph y representa el estado lógico actual del gráfico (nodos y conexiones). Si quieres manipular el gráfico, la documentación de LiteGraph (en doc/index.html si clonas https://github.com/jagenjo/litegraph.js) describe las funciones que necesitarás. Puedes usar graph para obtener detalles de nodos y conexiones, por ejemplo:

const ComfyNode_object_for_my_node = app.graph._nodes_by_id(my_node_id) 
ComfyNode_object_for_my_node.inputs.forEach(input => {
    const link_id = input.link;
    if (link_id) {
        const LLink_object = app.graph.links[link_id]
        const id_of_upstream_node = LLink_object.origin_id
        // etc
    }
});

LLink

El objeto LLink, accesible a través de graph.links, representa un enlace individual del gráfico, desde el slot de salida link.origin_slot del nodo link.origin_id hasta el slot link.target_slot del nodo link.target_id. También incluye una cadena que representa el tipo de dato en link.type, además de link.id. Los LLink se crean en el método connect de un LGraphNode (del cual ComfyNode es una subclase).

Evita crear tus propios objetos LLink: usa las funciones de LiteGraph en su lugar.

ComfyNode

ComfyNode es una subclase de LGraphNode, por lo que la documentación de LiteGraph resulta útil para operaciones más genéricas. Sin embargo, Comfy ha ampliado de forma significativa el comportamiento del núcleo de LiteGraph y tampoco hace uso de toda la funcionalidad de LiteGraph.

La descripción que sigue se aplica a un nodo normal. Los nodos de grupo, los nodos primitivos, las notas y los nodos de redirección tienen propiedades diferentes.

Un objeto ComfyNode representa un nodo del flujo de trabajo actual. Tiene una serie de propiedades importantes que quizá quieras aprovechar, además de una gran cantidad de funciones que puedes usar o interceptar para modificar su comportamiento.

Obsoleto: Interceptar los métodos del prototipo en ComfyNode o LGraphNode está obsoleto y puede cambiar en cualquier momento en un futuro próximo. Usa los ganchos de extensión oficiales cuando estén disponibles, como getNodeMenuItems para los menús contextuales. Consulta la Guía de migración del menú contextual para ver ejemplos.

Para hacerte una idea más completa del objeto nodo, puede resultarte útil insertar el siguiente código en tu extensión y colocar un punto de interrupción en el comando console.log. Cuando crees un nodo nuevo, podrás usar tu depurador favorito para inspeccionar el nodo.

async nodeCreated(node) {
    console.log("nodeCreated")
}

Propiedades

propiedad	contenido
`bgcolor`	El color de fondo del nodo, o undefined para el valor predeterminado
`comfyClass`	La clase de Python que representa el nodo
`flags`	Un diccionario que puede contener indicadores relacionados con el estado del nodo. En particular, `flags.collapsed` es verdadero en los nodos contraídos.
`graph`	Una referencia al objeto LGraph
`id`	Un id único
`input_type`	Una lista de los tipos de entrada (por ejemplo, “STRING”, “MODEL”, “CLIP”, etc.). Por lo general, coincide con INPUT_TYPES de Python
`inputs`	Una lista de entradas (se describe más abajo)
`mode`	Normalmente 0; se establece en 2 si el nodo está en silencio y en 4 si está en bypass. Comfy no usa los valores 1 y 3
`order`	La posición del nodo en el orden de ejecución. La establece `LGraph.computeExecutionOrder()` cuando se envía el prompt
`pos`	La posición [x,y] del nodo en el lienzo
`properties`	Un diccionario que contiene `"Node name for S&R"`, usado por LiteGraph
`properties_info`	El tipo y el valor predeterminado de las entradas de `properties`
`size`	El ancho y el alto del nodo en el lienzo
`title`	Título mostrado
`type`	El nombre único (de Python) de la clase del nodo
`widgets`	Una lista de widgets (se describe más abajo)
`widgets_values`	Una lista de los valores actuales de los widgets

Funciones

Hay una cantidad muy grande de funciones (85, la última vez que las conté). A continuación se muestra una selección. La mayoría de estas funciones no presentan modificaciones respecto al código central de LiteGraph.

Entradas, salidas y widgets

función	notas
Entradas / Salidas	La mayoría tiene métodos de salida con nombres equivalentes: s/In/Out/
`addInput`	Crea una nueva entrada, definida por nombre y tipo
`addInputs`	Versión en arreglo de `addInput`
`findInputSlot`	Encuentra el índice de la ranura a partir del nombre de la entrada
`findInputSlotByType`	Encuentra una entrada que coincida con el tipo. Opciones para preferir ranuras libres o usar solo ranuras libres
`removeInput`	Por índice de ranura
`getInputNode`	Obtiene el nodo conectado a esta entrada. El equivalente de salida es `getOutputNodes` y devuelve una lista
`getInputLink`	Obtiene el LLink conectado a esta entrada. No hay equivalente de salida
Widgets
`addWidget`	Agrega un widget estándar de Comfy
`addCustomWidget`	Agrega un widget personalizado (definido en el hook `getComfyWidgets`)
`addDOMWidget`	Agrega un widget definido por un elemento DOM
`convertWidgetToInput`	Convierte un widget en una entrada si `isConvertableWidget` lo permite (en `widgetInputs.js`)

Conexiones

función	notas
`connect`	Conecta la salida de este nodo a la entrada de otro nodo
`connectByType`	Conecta la salida a otro nodo especificando el tipo: se conecta a la primera ranura disponible que coincida
`connectByTypeOutput`	Conecta la entrada a la salida de otro nodo por tipo
`disconnectInput`	Elimina cualquier conexión hacia la entrada (especificada por nombre o índice)
`disconnectOutput`	Desconecta una salida de la entrada de un nodo especificado
`onConnectionChange`	Se llama en cada nodo. `side==1` si es una entrada en este nodo
`onConnectInput`	Se llama antes de que se realice una conexión. Si devuelve `false`, la conexión se rechaza

Visualización

función	notas
`setDirtyCanvas`	Indica que el primer plano (nodos) y/o el fondo (conexiones e imágenes) deben volver a dibujarse
`onDrawBackground`	Se llama con un objeto `CanvasRenderingContext2D` para dibujar el fondo. Comfy lo usa para renderizar imágenes
`onDrawForeground`	Se llama con un objeto `CanvasRenderingContext2D` para dibujar el nodo.
`getTitle`	El título que se mostrará.
`collapse`	Alterna el estado contraído del nodo.

collapse tiene un nombre poco adecuado: alterna el estado contraído. Recibe un parámetro booleano, que se puede usar para anular node.collapsable === false.

Otros

función	notas
`changeMode`	Se usa para poner el nodo en modo bypass (`mode == 4`) o no (`mode == 0`)

Entradas y widgets

Las entradas y los widgets representan las dos formas de introducir datos en un nodo. Por lo general, puedes convertir un widget en una entrada, pero no todas las entradas pueden convertirse en un widget (ya que muchos tipos de datos no se pueden introducir mediante un elemento de la interfaz). node.inputs es una lista de las entradas actuales (los puntos de colores del lado izquierdo del nodo), que especifica su .name, .type y .link (una referencia al LLink conectado en app.graph.links). Si una entrada es un widget que se ha convertido, también guarda una referencia al widget, ahora inactivo, en .widget. node.widgets es una lista de todos los widgets, tanto si se han convertido en una entrada como si no. Un widget tiene:

propiedad/función	notas
`callback`	Una función que se llama cuando cambia el valor del widget
`last_y`	La posición vertical del widget en el nodo
`name`	El nombre del widget (único dentro de un nodo)
`options`	Tal como se especifican en el código de Python (como default, min y max)
`type`	El nombre del tipo de widget (ver abajo) en minúsculas
`value`	El valor actual del widget. Es una propiedad con métodos `get` y `set`

app.widgets es un diccionario de los tipos de widget registrados actualmente, indexado por la versión en MAYÚSCULAS del nombre del tipo. Entre los tipos de widget integrados de Comfy se incluyen los obvios BOOLEAN, INT y FLOAT, así como STRING (que tiene dos variantes, de una línea y de varias líneas), COMBO para seleccionar de una lista desplegable, e IMAGEUPLOAD, que se usa en los nodos Load Image. Puedes agregar tipos de widget personalizados proporcionando un método getCustomWidgets en tu extensión.

Widgets enlazados

También puedes enlazar widgets, como ocurre con el comportamiento integrado de seed y control_after_generate, por ejemplo. Un widget enlazado tiene .type = 'base_widget_type:base_widget_name'; así, control_after_generate puede tener el tipo int:seed.

Prompt

Cuando presionas el botón Queue Prompt en Comfy, se llama al método app.graphToPrompt() para convertir el gráfico actual en un prompt que se pueda enviar al servidor. app.graphToPrompt devuelve un objeto (al que aquí llamamos prompt) con dos propiedades, output y workflow.

output

prompt.output asigna el node_id de cada nodo del gráfico a un objeto con dos propiedades.

prompt.output[node_id].class_type, el nombre único de la clase del nodo personalizado, tal como se define en el código de Python
prompt.output[node_id].inputs, que contiene el valor de cada entrada (o widget) como un mapa del nombre de la entrada a:
- el valor seleccionado, si es un widget, o
- un arreglo que contiene (upstream_node_id, upstream_node_output_slot) si hay una conexión en la entrada, o
- undefined, si es un widget que se ha convertido en entrada y no está conectado
- las demás entradas no conectadas no se incluyen en .inputs

Ten en cuenta que el upstream_node_id del arreglo que describe una entrada conectada se representa como una cadena, no como un entero.

workflow

prompt.workflow contiene las siguientes propiedades:

config - un diccionario de opciones de configuración adicionales (vacío de forma predeterminada)
extra - un diccionario con información adicional sobre el flujo de trabajo. De forma predeterminada contiene:
- extra.ds - describe la vista actual del gráfico (scale y offset)
groups - todos los grupos del flujo de trabajo
last_link_id - el id del último enlace agregado
last_node_id - el id del último nodo agregado
links - una lista de todos los enlaces del gráfico. Cada entrada es un arreglo de cinco enteros y una cadena:
- (link_id, upstream_node_id, upstream_node_output_slot, downstream_node_id, downstream_node_input_slot, data type)
nodes - una lista de todos los nodos del gráfico. Cada entrada es un mapa de un subconjunto de las propiedades del nodo como se describe arriba
- Se incluyen las siguientes propiedades: flags, id, inputs, mode, order, pos, properties, size, type, widgets_values
- Además, a menos que un nodo no tenga salidas, existe una propiedad outputs, que es una lista de las salidas del nodo, y cada una contiene:
  - name - el nombre de la salida
  - type - el tipo de dato de la salida
  - links - una lista de los link_id de todos los enlaces desde esta salida (si no hay conexiones, puede ser una lista vacía o null),
  - shape - la forma usada para dibujar la salida (3 de forma predeterminada para un punto)
  - slot_index - el número de ranura de la salida
version - el número de versión de LiteGraph (al momento de escribir esto, 0.4)

nodes.output no existe en los nodos sin salidas, no es una lista vacía.

Desarrollar con Comfy

Desplegar ComfyUI

Comfy CLI

Specifications

Nodos personalizados

Objetos de Comfy

LiteGraph

ComfyApp

Propiedades

Funciones

LGraph

LLink

ComfyNode

Propiedades

Funciones

Entradas, salidas y widgets

Conexiones

Visualización

Otros

Entradas y widgets

Tipos de widget

Widgets enlazados

Prompt

output

workflow