snake: improve control pad layout/responsiveness
Hunter
Wednesday, July 23rd, 2025 at 6:52 PM
113 visibility: visible;
114 }
115
116 + #centerBtn {
117 + z-index: 10;
118 + }
119 +
120 #mobileGameOver, #mobileStartHint {
121 font-size: 20px;
122 color: red;
487 });
488
489 // Mobile controls
- document.getElementById('upBtn').addEventListener('click', () => {
490 + document.getElementById('upBtn').addEventListener('touchstart', (e) => {
491 + e.preventDefault();
492 if (gameRunning) setDirection({x: 0, y: -1});
493 });
- document.getElementById('downBtn').addEventListener('click', () => {
494 + document.getElementById('downBtn').addEventListener('touchstart', (e) => {
495 + e.preventDefault();
496 if (gameRunning) setDirection({x: 0, y: 1});
497 });
- document.getElementById('leftBtn').addEventListener('click', () => {
498 + document.getElementById('leftBtn').addEventListener('touchstart', (e) => {
499 + e.preventDefault();
500 if (gameRunning) setDirection({x: -1, y: 0});
501 });
- document.getElementById('rightBtn').addEventListener('click', () => {
502 + document.getElementById('rightBtn').addEventListener('touchstart', (e) => {
503 + e.preventDefault();
504 if (gameRunning) setDirection({x: 1, y: 0});
505 });
- document.getElementById('centerBtn').addEventListener('click', () => {
506 + document.getElementById('centerBtn').addEventListener('touchstart', (e) => {
507 + e.preventDefault();
508 if (!gameRunning) {
509 startGame();
510 }