fix: comfydeploy node backward compatible in every comfyui
This commit is contained in:
EdwinWong
parent
503dca8fb6
commit
71d60a5dd1
@ -192,11 +192,13 @@ const ext = {
|
||||
|
||||
registerCustomNodes() {
|
||||
/** @type {LGraphNode}*/
|
||||
class ComfyDeploy {
|
||||
color = LGraphCanvas.node_colors.yellow.color;
|
||||
bgcolor = LGraphCanvas.node_colors.yellow.bgcolor;
|
||||
groupcolor = LGraphCanvas.node_colors.yellow.groupcolor;
|
||||
class ComfyDeploy extends LGraphNode {
|
||||
constructor() {
|
||||
super();
|
||||
this.color = LGraphCanvas.node_colors.yellow.color;
|
||||
this.bgcolor = LGraphCanvas.node_colors.yellow.bgcolor;
|
||||
this.groupcolor = LGraphCanvas.node_colors.yellow.groupcolor;
|
||||
|
||||
if (!this.properties) {
|
||||
this.properties = {};
|
||||
this.properties.workflow_name = "";
|
||||
@ -204,65 +206,75 @@ const ext = {
|
||||
this.properties.version = "";
|
||||
}
|
||||
|
||||
ComfyWidgets.STRING(
|
||||
this,
|
||||
this.addWidget(
|
||||
"text",
|
||||
"workflow_name",
|
||||
[
|
||||
"",
|
||||
{
|
||||
default: this.properties.workflow_name,
|
||||
multiline: false,
|
||||
},
|
||||
],
|
||||
app,
|
||||
this.properties.workflow_name,
|
||||
(v) => {
|
||||
this.properties.workflow_name = v;
|
||||
},
|
||||
{ multiline: false }
|
||||
);
|
||||
|
||||
ComfyWidgets.STRING(
|
||||
this,
|
||||
this.addWidget(
|
||||
"text",
|
||||
"workflow_id",
|
||||
[
|
||||
"",
|
||||
{
|
||||
default: this.properties.workflow_id,
|
||||
multiline: false,
|
||||
},
|
||||
],
|
||||
app,
|
||||
this.properties.workflow_id,
|
||||
(v) => {
|
||||
this.properties.workflow_id = v;
|
||||
},
|
||||
{ multiline: false }
|
||||
);
|
||||
|
||||
ComfyWidgets.STRING(
|
||||
this,
|
||||
this.addWidget(
|
||||
"text",
|
||||
"version",
|
||||
["", { default: this.properties.version, multiline: false }],
|
||||
app,
|
||||
this.properties.version,
|
||||
(v) => {
|
||||
this.properties.version = v;
|
||||
},
|
||||
{ multiline: false }
|
||||
);
|
||||
|
||||
// this.widgets.forEach((w) => {
|
||||
// // w.computeSize = () => [200,10]
|
||||
// w.computedHeight = 2;
|
||||
// })
|
||||
|
||||
this.widgets_start_y = 10;
|
||||
this.setSize(this.computeSize());
|
||||
|
||||
// const config = { };
|
||||
|
||||
// console.log(this);
|
||||
this.serialize_widgets = true;
|
||||
this.isVirtualNode = true;
|
||||
}
|
||||
|
||||
onExecute() {
|
||||
// This method is called when the node is executed
|
||||
// You can add any necessary logic here
|
||||
}
|
||||
|
||||
onSerialize(o) {
|
||||
// This method is called when the node is being serialized
|
||||
// Ensure all necessary data is saved
|
||||
if (!o.properties) {
|
||||
o.properties = {};
|
||||
}
|
||||
o.properties.workflow_name = this.properties.workflow_name;
|
||||
o.properties.workflow_id = this.properties.workflow_id;
|
||||
o.properties.version = this.properties.version;
|
||||
}
|
||||
|
||||
onConfigure(o) {
|
||||
// This method is called when the node is being configured (e.g., when loading a saved graph)
|
||||
// Ensure all necessary data is restored
|
||||
if (o.properties) {
|
||||
this.properties = { ...this.properties, ...o.properties };
|
||||
this.widgets[0].value = this.properties.workflow_name || "";
|
||||
this.widgets[1].value = this.properties.workflow_id || "";
|
||||
this.widgets[2].value = this.properties.version || "1";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Load default visibility
|
||||
|
||||
LiteGraph.registerNodeType(
|
||||
"ComfyDeploy",
|
||||
Object.assign(ComfyDeploy, {
|
||||
title_mode: LiteGraph.NORMAL_TITLE,
|
||||
title: "Comfy Deploy",
|
||||
collapsable: true,
|
||||
}),
|
||||
);
|
||||
// Register the node type
|
||||
LiteGraph.registerNodeType("ComfyDeploy", Object.assign(ComfyDeploy, {
|
||||
title: "Comfy Deploy",
|
||||
title_mode: LiteGraph.NORMAL_TITLE,
|
||||
collapsable: true,
|
||||
}));
|
||||
|
||||
ComfyDeploy.category = "deploy";
|
||||
},
|
||||
@ -431,10 +443,10 @@ function createDynamicUIHtml(data) {
|
||||
<h3 style="font-size: 14px; font-weight: semibold; margin-bottom: 8px;">Missing Nodes</h3>
|
||||
<p style="font-size: 12px;">These nodes are not found with any matching custom_nodes in the ComfyUI Manager Database</p>
|
||||
${data.missing_nodes
|
||||
.map((node) => {
|
||||
return `<p style="font-size: 14px; color: #d69e2e;">${node}</p>`;
|
||||
})
|
||||
.join("")}
|
||||
.map((node) => {
|
||||
return `<p style="font-size: 14px; color: #d69e2e;">${node}</p>`;
|
||||
})
|
||||
.join("")}
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
@ -442,17 +454,14 @@ function createDynamicUIHtml(data) {
|
||||
Object.values(data.custom_nodes).forEach((node) => {
|
||||
html += `
|
||||
<div style="border-bottom: 1px solid #e2e8f0; padding-top: 16px;">
|
||||
<a href="${
|
||||
node.url
|
||||
}" target="_blank" style="font-size: 18px; font-weight: semibold; color: white; text-decoration: none;">${
|
||||
node.name
|
||||
}</a>
|
||||
<a href="${node.url
|
||||
}" target="_blank" style="font-size: 18px; font-weight: semibold; color: white; text-decoration: none;">${node.name
|
||||
}</a>
|
||||
<p style="font-size: 14px; color: #4b5563;">${node.hash}</p>
|
||||
${
|
||||
node.warning
|
||||
? `<p style="font-size: 14px; color: #d69e2e;">${node.warning}</p>`
|
||||
: ""
|
||||
}
|
||||
${node.warning
|
||||
? `<p style="font-size: 14px; color: #d69e2e;">${node.warning}</p>`
|
||||
: ""
|
||||
}
|
||||
</div>
|
||||
`;
|
||||
});
|
||||
@ -466,9 +475,8 @@ function createDynamicUIHtml(data) {
|
||||
Object.entries(data.models).forEach(([section, items]) => {
|
||||
html += `
|
||||
<div style="border-bottom: 1px solid #e2e8f0; padding-top: 8px; padding-bottom: 8px;">
|
||||
<h3 style="font-size: 18px; font-weight: semibold; margin-bottom: 8px;">${
|
||||
section.charAt(0).toUpperCase() + section.slice(1)
|
||||
}</h3>`;
|
||||
<h3 style="font-size: 18px; font-weight: semibold; margin-bottom: 8px;">${section.charAt(0).toUpperCase() + section.slice(1)
|
||||
}</h3>`;
|
||||
items.forEach((item) => {
|
||||
html += `<p style="font-size: 14px; color: ${textColor};">${item.name}</p>`;
|
||||
});
|
||||
@ -484,9 +492,8 @@ function createDynamicUIHtml(data) {
|
||||
Object.entries(data.files).forEach(([section, items]) => {
|
||||
html += `
|
||||
<div style="border-bottom: 1px solid #e2e8f0; padding-top: 8px; padding-bottom: 8px;">
|
||||
<h3 style="font-size: 18px; font-weight: semibold; margin-bottom: 8px;">${
|
||||
section.charAt(0).toUpperCase() + section.slice(1)
|
||||
}</h3>`;
|
||||
<h3 style="font-size: 18px; font-weight: semibold; margin-bottom: 8px;">${section.charAt(0).toUpperCase() + section.slice(1)
|
||||
}</h3>`;
|
||||
items.forEach((item) => {
|
||||
html += `<p style="font-size: 14px; color: ${textColor};">${item.name}</p>`;
|
||||
});
|
||||
@ -1006,14 +1013,12 @@ export class LoadingDialog extends ComfyDialog {
|
||||
showLoading(title, message) {
|
||||
this.show(`
|
||||
<div style="width: 400px; display: flex; gap: 18px; flex-direction: column; overflow: unset">
|
||||
<h3 style="margin: 0px; display: flex; align-items: center; justify-content: center; gap: 12px;">${title} ${
|
||||
this.loadingIcon
|
||||
}</h3>
|
||||
${
|
||||
message
|
||||
? `<label style="max-width: 100%; white-space: pre-wrap; word-wrap: break-word;">${message}</label>`
|
||||
: ""
|
||||
}
|
||||
<h3 style="margin: 0px; display: flex; align-items: center; justify-content: center; gap: 12px;">${title} ${this.loadingIcon
|
||||
}</h3>
|
||||
${message
|
||||
? `<label style="max-width: 100%; white-space: pre-wrap; word-wrap: break-word;">${message}</label>`
|
||||
: ""
|
||||
}
|
||||
</div>
|
||||
`);
|
||||
}
|
||||
@ -1279,21 +1284,17 @@ export class ConfigDialog extends ComfyDialog {
|
||||
</label>
|
||||
<label style="color: white; width: 100%;">
|
||||
Endpoint:
|
||||
<input id="endpoint" style="margin-top: 8px; width: 100%; height:40px; box-sizing: border-box; padding: 0px 6px;" type="text" value="${
|
||||
data.endpoint
|
||||
}">
|
||||
<input id="endpoint" style="margin-top: 8px; width: 100%; height:40px; box-sizing: border-box; padding: 0px 6px;" type="text" value="${data.endpoint
|
||||
}">
|
||||
</label>
|
||||
<div style="color: white;">
|
||||
API Key: User / Org <button style="font-size: 18px;">${
|
||||
data.displayName ?? ""
|
||||
}</button>
|
||||
<input id="apiKey" style="margin-top: 8px; width: 100%; height:40px; box-sizing: border-box; padding: 0px 6px;" type="password" value="${
|
||||
data.apiKey
|
||||
}">
|
||||
API Key: User / Org <button style="font-size: 18px;">${data.displayName ?? ""
|
||||
}</button>
|
||||
<input id="apiKey" style="margin-top: 8px; width: 100%; height:40px; box-sizing: border-box; padding: 0px 6px;" type="password" value="${data.apiKey
|
||||
}">
|
||||
<button id="loginButton" style="margin-top: 8px; width: 100%; height:40px; box-sizing: border-box; padding: 0px 6px;">
|
||||
${
|
||||
data.apiKey ? "Re-login with ComfyDeploy" : "Login with ComfyDeploy"
|
||||
}
|
||||
${data.apiKey ? "Re-login with ComfyDeploy" : "Login with ComfyDeploy"
|
||||
}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user