From f6c52f4f41f4afe306b5adc90ba81feeca238e1a Mon Sep 17 00:00:00 2001
From: AUTOMATIC1111 <16777216c@gmail.com>
Date: Tue, 22 Aug 2023 11:02:14 +0300
Subject: [PATCH] for live previews, only hide gallery after at least one live
 previews pic has been received fix blinking for live previews fix a
 clientside live previews exception that happens when you kill serverside
 during sampling match the size of live preview image to gallery image

---
 javascript/progressbar.js | 24 ++++++++++++++++++------
 style.css                 |  2 +-
 2 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/javascript/progressbar.js b/javascript/progressbar.js
index a7c69937d..4a95077ea 100644
--- a/javascript/progressbar.js
+++ b/javascript/progressbar.js
@@ -79,17 +79,17 @@ function requestProgress(id_task, progressbarContainer, gallery, atEnd, onProgre
     divProgress.appendChild(divInner);
     parentProgressbar.insertBefore(divProgress, progressbarContainer);
 
-    if (gallery) {
-        var livePreview = document.createElement('div');
-        livePreview.className = 'livePreview';
-        gallery.insertBefore(livePreview, gallery.firstElementChild);
-    }
+    var livePreview = null;
 
     var removeProgressBar = function() {
+        if(! divProgress) return;
+
         setTitle("");
         parentProgressbar.removeChild(divProgress);
         if (gallery) gallery.removeChild(livePreview);
         atEnd();
+
+        divProgress = null;
     };
 
     var funProgress = function(id_task) {
@@ -149,8 +149,16 @@ function requestProgress(id_task, progressbarContainer, gallery, atEnd, onProgre
     var funLivePreview = function(id_task, id_live_preview) {
         request("./internal/progress", {id_task: id_task, id_live_preview: id_live_preview}, function(res) {
             if (res.live_preview && gallery) {
+
+
                 var img = new Image();
                 img.onload = function() {
+                    if(!livePreview){
+                        livePreview = document.createElement('div');
+                        livePreview.className = 'livePreview';
+                        gallery.insertBefore(livePreview, gallery.firstElementChild);
+                    }
+
                     livePreview.appendChild(img);
                     if (livePreview.childElementCount > 2) {
                         livePreview.removeChild(livePreview.firstElementChild);
@@ -168,5 +176,9 @@ function requestProgress(id_task, progressbarContainer, gallery, atEnd, onProgre
     };
 
     funProgress(id_task, 0);
-    funLivePreview(id_task, 0);
+
+    if(gallery){
+        funLivePreview(id_task, 0);
+    }
+
 }
diff --git a/style.css b/style.css
index 4166a3df1..cb12e036b 100644
--- a/style.css
+++ b/style.css
@@ -541,7 +541,7 @@ table.popup-table .link{
     position: absolute;
     object-fit: contain;
     width: 100%;
-    height: 100%;
+    height: calc(100% - 60px);  /* to match gradio's height */
 }
 
 /* fullscreen popup (ie in Lora's (i) button) */