Improve the multi-select behaviour/appearance and display how many selections are made/required

This commit is contained in:
Oliver 2026-02-01 01:19:39 -07:00
parent 0381df035e
commit 812583f33c
7 changed files with 75 additions and 20 deletions

View file

@ -8,7 +8,7 @@ const { HandlebarsApplicationMixin, ApplicationV2 } = foundry.applications.api;
const { FormDataExtended } = foundry.applications.ux;
const { deepClone } = foundry.utils;
const PAGE_SIZE = 52;
const PAGE_SIZE = 8;
export class ArtBrowser extends HandlebarsApplicationMixin(ApplicationV2) {
// #region Options
@ -129,6 +129,26 @@ export class ArtBrowser extends HandlebarsApplicationMixin(ApplicationV2) {
this.#onFilterSubmit.bind(this),
);
};
if (options.parts?.includes(`images`)) {
this._updateSelectedCount();
};
};
_updateSelectedCount() {
if (!this.rendered || this.selectMode === `single`) return;
const element = this.element.querySelector(`.selected-count`);
if (element) {
element.innerText = `${this.#selected.size} Selected`;
element.innerText = _loc(
`TB.apps.ArtBrowser.selected`,
{
current: this.#selected.size,
required: this.#selectCount,
},
);
};
};
async close(options) {
@ -157,7 +177,13 @@ export class ArtBrowser extends HandlebarsApplicationMixin(ApplicationV2) {
meta: {
idp: this.id,
},
selectMode: this.selectMode,
is: {
multi: this.selectMode === `multi`,
single: this.selectMode === `single`,
},
can: {
upload: true,
},
};
};
@ -194,8 +220,6 @@ export class ArtBrowser extends HandlebarsApplicationMixin(ApplicationV2) {
const images = [];
for (const [id, image] of allImages) {
image.id = id;
// Check if it matches the required filters
if (this.filters.name && !image.name.includes(this.filters.name)) {
continue;
@ -206,6 +230,10 @@ export class ArtBrowser extends HandlebarsApplicationMixin(ApplicationV2) {
const hasAllTags = this.filters.tags.every(tag => image.tags.includes(tag));
if ((!hasAnArtist && hasArtistFilter) || !hasAllTags) { continue };
// Populate ephemeral data for rendering
image.id = id;
image.selected = this.#selected.has(imagePath(image));
// Convert all of the artist IDs into the actual data
image.artists = image.artists
.map(artistID => {
@ -271,15 +299,15 @@ export class ArtBrowser extends HandlebarsApplicationMixin(ApplicationV2) {
const path = imagePath(image);
if (this.#selectCount > 1) {
if (this.#selected.has(path)) {
target.ariaPressed = false;
if (!target.checked) {
this.#selected.delete(path);
} else {
target.ariaPressed = true;
this.#selected.add(path);
};
if (this.#selected.size >= this.#selectCount) {
await this.#submit(Array.from(this.#selected));
} else {
this._updateSelectedCount();
};
} else {
await this.#submit(path);