fix: Task bar drag behaviour

- Placeholder is centered to mouse cursor
- Placeholder is positioned on mouse down not only on move
This commit is contained in:
sthag 2025-10-27 21:53:57 +01:00
parent e0cfcfac13
commit 0996ace34f

View file

@ -125,18 +125,24 @@ class DragAdv {
this.element.addEventListener('mousedown', this.onMouseDown.bind(this));
document.addEventListener('mousemove', this.onMouseMove.bind(this));
document.addEventListener('mouseup', this.onMouseUp.bind(this));
this.setPosition('bottom');
this.setPosition('bottom', this.barSize);
}
onMouseDown(event) {
this.isDragging = true;
// this.offsetX = event.clientX - this.element.getBoundingClientRect().left;
// this.offsetY = event.clientY - this.element.getBoundingClientRect().top;
this.offsetX = 0;
this.offsetY = 0;
this.element.style.display = 'none';
this.showPlaceholder();
this.offsetX = this.placeholder.getBoundingClientRect().width / 2;
this.offsetY = this.placeholder.getBoundingClientRect().height / 2;
this.element.style.display = 'none';
let x = event.clientX - this.offsetX;
let y = event.clientY - this.offsetY;
this.placeholder.style.left = `${x}px`;
this.placeholder.style.top = `${y}px`;
event.preventDefault();
}
@ -146,15 +152,8 @@ class DragAdv {
let x = event.clientX - this.offsetX;
let y = event.clientY - this.offsetY;
// Update the position of the element
// this.element.style.left = `${x}px`;
// this.element.style.top = `${y}px`;
// this.element.style.display = 'none';
// Update placeholder position
this.placeholder.style.left = `${x}px`;
this.placeholder.style.top = `${y}px`;
// this.placeholder.style.display = 'block';
}
onMouseUp() {