fix: screenToPageCoordinates should not offset by contentArea

excaliburjs · Feb 19, 2024 · bf24511 · bf24511
1 parent 652c320
commit bf24511
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 6 deletions.
diff --git a/sandbox/tests/pointer/index.html b/sandbox/tests/pointer/index.html
@@ -6,12 +6,12 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Pointer</title>
   <style>
-    canvas {
+    /* canvas {
       position: relative;
       top: 50%;
       left: 50%;
       transform: translate(-50%, 50%);
-    }
+    } */
   </style>
 </head>
 <body>

diff --git a/sandbox/tests/pointer/pointer.ts b/sandbox/tests/pointer/pointer.ts
@@ -66,10 +66,23 @@ var game2 = new Game2({
   width: 600,
   height: 400,
   antialiasing: false,
-  displayMode: ex.DisplayMode.Fixed
+  displayMode: ex.DisplayMode.FitScreenAndFill
 });
 game2.debug.collider.showBounds = true;
 game2.debug.graphics.showBounds = true;
 game2.toggleDebug();
 
+game2.input.pointers.primary.on('down', (evt) => {
+  const pos = game2.screen.worldToPageCoordinates(evt.worldPos);
+  const div = document.createElement('div');
+  div.style.left = pos.x + 'px';
+  div.style.top = pos.y + 'px';
+  div.style.position = 'absolute';
+  div.style.width = '100px';
+  div.style.height = '100px';
+  div.style.zIndex = '999';
+  div.style.backgroundColor = 'black';
+  document.body.appendChild(div);
+});
+
 game2.initialize();
diff --git a/src/engine/Screen.ts b/src/engine/Screen.ts
@@ -628,9 +628,7 @@ export class Screen {
     let newX = point.x;
     let newY = point.y;
 
-    // offset by content area
-    newX = newX + this.contentArea.left;
-    newY = newY + this.contentArea.top;
+    // no need to offset by content area, drawing is already offset by this
 
     newX = (newX / this.resolution.width) * this.viewport.width;
     newY = (newY / this.resolution.height) * this.viewport.height;