Extract templates, replace pagination format
| @@ -1426,30 +1426,26 @@ function getBackBlock() { | ||
| 1426 | 1426 | return template; |
| 1427 | 1427 | } |
| 1428 | 1428 | |
| 1429 | 1429 | async function getEmptyBlock() { |
| 1430 | 1430 | const icons = ['fa-dragon', 'fa-otter', 'fa-kiwi-bird', 'fa-crow', 'fa-frog']; |
| 1431 | 1431 | const texts = [t`Here be dragons`, t`Otterly empty`, t`Kiwibunga`, t`Pump-a-Rum`, t`Croak it`]; |
| 1432 | 1432 | const roll = new Date().getMinutes() % icons.length; |
| 1433 | 1433 | const emptyBlockparams = `{ |
| 1434 | - <div class="text_block empty_block"> | |
| 1434 | + text: texts[roll], | |
| 1435 | - <i class="fa-solid ${icons[roll]} fa-4x"></i> | |
| 1435 | + icon: icons[roll], | |
| 1436 | - <h1>${texts[roll]}</h1> | |
| 1436 | + }; | |
| 1437 | - <p>` + t`There are no items to display.` + `</p> | |
| 1437 | + const emptyBlock = await renderTemplateAsync('emptyBlock', params); | |
| 1438 | - </div>`; | |
| 1439 | 1438 | return $(emptyBlock); |
| 1440 | 1439 | } |
| 1441 | 1440 | |
| 1442 | 1441 | /** |
| 1443 | 1442 | * @param {number} hidden Number of hidden characters |
| 1444 | 1443 | */ |
| 1445 | 1444 | async function getHiddenBlock(hidden) { |
| 1446 | 1445 | const hiddenBlockparams = `{ |
| 1447 | - <div class="text_block hidden_block"> | |
| 1446 | + text: (hidden > 1 ? t`${hidden} characters hidden.` : t`${hidden} character hidden.`), | |
| 1448 | - <small> | |
| 1447 | + }; | |
| 1449 | - <p>` + (hidden > 1 ? t`${hidden} characters hidden.` : t`${hidden} character hidden.`) + `</p> | |
| 1448 | + const hiddenBlock = await renderTemplateAsync('hiddenBlock', params); | |
| 1450 | - <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> | |
| 1451 | - </small> | |
| 1452 | - </div>`; | |
| 1453 | 1449 | return $(hiddenBlock); |
| 1454 | 1450 | } |
| 1455 | 1451 | |
| @@ -1542,13 +1538,14 @@ export async function printCharacters(fullRefresh = false) { | ||
| 1542 | 1538 | nextText: '>', |
| 1543 | 1539 | formatNavigator: PAGINATION_TEMPLATE, |
| 1544 | 1540 | showNavigator: true, |
| 1545 | 1541 | callback: async function (/** @type {Entity[]} */ data) { |
| 1546 | 1542 | $(listId).empty(); |
| 1547 | 1543 | if (power_user.bogus_folders && isBogusFolderOpen()) { |
| 1548 | 1544 | $(listId).append(getBackBlock()); |
| 1549 | 1545 | } |
| 1550 | 1546 | if (!data.length) { |
| 1551 | - $(listId).append(getEmptyBlock()); | |
| 1547 | + const emptyBlock = await getEmptyBlock(); | |
| 1548 | + $(listId).append(emptyBlock); | |
| 1552 | 1549 | } |
| 1553 | 1550 | let displayCount = 0; |
| 1554 | 1551 | for (const i of data) { |
| @@ -1569,7 +1566,8 @@ export async function printCharacters(fullRefresh = false) { | ||
| 1569 | 1566 | |
| 1570 | 1567 | const hidden = (characters.length + groups.length) - displayCount; |
| 1571 | 1568 | if (hidden > 0 && entitiesFilter.hasAnyFilter()) { |
| 1572 | - $(listId).append(getHiddenBlock(hidden)); | |
| 1569 | + const hiddenBlock = await getHiddenBlock(hidden); | |
| 1570 | + $(listId).append(hiddenBlock); | |
| 1573 | 1571 | } |
| 1574 | 1572 | localizePagination($('#rm_print_characters_pagination')); |
| 1575 | 1573 | |
| @@ -0,0 +1,7 @@ | ||
| 1 | +<div class="text_block empty_block"> | |
| 2 | + <i class="fa-solid {{icon}} fa-4x"></i> | |
| 3 | + <h1>{{text}}</h1> | |
| 4 | + <p data-i18n="There are no items to display."> | |
| 5 | + There are no items to display. | |
| 6 | + </p> | |
| 7 | +</div> | |
| @@ -0,0 +1,6 @@ | ||
| 1 | +<div class="text_block hidden_block"> | |
| 2 | + <small> | |
| 3 | + <p>{{text}}</p> | |
| 4 | + <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> | |
| 5 | + </small> | |
| 6 | +</div> | |
| @@ -5,9 +5,9 @@ import { textgenerationwebui_settings as textgen_settings, textgen_types } from | ||
| 5 | 5 | import { tokenizers } from './tokenizers.js'; |
| 6 | 6 | import { renderTemplateAsync } from './templates.js'; |
| 7 | 7 | import { POPUP_TYPE, callGenericPopup } from './popup.js'; |
| 8 | 8 | import { t, translate } from './i18n.js'; |
| 9 | 9 | import { accountStorage } from './util/AccountStorage.js'; |
| 10 | 10 | import { localizePagination, PAGINATION_TEMPLATE } from './utils.js'; |
| 11 | 11 | |
| 12 | 12 | let mancerModels = []; |
| 13 | 13 | let togetherModels = []; |
| @@ -362,18 +362,7 @@ export async function loadFeatherlessModels(data) { | ||
| 362 | 362 | showSizeChanger: false, |
| 363 | 363 | prevText: '<', |
| 364 | 364 | nextText: '>', |
| 365 | 365 | formatNavigator: function (currentPagePAGINATION_TEMPLATE, totalPage) { |
| 366 | - let translated_of; | |
| 367 | - try { | |
| 368 | - translated_of = translate('pagination_of'); | |
| 369 | - if (translated_of == 'pagination_of') { | |
| 370 | - translated_of = 'of'; | |
| 371 | - } | |
| 372 | - } catch (e) { | |
| 373 | - translated_of = 'of'; | |
| 374 | - } | |
| 375 | - return (currentPage - 1) * perPage + 1 + ' - ' + currentPage * perPage + ` ${translated_of} ` + totalPage * perPage; | |
| 376 | - }, | |
| 377 | 366 | showNavigator: true, |
| 378 | 367 | callback: function (modelsOnPage, pagination) { |
| 379 | 368 | modelCardBlock.innerHTML = ''; |
| @@ -18,21 +18,8 @@ import { getCurrentLocale, t, translate } from './i18n.js'; | ||
| 18 | 18 | |
| 19 | 19 | /** |
| 20 | 20 | * Function returning pagination status string template. |
| 21 | - * @type {function} | |
| 22 | 21 | */ |
| 23 | -export const PAGINATION_TEMPLATE = function() { | |
| 22 | +export const PAGINATION_TEMPLATE = '<%= rangeStart %>-<%= rangeEnd %> .. <%= totalNumber %>'; | |
| 24 | - let translated_of; | |
| 25 | - try { | |
| 26 | - translated_of = translate('pagination_of'); | |
| 27 | - if (translated_of == 'pagination_of') { | |
| 28 | - translated_of = 'of'; | |
| 29 | - } | |
| 30 | - } catch (e) { | |
| 31 | - console.error(e); | |
| 32 | - translated_of = 'of'; | |
| 33 | - } | |
| 34 | - return `<%= rangeStart %>-<%= rangeEnd %> ${translated_of} <%= totalNumber %>`; | |
| 35 | -}; | |
| 36 | 23 | |
| 37 | 24 | export const localizePagination = function(container) { |
| 38 | 25 | let options = container.find('option'); |