Merge pull request #1465 from easydiffusion/beta

Keep IMAGE_STEP_SIZE synchronized across all the clamps

ui/media/js/main.js

@@ -183,6 +183,8 @@ let undoBuffer = []
 const UNDO_LIMIT = 20
 const MAX_IMG_UNDO_ENTRIES = 5
 
+let IMAGE_STEP_SIZE = 64
+
 let loraModels = []
 
 imagePreview.addEventListener("drop", function(ev) {
@@ -1368,8 +1370,8 @@ function getCurrentUserRequest() {
     // clamp to multiple of 8
     let width = parseInt(widthField.value)
     let height = parseInt(heightField.value)
-    width = width - (width % 8)
+    width = width - (width % IMAGE_STEP_SIZE)
-    height = height - (height % 8)
+    height = height - (height % IMAGE_STEP_SIZE)
 
     const newTask = {
         batchesDone: 0,
@@ -2245,8 +2247,8 @@ controlImageSelector.addEventListener("change", loadControlnetImageFromFile)
 function controlImageLoad() {
     let w = controlImagePreview.naturalWidth
     let h = controlImagePreview.naturalHeight
-    w = w - (w % 8)
+    w = w - (w % IMAGE_STEP_SIZE)
-    h = h - (h % 8)
+    h = h - (h % IMAGE_STEP_SIZE)
 
     addImageSizeOption(w)
     addImageSizeOption(h)

ui/media/js/parameters.js

@@ -462,16 +462,19 @@ async function getAppConfig() {
             document.querySelector("#lora_model_container").style.display = "none"
             document.querySelector("#tiling_container").style.display = "none"
             document.querySelector("#controlnet_model_container").style.display = "none"
+            document.querySelector("#hypernetwork_strength_container").style.display = ""
 
             document.querySelectorAll("#sampler_name option.diffusers-only").forEach((option) => {
                 option.style.display = "none"
             })
-            customWidthField.step = 64
+            IMAGE_STEP_SIZE = 64
-            customHeightField.step = 64
+            customWidthField.step = IMAGE_STEP_SIZE
+            customHeightField.step = IMAGE_STEP_SIZE
         } else {
             document.querySelector("#lora_model_container").style.display = ""
             document.querySelector("#tiling_container").style.display = ""
             document.querySelector("#controlnet_model_container").style.display = ""
+            document.querySelector("#hypernetwork_strength_container").style.display = "none"
 
             document.querySelectorAll("#sampler_name option.k_diffusion-only").forEach((option) => {
                 option.style.display = "none"
@@ -479,8 +482,9 @@ async function getAppConfig() {
             document.querySelector("#clip_skip_config").classList.remove("displayNone")
             document.querySelector("#embeddings-button").classList.remove("displayNone")
             document.querySelector("#negative-embeddings-button").classList.remove("displayNone")
-            customWidthField.step = 8
+            IMAGE_STEP_SIZE = 8
-            customHeightField.step = 8
+            customWidthField.step = IMAGE_STEP_SIZE
+            customHeightField.step = IMAGE_STEP_SIZE
         }
 
         console.log("get config status response", config)

ui/plugins/ui/image-editor-improvements.plugin.js

@@ -124,8 +124,8 @@
         // Draw the image with centered coordinates
         context.drawImage(imageObj, x, y, this.width, this.height);
 
-        let bestWidth = maxCroppedWidth - maxCroppedWidth % 8
+        let bestWidth = maxCroppedWidth - maxCroppedWidth % IMAGE_STEP_SIZE
-        let bestHeight = maxCroppedHeight - maxCroppedHeight % 8
+        let bestHeight = maxCroppedHeight - maxCroppedHeight % IMAGE_STEP_SIZE
 
         addImageSizeOption(bestWidth)
         addImageSizeOption(bestHeight)