Tag Folders: show hidden numbers

- Show hidden counts for folders, and total
- Rework resizing of character names to shrink additional data first
- Better placement for group numbers
This commit is contained in:
Wolfsblvt
2024-03-07 02:15:41 +01:00
parent 18379ec602
commit fb97f563b7
5 changed files with 83 additions and 26 deletions

View File

@ -1175,7 +1175,7 @@ function getEmptyBlock() {
const texts = ['Here be dragons', 'Otterly empty', 'Kiwibunga', 'Pump-a-Rum', 'Croak it'];
const roll = new Date().getMinutes() % icons.length;
const emptyBlock = `
<div class="empty_block">
<div class="text_block empty_block">
<i class="fa-solid ${icons[roll]} fa-4x"></i>
<h1>${texts[roll]}</h1>
<p>There are no items to display.</p>
@ -1183,6 +1183,20 @@ function getEmptyBlock() {
return $(emptyBlock);
}
/**
* @param {number} hidden Number of hidden characters
*/
function getHiddenBlock(hidden) {
const hiddenBlick = `
<div class="text_block hidden_block">
<small>
<p>${hidden} ${hidden > 1 ? 'characters' : 'character'} hidden.</p>
<div class="fa-solid fa-circle-info opacity50p" data-i18n="[title]Characters and groups hidden by filters or closed folders" title="Characters and groups hidden by filters or closed folders"></div>
</small>
</div>`;
return $(hiddenBlick);
}
function getCharacterBlock(item, id) {
let this_avatar = default_avatar;
if (item.avatar != 'none') {
@ -1261,19 +1275,28 @@ async function printCharacters(fullRefresh = false) {
if (!data.length) {
$(listId).append(getEmptyBlock());
}
let displayCount = 0;
for (const i of data) {
switch (i.type) {
case 'character':
$(listId).append(getCharacterBlock(i.item, i.id));
displayCount++;
break;
case 'group':
$(listId).append(getGroupBlock(i.item));
displayCount++;
break;
case 'tag':
$(listId).append(getTagBlock(i.item, i.entities ?? entities));
$(listId).append(getTagBlock(i.item, i.entities, i.hidden));
break;
}
}
const hidden = (characters.length + groups.length) - displayCount;
if (hidden > 0) {
$(listId).append(getHiddenBlock(hidden));
}
eventSource.emit(event_types.CHARACTER_PAGE_LOADED);
},
afterSizeSelectorChange: function (e) {
@ -1327,11 +1350,14 @@ export function getEntitiesList({ doFilter = false, doSort = true } = {}) {
// For folders, we remember the sub entities so they can be displayed later, even if they might be filtered
// Those sub entities should be filtered and have the search filters applied too
if (entity.type === 'tag') {
let subEntities = filterByTagState(entities, { subForEntity: entity });
let subEntities = filterByTagState(entities, { subForEntity: entity, filterHidden: false });
const subCount = subEntities.length;
subEntities = filterByTagState(entities, { subForEntity: entity });
if (doFilter) {
subEntities = entitiesFilter.applyFilters(subEntities);
}
entity.entities = subEntities;
entity.hidden = subCount - subEntities.length;
}
}