Пишу паззл на canvas js. Есть баг. если перетянуть одну картинку поверх другой, потом они тянутся вместе. Подкиньте, пожалуйста, идею, как это исправить???
mouseDown(e) {
e.preventDefault();
e.stopPropagation();
let mouseX = parseInt(e.clientX - offsetX);
let mouseY = parseInt(e.clientY - offsetY);
dragok = false;
for (let i = 0; i < rightField.length; i++) {
let a = rightField[i];
if (mouseX > a.x && mouseX < a.x + a.s && mouseY > a.y && mouseY < a.y + a.s) {
dragok = true;
a.isDragging = true;
a.isActive = true;
score++;
}
}
startX = mouseX;
startY = mouseY;
for (let j = 0; j < leftField.length; j++) {
let b = leftField[j];
if (mouseX > b.x && mouseX < b.x + b.s && mouseY > b.y && mouseY < b.y + b.s) {
b.isEmpty = true;
}
}
}
mouseMove(e) {
let mouseX = parseInt(e.clientX - offsetX);
let mouseY = parseInt(e.clientY - offsetY);
let distanceX = mouseX - startX;
let distanceY = mouseY - startY;
if (dragok) {
for (let i = 0; i < rightField.length; i++) {
let a = rightField[i];
if (a.isDragging && a.x <= 0) {
a.x = 1;
dragok = false;
} else if (a.isDragging && a.x >= containerSize.width - a.s) {
a.x = containerSize.width - a.s - 1;
dragok = false;
} else if (a.isDragging && a.y >= containerSize.height - a.s) {
a.y = containerSize.height - a.s - 1;
dragok = false;
}
else if (a.isDragging && a.y <= 0) {
a.y = 1;
dragok = false;
}
else if (a.isDragging) {
a.x += distanceX;
a.y += distanceY;
}
}
startX = mouseX;
startY = mouseY;
}
playingField.draw();
}
mouseUp(e) {
let mouseX = parseInt(e.clientX - offsetX);
let mouseY = parseInt(e.clientY - offsetY);
dragok = false;
for (let j = 0; j < leftField.length; j++) {
let b = leftField[j];
for (let i = 0; i < rightField.length; i++) {
let a = rightField[i];
a.isActive = false;
if (mouseX > b.x && mouseX < b.x + b.s && mouseY > b.y && mouseY < b.y + b.s && a.isDragging && b.isEmpty) {
a.x = b.x;
a.y = b.y;
b.isEmpty = false;
if (a.value === b.value) {
b.isChecked = true;
}
}
}
}
for (let j = 0; j < rightField.length; j++) {
rightField[j].isDragging = false;
}
}
}