improve: layout

feat: show button on update available dialog
This commit is contained in:
Dr.Lt.Data 2023-12-16 13:59:18 +09:00
parent 316f67af4d
commit 464c8e9cc1
5 changed files with 112 additions and 28 deletions

View File

@ -20,7 +20,7 @@ import nodes
import torch
version = [1, 13, 7]
version = [1, 14]
version_str = f"V{version[0]}.{version[1]}" + (f'.{version[2]}' if len(version) > 2 else '')
print(f"### Loading: ComfyUI-Manager ({version_str})")

View File

@ -5363,7 +5363,8 @@
],
"https://github.com/vienteck/ComfyUI-Chat-GPT-Integration": [
[
"ChatGptPrompt"
"ChatGptPrompt",
"ChatGptTextConcat"
],
{
"title_aux": "ComfyUI-Chat-GPT-Integration"

View File

@ -13,7 +13,7 @@ var docStyle = document.createElement('style');
docStyle.innerHTML = `
#cm-manager-dialog {
width: 1000px;
height: 410px;
height: 420px;
box-sizing: content-box;
z-index: 10000;
}
@ -119,6 +119,7 @@ const style = `
padding: 0px !important;
position: relative;
overflow: hidden;
font-size: 17px !important;
}
#cm-nodeinfo-button {
width: 310px;
@ -126,6 +127,7 @@ const style = `
padding: 0px !important;
position: relative;
overflow: hidden;
font-size: 17px !important;
}
#cm-manual-button {
width: 310px;
@ -142,6 +144,43 @@ const style = `
font-size: 17px !important;
}
.cm-experimental-button {
width: 290px;
height: 30px;
position: relative;
overflow: hidden;
font-size: 17px !important;
}
.cm-experimental {
width: 310px;
border: 1px solid #555;
border-radius: 5px;
padding: 10px;
align-items: center;
text-align: center;
justify-content: center;
box-sizing: border-box;
}
.cm-experimental-legend {
margin-top: -20px;
margin-left: 95px;
width:100px;
height:20px;
font-size: 13px;
font-weight: bold;
background-color: #990000;
color: #CCFFFF;
border-radius: 5px;
}
.cm-menu-combo {
cursor: pointer;
width: 310px;
box-sizing: border-box;
}
.cm-small-button {
width: 120px;
height: 30px;
@ -151,6 +190,15 @@ const style = `
font-size: 17px !important;
}
#cm-install-customnodes-button {
width: 200px;
height: 30px;
position: relative;
overflow: hidden;
box-sizing: border-box;
font-size: 17px !important;
}
.cm-search-filter {
width: 200px;
height: 30px !important;
@ -394,7 +442,20 @@ async function fetchUpdates(update_check_checkbox) {
}
if (response.status == 201) {
app.ui.dialog.show('There is an updated extension available.<BR><BR><P><B>NOTE:<BR>Fetch Updates is not an update.<BR>Please update from "Install Custom Nodes".</B></P>');
app.ui.dialog.show("There is an updated extension available.<BR><BR><P><B>NOTE:<BR>Fetch Updates is not an update.<BR>Please update from <button id='cm-install-customnodes-button'>Install Custom Nodes</button> </B></P>");
const button = document.getElementById('cm-install-customnodes-button');
button.addEventListener("click",
async function() {
app.ui.dialog.close();
if(!CustomNodesInstaller.instance)
CustomNodesInstaller.instance = new CustomNodesInstaller(app, self);
await CustomNodesInstaller.instance.show(CustomNodesInstaller.ShowMode.UPDATE);
}
);
app.ui.dialog.element.style.zIndex = 10010;
update_check_checkbox.checked = false;
}
@ -531,7 +592,7 @@ class ManagerMenuDialog extends ComfyDialog {
() => {
if(!CustomNodesInstaller.instance)
CustomNodesInstaller.instance = new CustomNodesInstaller(app, self);
CustomNodesInstaller.instance.show(false);
CustomNodesInstaller.instance.show(CustomNodesInstaller.ShowMode.NORMAL);
}
}),
@ -542,7 +603,7 @@ class ManagerMenuDialog extends ComfyDialog {
() => {
if(!CustomNodesInstaller.instance)
CustomNodesInstaller.instance = new CustomNodesInstaller(app, self);
CustomNodesInstaller.instance.show(true);
CustomNodesInstaller.instance.show(CustomNodesInstaller.ShowMode.MISSING_NODES);
}
}),
@ -589,14 +650,14 @@ class ManagerMenuDialog extends ComfyDialog {
// db mode
this.datasrc_combo = document.createElement("select");
this.datasrc_combo.style.cursor = "pointer";
this.datasrc_combo.className = "cm-menu-combo";
this.datasrc_combo.appendChild($el('option', { value: 'cache', text: 'DB: Channel (1day cache)' }, []));
this.datasrc_combo.appendChild($el('option', { value: 'local', text: 'DB: Local' }, []));
this.datasrc_combo.appendChild($el('option', { value: 'url', text: 'DB: Channel (remote)' }, []));
// preview method
let preview_combo = document.createElement("select");
preview_combo.style.cursor = "pointer";
preview_combo.className = "cm-menu-combo";
preview_combo.appendChild($el('option', { value: 'auto', text: 'Preview method: Auto' }, []));
preview_combo.appendChild($el('option', { value: 'taesd', text: 'Preview method: TAESD (slow)' }, []));
preview_combo.appendChild($el('option', { value: 'latent2rgb', text: 'Preview method: Latent2RGB (fast)' }, []));
@ -612,7 +673,7 @@ class ManagerMenuDialog extends ComfyDialog {
// nickname
let badge_combo = document.createElement("select");
badge_combo.style.cursor = "pointer";
badge_combo.className = "cm-menu-combo";
badge_combo.appendChild($el('option', { value: 'none', text: 'Badge: None' }, []));
badge_combo.appendChild($el('option', { value: 'nick', text: 'Badge: Nickname' }, []));
badge_combo.appendChild($el('option', { value: 'nick_hide', text: 'Badge: Nickname (hide built-in)' }, []));
@ -631,7 +692,7 @@ class ManagerMenuDialog extends ComfyDialog {
// channel
let channel_combo = document.createElement("select");
channel_combo.style.cursor = "pointer";
channel_combo.className = "cm-menu-combo";
api.fetchApi('/manager/channel_url_list')
.then(response => response.json())
.then(async data => {
@ -657,7 +718,7 @@ class ManagerMenuDialog extends ComfyDialog {
// share
let share_combo = document.createElement("select");
share_combo.style.cursor = "pointer";
share_combo.className = "cm-menu-combo";
const share_options = [
['none', 'None'],
['openart', 'OpenArt AI'],
@ -696,20 +757,7 @@ class ManagerMenuDialog extends ComfyDialog {
badge_combo,
channel_combo,
share_combo,
$el("hr", {}, []),
$el("center", {}, ["!! EXPERIMENTAL !!"]),
$el("br", {}, []),
$el("button.cm-button", {
type: "button",
textContent: "Snapshot Manager",
onclick:
() => {
if(!SnapshotManager.instance)
SnapshotManager.instance = new SnapshotManager(app, self);
SnapshotManager.instance.show();
}
}),
$el("button.cm-button", {
type: "button",
textContent: "Install via Git URL",
@ -721,6 +769,21 @@ class ManagerMenuDialog extends ComfyDialog {
}
}
}),
$el("br", {}, []),
$el("filedset.cm-experimental", {}, [
$el("legend.cm-experimental-legend", {}, ["EXPERIMENTAL"]),
$el("button.cm-experimental-button", {
type: "button",
textContent: "Snapshot Manager",
onclick:
() => {
if(!SnapshotManager.instance)
SnapshotManager.instance = new SnapshotManager(app, self);
SnapshotManager.instance.show();
}
})
]),
];
}

View File

@ -3,6 +3,7 @@ import { api } from "../../scripts/api.js"
import { ComfyDialog, $el } from "../../scripts/ui.js";
import { install_checked_custom_node, manager_instance, rebootAPI } from "./common.js";
async function getCustomNodes() {
var mode = manager_instance.datasrc_combo.value;
@ -91,6 +92,12 @@ export class CustomNodesInstaller extends ComfyDialog {
message_box = null;
data = null;
static ShowMode = {
NORMAL: 0,
MISSING_NODES: 1,
UPDATE: 2,
};
clear() {
this.install_buttons = [];
this.message_box = null;
@ -235,7 +242,7 @@ export class CustomNodesInstaller extends ComfyDialog {
this.conflict_mappings = await getConflictMappings();
if(this.is_missing_node_mode)
if(this.show_mode == CustomNodesInstaller.ShowMode.MISSING_NODES)
this.data = await this.filter_missing_node(this.data);
this.element.removeChild(msg);
@ -661,6 +668,13 @@ export class CustomNodesInstaller extends ComfyDialog {
combo.appendChild(option);
});
if(this.show_mode == CustomNodesInstaller.ShowMode.UPDATE) {
this.filter = 'Update';
}
else if(this.show_mode == CustomNodesInstaller.ShowMode.MISSING_NODES) {
this.filter = '*';
}
let self = this;
combo.addEventListener('change', function(event) {
self.filter = event.target.value;
@ -736,8 +750,13 @@ export class CustomNodesInstaller extends ComfyDialog {
this.element.appendChild(close_button);
}
async show(is_missing_node_mode) {
this.is_missing_node_mode = is_missing_node_mode;
async show(show_mode) {
this.show_mode = show_mode;
if(this.show_mode != CustomNodesInstaller.ShowMode.NORMAL) {
this.search_keyword = '';
}
try {
this.invalidateControl();

View File

@ -5363,7 +5363,8 @@
],
"https://github.com/vienteck/ComfyUI-Chat-GPT-Integration": [
[
"ChatGptPrompt"
"ChatGptPrompt",
"ChatGptTextConcat"
],
{
"title_aux": "ComfyUI-Chat-GPT-Integration"