[Enhancement] Improve Camera Animation for Smoother Gameplay 🎥

[maitri-vv]

Goal: Refactor the camera movement in the animation(time) function to use TWEEN.js for smoother, less jerky vertical movement as the stack grows.

Tasks:

Identify Target: The camera movement is currently handled by:

if (camera.position.y < boxHeight * (stack.length - 2) + 4) {
  camera.position.y += speed * timePassed;
}

Replace Logic: When a new layer is successfully added in splitBlockAndAddNextOneIfOverlaps(), calculate the new target y position for the camera:

const newCameraY = boxHeight * (stack.length - 2) + 4; 

Animate with TWEEN: Use TWEEN.js to animate camera.position.y from its current position to newCameraY over a short duration (e.g., 500ms) with an appropriate easing function (e.g., TWEEN.Easing.Quadratic.Out).

Remove Old Logic: Delete the outdated, linear camera movement logic from the animation(time) function.

[kazekunal]

Hi @maitri-vv, I have a couple of ideas for adjusting the camera angles using TWEEN.js, which involve zooming out when the game ends, allowing the user to view their block stack. I would love to contribute to the issue. Please assign it to me.

[maitri-vv]

Go ahead, make sure you retain the responsiveness too for the changes.