Merge branch 'staging' into pygimport

public/scripts/extensions/assets/index.js

@@ -3,8 +3,9 @@ TODO:
 */
 //const DEBUG_TONY_SAMA_FORK_MODE = true
 
-import { getRequestHeaders, callPopup } from '../../../script.js';
+import { getRequestHeaders, callPopup, processDroppedFiles } from '../../../script.js';
-import { deleteExtension, extensionNames, installExtension, renderExtensionTemplate } from '../../extensions.js';
+import { deleteExtension, extensionNames, getContext, installExtension, renderExtensionTemplate } from '../../extensions.js';
+import { executeSlashCommands } from '../../slash-commands.js';
 import { getStringHash, isValidUrl } from '../../utils.js';
 export { MODULE_NAME };
 
@@ -61,8 +62,8 @@ function downloadAssetsList(url) {
                     for (const i in availableAssets[assetType]) {
                         const asset = availableAssets[assetType][i];
                         const elemId = `assets_install_${assetType}_${i}`;
-                        let element = $('<button />', { id: elemId, type: 'button', class: 'asset-download-button menu_button' });
+                        let element = $('<div />', { id: elemId, class: 'asset-download-button right_menu_button' });
-                        const label = $('<i class="fa-fw fa-solid fa-download fa-xl"></i>');
+                        const label = $('<i class="fa-fw fa-solid fa-download fa-lg"></i>');
                         element.append(label);
 
                         //if (DEBUG_TONY_SAMA_FORK_MODE)
@@ -90,6 +91,11 @@ function downloadAssetsList(url) {
                         };
 
                         const assetDelete = async function () {
+                            if (assetType === 'character') {
+                                toastr.error('Go to the characters menu to delete a character.', 'Character deletion not supported');
+                                await executeSlashCommands(`/go ${asset['id']}`);
+                                return;
+                            }
                             element.off('click');
                             await deleteAsset(assetType, asset['id']);
                             label.removeClass('fa-check');
@@ -126,20 +132,27 @@ function downloadAssetsList(url) {
                         const displayName = DOMPurify.sanitize(asset['name'] || asset['id']);
                         const description = DOMPurify.sanitize(asset['description'] || '');
                         const url = isValidUrl(asset['url']) ? asset['url'] : '';
-                        const previewIcon = assetType == 'extension' ? 'fa-arrow-up-right-from-square' : 'fa-headphones-simple';
+                        const previewIcon = (assetType === 'extension' || assetType === 'character') ? 'fa-arrow-up-right-from-square' : 'fa-headphones-simple';
 
-                        $('<i></i>')
+                        const assetBlock = $('<i></i>')
                             .append(element)
-                            .append(`<div class="flex-container flexFlowColumn">
+                            .append(`<div class="flex-container flexFlowColumn flexNoGap">
-                                        <span class="flex-container alignitemscenter">
+                                        <span class="asset-name flex-container alignitemscenter">
                                             <b>${displayName}</b>
                                             <a class="asset_preview" href="${url}" target="_blank" title="Preview in browser">
                                                 <i class="fa-solid fa-sm ${previewIcon}"></i>
                                             </a>
                                         </span>
-                                        <span>${description}</span>
+                                        <small class="asset-description">
-                                     </div>`)
+                                            ${description}
-                            .appendTo(assetTypeMenu);
+                                        </small>
+                                     </div>`);
+
+                        if (assetType === 'character') {
+                            assetBlock.find('.asset-name').prepend(`<div class="avatar"><img src="${asset['url']}" alt="${displayName}"></div>`);
+                        }
+
+                        assetTypeMenu.append(assetBlock);
                     }
                     assetTypeMenu.appendTo('#assets_menu');
                     assetTypeMenu.on('click', 'a.asset_preview', previewAsset);
@@ -186,6 +199,10 @@ function isAssetInstalled(assetType, filename) {
         assetList = extensionNames.filter(x => x.startsWith(thirdPartyMarker)).map(x => x.replace(thirdPartyMarker, ''));
     }
 
+    if (assetType == 'character') {
+        assetList = getContext().characters.map(x => x.avatar);
+    }
+
     for (const i of assetList) {
         //console.debug(DEBUG_PREFIX,i,filename)
         if (i.includes(filename))
@@ -215,6 +232,13 @@ async function installAsset(url, assetType, filename) {
         });
         if (result.ok) {
             console.debug(DEBUG_PREFIX, 'Download success.');
+            if (category === 'character') {
+                console.debug(DEBUG_PREFIX, 'Importing character ', filename);
+                const blob = await result.blob();
+                const file = new File([blob], filename, { type: blob.type });
+                await processDroppedFiles([file]);
+                console.debug(DEBUG_PREFIX, 'Character downloaded.');
+            }
         }
     }
     catch (err) {

public/scripts/extensions/assets/style.css

@@ -27,17 +27,14 @@
     color: inherit;
 }
 
-.assets-list-div i {
+.assets-list-div > i {
     display: flex;
     flex-direction: row;
     align-items: center;
     justify-content: left;
     padding: 5px;
     font-style: normal;
-}
+    gap: 5px;
-
-.assets-list-div i span {
-    margin-left: 10px;
 }
 
 .assets-list-div i span:first-of-type {
@@ -46,12 +43,11 @@
 
 .asset-download-button {
     position: relative;
-    width: 50px;
-    padding: 8px 16px;
     border: none;
     outline: none;
     border-radius: 2px;
     cursor: pointer;
+    filter: none !important;
 }
 
 .asset-download-button:active {
@@ -85,6 +81,21 @@
     animation: asset-download-button-loading-spinner 1s ease infinite;
 }
 
+.asset-name .avatar {
+    --imgSize: 30px !important;
+    flex: unset;
+    width: var(--imgSize);
+    height: var(--imgSize);
+}
+
+.asset-name .avatar img {
+    width: var(--imgSize);
+    height: var(--imgSize);
+    border-radius: 50%;
+    object-fit: cover;
+    object-position: center center;
+}
+
 @keyframes asset-download-button-loading-spinner {
     from {
         transform: rotate(0turn);

public/scripts/slash-commands.js

@@ -80,14 +80,23 @@ class SlashCommandParser {
         const excludedFromRegex = ['sendas'];
         const firstSpace = text.indexOf(' ');
         const command = firstSpace !== -1 ? text.substring(1, firstSpace) : text.substring(1);
-        const args = firstSpace !== -1 ? text.substring(firstSpace + 1) : '';
+        let args = firstSpace !== -1 ? text.substring(firstSpace + 1) : '';
         const argObj = {};
         let unnamedArg;
 
         if (args.length > 0) {
+            let match;
+
+            // Match unnamed argument
+            const unnamedArgPattern = /(?:\w+=(?:"(?:\\.|[^"\\])*"|\S+)\s*)*(.*)/s;
+            match = unnamedArgPattern.exec(args);
+            if (match !== null && match[1].length > 0) {
+                args = args.slice(0, -match[1].length);
+                unnamedArg = match[1].trim();
+            }
+
             // Match named arguments
             const namedArgPattern = /(\w+)=("(?:\\.|[^"\\])*"|\S+)/g;
-            let match;
             while ((match = namedArgPattern.exec(args)) !== null) {
                 const key = match[1];
                 const value = match[2];
@@ -95,13 +104,6 @@ class SlashCommandParser {
                 argObj[key] = value.replace(/(^")|("$)/g, '');
             }
 
-            // Match unnamed argument
-            const unnamedArgPattern = /(?:\w+=(?:"(?:\\.|[^"\\])*"|\S+)\s*)*(.*)/s;
-            match = unnamedArgPattern.exec(args);
-            if (match !== null) {
-                unnamedArg = match[1].trim();
-            }
-
             // Excluded commands format in their own function
             if (!excludedFromRegex.includes(command)) {
                 unnamedArg = getRegexedString(
@@ -1119,6 +1121,12 @@ function findCharacterIndex(name) {
         (a, b) => a.includes(b),
     ];
 
+    const exactAvatarMatch = characters.findIndex(x => x.avatar === name);
+
+    if (exactAvatarMatch !== -1) {
+        return exactAvatarMatch;
+    }
+
     for (const matchType of matchTypes) {
         const index = characters.findIndex(x => matchType(x.name.toLowerCase(), name.toLowerCase()));
         if (index !== -1) {

src/endpoints/assets.js

@@ -8,7 +8,7 @@ const { DIRECTORIES, UNSAFE_EXTENSIONS } = require('../constants');
 const { jsonParser } = require('../express-common');
 const { clientRelativePath } = require('../util');
 
-const VALID_CATEGORIES = ['bgm', 'ambient', 'blip', 'live2d', 'vrm'];
+const VALID_CATEGORIES = ['bgm', 'ambient', 'blip', 'live2d', 'vrm', 'character'];
 
 /**
  * Validates the input filename for the asset.
@@ -199,6 +199,13 @@ router.post('/download', jsonParser, async (request, response) => {
         const fileStream = fs.createWriteStream(destination, { flags: 'wx' });
         await finished(res.body.pipe(fileStream));
 
+        if (category === 'character') {
+            response.sendFile(temp_path, { root: process.cwd() }, () => {
+                fs.rmSync(temp_path);
+            });
+            return;
+        }
+
         // Move into asset place
         console.debug('Download finished, moving file from', temp_path, 'to', file_path);
         fs.renameSync(temp_path, file_path);

src/endpoints/backends/chat-completions.js

@@ -513,8 +513,11 @@ router.post('/status', jsonParser, async function (request, response_getstatus_o
     } else if (request.body.chat_completion_source === CHAT_COMPLETION_SOURCES.OPENROUTER) {
         api_url = 'https://openrouter.ai/api/v1';
         api_key_openai = readSecret(SECRET_KEYS.OPENROUTER);
-        // OpenRouter needs to pass the referer: https://openrouter.ai/docs
+        // OpenRouter needs to pass the Referer and X-Title: https://openrouter.ai/docs#requests
-        headers = { 'HTTP-Referer': request.headers.referer };
+        headers = {
+            'HTTP-Referer': 'https://sillytavern.app',
+            'X-Title': 'SillyTavern',
+        };
     } else if (request.body.chat_completion_source === CHAT_COMPLETION_SOURCES.MISTRALAI) {
         api_url = new URL(request.body.reverse_proxy || API_MISTRAL).toString();
         api_key_openai = request.body.reverse_proxy ? request.body.proxy_password : readSecret(SECRET_KEYS.MISTRALAI);
@@ -700,8 +703,11 @@ router.post('/generate', jsonParser, function (request, response) {
     } else if (request.body.chat_completion_source === CHAT_COMPLETION_SOURCES.OPENROUTER) {
         apiUrl = 'https://openrouter.ai/api/v1';
         apiKey = readSecret(SECRET_KEYS.OPENROUTER);
-        // OpenRouter needs to pass the referer: https://openrouter.ai/docs
+        // OpenRouter needs to pass the Referer and X-Title: https://openrouter.ai/docs#requests
-        headers = { 'HTTP-Referer': request.headers.referer };
+        headers = {
+            'HTTP-Referer': 'https://sillytavern.app',
+            'X-Title': 'SillyTavern',
+        };
         bodyParams = { 'transforms': ['middle-out'] };
 
         if (request.body.min_p !== undefined) {