Workaround for the Fullscreen Preview Zoom Problem

[zeittresor]

Currently there seams to be a problem with the left click on a preview image.. (not opening the fullscreen preview; only happens if working with a text2image batch)...

i found a little solution for me for that problem..
I've added another eventhandler to simple press the "*" (asterisk) key of your keyboard to switch to fullscreen preview.

Just open ..\forge\webui\javascript\imageviewer.js
After the last Line "});" put this:

// Add event listener for "*" key
document.addEventListener('keydown', function(event) {
    if (event.key === '*') {
        const modalImage = gradioApp().getElementById("modalImage");
        if (modalImage) {
            showModal({ target: modalImage });
        }
    }
});

Restart the UI,.. Its not always working (dont know why, but in most cases it works for me).
How ever in addition to that i have added this to press the "-" in fullscreen preview to reduce the zoom out by 10% at every keypress and the "+" key to zoom in. If you want to use it also just add this in addition below the code aboth:

// Add event listener for "+" key to zoom in everytime 10% the image
document.addEventListener('keydown', function(event) {
    if (event.key === '+') {
        const modalImage = gradioApp().getElementById("modalImage");
        if (modalImage) {
            let currentWidth = modalImage.clientWidth;
            let currentHeight = modalImage.clientHeight;
            modalImage.style.width = (currentWidth * 1.1) + 'px';
            modalImage.style.height = (currentHeight * 1.1) + 'px';
        }
    }
});

// Add event listener for "-" key to zoom out everytime 10% the image
document.addEventListener('keydown', function(event) {
    if (event.key === '-') {
        const modalImage = gradioApp().getElementById("modalImage");
        if (modalImage) {
            let currentWidth = modalImage.clientWidth;
            let currentHeight = modalImage.clientHeight;
            modalImage.style.width = (currentWidth / 1.1) + 'px';
            modalImage.style.height = (currentHeight / 1.1) + 'px';
        }
    }
});

[zeittresor]

there is a better solution currently for the problem. -> #1167 the first comment by EvanGuanSF there solves the problem more directly instead of finding a workaround like me by adding hotkeys 🙌

[zeittresor]

i have another solution for this, ive invented a external workaround for it https://github.com/zeittresor/timedviewer (but cant get it run from "inside" the webui (using a additional script called "sd-forge-scriptrun" i have written for forge.. currently the timedviewer is only working fine if i start it using "timedviewer.py -gui" from somewhere outside of the webui and select the output folder of the webui.

here is the "sd-forge-scriptrun" script i have written for forge to run it from "inside" of the webui - i dont know whats wrong if i start it from webui it gives me some error in the console - i think it have something to do with the pygame library i am using in the timedviewer.py script but even if i put the dist into to \webui_forge_cu124_torch24\system\python\Lib\site-packages the error shows up (any suggestions - someone ?):

sd-forge-scriptrun.py

from modules.shared import opts
import modules.scripts as scripts
import gradio as gr
import subprocess
import os

# Read the text file, expecting 5 lines.
# Each line follows the scheme: Program name, script path and filename, commandline parameters (if any)
# Example of a line in the text file:
# My Program, /path/to/script.py, --option=xyz
#
# Please place the text file "scripts_list.txt" in the same directory as this script.

class Script(scripts.Script):
    def title(self):
        return "External Script Launcher"

    def __init__(self):
        super().__init__()
        script_dir = os.path.dirname(os.path.realpath(__file__))
        self.script_list_file = os.path.join(script_dir, "scripts_list.txt")
        
        self.scripts_data = []
        if os.path.exists(self.script_list_file):
            with open(self.script_list_file, "r", encoding="utf-8") as f:
                for line in f:
                    line = line.strip()
                    if line:
                        parts = [p.strip() for p in line.split(",")]
                        if len(parts) == 3:
                            prog_name, script_path, params = parts
                            self.scripts_data.append((prog_name, script_path, params))
        else:
            for i in range(5):
                self.scripts_data.append((f"Program {i+1}", f"/path/to/script{i+1}.py", ""))

        if len(self.scripts_data) < 5:
            for i in range(len(self.scripts_data), 5):
                self.scripts_data.append((f"Program {i+1}", f"/path/to/script{i+1}.py", ""))
        elif len(self.scripts_data) > 5:
            self.scripts_data = self.scripts_data[:5]

    def run_external_script(self, button_index, script_path, params):
        param_list = []
        if params:
            param_list = params.split()
        python_exe = "python"
        try:
            subprocess.run([python_exe, script_path] + param_list, check=True)
            return "Script executed successfully."
        except Exception as e:
            # Print an error to the console only
            print(f"Error: Could not execute script '{script_path}' at button {button_index+1}. Reason: {e}")
            # Return an empty string or a neutral message so the UI doesn't show an error.
            return ""

    def ui(self, is_img2img):
        outputs = []
        with gr.Group():
            with gr.Box():
                gr.Markdown("### Start external programs")
                result = gr.Textbox(label="Result", value="", interactive=False)
                for i, (prog_name, script_path, params) in enumerate(self.scripts_data):
                    btn = gr.Button(value=prog_name)
                    # Pass button index to the function
                    btn.click(fn=lambda idx=i, sp=script_path, pa=params: self.run_external_script(idx, sp, pa), inputs=[], outputs=[result])
                outputs.append(result)
        return outputs

    def run(self, p):
        return p

scripts_list.txt

Image Preview GUI, D:\AI\webui_forge_cu124_torch24\webui\extensions\sd-forge-scriptrun\examples\zeittresor\TimedViewer.py, -gui
-, -, -
-, -, -
-, -, -
-, -, -