Fix screen bounds calculation and transform (#514)

## Description:

UX Improvement - Make view properly transform to actual player position.
Required a fix of the screen bounds calculation, which was using the
full screen size, instead of the current window size.

Fixes #519 

## Please complete the following:

- [x] I have added screenshots for all UI updates
- [x] I confirm I have thoroughly tested these changes and take full
responsibility for any bugs introduced
- [x] I understand that submitting code with bugs that could have been
caught through manual testing blocks releases and new features for all
contributors

## Please put your Discord username so you can be contacted if a bug or
regression is found:

eyeseeem

Co-authored-by: Max Dohme <max.dohme@gmail.com>

src/client/graphics/TransformHandler.ts

@@ -97,6 +97,10 @@ export class TransformHandler {
   }
 
   screenBoundingRect(): [Cell, Cell] {
+    const canvasRect = this.boundingRect();
+    const canvasWidth = canvasRect.width;
+    const canvasHeight = canvasRect.height;
+
     const LeftX = -this.game.width() / 2 / this.scale + this.offsetX;
     const TopY = -this.game.height() / 2 / this.scale + this.offsetY;
 
@@ -104,12 +108,12 @@ export class TransformHandler {
     const gameTopY = TopY + this.game.height() / 2;
 
     const rightX =
-      (screen.width - this.game.width() / 2) / this.scale + this.offsetX;
-    const rightY =
-      (screen.height - this.game.height() / 2) / this.scale + this.offsetY;
+      (canvasWidth - this.game.width() / 2) / this.scale + this.offsetX;
+    const bottomY =
+      (canvasHeight - this.game.height() / 2) / this.scale + this.offsetY;
 
     const gameRightX = rightX + this.game.width() / 2;
-    const gameBottomY = rightY + this.game.height() / 2;
+    const gameBottomY = bottomY + this.game.height() / 2;
 
     return [
       new Cell(Math.floor(gameLeftX), Math.floor(gameTopY)),