Merge branch 'master' into master

3 files changed, 47 insertions, 14 deletions

diff --git a/javascript/images_history.js b/javascript/images_history.js
index 3a20056b..f7d052c3 100644
--- a/javascript/images_history.js
+++ b/javascript/images_history.js
@@ -163,10 +163,15 @@ function images_history_init(){
         for (var i in images_history_tab_list){               
             var tabname = images_history_tab_list[i]
             tab_btns[i].setAttribute("tabname", tabname);
-            tab_btns[i].addEventListener('click', images_history_click_tab);
+
+            // this refreshes history upon tab switch
+            // until the history is known to work well, which is not the case now, we do not do this at startup
+            //tab_btns[i].addEventListener('click', images_history_click_tab);
         }    
-        tabs_box.classList.add(images_history_tab_list[0]);   
-           load_txt2img_button.click();
+        tabs_box.classList.add(images_history_tab_list[0]);
+
+        // same as above, at page load
+        //load_txt2img_button.click();
     } else {
         setTimeout(images_history_init, 500);
     } 
@@ -182,12 +187,15 @@ document.addEventListener("DOMContentLoaded", function() {
             buttons.forEach(function(bnt){    
                 bnt.addEventListener('click', images_history_click_image, true);
             });
+
+            // same as load_txt2img_button.click() above
+            /*
             var cls_btn = gradioApp().getElementById(tabname + '_images_history_gallery').querySelector("svg");
             if (cls_btn){
                 cls_btn.addEventListener('click', function(){
                     gradioApp().getElementById(tabname + '_images_history_renew_page').click();
                 }, false);
-            }
+            }*/
 
         }     
     });
diff --git a/javascript/progressbar.js b/javascript/progressbar.js
index 4395a215..076f0a97 100644
--- a/javascript/progressbar.js
+++ b/javascript/progressbar.js
@@ -1,5 +1,7 @@
 // code related to showing and updating progressbar shown as the image is being made
 global_progressbars = {}
+galleries = {}
+galleryObservers = {}
 
 function check_progressbar(id_part, id_progressbar, id_progressbar_span, id_skip, id_interrupt, id_preview, id_gallery){
     var progressbar = gradioApp().getElementById(id_progressbar)
@@ -31,13 +33,24 @@ function check_progressbar(id_part, id_progressbar, id_progressbar_span, id_skip
                 preview.style.width = gallery.clientWidth + "px"
                 preview.style.height = gallery.clientHeight + "px"
 
+				//only watch gallery if there is a generation process going on
+                check_gallery(id_gallery);    
+
                 var progressDiv = gradioApp().querySelectorAll('#' + id_progressbar_span).length > 0;
                 if(!progressDiv){
                     if (skip) {
                         skip.style.display = "none"
                     }
                     interrupt.style.display = "none"
+			
+                    //disconnect observer once generation finished, so user can close selected image if they want
+                    if (galleryObservers[id_gallery]) {
+                        galleryObservers[id_gallery].disconnect();
+                        galleries[id_gallery] = null;
+                    }    
                 }
+
+
             }
 
             window.setTimeout(function() { requestMoreProgress(id_part, id_progressbar_span, id_skip, id_interrupt) }, 500)
@@ -46,6 +59,28 @@ function check_progressbar(id_part, id_progressbar, id_progressbar_span, id_skip
 	}
 }
 
+function check_gallery(id_gallery){
+    let gallery = gradioApp().getElementById(id_gallery)
+    // if gallery has no change, no need to setting up observer again.
+    if (gallery && galleries[id_gallery] !== gallery){
+        galleries[id_gallery] = gallery;
+        if(galleryObservers[id_gallery]){
+            galleryObservers[id_gallery].disconnect();
+        }
+        let prevSelectedIndex = selected_gallery_index();
+        galleryObservers[id_gallery] = new MutationObserver(function (){
+            let galleryButtons = gradioApp().querySelectorAll('#'+id_gallery+' .gallery-item')
+            let galleryBtnSelected = gradioApp().querySelector('#'+id_gallery+' .gallery-item.\\!ring-2')
+            if (prevSelectedIndex !== -1 && galleryButtons.length>prevSelectedIndex && !galleryBtnSelected) {
+                //automatically re-open previously selected index (if exists)
+                galleryButtons[prevSelectedIndex].click();
+		showGalleryImage();
+            }
+        })
+        galleryObservers[id_gallery].observe( gallery, { childList:true, subtree:false })
+    }
+}
+
 onUiUpdate(function(){
     check_progressbar('txt2img', 'txt2img_progressbar', 'txt2img_progress_span', 'txt2img_skip', 'txt2img_interrupt', 'txt2img_preview', 'txt2img_gallery')
     check_progressbar('img2img', 'img2img_progressbar', 'img2img_progress_span', 'img2img_skip', 'img2img_interrupt', 'img2img_preview', 'img2img_gallery')
diff --git a/javascript/ui.js b/javascript/ui.js
index 0f8fe68e..56f4216f 100644
--- a/javascript/ui.js
+++ b/javascript/ui.js
@@ -187,12 +187,10 @@ onUiUpdate(function(){
 	if (!txt2img_textarea) {
 		txt2img_textarea = gradioApp().querySelector("#txt2img_prompt > label > textarea");
 		txt2img_textarea?.addEventListener("input", () => update_token_counter("txt2img_token_button"));
-        txt2img_textarea?.addEventListener("keyup", (event) => submit_prompt(event, "txt2img_generate"));
 	}
 	if (!img2img_textarea) {
 		img2img_textarea = gradioApp().querySelector("#img2img_prompt > label > textarea");
 		img2img_textarea?.addEventListener("input", () => update_token_counter("img2img_token_button"));
-        img2img_textarea?.addEventListener("keyup", (event) => submit_prompt(event, "img2img_generate"));
 	}
 })
 
@@ -220,14 +218,6 @@ function update_token_counter(button_id) {
 	token_timeout = setTimeout(() => gradioApp().getElementById(button_id)?.click(), wait_time);
 }
 
-function submit_prompt(event, generate_button_id) {
-    if (event.altKey && event.keyCode === 13) {
-        event.preventDefault();
-        gradioApp().getElementById(generate_button_id).click();
-        return;
-    }
-}
-
 function restart_reload(){
     document.body.innerHTML='<h1 style="font-family:monospace;margin-top:20%;color:lightgray;text-align:center;">Reloading...</h1>';
     setTimeout(function(){location.reload()},2000)