More host UI refinements, intuitive UI enhancements during gameplay pt 3.

This commit is contained in:
Aaron D. Lee 2026-01-26 15:04:23 -05:00
parent 059edfb3d9
commit c72fe44cfa
3 changed files with 41 additions and 9 deletions

View File

@ -206,8 +206,8 @@ class GolfGame {
this.joinRoomBtn.addEventListener('click', () => { this.playSound('click'); this.joinRoom(); }); this.joinRoomBtn.addEventListener('click', () => { this.playSound('click'); this.joinRoom(); });
this.startGameBtn.addEventListener('click', () => { this.playSound('success'); this.startGame(); }); this.startGameBtn.addEventListener('click', () => { this.playSound('success'); this.startGame(); });
this.leaveRoomBtn.addEventListener('click', () => { this.playSound('click'); this.leaveRoom(); }); this.leaveRoomBtn.addEventListener('click', () => { this.playSound('click'); this.leaveRoom(); });
this.deck.addEventListener('click', () => { this.playSound('card'); this.drawFromDeck(); }); this.deck.addEventListener('click', () => { this.drawFromDeck(); });
this.discard.addEventListener('click', () => { this.playSound('card'); this.drawFromDiscard(); }); this.discard.addEventListener('click', () => { this.drawFromDiscard(); });
this.discardBtn.addEventListener('click', () => { this.playSound('card'); this.discardDrawn(); }); this.discardBtn.addEventListener('click', () => { this.playSound('card'); this.discardDrawn(); });
this.skipFlipBtn.addEventListener('click', () => { this.playSound('click'); this.skipFlip(); }); this.skipFlipBtn.addEventListener('click', () => { this.playSound('click'); this.skipFlip(); });
this.nextRoundBtn.addEventListener('click', () => { this.playSound('click'); this.nextRound(); }); this.nextRoundBtn.addEventListener('click', () => { this.playSound('click'); this.nextRound(); });
@ -633,15 +633,27 @@ class GolfGame {
// Game Actions // Game Actions
drawFromDeck() { drawFromDeck() {
if (!this.isMyTurn() || this.drawnCard || this.gameState.has_drawn_card) return; if (!this.isMyTurn() || this.drawnCard || this.gameState.has_drawn_card) {
if (this.gameState && !this.gameState.waiting_for_initial_flip) {
this.playSound('reject');
}
return;
}
if (this.gameState.waiting_for_initial_flip) return; if (this.gameState.waiting_for_initial_flip) return;
this.playSound('card');
this.send({ type: 'draw', source: 'deck' }); this.send({ type: 'draw', source: 'deck' });
} }
drawFromDiscard() { drawFromDiscard() {
if (!this.isMyTurn() || this.drawnCard || this.gameState.has_drawn_card) return; if (!this.isMyTurn() || this.drawnCard || this.gameState.has_drawn_card) {
if (this.gameState && !this.gameState.waiting_for_initial_flip) {
this.playSound('reject');
}
return;
}
if (this.gameState.waiting_for_initial_flip) return; if (this.gameState.waiting_for_initial_flip) return;
if (!this.gameState.discard_top) return; if (!this.gameState.discard_top) return;
this.playSound('card');
this.send({ type: 'draw', source: 'discard' }); this.send({ type: 'draw', source: 'discard' });
} }
@ -1142,6 +1154,15 @@ class GolfGame {
const card = myData.cards[position]; const card = myData.cards[position];
// Check if action is allowed - if not, play reject sound
const canAct = this.gameState.waiting_for_initial_flip ||
this.drawnCard ||
this.waitingForFlip;
if (!canAct) {
this.playSound('reject');
return;
}
// Initial flip phase // Initial flip phase
if (this.gameState.waiting_for_initial_flip) { if (this.gameState.waiting_for_initial_flip) {
if (card.face_up) return; if (card.face_up) return;
@ -1503,7 +1524,7 @@ class GolfGame {
// Toggle not-my-turn class to disable hover effects when it's not player's turn // Toggle not-my-turn class to disable hover effects when it's not player's turn
const isMyTurn = this.isMyTurn(); const isMyTurn = this.isMyTurn();
this.playerArea.classList.toggle('not-my-turn', !isMyTurn); this.gameScreen.classList.toggle('not-my-turn', !isMyTurn);
// Update status message (handled by specific actions, but set default here) // Update status message (handled by specific actions, but set default here)
const currentPlayer = this.gameState.players.find(p => p.id === this.gameState.current_player_id); const currentPlayer = this.gameState.players.find(p => p.id === this.gameState.current_player_id);

View File

@ -786,11 +786,22 @@ input::placeholder {
} }
/* Disable hover effects when not player's turn */ /* Disable hover effects when not player's turn */
.not-my-turn .card { #game-screen.not-my-turn .card {
cursor: default; cursor: default;
} }
.not-my-turn .card:hover { #game-screen.not-my-turn .card:hover {
transform: none;
box-shadow: none;
}
#game-screen.not-my-turn #deck,
#game-screen.not-my-turn #discard {
cursor: default;
}
#game-screen.not-my-turn #deck:hover,
#game-screen.not-my-turn #discard:hover {
transform: none; transform: none;
box-shadow: none; box-shadow: none;
} }
@ -1834,11 +1845,11 @@ input::placeholder {
} }
/* Disable hover effects when not player's turn */ /* Disable hover effects when not player's turn */
.not-my-turn .real-card { #game-screen.not-my-turn .real-card {
cursor: default; cursor: default;
} }
.not-my-turn .real-card:hover { #game-screen.not-my-turn .real-card:hover {
transform: none; transform: none;
} }
} }

Binary file not shown.