Assorted SD fixes

public/script.js

@@ -9055,19 +9055,12 @@ jQuery(async function () {
     });
 
     $(document).on('click', '.mes .avatar', function () {
-
+        const messageElement = $(this).closest('.mes');
-        //console.log(isMobile());
+        const thumbURL = $(this).children('img').attr('src');
-        //console.log($('body').hasClass('waifuMode'));
+        const charsPath = '/characters/'
-
+        const targetAvatarImg = thumbURL.substring(thumbURL.lastIndexOf("=") + 1);
-        /* if (isMobile() === true && !$('body').hasClass('waifuMode')) {
+        const charname = targetAvatarImg.replace('.png', '');
-            console.debug('saw mobile regular mode, returning');
+        const isValidCharacter = characters.some(x => x.avatar === targetAvatarImg);
-            return;
-        } else { console.debug('saw valid env for zoomed display') } */
-
-        let thumbURL = $(this).children('img').attr('src');
-        let charsPath = '/characters/'
-        let targetAvatarImg = thumbURL.substring(thumbURL.lastIndexOf("=") + 1);
-        let charname = targetAvatarImg.replace('.png', '');
 
         // Remove existing zoomed avatars for characters that are not the clicked character when moving UI is not enabled
         if (!power_user.movingUI) {
@@ -9080,7 +9073,7 @@ jQuery(async function () {
             });
         }
 
-        let avatarSrc = isDataURL(thumbURL) ? thumbURL : charsPath + targetAvatarImg;
+        const avatarSrc = isDataURL(thumbURL) ? thumbURL : charsPath + targetAvatarImg;
         if ($(`.zoomed_avatar[forChar="${charname}"]`).length) {
             console.debug('removing container as it already existed')
             $(`.zoomed_avatar[forChar="${charname}"]`).remove();
@@ -9094,11 +9087,11 @@ jQuery(async function () {
             newElement.find('.drag-grabber').attr('id', `zoomFor_${charname}header`);
 
             $('body').append(newElement);
-            if ($(this).parent().parent().attr('is_user') == 'true') { //handle user avatars
+            if (messageElement.attr('is_user') == 'true') { //handle user avatars
                 $(`.zoomed_avatar[forChar="${charname}"] img`).attr('src', thumbURL);
-            } else if ($(this).parent().parent().attr('is_system') == 'true') { //handle system avatars
+            } else if (messageElement.attr('is_system') == 'true' && !isValidCharacter) { //handle system avatars
                 $(`.zoomed_avatar[forChar="${charname}"] img`).attr('src', thumbURL);
-            } else if ($(this).parent().parent().attr('is_user') == 'false') { //handle char avatars
+            } else if (messageElement.attr('is_user') == 'false') { //handle char avatars
                 $(`.zoomed_avatar[forChar="${charname}"] img`).attr('src', avatarSrc);
             }
             loadMovingUIState();

public/scripts/extensions.js

@@ -365,10 +365,9 @@ function addExtensionsButtonAndMenu() {
     });
 
     $("html").on('touchstart mousedown', function (e) {
-        // let clickTarget = $(e.target);
+        const clickTarget = $(e.target);
-        if (dropdown.is(':visible')
+        const noCloseTargets = ['#sd_gen'];
-            /*&& clickTarget.closest(button).length == 0
+        if (dropdown.is(':visible') && !noCloseTargets.some(id => clickTarget.closest(id).length > 0)) {
-            && clickTarget.closest(dropdown).length == 0*/) {
             $(dropdown).fadeOut(animation_duration);
         }
     });

public/scripts/extensions/stable-diffusion/index.js

@@ -7,10 +7,11 @@ import {
     getRequestHeaders,
     event_types,
     eventSource,
-    appendImageToMessage,
     generateQuietPrompt,
     this_chid,
     getCurrentChatId,
+    animation_duration,
+    appendMediaToMessage,
 } from "../../../script.js";
 import { getApiUrl, getContext, extension_settings, doExtrasFetch, modules, renderExtensionTemplate } from "../../extensions.js";
 import { selected_group } from "../../group-chats.js";
@@ -1764,10 +1765,10 @@ function addSDGenButtons() {
         if (target.is(button) && !dropdown.is(":visible") && $("#send_but").is(":visible")) {
             e.preventDefault();
 
-            dropdown.fadeIn(250);
+            dropdown.fadeIn(animation_duration);
             popper.update();
         } else {
-            dropdown.fadeOut(250);
+            dropdown.fadeOut(animation_duration);
         }
     });
 }
@@ -1865,7 +1866,7 @@ async function sdMessageButton(e) {
         message.extra.image = image;
         message.extra.title = prompt;
         message.extra.generationType = generationType;
-        appendImageToMessage(message, $mes);
+        appendMediaToMessage(message, $mes);
 
         context.saveChat();
     }

server.js

@@ -2493,14 +2493,16 @@ app.post('/uploadimage', jsonParser, async (request, response) => {
         return response.status(400).send({ error: "No image data provided" });
     }
 
+    try {
         // Extracting the base64 data and the image format
-    const match = request.body.image.match(/^data:image\/(png|jpg|webp|jpeg|gif);base64,(.+)$/);
+        const splitParts = request.body.image.split(',');
-    if (!match) {
+        const format = splitParts[0].split(';')[0].split('/')[1];
+        const base64Data = splitParts[1];
+        const validFormat = ['png', 'jpg', 'webp', 'jpeg', 'gif'].includes(format);
+        if (!validFormat) {
             return response.status(400).send({ error: "Invalid image format" });
         }
 
-    const [, format, base64Data] = match;
-
         // Constructing filename and path
         let filename = `${Date.now()}.${format}`;
         if (request.body.filename) {
@@ -2513,7 +2515,6 @@ app.post('/uploadimage', jsonParser, async (request, response) => {
             pathToNewFile = path.join(DIRECTORIES.userImages, request.body.ch_name, filename);
         }
 
-    try {
         ensureDirectoryExistence(pathToNewFile);
         const imageBuffer = Buffer.from(base64Data, 'base64');
         await fs.promises.writeFile(pathToNewFile, imageBuffer);