From e16b9dc8192bc42cd13c7bdfc7d5719c102bc295 Mon Sep 17 00:00:00 2001
From: Connum <connum@gmail.com>
Date: Thu, 22 Sep 2022 19:37:57 +0200
Subject: resize mask canvases to fit underlying image (fixes #668)

---
 javascript/imageMaskFix.js | 45 +++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 45 insertions(+)
 create mode 100644 javascript/imageMaskFix.js

diff --git a/javascript/imageMaskFix.js b/javascript/imageMaskFix.js
new file mode 100644
index 00000000..3d77bfe9
--- /dev/null
+++ b/javascript/imageMaskFix.js
@@ -0,0 +1,45 @@
+/**
+ * temporary fix for https://github.com/AUTOMATIC1111/stable-diffusion-webui/issues/668
+ * @see https://github.com/gradio-app/gradio/issues/1721
+ */
+window.addEventListener( 'resize', () => imageMaskResize());
+function imageMaskResize() {
+    const canvases = gradioApp().querySelectorAll('#img2maskimg .touch-none canvas');
+    if ( ! canvases.length ) {
+    canvases_fixed = false;
+    window.removeEventListener( 'resize', imageMaskResize );
+    return;
+    }
+
+    const wrapper = canvases[0].closest('.touch-none');
+    const previewImage = wrapper.previousElementSibling;
+
+    if ( ! previewImage.complete ) {
+        previewImage.addEventListener( 'load', () => imageMaskResize());
+        return;
+    }
+
+    const w = previewImage.width;
+    const h = previewImage.height;
+    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);
+
+    wrapper.style.width = `${wW}px`;
+    wrapper.style.height = `${wH}px`;
+    wrapper.style.left = `${(w-wW)/2}px`;
+    wrapper.style.top = `${(h-wH)/2}px`;
+
+    canvases.forEach( c => {
+        c.style.width = c.style.height = '';
+        c.style.maxWidth = '100%';
+        c.style.maxHeight = '100%';
+        c.style.objectFit = 'contain';
+    });
+ }
+  
+ onUiUpdate(() => imageMaskResize());
\ No newline at end of file
-- 
cgit v1.2.1