From 0a4a0b8922b9ac73bee36a28a55ed7cfd49f7d40 Mon Sep 17 00:00:00 2001
From: Vladimir Mandic <mandic00@live.com>
Date: Fri, 5 Apr 2024 13:07:00 -0400
Subject: [PATCH] fix imageviewer and push changes to support uiux

---
 .eslintrc.json            |  2 ++
 CHANGELOG.md              |  4 ++--
 javascript/imageViewer.js | 19 ++++++++++---------
 javascript/script.js      |  4 +++-
 javascript/startup.js     |  3 ++-
 5 files changed, 19 insertions(+), 13 deletions(-)

diff --git a/.eslintrc.json b/.eslintrc.json
index fdda21aa8..1bbadb88c 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -51,10 +51,12 @@
     "onUiLoaded": "readonly",
     "onUiUpdate": "readonly",
     "onUiTabChange": "readonly",
+    "onUiReady": "readonly",
     "uiCurrentTab": "writable",
     "uiElementIsVisible": "readonly",
     "uiElementInSight": "readonly",
     "getUICurrentTabContent": "readonly",
+    "waitForFlag": "readonly",
     //ui.js
     "opts": "writable",
     "sortUIElements": "readonly",
diff --git a/CHANGELOG.md b/CHANGELOG.md
index fb025be50..b8888cbb2 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -37,6 +37,7 @@
     as both *image-browser* and *controlnet* have native equivalents  
     both can still be installed by user if desired  
 - **Improvements**:
+  - Add **MIGraphX** torch optimization engine, thanks @Disty0
   - Styles apply wildcards to params
   - Make metadata in full screen viewer optional
   - Add VAE civitai scan metadata/preview
@@ -45,8 +46,7 @@
   - update to *IPEX 2.1.20* on Linux  
     requires removing the venv folder to update properly  
   - removed 1024x1024 workaround  
-  - disable ipexrun by default  
-    export `IPEXRUN=True` if you want to use ipexrun.  
+  - disable ipexrun by default, set `IPEXRUN=True` if you want to use `ipexrun`.  
 - **Fixes**:
   - update requirements
   - prompt params parser
diff --git a/javascript/imageViewer.js b/javascript/imageViewer.js
index 8d85bebcd..9f56ff876 100644
--- a/javascript/imageViewer.js
+++ b/javascript/imageViewer.js
@@ -169,18 +169,17 @@ function galleryClickEventHandler(event) {
   }
 }
 
-async function initImageViewer() {
+async function bindImageViewer() {
   // Each tab has its own gradio-gallery
   const galleryPreviews = gradioApp().querySelectorAll('.gradio-gallery > div.preview');
-  if (galleryPreviews.length > 0) {
-    for (const galleryPreview of galleryPreviews) {
-      const fullImgPreview = galleryPreview.querySelectorAll('img');
-      if (fullImgPreview.length > 0) {
-        galleryPreview.addEventListener('click', galleryClickEventHandler, true);
-        fullImgPreview.forEach(setupImageForLightbox);
-      }
-    }
+  for (const galleryPreview of galleryPreviews) {
+    if (!galleryPreview.hasAttribute('data-listener')) galleryPreview.addEventListener('click', galleryClickEventHandler, true);
+    galleryPreview.setAttribute('data-listener', true);
+    galleryPreview.querySelectorAll('img').forEach(setupImageForLightbox);
   }
+}
+
+async function initImageViewer() {
   // main elements
   const modal = document.createElement('div');
   modal.id = 'lightboxModal';
@@ -281,3 +280,5 @@ async function initImageViewer() {
   gradioApp().appendChild(modal);
   log('initImageViewer');
 }
+
+onAfterUiUpdate(bindImageViewer);
diff --git a/javascript/script.js b/javascript/script.js
index 267c586ac..3f380c3e3 100644
--- a/javascript/script.js
+++ b/javascript/script.js
@@ -1,12 +1,14 @@
 const log = (...msg) => {
   const dt = new Date();
   const ts = `${dt.getHours().toString().padStart(2, '0')}:${dt.getMinutes().toString().padStart(2, '0')}:${dt.getSeconds().toString().padStart(2, '0')}.${dt.getMilliseconds().toString().padStart(3, '0')}`;
+  if (window.logger) window.logger.innerHTML += window.logPrettyPrint(...msg);
   console.log(ts, ...msg); // eslint-disable-line no-console
 };
 
 const debug = (...msg) => {
   const dt = new Date();
   const ts = `${dt.getHours().toString().padStart(2, '0')}:${dt.getMinutes().toString().padStart(2, '0')}:${dt.getSeconds().toString().padStart(2, '0')}.${dt.getMilliseconds().toString().padStart(3, '0')}`;
+  if (window.logger) window.logger.innerHTML += window.logPrettyPrint(...msg);
   console.debug(ts, ...msg); // eslint-disable-line no-console
 };
 
@@ -81,7 +83,7 @@ function scheduleAfterUiUpdateCallbacks() {
 }
 
 let executedOnLoaded = false;
-const ignoreElements = ['logMonitorData', 'logWarnings', 'logErrors', 'tooltip-container'];
+const ignoreElements = ['logMonitorData', 'logWarnings', 'logErrors', 'tooltip-container', 'logger'];
 const ignoreClasses = ['wrap'];
 
 async function mutationCallback(mutations) {
diff --git a/javascript/startup.js b/javascript/startup.js
index 76c573eab..0d079650a 100644
--- a/javascript/startup.js
+++ b/javascript/startup.js
@@ -2,6 +2,7 @@
 
 async function initStartup() {
   log('initStartup');
+  if (window.setupLogger) await setupLogger();
 
   // all items here are non-blocking async calls
   initModels();
@@ -26,7 +27,7 @@ async function initStartup() {
   executeCallbacks(uiReadyCallbacks);
 
   // optinally wait for modern ui
-  if (window.waitForUiUxReady) await window.waitForUiUxReady();
+  if (window.waitForUiReady) await waitForUiReady();
   removeSplash();
 
   // post startup tasks that may take longer but are not critical