5c302446 · permissionBRICK/SillyTavern

 import { SlashCommand } from '../../slash-commands/SlashCommand.js';
 import { ARGUMENT_TYPE, SlashCommandArgument, SlashCommandNamedArgument } from '../../slash-commands/SlashCommandArgument.js';
 import { SlashCommandEnumValue, enumTypes } from '../../slash-commands/SlashCommandEnumValue.js';
 import { commonEnumProviders, enumIcons } from '../../slash-commands/SlashCommandCommonEnumsProvider.js';
 import { slashCommandReturnHelper } from '../../slash-commands/SlashCommandReturnHelper.js';
 import { generateWebLlmChatPrompt, isWebLlmSupported } from '../shared.js';
 import { Popup, POPUP_RESULT } from '../../popup.js';

 const updateVisualNovelModeDebounced = debounce(forceUpdateVisualNovelMode, debounce_timeout.quick);
 async function updateVisualNovelMode(name, expression) {
     const containervnContainer = $('#visual-novel-wrapper');
     await visualNovelRemoveInactive(containervnContainer);
     const setSpritePromises = await visualNovelSetCharacterSprites(containervnContainer, name, expression);
     // calculate layer indices based on recent messages
     await visualNovelUpdateLayers(containervnContainer);
     await Promise.allSettled(setSpritePromises);
     // update again based on new sprites
     if (setSpritePromises.length > 0) {
         await visualNovelUpdateLayers(containervnContainer);
+    }
+}

     await Promise.allSettled(removeInactiveCharactersPromises);
