diff --git a/ui/media/js/main.js b/ui/media/js/main.js
index 7efc9759..effd9660 100644
--- a/ui/media/js/main.js
+++ b/ui/media/js/main.js
@@ -678,8 +678,14 @@ function onUseAsThumbnailClick(req, img) {
 
     useAsThumbDialog.showModal()
     useAsThumbImage.src = img.src
+    img.width = img.height = 512
 
-    var croppr = new Croppr('#croppr', { aspectRatio: 1, minSize: [384,384,'px'], startSize:  [100, 100, '%'], returnMode:"real" })
+    var croppr = new Croppr(useAsThumbImage, { aspectRatio: 1, minSize: [384,384,'px'], startSize:  [100, 100, '%'], returnMode:"real" })
+
+    useAsThumbDialog.addEventListener("blur", () => {
+        console.log("blur")
+        croppr.destroy
+    })
 
 //    fetch(img.src)
 //      .then(response => response.blob())
@@ -691,6 +697,10 @@ function onUseAsThumbnailClick(req, img) {
 //      })
 }
 
+modalDialogCloseOnBackdropClick(useAsThumbDialog)
+makeDialogDraggable(useAsThumbDialog)
+
+
 function enqueueImageVariationTask(req, img, reqDiff) {
     const imageSeed = img.getAttribute("data-seed")