Add comprehensive mobile support with touch controls and responsive design

Implemented full mobile optimization to make the game mobile-ready:

**Core Mobile Support:**
- Updated viewport meta tag to prevent zoom and improve touch responsiveness
- Added mobile web app meta tags for iOS/Android standalone mode
- Enhanced CSS to prevent text selection, pull-to-refresh, and tap highlights
- Configured Phaser scale system with min/max bounds (320x240 to 1920x1080)
- Added fullscreen support for game container

**Touch Controls:**
- Added mobile device detection to HuntingScene
- Automatically default to touch controls on mobile devices
- Hide keyboard control instructions on mobile
- Only hide cursor on desktop (preserve default cursor on mobile)
- Adjusted messaging for mobile ("Tap to shoot" vs "Click to shoot")

**Touch Feedback:**
- Added pointerdown/pointerup handlers to all interactive buttons
- Buttons now scale down when pressed (0.95x) for tactile feedback
- Maintained hover effects for desktop compatibility
- Updated IntroScene "SET SAIL" button with touch feedback
- Updated MapScene location markers and close button
- Updated TransitionScene continue button
- All touch feedback works on both touch and mouse inputs

**Backward Compatibility:**
- All desktop functionality preserved
- Hover effects still work on desktop
- Keyboard controls available on desktop
- Touch and mouse inputs work seamlessly together

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
Thomas Richter
2025-12-18 05:17:09 +01:00
parent 1e5f4f35cd
commit 8de3f594f9
6 changed files with 105 additions and 27 deletions

View File

@@ -48,7 +48,7 @@ export default class IntroScene extends Phaser.Scene {
fontStyle: 'bold'
}).setOrigin(0.5);
// Button hover effects
// Button hover effects (desktop)
buttonBg.on('pointerover', () => {
buttonBg.setFillStyle(0x4a90c4);
});
@@ -57,8 +57,17 @@ export default class IntroScene extends Phaser.Scene {
buttonBg.setFillStyle(0x2d5f8e);
});
// Button click handler
// Touch feedback (works on both touch and mouse)
buttonBg.on('pointerdown', () => {
buttonBg.setFillStyle(0x4a90c4);
buttonBg.setScale(0.95);
buttonText.setScale(0.95);
});
buttonBg.on('pointerup', () => {
buttonBg.setFillStyle(0x2d5f8e);
buttonBg.setScale(1.0);
buttonText.setScale(1.0);
this.startGame();
});