Merge branch 'dev' of https://github.com/BlipRanger/SillyTavern into feature/tags

public/index.html

@@ -1308,6 +1308,10 @@
                         <form action="javascript:void(null);" method="post" enctype="multipart/form-data">
                             <div id="kobold_horde_block">
                                 <ul>
+                                    <li>
+                                        Avoid sending sensitive information to the Horde.
+                                        <a target="_blank" href="https://docs.sillytavern.app/usage/api-connections/horde/">Review the Privacy statement</a>
+                                    </li>
                                     <li>
                                         <a target="_blank" href="https://horde.koboldai.net/register">Register a Horde
                                             account for faster queue times</a>
@@ -1347,13 +1351,11 @@
                                 <div class="neutral_warning">For privacy reasons, your API key will be hidden after you
                                     reload the page.</div>
                                 <h4 class="horde_model_title">
-                                    Model
+                                    Models
                                     <div id="horde_refresh" title="Refresh models" class="right_menu_button">
                                         <div class="fa-solid fa-repeat "></div>
                                     </div>
                                 </h4>
-                                <small class="horde_multiple_hint">You can select multiple models.<br>Avoid sending
-                                    sensitive information to the Horde. <a id="horde_privacy_disclaimer" target="_blank" href="https://docs.sillytavern.app/usage/api-connections/koboldai/">Learn more</a></small>
                                 <select id="horde_model" multiple>
                                     <option>-- Horde models not loaded --</option>
                                 </select>
@@ -2776,7 +2778,7 @@
                     <textarea id="creator_notes_textarea" name="creator_notes" placeholder="(Displays in the characters list. Describe the bot to the user, list the chat models it has been tested on, and any other useful tips)" form="form_create" class="text_pole" autocomplete="off" rows="2" maxlength="20000"></textarea>
                 </div>
                 <div>
-                    <h4>Creators's Tags</h4>
+                    <h4>Creator's Tags</h4>
                     <textarea id="tags_textarea" name="tags" placeholder="(List of freeform comma-separated tags)" form="form_create" class="text_pole" autocomplete="off" rows="1" maxlength="2000"></textarea>
                 </div>
                 <div>
@@ -3458,4 +3460,4 @@
     </script>
 </body>
 
-</html>
+</html>

public/script.js

