Fix #2750

left / top alignment was necessary with gradio 3.4.1. In gradio 3.5 the parent div of the image mask is centered, so the left / top alignment put the mask in the wrong place as described in #2750 #2795 #2805. This fix was tested on Windows 10 / Chrome.

javascript/imageMaskFix.js

@@ -31,8 +31,8 @@ function imageMaskResize() {
 
     wrapper.style.width = `${wW}px`;
     wrapper.style.height = `${wH}px`;
-    wrapper.style.left = `${(w-wW)/2}px`;
-    wrapper.style.top = `${(h-wH)/2}px`;
+    wrapper.style.left = `0px`;
+    wrapper.style.top = `0px`;
 
     canvases.forEach( c => {
         c.style.width = c.style.height = '';
@@ -42,4 +42,4 @@ function imageMaskResize() {
     });
  }
   
- onUiUpdate(() => imageMaskResize());
\ No newline at end of file
+ onUiUpdate(() => imageMaskResize());