jumbo patch

javascript/imageMaskFix.js

@@ -1,3 +1,4 @@
+/* global gradioApp, onUiUpdate */
 /**
  * temporary fix for https://github.com/AUTOMATIC1111/stable-diffusion-webui/issues/668
  * @see https://github.com/gradio-app/gradio/issues/1721
@@ -5,7 +6,6 @@
 function imageMaskResize() {
   const canvases = gradioApp().querySelectorAll('#img2maskimg .touch-none canvas');
   if (!canvases.length) {
-    canvases_fixed = false;
     window.removeEventListener('resize', imageMaskResize);
     return;
   }
@@ -14,7 +14,7 @@ function imageMaskResize() {
   const previewImage = wrapper.previousElementSibling;
 
   if (!previewImage.complete) {
-    previewImage.addEventListener('load', () => imageMaskResize());
+    previewImage.addEventListener('load', imageMaskResize);
     return;
   }
 
@@ -23,7 +23,6 @@ function imageMaskResize() {
   const nw = previewImage.naturalWidth;
   const nh = previewImage.naturalHeight;
   const portrait = nh > nw;
-  const factor = portrait;
 
   const wW = Math.min(w, portrait ? h / nh * nw : w / nw * nw);
   const wH = Math.min(h, portrait ? h / nh * nh : w / nw * nh);
@@ -34,12 +33,13 @@ function imageMaskResize() {
   wrapper.style.top = '0px';
 
   canvases.forEach((c) => {
-    c.style.width = c.style.height = '';
+    c.style.width = '';
+    c.style.height = '';
     c.style.maxWidth = '100%';
     c.style.maxHeight = '100%';
     c.style.objectFit = 'contain';
   });
 }
 
+onUiUpdate(imageMaskResize);
 window.addEventListener('resize', imageMaskResize);
-onUiUpdate(() => imageMaskResize());