shortdeck1.4:hand card display fix

This commit is contained in:
2025-10-14 13:26:59 +08:00
parent 8f30e75e1a
commit e2cf510d34
13 changed files with 249 additions and 25 deletions

View File

@@ -347,32 +347,55 @@
const Card = ({ card, isBack = false }) => {
if (isBack || !card) {
return React.createElement('div', {
className: 'card back'
className: 'card back',
style: {
backgroundColor: '#1e40af',
color: 'white',
fontSize: '24px',
fontWeight: 'bold'
}
}, '🂠');
}
// Convert card notation to display format
const convertCard = (cardStr) => {
const parseCard = (cardStr) => {
if (!cardStr || cardStr.length < 2) return cardStr;
const rank = cardStr.slice(0, -1);
const suit = cardStr.slice(-1).toLowerCase();
const suit = cardStr.slice(-1);
const suitSymbols = {
's': '',
'h': '',
'd': '',
'c': ''
'h': '', // hearts
'd': '', // diamonds
'c': '', // clubs
's': '' // spades
};
return rank + (suitSymbols[suit] || suit);
const rankSymbols = {
'A': 'A', 'K': 'K', 'Q': 'Q', 'J': 'J',
'T': '10', '9': '9', '8': '8', '7': '7', '6': '6'
};
return (rankSymbols[rank] || rank) + (suitSymbols[suit] || suit);
};
const displayCard = convertCard(card);
const isRed = displayCard.includes('♥') || displayCard.includes('♦');
const displayCard = parseCard(card);
const suit = card.slice(-1);
const isRed = suit === 'h' || suit === 'd';
return React.createElement('div', {
className: `card ${isRed ? 'red' : ''}`
className: `card ${isRed ? 'red' : ''}`,
style: {
backgroundColor: 'white',
color: isRed ? '#dc2626' : '#1f2937',
fontSize: '14px',
fontWeight: 'bold',
border: '2px solid #374151',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
minHeight: '84px',
minWidth: '60px'
}
}, displayCard);
};
@@ -382,13 +405,14 @@
const safeState = state || 'WAITING';
const safeCards = Array.isArray(cards) ? cards : [];
if (isCurrentPlayer) {
console.log('Debug - Current player cards:', cards);
console.log('Debug - Safe cards:', safeCards);
console.log('Debug - Cards length:', safeCards.length);
console.log('Debug - isCurrentPlayer:', isCurrentPlayer);
console.log('Debug - Will show cards:', isCurrentPlayer && safeCards.length > 0);
}
console.log(`PlayerSeat Debug - Player ${index}:`, {
player,
index,
isCurrentPlayer,
cardsLength: safeCards.length,
cards: safeCards,
willShowCards: isCurrentPlayer && safeCards.length > 0
});
return React.createElement('div', {
className: `player-seat bg-gray-800 rounded-lg p-4 text-white relative ${isCurrentTurn ? 'active' : ''} ${safeState !== 'ACTIVE' && safeState !== 'active' ? 'opacity-50' : ''}`
@@ -407,9 +431,28 @@
React.createElement('div', {
className: 'flex gap-1 justify-center mb-2'
},
isCurrentPlayer && safeCards.length > 0
? safeCards.map((card, idx) => React.createElement(Card, { key: idx, card }))
: [React.createElement(Card, { key: 0, isBack: true }), React.createElement(Card, { key: 1, isBack: true })]
(() => {
console.log(`Cards Render Debug - Player ${index}:`, {
isCurrentPlayer,
safeCardsLength: safeCards.length,
safeCards,
shouldShowCards: isCurrentPlayer && safeCards.length > 0
});
if (isCurrentPlayer && safeCards.length > 0) {
console.log(`Cards Render Debug - Player ${index} - Showing actual cards:`, safeCards);
return safeCards.map((card, idx) => {
console.log(`Cards Render Debug - Player ${index} - Creating card ${idx}: "${card}"`);
return React.createElement(Card, { key: idx, card });
});
} else {
console.log(`Cards Render Debug - Player ${index} - Showing card backs (isCurrentPlayer: ${isCurrentPlayer}, cardCount: ${safeCards.length})`);
return [
React.createElement(Card, { key: 0, isBack: true }),
React.createElement(Card, { key: 1, isBack: true })
];
}
})()
),
// Stack and Bet Info
@@ -726,9 +769,14 @@
currentBet: (gameState.currentPot && gameState.currentPot[index]) || 0,
state: (gameState.playerStates && gameState.playerStates[index]) || 'WAITING',
cards: index === gameState.playerId ? (() => {
console.log('PlayersList Debug - gameState.playerCards:', gameState.playerCards);
console.log('PlayersList Debug - index:', index, 'playerId:', gameState.playerId);
return gameState.playerCards || [];
console.log('PlayersLayout Debug - gameState.playerCards:', gameState.playerCards);
console.log('PlayersLayout Debug - index:', index, 'playerId:', gameState.playerId);
console.log('PlayersLayout Debug - playerCards type:', typeof gameState.playerCards);
console.log('PlayersLayout Debug - playerCards isArray:', Array.isArray(gameState.playerCards));
console.log('PlayersLayout Debug - playerCards JSON:', JSON.stringify(gameState.playerCards));
const cards = gameState.playerCards || [];
console.log('PlayersLayout Debug - Passing cards:', cards);
return cards;
})() : []
})
)