rixty
/
SillyTavern
mirror of https://github.com/SillyTavern/SillyTavern.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fix expander button and group tags add 

- Fix expander button to never be "removable" in any list
- Fix group tag list to actually work on adding tags
This commit is contained in:
Wolfsblvt 2024-04-06 07:37:30 +02:00
parent fe8f0a8ff2
commit 9805215c28
1 changed files with 13 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
public/scripts/tags.js
View File

@ -649,15 +649,16 @@ function createNewTag(tagName) {
/** /**
* Prints the list of tags * Prints the list of tags
* *
* @param {JQuery<HTMLElement>} element - The container element where the tags are to be printed. * @param {JQuery<HTMLElement>|string} element - The container element where the tags are to be printed. (Optionally can also be a string selector for the element, which will then be resolved)
* @param {PrintTagListOptions} [options] - Optional parameters for printing the tag list. * @param {PrintTagListOptions} [options] - Optional parameters for printing the tag list.
*/ */
function printTagList(element, { tags = undefined, addTag = undefined, forEntityOrKey = undefined, empty = true, tagActionSelector = undefined, tagOptions = {} } = {}) { function printTagList(element, { tags = undefined, addTag = undefined, forEntityOrKey = undefined, empty = true, tagActionSelector = undefined, tagOptions = {} } = {}) {
const $element = (typeof element === "string") ? $(element) : element;
const key = forEntityOrKey !== undefined ? getTagKeyForEntity(forEntityOrKey) : getTagKey(); const key = forEntityOrKey !== undefined ? getTagKeyForEntity(forEntityOrKey) : getTagKey();
let printableTags = tags ? (typeof tags === 'function' ? tags() : tags) : getTagsList(key); let printableTags = tags ? (typeof tags === 'function' ? tags() : tags) : getTagsList(key);
if (empty === 'always' || (empty && (printableTags?.length > 0 || key))) { if (empty === 'always' || (empty && (printableTags?.length > 0 || key))) {
$(element).empty(); $element.empty();
} }
if (addTag && (tagOptions.skipExistsCheck || !printableTags.some(x => x.id === addTag.id))) { if (addTag && (tagOptions.skipExistsCheck || !printableTags.some(x => x.id === addTag.id))) {
@ -670,7 +671,7 @@ function printTagList(element, { tags = undefined, addTag = undefined, forEntity
const customAction = typeof tagActionSelector === 'function' ? tagActionSelector : null; const customAction = typeof tagActionSelector === 'function' ? tagActionSelector : null;
// Well, lets check if the tag list was expanded. Based on either a css class, or when any expand was clicked yet, then we search whether this element id matches // Well, lets check if the tag list was expanded. Based on either a css class, or when any expand was clicked yet, then we search whether this element id matches
const expanded = element.hasClass('tags-expanded') || (expanded_tags_cache.length && expanded_tags_cache.indexOf(key ?? getTagKeyForEntityElement(element)) >= 0); const expanded = $element.hasClass('tags-expanded') || (expanded_tags_cache.length && expanded_tags_cache.indexOf(key ?? getTagKeyForEntityElement(element)) >= 0);
// We prepare some stuff. No matter which list we have, there is a maximum value of tags we are going to display // We prepare some stuff. No matter which list we have, there is a maximum value of tags we are going to display
const TAGS_LIMIT = 50; const TAGS_LIMIT = 50;
@ -692,7 +693,7 @@ function printTagList(element, { tags = undefined, addTag = undefined, forEntity
// Check if we should print this tag // Check if we should print this tag
if (totalPrinted++ < MAX_TAGS || filterActive(tag)) { if (totalPrinted++ < MAX_TAGS || filterActive(tag)) {
appendTagToList(element, tag, tagOptions); appendTagToList($element, tag, tagOptions);
} else { } else {
hiddenTags++; hiddenTags++;
} }
@ -705,21 +706,25 @@ function printTagList(element, { tags = undefined, addTag = undefined, forEntity
// Add click event // Add click event
const showHiddenTags = (event) => { const showHiddenTags = (event) => {
const elementKey = key ?? getTagKeyForEntityElement(element); const elementKey = key ?? getTagKeyForEntityElement($element);
console.log(`Hidden tags shown for element ${elementKey}`); console.log(`Hidden tags shown for element ${elementKey}`);
// Mark the current char/group as expanded if we were in any. This will be kept in memory until reload // Mark the current char/group as expanded if we were in any. This will be kept in memory until reload
element.addClass('tags-expanded'); $element.addClass('tags-expanded');
expanded_tags_cache.push(elementKey); expanded_tags_cache.push(elementKey);
// Do not bubble further, we are just expanding // Do not bubble further, we are just expanding
event.stopPropagation(); event.stopPropagation();
printTagList(element, { tags: tags, addTag: addTag, forEntityOrKey: forEntityOrKey, empty: empty, tagActionSelector: tagActionSelector, tagOptions: tagOptions }); printTagList($element, { tags: tags, addTag: addTag, forEntityOrKey: forEntityOrKey, empty: empty, tagActionSelector: tagActionSelector, tagOptions: tagOptions });
}; };
// Print the placeholder object with its styling and action to show the remaining tags
/** @type {Tag} */ /** @type {Tag} */
const placeholderTag = { id: id, name: "...", title: `${hiddenTags} tags not displayed.\n\nClick to expand remaining tags.`, color: 'transparent', action: showHiddenTags, class: 'placeholder-expander' }; const placeholderTag = { id: id, name: "...", title: `${hiddenTags} tags not displayed.\n\nClick to expand remaining tags.`, color: 'transparent', action: showHiddenTags, class: 'placeholder-expander' };
appendTagToList(element, placeholderTag, tagOptions); // It should never be marked as a removable tag, because it's just an expander action
/** @type {TagOptions} */
const placeholderTagOptions = { ...tagOptions, removable: false };
appendTagToList($element, placeholderTag, placeholderTagOptions);
} }
} }