298977887/ComfyUI
1
0
Fork 0
mirror of https://github.com/comfyanonymous/ComfyUI.git synced 2025-04-20 03:13:30 +00:00
Code Issues Packages Projects Releases Wiki Activity

Prevent draggable menu to get outside of window

Browse Source
This commit is contained in:
Jairo Correa 2023-03-25 23:06:00 -03:00
parent a5c78a5796
commit 48d4edbceb
1 changed files with 16 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
web/scripts/ui.js
View File

@ -36,7 +36,12 @@ function $el(tag, propsOrChildren, children) {
} }
function dragElement(dragEl) { function dragElement(dragEl) {
var pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0; var posDiffX = 0,
posDiffY = 0,
posStartX = 0,
posStartY = 0,
newPosX = 0,
newPosY = 0;
if (dragEl.getElementsByClassName('drag-handle')[0]) { if (dragEl.getElementsByClassName('drag-handle')[0]) {
// if present, the handle is where you move the DIV from: // if present, the handle is where you move the DIV from:
dragEl.getElementsByClassName('drag-handle')[0].onmousedown = dragMouseDown; dragEl.getElementsByClassName('drag-handle')[0].onmousedown = dragMouseDown;
@ -49,8 +54,8 @@ function dragElement(dragEl) {
e = e || window.event; e = e || window.event;
e.preventDefault(); e.preventDefault();
// get the mouse cursor position at startup: // get the mouse cursor position at startup:
pos3 = e.clientX; posStartX = e.clientX;
pos4 = e.clientY; posStartY = e.clientY;
document.onmouseup = closeDragElement; document.onmouseup = closeDragElement;
// call a function whenever the cursor moves: // call a function whenever the cursor moves:
document.onmousemove = elementDrag; document.onmousemove = elementDrag;
@ -60,13 +65,15 @@ function dragElement(dragEl) {
e = e || window.event; e = e || window.event;
e.preventDefault(); e.preventDefault();
// calculate the new cursor position: // calculate the new cursor position:
pos1 = pos3 - e.clientX; posDiffX = e.clientX - posStartX;
pos2 = pos4 - e.clientY; posDiffY = e.clientY - posStartY;
pos3 = e.clientX; posStartX = e.clientX;
pos4 = e.clientY; posStartY = e.clientY;
newPosX = Math.min((document.body.clientWidth - dragEl.clientWidth), Math.max(0, (dragEl.offsetLeft + posDiffX)));
newPosY = Math.min((document.body.clientHeight - dragEl.clientHeight), Math.max(0, (dragEl.offsetTop + posDiffY)));
// set the element's new position: // set the element's new position:
dragEl.style.top = (dragEl.offsetTop - pos2) + "px"; dragEl.style.top = newPosY + "px";
dragEl.style.left = (dragEl.offsetLeft - pos1) + "px"; dragEl.style.left = newPosX + "px";
} }
function closeDragElement() { function closeDragElement() {