diff --git a/CHANGES.md b/CHANGES.md
index 9fe2cff0..6168fcc3 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -21,6 +21,8 @@
Our focus continues to remain on an easy installation experience, and an easy user-interface. While still remaining pretty powerful, in terms of features and speed.
### Detailed changelog
+* 2.5.36 - 11 May 2023 - (beta-only) More VRAM optimizations for "low" VRAM usage mode.
+* 2.5.36 - 10 May 2023 - (beta-only) Bug fix for "meta" error when using a LoRA in 'low' VRAM usage mode.
* 2.5.35 - 3 May 2023 - (beta-only) First round of VRAM Optimizations for the "Test Diffusers" version. This change significantly reduces the amount of VRAM used by the diffusers version during image generation. The VRAM usage is still not equal to the "non-diffusers" version, but more optimizations are coming soon.
* 2.5.34 - 22 Apr 2023 - Don't start the browser in an incognito new profile (on Windows). Thanks @JeLuf.
* 2.5.33 - 21 Apr 2023 - Install PyTorch 2.0 on new installations (on Windows and Linux).
diff --git a/scripts/check_modules.py b/scripts/check_modules.py
index b1ec44d6..8da111e0 100644
--- a/scripts/check_modules.py
+++ b/scripts/check_modules.py
@@ -18,7 +18,7 @@ os_name = platform.system()
modules_to_check = {
"torch": ("1.11.0", "1.13.1", "2.0.0"),
"torchvision": ("0.12.0", "0.14.1", "0.15.1"),
- "sdkit": "1.0.84",
+ "sdkit": "1.0.91",
"stable-diffusion-sdkit": "2.1.4",
"rich": "12.6.0",
"uvicorn": "0.19.0",
diff --git a/ui/index.html b/ui/index.html
index be522689..d196b99d 100644
--- a/ui/index.html
+++ b/ui/index.html
@@ -30,7 +30,7 @@
Easy Diffusion
- v2.5.35
+ v2.5.36
diff --git a/ui/media/css/image-modal.css b/ui/media/css/image-modal.css
index 1001807c..64096003 100644
--- a/ui/media/css/image-modal.css
+++ b/ui/media/css/image-modal.css
@@ -70,6 +70,14 @@
max-height: calc(100vh - (var(--popup-padding) * 2) - 4px);
}
+#viewFullSizeImgModal img:not(.natural-zoom) {
+ cursor: grab;
+}
+
+#viewFullSizeImgModal .grabbing img:not(.natural-zoom) {
+ cursor: grabbing;
+}
+
#viewFullSizeImgModal .content > div::-webkit-scrollbar-track, #viewFullSizeImgModal .content > div::-webkit-scrollbar-corner {
background: rgba(0, 0, 0, .5)
}
diff --git a/ui/media/js/image-modal.js b/ui/media/js/image-modal.js
index 3a97c4d8..28c1eaf2 100644
--- a/ui/media/js/image-modal.js
+++ b/ui/media/js/image-modal.js
@@ -63,15 +63,73 @@ const imageModal = (function() {
setZoomLevel(imageContainer.querySelector("img")?.classList?.contains("natural-zoom"))
)
- const state = {
+ const initialState = () => ({
previous: undefined,
next: undefined,
+
+ start: {
+ x: 0,
+ y: 0,
+ },
+
+ scroll: {
+ x: 0,
+ y: 0,
+ },
+ })
+
+ const state = initialState()
+
+ // Allow grabbing the image to scroll
+ const stopGrabbing = (e) => {
+ if(imageContainer.classList.contains("grabbing")) {
+ imageContainer.classList.remove("grabbing")
+ e?.preventDefault()
+ console.log(`stopGrabbing()`, e)
+ }
+ }
+
+ const addImageGrabbing = (image) => {
+ image?.addEventListener('mousedown', (e) => {
+ if (!image.classList.contains("natural-zoom")) {
+ e.stopPropagation()
+ e.stopImmediatePropagation()
+ e.preventDefault()
+
+ imageContainer.classList.add("grabbing")
+ state.start.x = e.pageX - imageContainer.offsetLeft
+ state.scroll.x = imageContainer.scrollLeft
+ state.start.y = e.pageY - imageContainer.offsetTop
+ state.scroll.y = imageContainer.scrollTop
+ }
+ })
+
+ image?.addEventListener('mouseup', stopGrabbing)
+ image?.addEventListener('mouseleave', stopGrabbing)
+ image?.addEventListener('mousemove', (e) => {
+ if(imageContainer.classList.contains("grabbing")) {
+ e.stopPropagation()
+ e.stopImmediatePropagation()
+ e.preventDefault()
+
+ // Might need to increase this multiplier based on the image size to window size ratio
+ // The default 1:1 is pretty slow
+ const multiplier = 1.0
+
+ const deltaX = e.pageX - imageContainer.offsetLeft - state.start.x
+ imageContainer.scrollLeft = state.scroll.x - (deltaX * multiplier)
+ const deltaY = e.pageY - imageContainer.offsetTop - state.start.y
+ imageContainer.scrollTop = state.scroll.y - (deltaY * multiplier)
+ }
+ })
}
const clear = () => {
imageContainer.innerHTML = ""
- Object.keys(state).forEach((key) => delete state[key])
+ Object.entries(initialState()).forEach(([key, value]) => state[key] = value)
+
+ stopGrabbing()
}
const close = () => {
@@ -95,6 +153,7 @@ const imageModal = (function() {
const src = typeof options === "string" ? options : options.src
const imgElem = createElement("img", { src }, "natural-zoom")
+ addImageGrabbing(imgElem)
imageContainer.appendChild(imgElem)
modalElem.classList.add("active")
document.body.style.overflow = "hidden"
diff --git a/ui/media/js/image-modifiers.js b/ui/media/js/image-modifiers.js
index fd4ecaf1..69f31ab1 100644
--- a/ui/media/js/image-modifiers.js
+++ b/ui/media/js/image-modifiers.js
@@ -246,7 +246,7 @@ function refreshInactiveTags(inactiveTags) {
overlays.forEach((i) => {
let modifierName = i.parentElement.getElementsByClassName("modifier-card-label")[0].getElementsByTagName("p")[0]
.dataset.fullName
- if (inactiveTags?.find((element) => element === modifierName) !== undefined) {
+ if (inactiveTags?.find((element) => trimModifiers(element) === modifierName) !== undefined) {
i.parentElement.classList.add("modifier-toggle-inactive")
}
})