tyler.durden/pandorafms
1
0
Fork 0
mirror of https://github.com/pandorafms/pandorafms.git synced 2025-07-30 17:25:26 +02:00
Code Issues Packages Projects Releases Wiki Activity

WIP: VC items movement

Browse Source
This commit is contained in:
Alejandro Gallardo Escobar 2019-06-20 18:19:10 +02:00
parent 71ea94eea3
commit cd5ad59f56
1 changed files with 44 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
visual_console_client/src/lib/index.ts
View File

@ -447,11 +447,15 @@ export function addMovementListener(
let mouseElementOffsetY: Position["y"] = 0; let mouseElementOffsetY: Position["y"] = 0;
// Bounds. // Bounds.
let containerBounds = container.getBoundingClientRect(); let containerBounds = container.getBoundingClientRect();
let containerTop = getOffset(container).top; let containerOffset = getOffset(container);
let containerTop = containerOffset.top;
let containerBottom = containerTop + containerBounds.height; let containerBottom = containerTop + containerBounds.height;
let containerLeft = getOffset(container).left; let containerLeft = containerOffset.left;
let containerRight = containerLeft + containerBounds.width; let containerRight = containerLeft + containerBounds.width;
let elementBounds = element.getBoundingClientRect(); let elementBounds = element.getBoundingClientRect();
let elementOffset = getOffset(element);
let elementLeft = elementOffset.left;
let elementTop = elementOffset.top;
let borderWidth = window.getComputedStyle(element).borderWidth || "0"; let borderWidth = window.getComputedStyle(element).borderWidth || "0";
let borderFix = Number.parseInt(borderWidth) * 2; let borderFix = Number.parseInt(borderWidth) * 2;
@ -471,14 +475,17 @@ export function addMovementListener(
// TODO: Document. // TODO: Document.
if (e.pageX < containerLeft) x = 0; const mouseX = e.pageX;
else if (e.pageX > containerRight) x = containerBounds.width; const mouseY = e.pageY;
else x = e.pageX - lastMouseX + lastX;
if (e.pageY < containerTop) y = 0; if (mouseX < containerLeft) x = 0;
else if (e.pageY > containerBottom) else if (mouseX > containerRight) x = containerBounds.width;
else x = mouseX - lastMouseX + lastX;
if (mouseY < containerTop) y = 0;
else if (mouseY > containerBottom)
y = containerBounds.height - elementBounds.height + borderFix; y = containerBounds.height - elementBounds.height + borderFix;
else y = e.pageY - lastMouseY + lastY; else y = mouseY - lastMouseY + lastY;
if (x < 0) x = 0; if (x < 0) x = 0;
else if (x + elementBounds.width - borderFix > containerBounds.width) else if (x + elementBounds.width - borderFix > containerBounds.width)
@ -488,6 +495,17 @@ export function addMovementListener(
else if (y + elementBounds.height - borderFix > containerBounds.height) else if (y + elementBounds.height - borderFix > containerBounds.height)
y = containerBounds.height - elementBounds.height + borderFix; y = containerBounds.height - elementBounds.height + borderFix;
if (x === lastX && y === lastY) return;
// Store the last mouse coordinates.
lastMouseX = mouseX;
lastMouseY = mouseY;
// if (x < lastX && mouseX > elementLeft + mouseElementOffsetX) return;
// if (x > lastX && mouseX < elementLeft + mouseElementOffsetX) return;
// if (y < lastY && mouseY > elementTop + mouseElementOffsetY) return;
// if (y > lastY && mouseY < elementTop + mouseElementOffsetY) return;
// Run the movement events. // Run the movement events.
throttledMovement(x, y); throttledMovement(x, y);
debouncedMovement(x, y); debouncedMovement(x, y);
@ -495,9 +513,6 @@ export function addMovementListener(
// Store the coordinates of the element. // Store the coordinates of the element.
lastX = x; lastX = x;
lastY = y; lastY = y;
// Store the last mouse coordinates.
lastMouseX = e.pageX;
lastMouseY = e.pageY;
}; };
const handleEnd = () => { const handleEnd = () => {
// Reset the positions. // Reset the positions.
@ -533,11 +548,15 @@ export function addMovementListener(
// Initialize the bounds. // Initialize the bounds.
containerBounds = container.getBoundingClientRect(); containerBounds = container.getBoundingClientRect();
containerTop = getOffset(container).top; containerOffset = getOffset(container);
containerTop = containerOffset.top;
containerBottom = containerTop + containerBounds.height; containerBottom = containerTop + containerBounds.height;
containerLeft = getOffset(container).left; containerLeft = containerOffset.left;
containerRight = containerLeft + containerBounds.width; containerRight = containerLeft + containerBounds.width;
elementBounds = element.getBoundingClientRect(); elementBounds = element.getBoundingClientRect();
elementOffset = getOffset(element);
elementLeft = elementOffset.left;
elementTop = elementOffset.top;
borderWidth = window.getComputedStyle(element).borderWidth || "0"; borderWidth = window.getComputedStyle(element).borderWidth || "0";
borderFix = Number.parseInt(borderWidth) * 2; borderFix = Number.parseInt(borderWidth) * 2;
@ -618,6 +637,18 @@ export function addResizementListener(
let width = lastWidth + (e.pageX - lastMouseX); let width = lastWidth + (e.pageX - lastMouseX);
let height = lastHeight + (e.pageY - lastMouseY); let height = lastHeight + (e.pageY - lastMouseY);
if (width === lastWidth && height === lastHeight) return;
console.log(
width - lastWidth,
e.pageX - elementLeft + (lastWidth - mouseElementOffsetX)
);
if (
width < lastWidth &&
e.pageX > elementLeft + (lastWidth - mouseElementOffsetX)
)
return;
if (width < minWidth) { if (width < minWidth) {
// Minimum value. // Minimum value.
width = minWidth; width = minWidth;