GKaszewski/endless-runner-vibe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add touchscreen support for mobile play

Browse Source 
- game.rs: include MOUSE_BUTTON_LEFT in jump and restart checks;
  Emscripten maps single taps to mouse events so no JS glue needed
- web/index.html: mobile viewport meta (no user-scalable), CSS canvas
  scaling (max-width/max-height 100%), touch-action:none to prevent
  browser consuming taps as scroll/zoom, updated hint text

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Gabriel Kaszewski
2026-03-07 00:47:01 +01:00
parent 684d07c63b
commit 19d79be44c
2 changed files with 20 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
web/index.html
View File

@@ -2,26 +2,37 @@
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>Endless Runner</title>
<style>
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body {
height: 100%;
overflow: hidden;
}
body {
background: #16182e;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-height: 100vh;
height: 100%;
font-family: monospace;
color: #a0b8ff;
}
#canvas {
display: block;
/* Scale down to fit any viewport while keeping aspect ratio */
max-width: 100%;
max-height: 100vh;
width: auto;
height: auto;
border: 1px solid #3050a0;
/* Prevent browser from consuming taps as scroll/zoom */
touch-action: none;
}
#status {
margin-top: 12px;
margin-top: 8px;
font-size: 13px;
opacity: 0.6;
}
@@ -36,7 +47,7 @@
var Module = {
canvas: document.getElementById('canvas'),
onRuntimeInitialized: function() {
statusEl.textContent = 'SPACE / W / ↑ to jump';
statusEl.textContent = 'Tap or SPACE / W / ↑ to jump';
},
print: function(text) { console.log(text); },
printErr: function(text) { console.error(text); },