From 692c1a5e60f305fdebe54d4a20e1da39a6e9bb69 Mon Sep 17 00:00:00 2001
From: Cohee <18619528+Cohee1207@users.noreply.github.com>
Date: Sun, 20 Aug 2023 12:16:29 +0300
Subject: [PATCH] Fix background SD gens

---
 .../extensions/stable-diffusion/index.js       | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/public/scripts/extensions/stable-diffusion/index.js b/public/scripts/extensions/stable-diffusion/index.js
index 705bb151a..9fb9baeb2 100644
--- a/public/scripts/extensions/stable-diffusion/index.js
+++ b/public/scripts/extensions/stable-diffusion/index.js
@@ -588,7 +588,7 @@ async function generatePicture(_, trigger, message, callback) {
         const callbackOriginal = callback;
         callback = async function (prompt, base64Image) {
             const imagePath = base64Image;
-            const imgUrl = `url(${base64Image})`;
+            const imgUrl = `url('${encodeURIComponent(base64Image)}')`;
 
             if ('forceSetBackground' in window) {
                 forceSetBackground(imgUrl);
@@ -665,15 +665,15 @@ async function sendGenerationRequest(generationType, prompt, characterName=null,
 }
 
 /**
- * Generates an "extras" image using a provided prompt and other settings, 
+ * Generates an "extras" image using a provided prompt and other settings,
  * then saves the generated image and either invokes a callback or sends a message with the image.
- * 
+ *
  * @param {string} prompt - The main instruction used to guide the image generation.
  * @param {string} prefix - Additional context or prefix to guide the image generation.
  * @param {string} characterName - The name used to determine the sub-directory for saving.
  * @param {function} [callback] - Optional callback function invoked with the prompt and saved image.
  *                                If not provided, `sendMessage` is called instead.
- * 
+ *
  * @returns {Promise<void>} - A promise that resolves when the image generation and processing are complete.
  */
 async function generateExtrasImage(prompt, prefix, characterName, callback) {
@@ -702,7 +702,7 @@ async function generateExtrasImage(prompt, prefix, characterName, callback) {
         const data = await result.json();
         //filename should be character name + human readable timestamp + generation mode
         const filename = `${characterName}_${humanizedDateTime()}`;
-        const base64Image = await saveBase64AsFile(data.image, characterName, filename, "jpg"); 
+        const base64Image = await saveBase64AsFile(data.image, characterName, filename, "jpg");
         callback ? callback(prompt, base64Image) : sendMessage(prompt, base64Image);
     } else {
         callPopup('Image generation has failed. Please try again.', 'text');
@@ -710,15 +710,15 @@ async function generateExtrasImage(prompt, prefix, characterName, callback) {
 }
 
 /**
- * Generates a "horde" image using the provided prompt and configuration settings, 
+ * Generates a "horde" image using the provided prompt and configuration settings,
  * then saves the generated image and either invokes a callback or sends a message with the image.
- * 
+ *
  * @param {string} prompt - The main instruction used to guide the image generation.
  * @param {string} prefix - Additional context or prefix to guide the image generation.
  * @param {string} characterName - The name used to determine the sub-directory for saving.
  * @param {function} [callback] - Optional callback function invoked with the prompt and saved image.
  *                                If not provided, `sendMessage` is called instead.
- * 
+ *
  * @returns {Promise<void>} - A promise that resolves when the image generation and processing are complete.
  */
 async function generateHordeImage(prompt, prefix, characterName, callback) {
@@ -744,7 +744,7 @@ async function generateHordeImage(prompt, prefix, characterName, callback) {
     if (result.ok) {
         const data = await result.text();
         const filename = `${characterName}_${humanizedDateTime()}`;
-        const base64Image = await saveBase64AsFile(data, characterName, filename, "webp"); 
+        const base64Image = await saveBase64AsFile(data, characterName, filename, "webp");
         callback ? callback(prompt, base64Image) : sendMessage(prompt, base64Image);
     } else {
         toastr.error('Image generation has failed. Please try again.');