mirror of
https://github.com/AUTOMATIC1111/stable-diffusion-webui.git
synced 2026-02-01 21:32:01 -08:00
add old message for empty results to cards list.
This commit is contained in:
Sj-Si
parent
edab04ebea
commit
ec300d6917
6 changed files with 91 additions and 46 deletions
|
|
@ -19,6 +19,8 @@ class Clusterize {
|
|||
content_elem = null;
|
||||
scroll_id = null;
|
||||
content_id = null;
|
||||
no_data_class_default = "clusterize-no-data";
|
||||
loading_class_default = "clusterize-loading";
|
||||
options = {
|
||||
rows_in_block: 50,
|
||||
cols_in_block: 1,
|
||||
|
|
@ -26,12 +28,15 @@ class Clusterize {
|
|||
tag: null,
|
||||
id_attr: "data-div-id",
|
||||
show_no_data_row: true,
|
||||
no_data_class: "clusterize-no-data",
|
||||
no_data_text: "No data",
|
||||
loading_data_text: "Loading...",
|
||||
no_data_class: this.no_data_class_default,
|
||||
loading_class: this.loading_class_default,
|
||||
keep_parity: true,
|
||||
callbacks: {},
|
||||
};
|
||||
loading_html_default = `<div class="${this.loading_class_default}">Loading...</div>`;
|
||||
no_data_html_default = `<div class="${this.no_data_class_default}">No Data</div>`;
|
||||
loading_html = null;
|
||||
no_data_html = null;
|
||||
setup_has_run = false;
|
||||
enabled = false;
|
||||
#is_mac = null;
|
||||
|
|
@ -100,6 +105,9 @@ class Clusterize {
|
|||
this.#max_items = args.max_items;
|
||||
|
||||
this.#on_scroll_bound = this.#onScroll.bind(this);
|
||||
|
||||
this.loading_html = args.loading_html;
|
||||
this.no_data_html = args.no_data_html;
|
||||
}
|
||||
|
||||
// ==== PUBLIC FUNCTIONS ====
|
||||
|
|
@ -125,12 +133,13 @@ class Clusterize {
|
|||
this.setup_has_run = true;
|
||||
}
|
||||
|
||||
clear(custom_text) {
|
||||
clear(custom_html) {
|
||||
if (!this.setup_has_run || !this.enabled) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.#html(this.#generateEmptyRow(custom_text).join(""));
|
||||
custom_html = custom_html || this.no_data_html;
|
||||
this.#html(custom_html);
|
||||
}
|
||||
|
||||
destroy() {
|
||||
|
|
@ -138,7 +147,7 @@ class Clusterize {
|
|||
this.#teardownElementObservers();
|
||||
this.#teardownResizeObservers();
|
||||
|
||||
this.#html(this.#generateEmptyRow().join(""));
|
||||
this.#html(this.no_data_html);
|
||||
|
||||
this.setup_has_run = false;
|
||||
}
|
||||
|
|
@ -276,6 +285,23 @@ class Clusterize {
|
|||
if (!this.options.tag) {
|
||||
this.options.tag = this.content_elem.children[0].tagName.toLowerCase();
|
||||
}
|
||||
|
||||
if (!isString(this.loading_html)) {
|
||||
const loading_elem = this.content_elem.querySelector(`.${this.options.loading_class}`);
|
||||
if (isElement(loading_elem)) {
|
||||
this.loading_html = loading_elem.outerHTML;
|
||||
loading_elem.remove();
|
||||
}
|
||||
}
|
||||
|
||||
if (!isString(this.no_data_html)) {
|
||||
const no_data_elem = this.content_elem.querySelector(`.${this.options.no_data_class}`);
|
||||
if (isElement(no_data_elem)) {
|
||||
this.no_data_html = no_data_elem.outerHTML;
|
||||
no_data_elem.remove();
|
||||
}
|
||||
}
|
||||
|
||||
this.#recalculateDims();
|
||||
}
|
||||
|
||||
|
|
@ -290,7 +316,9 @@ class Clusterize {
|
|||
}
|
||||
|
||||
// Get the first element that isn't one of our placeholder rows.
|
||||
const node = this.content_elem.querySelector(":scope > :not(.clusterize-extra-row,.clusterize-no-data)");
|
||||
const node = this.content_elem.querySelector(
|
||||
`:scope > :not(.clusterize-extra-row,.${this.options.no_data_class},.${this.options.loading_class})`
|
||||
);
|
||||
if (!isElement(node)) {
|
||||
// dont attempt to compute dims if we have no data.
|
||||
return;
|
||||
|
|
@ -348,30 +376,6 @@ class Clusterize {
|
|||
return Math.min(current_cluster, max_cluster);
|
||||
}
|
||||
|
||||
#generateEmptyRow(text, class_name) {
|
||||
if (isNullOrUndefined(text)) {
|
||||
text = this.options.no_data_text;
|
||||
}
|
||||
|
||||
if (isNullOrUndefined(class_name)) {
|
||||
class_name = this.options.no_data_class;
|
||||
}
|
||||
|
||||
const empty_row = document.createElement(this.options.tag);
|
||||
const content = document.createTextNode(text);
|
||||
empty_row.className = class_name;
|
||||
if (this.options.tag === "tr") {
|
||||
const td = document.createElement("td");
|
||||
// fixes #53
|
||||
td.colSpan = 100;
|
||||
td.appendChild(content);
|
||||
empty_row.appendChild(td);
|
||||
} else {
|
||||
empty_row.appendChild(content);
|
||||
}
|
||||
return [empty_row.outerHTML];
|
||||
}
|
||||
|
||||
async #generate() {
|
||||
const rows_start = Math.max(0, (this.options.rows_in_cluster - this.options.rows_in_block) * this.#getClusterNum());
|
||||
const rows_end = rows_start + this.options.rows_in_cluster;
|
||||
|
|
@ -393,7 +397,7 @@ class Clusterize {
|
|||
top_offset: 0,
|
||||
bottom_offset: 0,
|
||||
rows_above: 0,
|
||||
rows: this_cluster_rows.length ? this_cluster_rows : this.#generateEmptyRow(),
|
||||
rows: this_cluster_rows.length ? this_cluster_rows : [this.no_data_html],
|
||||
};
|
||||
}
|
||||
|
||||
|
|
@ -413,12 +417,12 @@ class Clusterize {
|
|||
if (!Array.isArray(rows) || !rows.length) {
|
||||
// This implies there is no data for this list. Not an error.
|
||||
// Errors should be handled in the fetchData callback, not here.
|
||||
this.#html(this.#generateEmptyRow().join(""));
|
||||
this.#html(this.no_data_html);
|
||||
return;
|
||||
} else {
|
||||
this.#exploreEnvironment(rows, this.#cache);
|
||||
// Remove the temporary item from the data since we calculated its size.
|
||||
this.#html(this.#generateEmptyRow("Loading...").join(""));
|
||||
this.#html(this.loading_html);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -111,6 +111,10 @@ class ExtraNetworksTab {
|
|||
refresh_in_progress = false;
|
||||
dirs_view_en = false;
|
||||
tree_view_en = false;
|
||||
tree_list_no_data_html_bkp = null;
|
||||
tree_list_loading_html_bkp = null;
|
||||
cards_list_no_data_html_bkp = null;
|
||||
cards_list_loading_html_bkp = null;
|
||||
constructor({tabname, extra_networks_tabname}) {
|
||||
this.tabname = tabname;
|
||||
this.extra_networks_tabname = extra_networks_tabname;
|
||||
|
|
@ -149,6 +153,26 @@ class ExtraNetworksTab {
|
|||
this.controls_elem.id = `${this.tabname_full}_controls`;
|
||||
controls_div.insertBefore(this.controls_elem, null);
|
||||
|
||||
// create backups of the no-data and loading elements for tree/cards list
|
||||
const tree_loading_elem = this.container_elem.querySelector(
|
||||
".extra-network-tree .clusterize-loading"
|
||||
);
|
||||
const tree_no_data_elem = this.container_elem.querySelector(
|
||||
".extra-network-tree .clusterize-no-data"
|
||||
);
|
||||
const cards_loading_elem = this.container_elem.querySelector(
|
||||
".extra-network-cards-content .clusterize-loading"
|
||||
);
|
||||
const cards_no_data_elem = this.container_elem.querySelector(
|
||||
".extra-network-cards-content .clusterize-no-data"
|
||||
);
|
||||
// need to store backup of these since they are removed on clusterize clear.
|
||||
// we re-apply them next time we call setup.
|
||||
this.cards_list_no_data_html_bkp = cards_no_data_elem.outerHTML;
|
||||
this.cards_list_loading_html_bkp = cards_loading_elem.outerHTML;
|
||||
this.tree_list_no_data_html_bkp = tree_no_data_elem.outerHTML;
|
||||
this.tree_list_loading_html_bkp = tree_loading_elem.outerHTML;
|
||||
|
||||
await Promise.all([this.setupTreeList(), this.setupCardsList()]);
|
||||
|
||||
const btn_dirs_view = this.controls_elem.querySelector(".extra-network-control--dirs-view");
|
||||
|
|
@ -232,6 +256,8 @@ class ExtraNetworksTab {
|
|||
initData: this.onInitTreeData.bind(this),
|
||||
fetchData: this.onFetchTreeData.bind(this),
|
||||
},
|
||||
no_data_html: this.tree_list_no_data_html_bkp,
|
||||
loading_html: this.tree_list_loading_html_bkp,
|
||||
});
|
||||
await this.tree_list.setup();
|
||||
}
|
||||
|
|
@ -250,6 +276,8 @@ class ExtraNetworksTab {
|
|||
initData: this.onInitCardsData.bind(this),
|
||||
fetchData: this.onFetchCardsData.bind(this),
|
||||
},
|
||||
no_data_html: this.cards_list_no_data_html_bkp,
|
||||
loading_html: this.cards_list_loading_html_bkp,
|
||||
});
|
||||
await this.cards_list.setup();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -106,7 +106,7 @@ class ExtraNetworksClusterize extends Clusterize {
|
|||
if (this.lru instanceof LRUCache) {
|
||||
this.lru.clear();
|
||||
}
|
||||
super.clear("Loading...");
|
||||
super.clear(this.loading_html);
|
||||
}
|
||||
|
||||
async load(force_init_data) {
|
||||
|
|
@ -263,15 +263,12 @@ class ExtraNetworksClusterizeTreeList extends ExtraNetworksClusterize {
|
|||
selected_div_id = null;
|
||||
|
||||
constructor(args) {
|
||||
super({
|
||||
...args,
|
||||
no_data_text: "Directory is empty.",
|
||||
});
|
||||
super({...args});
|
||||
}
|
||||
|
||||
clear() {
|
||||
this.selected_div_id = null;
|
||||
super.clear("Loading...");
|
||||
super.clear(this.loading_html);
|
||||
}
|
||||
|
||||
async onRowSelected(elem) {
|
||||
|
|
@ -498,10 +495,7 @@ class ExtraNetworksClusterizeTreeList extends ExtraNetworksClusterize {
|
|||
|
||||
class ExtraNetworksClusterizeCardsList extends ExtraNetworksClusterize {
|
||||
constructor(args) {
|
||||
super({
|
||||
...args,
|
||||
no_data_text: "No files matching filter.",
|
||||
});
|
||||
super({...args});
|
||||
}
|
||||
|
||||
sortByPath(data) {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue