diff options
Diffstat (limited to 'html/cards')
-rw-r--r-- | html/cards/script.js | 11 |
1 files changed, 9 insertions, 2 deletions
diff --git a/html/cards/script.js b/html/cards/script.js index 9f11282..5669d3a 100644 --- a/html/cards/script.js +++ b/html/cards/script.js @@ -125,8 +125,9 @@ const handleMouseMove = e => { if (!gameState.draggingCard) return; const rect = canvas.getBoundingClientRect(); - gameState.draggingCard.x = e.clientX - rect.left; - gameState.draggingCard.y = e.clientY - rect.top; + // Update the card's position using the offset + gameState.draggingCard.x = e.clientX - rect.left - dragOffset.x; + gameState.draggingCard.y = e.clientY - rect.top - dragOffset.y; renderAllCards(gameState.cards); }; @@ -137,6 +138,8 @@ const handleMouseUp = () => { document.removeEventListener('mouseup', handleMouseUp); }; +let dragOffset = { x: 0, y: 0 }; // To store the offset of the click position + const handleMouseDown = e => { const rect = canvas.getBoundingClientRect(); const x = e.clientX - rect.left; @@ -156,6 +159,10 @@ const handleMouseDown = e => { if (clickedCard) { gameState.draggingCard = clickedCard; + // Calculate the offset between the mouse position and the card's position + dragOffset.x = x - clickedCard.x; + dragOffset.y = y - clickedCard.y; + // Move the dragged card to the top of the stack gameState.cards = gameState.cards.filter(card => card !== clickedCard); gameState.cards.push(clickedCard); |