298977887/ComfyUI
1
0
Fork 0
mirror of https://github.com/comfyanonymous/ComfyUI.git synced 2025-01-11 18:35:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

Remove bottom anchor

Browse Source
This commit is contained in:
pythongosssss 2023-03-30 20:14:01 +01:00
parent 6481c90371
commit c93dc2fb89
1 changed files with 12 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
web/scripts/ui.js
View File

@ -50,19 +50,24 @@ function dragElement(dragEl, settings) {
dragEl.onmousedown = dragMouseDown; dragEl.onmousedown = dragMouseDown;
} }
// When the element resizes (e.g. view queue) ensure it is still in the windows bounds
const resizeObserver = new ResizeObserver(() => {
ensureInBounds();
}).observe(dragEl);
function ensureInBounds() { function ensureInBounds() {
if (dragEl.classList.contains("comfy-menu-manual-pos")) {
newPosX = Math.min(document.body.clientWidth - dragEl.clientWidth, Math.max(0, dragEl.offsetLeft)); newPosX = Math.min(document.body.clientWidth - dragEl.clientWidth, Math.max(0, dragEl.offsetLeft));
newPosY = Math.min(document.body.clientHeight - dragEl.clientHeight, Math.max(0, dragEl.offsetTop)); newPosY = Math.min(document.body.clientHeight - dragEl.clientHeight, Math.max(0, dragEl.offsetTop));
positionElement(); positionElement();
} }
}
function positionElement() { function positionElement() {
const halfWidth = document.body.clientWidth / 2; const halfWidth = document.body.clientWidth / 2;
const halfHeight = document.body.clientHeight / 2;
const anchorRight = newPosX + dragEl.clientWidth / 2 > halfWidth; const anchorRight = newPosX + dragEl.clientWidth / 2 > halfWidth;
const anchorBottom = newPosY + dragEl.clientHeight / 2 > halfHeight;
// set the element's new position: // set the element's new position:
if (anchorRight) { if (anchorRight) {
@ -72,22 +77,15 @@ function dragElement(dragEl, settings) {
dragEl.style.left = newPosX + "px"; dragEl.style.left = newPosX + "px";
dragEl.style.right = "unset"; dragEl.style.right = "unset";
} }
if (anchorBottom) {
dragEl.style.top = "unset";
dragEl.style.bottom = document.body.clientHeight - newPosY - dragEl.clientHeight + "px";
} else {
dragEl.style.top = newPosY + "px"; dragEl.style.top = newPosY + "px";
dragEl.style.bottom = "unset"; dragEl.style.bottom = "unset";
}
if (savePos) { if (savePos) {
localStorage.setItem( localStorage.setItem(
"Comfy.MenuPosition", "Comfy.MenuPosition",
JSON.stringify({ JSON.stringify({
left: dragEl.style.left, x: dragEl.offsetLeft,
right: dragEl.style.right, y: dragEl.offsetTop,
top: dragEl.style.top,
bottom: dragEl.style.bottom,
}) })
); );
} }
@ -97,11 +95,9 @@ function dragElement(dragEl, settings) {
let pos = localStorage.getItem("Comfy.MenuPosition"); let pos = localStorage.getItem("Comfy.MenuPosition");
if (pos) { if (pos) {
pos = JSON.parse(pos); pos = JSON.parse(pos);
dragEl.style.left = pos.left; newPosX = pos.x;
dragEl.style.right = pos.right; newPosY = pos.y;
dragEl.style.top = pos.top; positionElement();
dragEl.style.bottom = pos.bottom;
dragEl.classList.add("comfy-menu-manual-pos");
ensureInBounds(); ensureInBounds();
} }
} }
@ -150,9 +146,7 @@ function dragElement(dragEl, settings) {
} }
window.addEventListener("resize", () => { window.addEventListener("resize", () => {
if (dragEl.classList.contains("comfy-menu-manual-pos")) {
ensureInBounds(); ensureInBounds();
}
}); });
function closeDragElement() { function closeDragElement() {