enable progressbar without gallery

2 files changed, 18 insertions, 25 deletions

diff --git a/javascript/progressbar.js b/javascript/progressbar.js
index b8473ebf..18c771a2 100644
--- a/javascript/progressbar.js
+++ b/javascript/progressbar.js
@@ -130,7 +130,7 @@ function requestProgress(id_task, progressbarContainer, gallery, atEnd, onProgre
     var dateStart = new Date()
     var wasEverActive = false
     var parentProgressbar = progressbarContainer.parentNode
-    var parentGallery = gallery.parentNode
+    var parentGallery = gallery ? gallery.parentNode : null
 
     var divProgress = document.createElement('div')
     divProgress.className='progressDiv'
@@ -141,14 +141,16 @@ function requestProgress(id_task, progressbarContainer, gallery, atEnd, onProgre
     divProgress.appendChild(divInner)
     parentProgressbar.insertBefore(divProgress, progressbarContainer)
 
-    var livePreview = document.createElement('div')
-    livePreview.className='livePreview'
-    parentGallery.insertBefore(livePreview, gallery)
+    if(parentGallery){
+        var livePreview = document.createElement('div')
+        livePreview.className='livePreview'
+        parentGallery.insertBefore(livePreview, gallery)
+    }
 
     var removeProgressBar = function(){
         setTitle("")
         parentProgressbar.removeChild(divProgress)
-        parentGallery.removeChild(livePreview)
+        if(parentGallery) parentGallery.removeChild(livePreview)
         atEnd()
     }
 
@@ -168,6 +170,7 @@ function requestProgress(id_task, progressbarContainer, gallery, atEnd, onProgre
             progressText = ""
 
             divInner.style.width = ((res.progress || 0) * 100.0) + '%'
+            divInner.style.background = res.progress ? "" : "transparent"
 
             if(res.progress > 0){
                 progressText = ((res.progress || 0) * 100.0).toFixed(0) + '%'
@@ -175,11 +178,15 @@ function requestProgress(id_task, progressbarContainer, gallery, atEnd, onProgre
 
             if(res.eta){
                 progressText += " ETA: " + formatTime(res.eta)
-            } else if(res.textinfo){
-                progressText += " " + res.textinfo
             }
 
+
             setTitle(progressText)
+
+            if(res.textinfo && res.textinfo.indexOf("\n") == -1){
+                progressText = res.textinfo + " " + progressText
+            }
+
             divInner.textContent = progressText
 
             var elapsedFromStart = (new Date() - dateStart) / 1000
@@ -197,8 +204,7 @@ function requestProgress(id_task, progressbarContainer, gallery, atEnd, onProgre
             }
 
 
-            if(res.live_preview){
-
+            if(res.live_preview && gallery){
                 var rect = gallery.getBoundingClientRect()
                 if(rect.width){
                     livePreview.style.width = rect.width + "px"
diff --git a/style.css b/style.css
index 97f9402a..b1d47df6 100644
--- a/style.css
+++ b/style.css
@@ -290,26 +290,12 @@ input[type="range"]{
   min-height: unset !important;

 }

 

-#txt2img_progressbar, #img2img_progressbar, #ti_progressbar{

-  position: absolute;

-  z-index: 1000;

-  right: 0;

-  padding-left: 5px;

-  padding-right: 5px;

-  display: block;

-}

-

-#txt2img_progress_row, #img2img_progress_row{

-  margin-bottom: 10px;

-  margin-top: -18px;

-}

-

 .progressDiv{

     position: absolute;

     height: 20px;

     top: -20px;

     background: #b4c0cc;

-    border-radius: 8px !important;

+    border-radius: 3px !important;

 }

 

 .dark .progressDiv{

@@ -325,9 +311,10 @@ input[type="range"]{
     line-height: 20px;

     padding: 0 8px 0 0;

     text-align: right;

-    border-radius: 8px;

+    border-radius: 3px;

     overflow: visible;

     white-space: nowrap;

+    padding: 0 0.5em;

 }

 

 .livePreview{