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:
@@ -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();
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user