@@ -180,6 +180,7 @@ export {
     select_rm_info,
     setCharacterId,
     setCharacterName,
+    replaceCurrentChat,
     setOnlineStatus,
     checkOnlineStatus,
     setEditedMessageId,
@@ -5544,21 +5545,20 @@ function openCharacterWorldPopup() {
         const fileName = getCharaFilename(chid);
         const tempExtraBooks = selectedWorlds.map((index) => world_names[index]).filter((e) => e !== undefined);
 
-        const existingCharLore = charLore.find((e) => e.name === fileName);
+        const existingCharIndex = charLore.findIndex((e) => e.name === fileName);
-        if (existingCharLore) {
+        if (existingCharIndex === -1) {
-            if (tempExtraBooks.length === 0) {
-                charLore.splice(existingCharLore, 1);
-            } else {
-                existingCharLore.extraBooks = tempExtraBooks;
-            }
-        } else {
             const newCharLoreEntry = {
                 name: fileName,
                 extraBooks: tempExtraBooks
             }
 
             charLore.push(newCharLoreEntry);
+        } else if (tempExtraBooks.length === 0) {
+            charLore.splice(existingCharIndex, 1);
+        } else {
+            charLore[existingCharIndex].extraBooks = tempExtraBooks;
         }
+
         Object.assign(world_info, { charLore: charLore });
         saveSettingsDebounced();
     }
@@ -7704,7 +7704,7 @@ $(document).ready(function () {
         eventSource.emit(event_types.GENERATION_STOPPED);
     });
 
-    $('.drawer-toggle').click(function () {
+    $('.drawer-toggle').on('click', function () {
         var icon = $(this).find('.drawer-icon');
         var drawer = $(this).parent().find('.drawer-content');
         if (drawer.hasClass('resizing')) { return }
@@ -7741,7 +7741,7 @@ $(document).ready(function () {
             }
 
 
-        } else if (drawerWasOpenAlready) { //to close
+        } else if (drawerWasOpenAlready) { //to close manually
             icon.toggleClass('closedIcon openIcon');
 
             if (pinnedDrawerClicked) {
@@ -7787,7 +7787,9 @@ $(document).ready(function () {
             if (jQuery.find('.openDrawer').length !== 0) {
                 if (targetParentHasOpenDrawer === 0) {
                     //console.log($('.openDrawer').not('.pinnedOpen').length);
-                    $('.openDrawer').not('.pinnedOpen').slideToggle(200, "swing");
+                    $('.openDrawer').not('.pinnedOpen').addClass('resizing').slideToggle(200, "swing", function () {
+                        $(this).closest('.drawer-content').removeClass('resizing')
+                    });
                     $('.openIcon').toggleClass('closedIcon openIcon');
                     $('.openDrawer').not('.pinnedOpen').toggleClass('closedDrawer openDrawer');
 
@@ -7981,8 +7983,8 @@ $(document).ready(function () {
         const html = `<h3>Enter the URL of the content to import</h3>
         Supported sources:<br>
         <ul class="justifyLeft">
-            <li>Chub characters (direct link or id)<br>Example: <tt>lorebooks/bartleby/example-lorebook</tt></li>
+            <li>Chub characters (direct link or id)<br>Example: <tt></tt>Anonymous/example-character</li>
-            <li>Chub lorebooks (direct link or id)<br>Example: <tt>Anonymous/example-character</tt></li>
+            <li>Chub lorebooks (direct link or id)<br>Example: <tt>lorebooks/bartleby/example-lorebook</tt></li>
             <li>More coming soon...</li>
         <ul>`
         const input = await callPopup(html, 'input');

public/scripts/RossAscends-mods.js

@@ -27,7 +27,7 @@ import {
     SECRET_KEYS,
     secret_state,
 } from "./secrets.js";
-import { sortByCssOrder, debounce } from "./utils.js";
+import { sortByCssOrder, debounce, delay } from "./utils.js";
 import { chat_completion_sources, oai_settings } from "./openai.js";
 
 var NavToggle = document.getElementById("nav-toggle");
@@ -479,12 +479,30 @@ function OpenNavPanels() {
 
 export function dragElement(elmnt) {
     var pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
-    var height, width, top, left;
+    var height, width, top, left, right, bottom;
+
+    var oldTop = Number((String($(elmnt).css('top')).replace('px', '')))
+    var oldLeft = Number((String($(elmnt).css('left')).replace('px', '')))
+    var oldWidth = Number((String($(elmnt).css('width')).replace('px', '')))
+    var oldHeight = Number((String($(elmnt).css('width')).replace('px', '')))
+    var oldRight = Number((String($(elmnt).css('right')).replace('px', '')))
+    var oldBottom = Number((String($(elmnt).css('bottom')).replace('px', '')))
     var elmntName = elmnt.attr('id');
+    console.debug(`${elmntName} init state: 
+T: ${$(elmnt).css('top')}
+L: ${$(elmnt).css('left')}
+W: ${$(elmnt).css('width')}
+H: ${$(elmnt).css('height')}
+R: ${$(elmnt).css('right')}
+B: ${$(elmnt).css('bottom')}
+---`);
+
+
     const elmntNameEscaped = $.escapeSelector(elmntName);
     const elmntHeader = $(`#${elmntNameEscaped}header`);
     if (elmntHeader.length) {
         elmntHeader.off('mousedown').on('mousedown', (e) => {
+
             dragMouseDown(e);
         });
     } else {
@@ -497,40 +515,63 @@ export function dragElement(elmnt) {
             || $(target).hasClass('resizing')
             || Number((String(target.height).replace('px', ''))) < 50
             || Number((String(target.width).replace('px', ''))) < 50
+            || power_user.movingUI === false
             || isMobile() === true
-        ) { return }
+        ) {
+            console.debug('aborting mutator')
+            return
+        }
 
         const style = getComputedStyle(target);
-        console.log(style.top, style.left)
+        //console.log(style.top, style.left)
         height = target.offsetHeight;
         width = target.offsetWidth;
         top = parseInt(style.top);
         left = parseInt(style.left);
-
+        right = parseInt(style.right);
-        /*         console.log(`
+        bottom = parseInt(style.bottom);
-                        height=${height}, 
-                        width=${width}, 
-                        top=${top}, 
-                        left=${left}`); */
 
         if (!power_user.movingUIState[elmntName]) {
+            console.debug(`adding config property for ${elmntName}`)
             power_user.movingUIState[elmntName] = {};
         }
 
         power_user.movingUIState[elmntName].top = top;
         power_user.movingUIState[elmntName].left = left;
-        power_user.movingUIState[elmntName].width = width;
+
-        power_user.movingUIState[elmntName].height = height;
+        if (!isNaN(oldWidth)
-        power_user.movingUIState[elmntName].right = 'unset';
+            && !isNaN(oldHeight)
-        power_user.movingUIState[elmntName].bottom = 'unset';
+            && (oldHeight !== height || oldWidth !== width)) {
-        power_user.movingUIState[elmntName].margin = 'unset';
+            power_user.movingUIState[elmntName].width = width;
-        saveSettingsDebounced();
+            power_user.movingUIState[elmntName].height = height;
+        } else {
+            console.debug('skipping W/H setting')
+        }
+        power_user.movingUIState[elmntName].right = right;
+        power_user.movingUIState[elmntName].bottom = bottom;
+        if (!isNaN(oldTop) && !isNaN(oldLeft) && (oldTop !== top || oldLeft !== left)) {
+            console.debug('unsetting margin due to custom position')
+            console.debug(`${elmntName}:
+T: ${oldTop}>>${top}
+L: ${oldLeft}>> ${left}
+H: ${oldHeight} >> ${height}
+W: ${oldWidth}>> ${width}
+R: ${oldRight} >> ${right}
+B: ${oldBottom}>> ${bottom}
+---`)
+            power_user.movingUIState[elmntName].margin = 'unset';
+        } else {
+            console.log('skipped unsetting margins')
+            console.log(oldTop, top, oldLeft, left)
+        }
         saveSettingsDebounced();
 
 
+
         // Check if the element header exists and set the listener on the grabber
         if (elmntHeader.length) {
             elmntHeader.off('mousedown').on('mousedown', (e) => {
+                console.debug('listener started from header')
                 dragMouseDown(e);
             });
         } else {
@@ -541,6 +582,7 @@ export function dragElement(elmnt) {
     observer.observe(elmnt.get(0), { attributes: true, attributeFilter: ['style'] });
 
     function dragMouseDown(e) {
+
         if (e) {
             e.preventDefault();
             pos3 = e.clientX; //mouse X at click
@@ -615,6 +657,7 @@ export function dragElement(elmnt) {
     }
 
     function closeDragElement() {
+        console.debug('drag finished')
         $(document).off('mouseup', closeDragElement);
         $(document).off('mousemove', elementDrag);
         $("body").css("overflow", "");
@@ -624,27 +667,28 @@ export function dragElement(elmnt) {
     }
 }
 
+export async function initMovingUI() {
+    if (isMobile() === false && power_user.movingUI === true) {
+        console.debug('START MOVING UI')
+        dragElement($("#sheld"));
+        dragElement($("#left-nav-panel"));
+        dragElement($("#right-nav-panel"));
+        dragElement($("#WorldInfo"));
+        await delay(1000)
+        console.debug('loading AN draggable function')
+        dragElement($("#floatingPrompt"))
+
+    }
+}
+
 // ---------------------------------------------------
 
 $("document").ready(function () {
 
     // initial status check
     setTimeout(() => {
-        if (isMobile === false) {
+        RA_checkOnlineStatus();
-            dragElement($("#sheld"));
+    }, 100);
-            dragElement($("#left-nav-panel"));
-            dragElement($("#right-nav-panel"));
-            dragElement($("#WorldInfo"));
-            dragElement($("#floatingPrompt"));
-        }
-        RA_checkOnlineStatus
-    }
-        , 100);
-
-
-
-
-    //$('div').on('resize', saveMovingUIState());
 
     // read the state of AutoConnect and AutoLoadChat.
     $(AutoConnectCheckbox).prop("checked", LoadLocalBool("AutoConnectEnabled"));

public/scripts/horde.js

@@ -271,6 +271,14 @@ jQuery(function () {
             placeholder: 'Select Horde models',
             allowClear: true,
             closeOnSelect: false,
+            templateSelection: function(data) {
+                // Customize the pillbox text by shortening the full text
+                return data.id;
+            },
+            templateResult: function(data) {
+                // Return the full text for the dropdown
+                return data.text;
+            },
         });
     }
 })

public/scripts/power-user.js

@@ -15,10 +15,13 @@ import {
     printCharacters,
     name1,
     name2,
+    replaceCurrentChat,
+    setCharacterId
 } from "../script.js";
-import { favsToHotswap, isMobile } from "./RossAscends-mods.js";
+import { favsToHotswap, isMobile, initMovingUI } from "./RossAscends-mods.js";
 import {
     groups,
+    resetSelectedGroup,
     selected_group,
 } from "./group-chats.js";
 
@@ -308,7 +311,13 @@ function switchMovingUI() {
     const movingUI = localStorage.getItem(storage_keys.movingUI);
     power_user.movingUI = movingUI === null ? false : movingUI == "true";
     $("body").toggleClass("movingUI", power_user.movingUI);
-    scrollChatToBottom();
+    if (power_user.movingUI === true) {
+        initMovingUI()
+        if (power_user.movingUIState) {
+            loadMovingUIState();
+        }
+    };
+    //scrollChatToBottom();
 }
 
 function noShadows() {
@@ -648,7 +657,10 @@ function loadPowerUserSettings(settings, data) {
 }
 
 function loadMovingUIState() {
-    if (isMobile() === false && power_user.movingUIState) {
+    if (isMobile() === false
+        && power_user.movingUIState
+        && power_user.movingUI === true) {
+        console.debug('loading movingUI state')
         for (var elmntName of Object.keys(power_user.movingUIState)) {
             var elmntState = power_user.movingUIState[elmntName];
             try {
@@ -664,7 +676,7 @@ function loadMovingUIState() {
             }
         }
     } else {
-        console.debug('skipping movingUI state load for mobile')
+        console.debug('skipping movingUI state load')
         return
     }
 }
@@ -939,6 +951,22 @@ function resetMovablePanels() {
     document.getElementById("right-nav-panel").style.width = '';
     document.getElementById("right-nav-panel").style.margin = '';
 
+    document.getElementById("WorldInfo").style.top = '';
+    document.getElementById("WorldInfo").style.left = '';
+    document.getElementById("WorldInfo").style.right = '';
+    document.getElementById("WorldInfo").style.bottom = '';
+    document.getElementById("WorldInfo").style.height = '';
+    document.getElementById("WorldInfo").style.width = '';
+    document.getElementById("WorldInfo").style.margin = '';
+
+    document.getElementById("floatingPrompt").style.top = '';
+    document.getElementById("floatingPrompt").style.left = '';
+    document.getElementById("floatingPrompt").style.right = '';
+    document.getElementById("floatingPrompt").style.bottom = '';
+    document.getElementById("floatingPrompt").style.height = '';
+    document.getElementById("floatingPrompt").style.width = '';
+    document.getElementById("floatingPrompt").style.margin = '';
+
     if ($("#expression-holder")) {
         document.getElementById("expression-holder").style.top = '';
         document.getElementById("expression-holder").style.left = '';
@@ -959,23 +987,6 @@ function resetMovablePanels() {
         $(".zoomed_avatar").css('margin', '');
     }
 
-
-    document.getElementById("WorldInfo").style.top = '';
-    document.getElementById("WorldInfo").style.left = '';
-    document.getElementById("WorldInfo").style.right = '';
-    document.getElementById("WorldInfo").style.bottom = '';
-    document.getElementById("WorldInfo").style.height = '';
-    document.getElementById("WorldInfo").style.width = '';
-    document.getElementById("WorldInfo").style.margin = '';
-
-    document.getElementById("floatingPrompt").style.top = '';
-    document.getElementById("floatingPrompt").style.left = '';
-    document.getElementById("floatingPrompt").style.right = '';
-    document.getElementById("floatingPrompt").style.bottom = '';
-    document.getElementById("floatingPrompt").style.height = '';
-    document.getElementById("floatingPrompt").style.width = '';
-    document.getElementById("floatingPrompt").style.margin = '';
-
     $('*[data-dragged="true"]').removeAttr('data-dragged');
     power_user.movingUIState = {}
     saveSettingsDebounced();
@@ -992,6 +1003,15 @@ function doNewChat() {
     }, 1);
 }
 
+function doRandomChat() {
+    resetSelectedGroup();
+    setCharacterId(Math.floor(Math.random() * characters.length));
+    setTimeout(() => {
+        replaceCurrentChat();
+    }, 1);
+
+}
+
 function doDelMode() {
     setTimeout(() => {
         $("#option_delete_mes").trigger('click')
@@ -1399,5 +1419,6 @@ $(document).ready(() => {
 
     registerSlashCommand('vn', toggleWaifu, ['vn'], ' – swaps Visual Novel Mode On/Off', false, true);
     registerSlashCommand('newchat', doNewChat, ['newchat'], ' – start a new chat with current character', true, true);
+    registerSlashCommand('random', doRandomChat, ['random'], ' – start a new chat with a random character', true, true);
     registerSlashCommand('delmode', doDelMode, ['delmode'], ' – enter message deletion mode', true, true);
 });

public/scripts/world-info.js

@@ -250,16 +250,18 @@ function displayWorldEntries(name, data) {
             return;
         }
 
-        const existingCharLores = world_info.charLore?.filter((e) => e.extraBooks.includes(name));
+        if (world_info.charLore) {
-        if (existingCharLores && existingCharLores.length > 0) {
+            world_info.charLore.forEach((charLore, index) => {
-            existingCharLores.forEach((charLore) => {
+                if (charLore.extraBooks?.includes(name)) {
-                const tempCharLore = charLore.extraBooks.filter((e) => e !== name);
+                    const tempCharLore = charLore.extraBooks.filter((e) => e !== name);
-                if (tempCharLore.length === 0) {
+                    if (tempCharLore.length === 0) {
-                    world_info.charLore.splice(charLore, 1);
+                        world_info.charLore.splice(index, 1);
-                } else {
+                    } else {
-                    charLore.extraBooks = tempCharLore;
+                        charLore.extraBooks = tempCharLore;
+                    }
                 }
             });
+
             saveSettingsDebounced();
         }
 
@@ -1368,4 +1370,21 @@ jQuery(() => {
             }
         }
     });
-});
+
+    $("#world_info").on('mousewheel', function (e) {
+        e.preventDefault();
+        if ($(this).is(':animated')) {
+            return; //dont force multiple scroll animations
+        }
+        var wheelDelta = e.originalEvent.wheelDelta.toFixed(0);
+        var DeltaPosNeg = (wheelDelta >= 0) ? 1 : -1; //determine if scrolling up or down
+        var containerHeight = $(this).height().toFixed(0);
+        var optionHeight = $(this).find('option').first().height().toFixed(0);
+        var visibleOptions = (containerHeight / optionHeight).toFixed(0); //how many options we can see
+        var pixelsToScroll = (optionHeight * visibleOptions * DeltaPosNeg).toFixed(0); //scroll a full container height
+        var scrollTop = ($(this).scrollTop() - pixelsToScroll).toFixed(0);
+
+        $(this).animate({ scrollTop: scrollTop }, 200);
+    });
+
+})

public/style.css

@@ -3874,9 +3874,10 @@ label[for="extensions_autoconnect"] {
     max-height: calc(100svh - 70px);
     display: none;
     position: absolute;
+    top: 41px;
     left: 0;
     right: 0;
-    margin: 35px auto 0 auto;
+    margin: 0 auto;
     backdrop-filter: blur(calc(var(--SmartThemeBlurStrength)));
     -webkit-backdrop-filter: blur(calc(var(--SmartThemeBlurStrength)));
     z-index: 9999 !important;
@@ -4249,7 +4250,8 @@ body.no-blur #character_popup,
 body.no-blur #world_popup,
 body.no-blur #dialogue_popup,
 body.no-blur #select_chat_popup,
-body.no-blur .drawer-content {
+body.no-blur .drawer-content,
+body.no-blur .select2-results__options {
     background-color: black !important;
 }
 
@@ -4869,6 +4871,10 @@ body.waifuMode .zoomed_avatar {
     padding: 3px 5px;
 }
 
+.select2-container.select2-container--focus .select2-selection--multiple {
+    border: 1px solid var(--white30a);
+}
+
 .select2-container .select2-selection--multiple .select2-selection__choice {
     border-radius: 5px;
     border-style: solid;
@@ -4917,6 +4923,10 @@ body.waifuMode .zoomed_avatar {
     border-radius: 2px;
 }
 
+.select2-container .select2-selection--multiple .select2-selection__choice__remove {
+    color: var(--SmartThemeBodyColor);
+}
+
 /* Add the custom checkbox checkmark */
 .select2-results__option--selected.select2-results__option:before {
     content: '\2713';
@@ -4925,4 +4935,4 @@ body.waifuMode .zoomed_avatar {
     background-color: var(--SmartThemeBlurTintColor);
     text-align: center;
     line-height: 14px;
-}
+}

server.js

@@ -823,7 +823,6 @@ function charaFormatData(data) {
     // This is supposed to save all the foreign keys that ST doesn't care about
     const _ = require('lodash');
     const char = tryParse(data.json_data) || {};
-    console.log(data.tags);
 
     // This function uses _.cond() to create a series of conditional checks that return the desired output based on the input data.
     // It checks if data.alternate_greetings is an array, a string, or neither, and acts accordingly.
@@ -1866,7 +1865,6 @@ app.post("/importcharacter", urlencodedParser, async function (request, response
                     charaWrite(uploadPath, char, png_name, response, { file_name: png_name });
                 } else if (jsonData.name !== undefined) {
                     console.log('Found a v1 character file.');
-                    console.log(jsonData);
                     let char = {
                         "name": jsonData.name,
                         "description": jsonData.description ?? '',