rixty/SillyTavern
1
0
Fork 0
mirror of https://github.com/SillyTavern/SillyTavern.git synced 2025-06-05 21:59:27 +02:00
Code Issues Packages Projects Releases Wiki Activity

Char List Tags Collapsable

Browse Source
This commit is contained in:
RossAscends
2023-06-09 00:21:13 +09:00
parent 87125cb3b5
commit 59c09d90c7
4 changed files with 46 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
public/script.js
View File

@ -5501,7 +5501,7 @@ $(document).ready(function () {
$("#chat").on('scroll', debounce(() => {
updateVisibleDivs('#chat', false);
}, 5));
}, 10));
let S_TAFocused = false;
let S_TAPreviouslyFocused = false;

20
public/scripts/tags.js
View File

@ -26,9 +26,14 @@ const TAG_LOGIC_AND = true; // switch to false to use OR logic for combining tag
const CHARACTER_SELECTOR = '#rm_print_characters_block > div';
const ACTIONABLE_TAGS = {
VIEW: { id: 2, name: 'Manage tags', color: 'rgba(150, 100, 100, 0.5)', action: onViewTagsListClick, icon: 'fa-solid fa-tags' },
FAV: { id: 1, name: 'Show only favorites', color: 'rgba(255, 255, 0, 0.5)', action: applyFavFilter, icon: 'fa-solid fa-star' },
GROUP: { id: 0, name: 'Show only groups', color: 'rgba(100, 100, 100, 0.5)', action: filterByGroups, icon: 'fa-solid fa-users' },
HINT: { id: 3, name: 'Show Tag List', color: 'rgba(150, 100, 100, 0.5)', action: onTagListHintClick, icon: 'fa-solid fa-tags' },
}
const InListActionable = {
VIEW: { id: 2, name: 'Manage tags', color: 'rgba(150, 100, 100, 0.5)', action: onViewTagsListClick, icon: 'fa-solid fa-gear' },
}
const DEFAULT_TAGS = [
@ -233,6 +238,9 @@ function appendTagToList(listElement, tag, { removable, selectable, action }) {
tagElement.on('click', () => action.bind(tagElement)());
tagElement.addClass('actionable');
}
if (action && tag.id === 2) {
tagElement.addClass('innerActionable hidden');
}
$(listElement).append(tagElement);
}
@ -291,6 +299,9 @@ function printTags() {
$(FILTER_SELECTOR).find('.actionable').last().addClass('margin-right-10px');
for (const tag of Object.values(InListActionable)) {
appendTagToList(FILTER_SELECTOR, tag, { removable: false, selectable: false, action: tag.action });
}
for (const tag of tagsToDisplay) {
appendTagToList(FILTER_SELECTOR, tag, { removable: false, selectable: true, });
}
@ -437,6 +448,13 @@ function onTagColorize(evt) {
saveSettingsDebounced();
}
function onTagListHintClick() {
console.log($(this));
$(this).toggleClass('selected');
$(this).siblings(".tag:not(.actionable)").toggle(100);
$(this).siblings(".innerActionable").toggleClass('hidden');
}
$(document).ready(() => {
createTagInput('#tagInput', '#tagList');
createTagInput('#groupTagInput', '#groupTagList');

29
public/style.css
View File

@ -130,6 +130,7 @@ table.responsiveTable {
padding: 5px;
}
.hidden,
.hiddenByScroll {
visibility: hidden !important;
}
@ -2332,6 +2333,7 @@ input[type="range"]::-webkit-slider-thumb {
.mes_buttons .mes_edit,
.mes_buttons .mes_bookmark,
.extraMesButtonsHint,
#tagListHint,
.extraMesButtons div {
cursor: pointer;
transition: 0.3s ease-in-out;
@ -2342,6 +2344,7 @@ input[type="range"]::-webkit-slider-thumb {
.mes_buttons .mes_edit:hover,
.mes_buttons .mes_bookmark:hover,
.extraMesButtonsHint:hover,
#tagListHint:hover,
.extraMesButtons div:hover {
opacity: 1;
}
@ -2735,9 +2738,13 @@ h5 {
width: fit-content;
min-width: 0;
text-shadow: none !important;
}
#rm_tag_filter .tag:not(.actionable) {
display: none;
}
.tag.actionable {
border-radius: 50%;
aspect-ratio: 1 / 1;
@ -2745,10 +2752,21 @@ h5 {
min-width: calc(var(--mainFontSize) * 2);
font-size: calc(var(--mainFontSize) * 1);
padding: 0;
display: flex;
justify-content: center;
align-items: center;
}
#tagListHint {
align-self: center;
display: flex;
margin-right: 10px;
}
.opacity1 {
opacity: 1 !important;
}
.margin-right-10px {
margin-right: 10px;
}
@ -2852,7 +2870,7 @@ body .ui-front {
body .ui-widget-content {
background-color: var(--SmartThemeBlurTintColor);
border: 1px solid var(--white30a) !important;
border-radius: 15px;
border-radius: 10px;
box-shadow: 0 0 5px black;
text-shadow: 0px 0px calc(var(--shadowWidth) * 1px) var(--SmartThemeShadowColor);
backdrop-filter: blur(calc(var(--SmartThemeBlurStrength)*2));
@ -2869,15 +2887,18 @@ body .ui-widget-content .ui-menu-item-wrapper {
}
body .ui-widget-content li {
padding: 0.75rem 1.25rem;
padding: 5px;
text-decoration: none;
display: flex;
align-items: center;
cursor: pointer;
opacity: 0.5;
transition: all 200ms;
}
body .ui-widget-content li:hover {
background-color: var(--SmartThemeEmColor);
/* background-color: var(--SmartThemeEmColor); */
opacity: 1;
}
/* GROUP CHATS */