Fix issue with modal image viewer with low live_preview_refresh_period (#16981)

.eslintrc.js

@@ -88,6 +88,7 @@ module.exports = {
         // imageviewer.js
         modalPrevImage: "readonly",
         modalNextImage: "readonly",
+        updateModalImageIfVisible: "readonly",
         // localStorage.js
         localSet: "readonly",
         localGet: "readonly",

README.md

@@ -133,7 +133,7 @@ If your system is very new, you need to install python3.11 or python3.10:
 # Ubuntu 24.04
 sudo add-apt-repository ppa:deadsnakes/ppa
 sudo apt update
-sudo apt install python3.11
+sudo apt install python3.11 python3.11-venv
 
 # Manjaro/Arch
 sudo pacman -S yay

javascript/imageviewer.js

@@ -54,6 +54,7 @@ function updateOnBackgroundChange() {
         updateModalImage();
     }
 }
+const updateModalImageIfVisible = updateOnBackgroundChange;
 
 function modalImageSwitch(offset) {
     var galleryButtons = all_gallery_buttons();
@@ -164,6 +165,7 @@ function modalLivePreviewToggle(event) {
     const modalToggleLivePreview = gradioApp().getElementById("modal_toggle_live_preview");
     opts.js_live_preview_in_modal_lightbox = !opts.js_live_preview_in_modal_lightbox;
     modalToggleLivePreview.innerHTML = opts.js_live_preview_in_modal_lightbox ? "🗇" : "🗆";
+    updateModalImageIfVisible();
     event.stopPropagation();
 }
 

javascript/progressbar.js

@@ -190,7 +190,7 @@ function requestProgress(id_task, progressbarContainer, gallery, atEnd, onProgre
                         livePreview.className = 'livePreview';
                         gallery.insertBefore(livePreview, gallery.firstElementChild);
                     }
-
+                    updateModalImageIfVisible();
                     livePreview.appendChild(img);
                     if (livePreview.childElementCount > 2) {
                         livePreview.removeChild(livePreview.firstElementChild);

modules/images.py

@@ -409,6 +409,7 @@ class FilenameGenerator:
         'generation_number': lambda self: NOTHING_AND_SKIP_PREVIOUS_TEXT if (self.p.n_iter == 1 and self.p.batch_size == 1) or self.zip else self.p.iteration * self.p.batch_size + self.p.batch_index + 1,
         'hasprompt': lambda self, *args: self.hasprompt(*args),  # accepts formats:[hasprompt<prompt1|default><prompt2>..]
         'clip_skip': lambda self: opts.data["CLIP_stop_at_last_layers"],
+        'randn_source': lambda self: opts.data["randn_source"],
         'denoising': lambda self: self.p.denoising_strength if self.p and self.p.denoising_strength else NOTHING_AND_SKIP_PREVIOUS_TEXT,
         'user': lambda self: self.p.user,
         'vae_filename': lambda self: self.get_vae_filename(),

style.css

@@ -602,6 +602,7 @@ table.popup-table .link{
     background: var(--background-fill-primary);
     width: 100%;
     height: 100%;
+    pointer-events: none;
 }
 
 .livePreview img{