This commit is contained in:
gpt-engineer-app[bot]
2026-01-22 23:38:57 +00:00
parent 224b0a5450
commit a9548741ce
7 changed files with 252 additions and 42 deletions
+26 -11
View File
@@ -8,6 +8,7 @@ import { Maximize2, Minimize2 } from 'lucide-react';
import { useBrowserFullscreen } from '@/hooks/useGameDimensions';
import { MobileControlsDock, MobileControlsSpacer } from '@/components/MobileControlsDock';
import { useSwipeControls } from '@/hooks/useSwipeControls';
import GameTouchButton from '@/components/GameTouchButton';
const GRID_WIDTH = 21;
const GRID_HEIGHT = 21;
@@ -44,7 +45,7 @@ const MAZE_TEMPLATE = [
];
const Pacman = () => {
const { playSound } = useSettings();
const { playSound, mobileControlMode } = useSettings();
const { checkGameScoreAchievements, unlockMaxScore } = useAchievements();
// Game mode selection
@@ -115,9 +116,11 @@ const Pacman = () => {
onTap: () => {
if (gameStarted && !gameOver && !gameComplete) setIsPaused(p => !p);
},
enabled: isMobile && gameStarted && !gameOver && !gameComplete,
enabled: isMobile && gameStarted && !gameOver && !gameComplete && mobileControlMode === 'swipe',
});
const useButtonControls = isMobile && mobileControlMode === 'buttons';
useEffect(() => {
const handleResize = () => setCellSize(getCellSize());
window.addEventListener('resize', handleResize);
@@ -766,15 +769,27 @@ const Pacman = () => {
<button onClick={() => { setGameMode('1p'); setShowModeSelection(false); }} className="font-minecraft text-sm py-3 px-8 border border-primary bg-primary/20 text-primary hover:bg-primary/40 transition-all box-glow">START GAME</button>
</div>
) : gameStarted && !gameOver && !gameComplete ? (
<div
className="w-full h-24 border border-primary/30 rounded-lg bg-primary/5 flex items-center justify-center touch-none mt-2"
{...getSwipeHandlers()}
>
<p className="font-pixel text-xs text-primary/60 text-center pointer-events-none">
SWIPE TO MOVE<br />
<span className="text-[10px] text-foreground/40">TAP TO PAUSE</span>
</p>
</div>
useButtonControls ? (
<div className="flex flex-col items-center gap-2 mt-2">
<button onClick={() => setNextDirection('up')} className="p-3 px-6 border border-primary/50 active:bg-primary/40 text-primary font-pixel text-lg select-none"></button>
<div className="flex gap-3">
<button onClick={() => setNextDirection('left')} className="p-3 px-6 border border-primary/50 active:bg-primary/40 text-primary font-pixel text-lg select-none"></button>
<button onClick={() => setIsPaused(p => !p)} className="p-3 px-4 border border-primary/50 active:bg-primary/40 text-primary font-pixel text-[10px] select-none">{isPaused ? '▶' : '❚❚'}</button>
<button onClick={() => setNextDirection('right')} className="p-3 px-6 border border-primary/50 active:bg-primary/40 text-primary font-pixel text-lg select-none"></button>
</div>
<button onClick={() => setNextDirection('down')} className="p-3 px-6 border border-primary/50 active:bg-primary/40 text-primary font-pixel text-lg select-none"></button>
</div>
) : (
<div
className="w-full h-24 border border-primary/30 rounded-lg bg-primary/5 flex items-center justify-center touch-none mt-2"
{...getSwipeHandlers()}
>
<p className="font-pixel text-xs text-primary/60 text-center pointer-events-none">
SWIPE TO MOVE<br />
<span className="text-[10px] text-foreground/40">TAP TO PAUSE</span>
</p>
</div>
)
) : (
<button onClick={startGame} className="font-minecraft text-sm py-3 px-8 border border-primary bg-primary/20 text-primary hover:bg-primary/40 transition-all box-glow">
{gameComplete ? 'PERFECT!' : gameOver ? 'RETRY' : 'START'}