+}
 -async function visualNovelSetCharacterSprites(container, name, expression) {
 +/**
 + * Sets the character sprites for visual novel mode based on the provided container, name, and expression.
 + *
 + * @param {JQuery<HTMLElement>} vnContainer - The container element where the sprites will be set
 + * @param {string} spriteFolderName - The name of the sprite folder
 + * @param {string} expression - The expression to set for the characters
 + * @returns {Promise<Array>} - An array of promises that resolve when the sprites are set
 + */
 +async function visualNovelSetCharacterSprites(vnContainer, spriteFolderName, expression) {
     const context = getContext();
     const group = context.groups.find(x => x.id == context.groupId);
 -    const labels = await getExpressionsList();
 -    const createCharacterPromises = [];
     const setSpritePromises = [];
     for (const avatar of group.members) {
 -        const isDisabled = group.disabled_members.includes(avatar);
+-
         // skip disabled characters
 +        const isDisabled = group.disabled_members.includes(avatar);
         if (isDisabled && hideMutedSprites) {
             continue;
+        }
         const character = context.characters.find(x => x.avatar == avatar);
+-
         if (!character) {
             continue;
+        }
 -        const spriteFolderName = getSpriteFolderName({ original_avatar: character.avatar }, character.name);
 +        const expressionImage = vnContainer.find(`.expression-holder[data-avatar="${avatar}"]`);
++
 +        const memberSpriteFolderName = getSpriteFolderName({ original_avatar: character.avatar }, character.name);
         // download images if not downloaded yet
         if (spriteCache[spriteFolderNamememberSpriteFolderName] === undefined) {
             spriteCache[spriteFolderNamememberSpriteFolderName] = await getSpritesList(spriteFolderNamememberSpriteFolderName);
+        }
 -        const sprites = spriteCache[spriteFolderName];
 +        const prevExpressionSrc = expressionImage.find('img').attr('src') || null;
 -        const expressionImage = container.find(`.expression-holder[data-avatar="${avatar}"]`);
 -        const defaultExpression = getFallbackExpression();
 -        // TODO: Visual novel sprites need fixing, currently do not update based on multiple sprites, etc
 -        const defaultSpritePath = sprites.find(x => x.label === defaultExpression)?.path;
 -        const noSprites = sprites.length === 0;
 -        if (expressionImage.length > 0) {
 +        const spriteFile = chooseSpriteForExpression(memberSpriteFolderName, expression, { prevExpressionSrc: prevExpressionSrc });
                     if (name == spriteFolderNameexpressionImage.length) {
 -                await validateImages(spriteFolderName, true);
 +            if (spriteFolderName == memberSpriteFolderName) {
 +                await validateImages(memberSpriteFolderName, true);
                 setExpressionOverrideHtml(true); // <= force clear expression override input
 -                const currentSpritePath = labels.includes(expression) ? sprites.find(x => x.label === expression)?.path : '';
 +                const path = spriteFile?.imageSrc || '';
+-
 -                const path = currentSpritePath || defaultSpritePath || '';
                 const img = expressionImage.find('img');
                 await setImage(img, path);
+            }
             expressionImage.toggleClass('hidden', noSprites!spriteFile);
         } else {
             const template = $('#expression-holder').clone();
             template.attr('id', `expression-${avatar}`);

             template.find('.drag-grabber').attr('id', `expression-${avatar}header`);
             $('#visual-novel-wrapper').append(template);
             dragElement($(template[0]));
             template.toggleClass('hidden', noSprites!spriteFile);
             await setImage(template.find('img'), defaultSpritePathspriteFile?.imageSrc || '');
             const fadeInPromise = new Promise(resolve => {
                 template.fadeIn(250, () => resolve());
             });
             createCharacterPromisessetSpritePromises.push(fadeInPromise);
 -            const setSpritePromise = setLastMessageSprite(template.find('img'), avatar, labels);
 -            setSpritePromises.push(setSpritePromise);
+        }
++
 +        if (spriteFile) console.info(`Expression set for group member ${character.name}`, { expression: spriteFile.expression, file: spriteFile.fileName });
 +        else if (expressionImage.length) console.info(`Expression unset for group member ${character.name} - No sprite found`, { expression: expression });
 +        else console.info(`Expression not available for group member ${character.name}`, { expression: expression });
+    }
 -    await Promise.allSettled(createCharacterPromises);
     return setSpritePromises;
+}

     const containerWidth = container.width();
     const pivotalPoint = containerWidth * 0.5;
     let images = Array.from($('#visual-novel-wrapper .expression-holder')).sort(sortFunction);
     let imagesWidth = [];
     images.sort(sortFunction).eachforEach(functionimage ()=> {
         imagesWidth.push($(thisimage).width());
     });
     let totalWidth = imagesWidth.reduce((a, b) => a + b, 0);

         currentPosition = 0; // Reset the initial position to 0
+    }
     images.sort(sortFunction).eachforEach((indexcurrent, currentindex) => {
         const element = $(current);
         const elementID = element.attr('id');

     await Promise.allSettled(setLayerIndicesPromises);
+}
 -async function setLastMessageSprite(img, avatar, labels) {
 -    const context = getContext();
 -    const lastMessage = context.chat.slice().reverse().find(x => x.original_avatar == avatar || (x.force_avatar && x.force_avatar.includes(encodeURIComponent(avatar))));
+-
 -    if (lastMessage) {
 -        const text = lastMessage.mes || '';
 -        const spriteFolderName = getSpriteFolderName(lastMessage, lastMessage.name);
 -        const sprites = spriteCache[spriteFolderName] || [];
 -        const label = await getExpressionLabel(text);
 -        const path = labels.includes(label) ? sprites.find(x => x.label === label)?.path : '';
+-
 -        if (path) {
 -            setImage(img, path);
 -        }
 -    }
 -}
+-
 async function setImage(img, path) {
     // Cohee: If something goes wrong, uncomment this to return to the old behavior
     /*

 /**
  * Validate a character's sprites, and redraw the sprites list if not done before or forced to redraw.
  * @param {string} characterspriteFolderName - The character sprite folder to validate
  * @param {boolean} [forceRedrawCached=false] - Whether to force redrawing the sprites list even if it's already been drawn before
  */
 async function validateImages(characterspriteFolderName, forceRedrawCached = false) {
     if (!characterspriteFolderName) {
         return;
+    }
     const labels = await getExpressionsList();
     if (spriteCache[characterspriteFolderName]) {
         if (forceRedrawCached && $('#image_list').data('name') !== characterspriteFolderName) {
             console.debug('force redrawing character sprites list');
             await drawSpritesList(characterspriteFolderName, labels, spriteCache[characterspriteFolderName]);
+        }
         return;
+    }
     const sprites = await getSpritesList(characterspriteFolderName);
     let validExpressions = await drawSpritesList(characterspriteFolderName, labels, sprites);
     spriteCache[characterspriteFolderName] = validExpressions;
+}
 /**

 /**
  * Populate the character expression list with sprites for the given character.
  * @param {string} characterspriteFolderName - The name of the character to populate the list for
  * @param {string[]} labels - An array of expression labels that are valid
  * @param {Expression[]} sprites - An array of sprites
  * @returns {Promise<Expression[]>} An array of valid expression labels
  */
 async function drawSpritesList(characterspriteFolderName, labels, sprites) {
     /** @type {Expression[]} */
     let validExpressions = [];
     $('#no_chat_expressions').hide();
     $('#open_chat_expressions').show();
     $('#image_list').empty();
     $('#image_list').data('name', characterspriteFolderName);
     $('#image_list_header_name').text(characterspriteFolderName);
     if (!Array.isArray(labels)) {
         return [];

+}
 /**
 - * Set the expression of a character.
 + * Selects a sprite from the given sprite folder for the given expression.
 - * @param {string} character - The name of the character
 + *
 - * @param {string} expression - The expression or sprite name to set
 + * If multiple sprites are allowed for the expression, it will randomly select one.
 - * @param {Object} options - Optional parameters
 + * If the rerollIfSame option is enabled, it will only select a different sprite if the previous sprite was the same.
 - * @param {boolean} [options.force=false] - Whether to force the expression change even if Visual Novel mode is on
 + * If the overrideSpriteFile option is set, it will look for the sprite with the given file name instead of randomly selecting one.
 - * @param {string?} [options.overrideSpriteFile=null] - Set if a specific sprite file should be used. Must be sprite file name.
 + *
  * @returnsparam {Promise<void>string} AspriteFolderName promise- thatThe resolvesname whenof the expression has beensprite set.folder
 + * @param {string} expression - The expression to find the sprite for
 + * @param {object} [options] - Options to select the sprite
 + * @param {string} [options.prevExpressionSrc=null] - The source of the previous expression
 + * @param {string} [options.overrideSpriteFile=null] - The file name of the sprite to select
 + * @returns {ExpressionImage} - The selected sprite
  */
 async function setExpressionchooseSpriteForExpression(characterspriteFolderName, expression, { forceprevExpressionSrc = falsenull, overrideSpriteFile = null } = {}) {
 -    await validateImages(character);
 +    const sprite = (spriteCache[spriteFolderName] && spriteCache[spriteFolderName].find(x => x.label === expression));
 -    const img = $('img.expression');
 +    if (!(sprite?.files.length > 0))
 -    const prevExpressionSrc = img.attr('src');
 +        return null;
 -    const expressionClone = img.clone();
 -    /** @type {Expression} */
 -    const sprite = (spriteCache[character] && spriteCache[character].find(x => x.label === expression));
 -    if (sprite && sprite.files.length > 0) {
     let spriteFile = sprite.files[0];
     // If a specific sprite file should be set, we are looking it up here

     else if (extension_settings.expressions.allowMultiple && sprite.files.length > 1) {
         let possibleFiles = sprite.files;
         if (extension_settings.expressions.rerollIfSame) {
                             possibleFiles = possibleFiles.filter(x => !prevExpressionSrc || x.imageSrc !== prevExpressionSrc);
+        }
         spriteFile = possibleFiles[Math.floor(Math.random() * possibleFiles.length)];
+    }
 +    return spriteFile;
++
 +}
++
 +/**
 + * Set the expression of a character.
 + * @param {string} spriteFolderName - The name of the character (folder name - can also be a costume override)
 + * @param {string} expression - The expression or sprite name to set
 + * @param {Object} options - Optional parameters
 + * @param {boolean} [options.force=false] - Whether to force the expression change even if Visual Novel mode is on
 + * @param {string?} [options.overrideSpriteFile=null] - Set if a specific sprite file should be used. Must be sprite file name.
 + * @returns {Promise<void>} A promise that resolves when the expression has been set.
 + */
 +async function setExpression(spriteFolderName, expression, { force = false, overrideSpriteFile = null } = {}) {
 +    await validateImages(spriteFolderName);
 +    const img = $('img.expression');
 +    const prevExpressionSrc = img.attr('src');
 +    const expressionClone = img.clone();
++
 +    const spriteFile = chooseSpriteForExpression(spriteFolderName, expression, { prevExpressionSrc: prevExpressionSrc, overrideSpriteFile: overrideSpriteFile });
 +    if (spriteFile) {
         if (force && isVisualNovelMode()) {
             const context = getContext();
             const group = context.groups.find(x => x.id === context.groupId);
 -            for (const member of group.members) {
 +            // If it's a folder, make sure we find the group member based on the actual name
 -                const groupMember = context.characters.find(x => x.avatar === member);
 +            const memberName = spriteFolderName.split('/')[0] ?? spriteFolderName;
+-
 -                if (!groupMember) {
 -                    continue;
 -                }
 -                if (groupMember.name == character) {
 +            const groupMember = group.members
 -                    await setImage($(`.expression-holder[data-avatar="${member}"] img`), spriteFile.imageSrc);
 +                .map(member => context.characters.find(x => x.avatar === member))
 +                .find(groupMember => groupMember && groupMember.name === memberName);
 +            if (groupMember) {
 +                await setImage($(`.expression-holder[data-avatar="${groupMember.avatar}"] img`), spriteFile.imageSrc);
                 return;
+            }
+        }
 -        }
         //only swap expressions when necessary
         if (prevExpressionSrc !== spriteFile.imageSrc

@@ -1456,7 +1460,7 @@ async function setExpression(character, expression, { force = false, overrideSpr
1456	1460	} else {
1457	1461	setNone();
1458	1462	}
1459	1463	console.debug('Expression unset - No sprite found', { expression: expression });
1460	1464	}
1461	1465
1462	1466	function setDefault() {

         $(document).on('click', '.expression_list_item', onClickExpressionImage);
         $(document).on('click', '.expression_list_upload', onClickExpressionUpload);
         $(document).on('click', '.expression_list_delete', onClickExpressionDelete);
         $(window).on('resize', () => updateVisualNovelModeDebounced());
         $('#open_chat_expressions').hide();
         await renderAdditionalExpressionSettings();

Fix visual novel mode for new expression thingy