/**
 * 掼蛋游戏UI交互
 */

// 游戏实例
let game = null;
let selectedCards = new Set();

// 初始化
document.addEventListener('DOMContentLoaded', () => {
    initEventListeners();
});

function initEventListeners() {
    // 开始游戏
    document.getElementById('btn-start').addEventListener('click', startGame);
    
    // 出牌按钮
    document.getElementById('btn-play').addEventListener('click', playSelectedCards);
    document.getElementById('btn-pass').addEventListener('click', passTurn);
    document.getElementById('btn-hint').addEventListener('click', showHint);
    
    // 下一局
    document.getElementById('btn-next-round').addEventListener('click', nextRound);
}

// 开始游戏
function startGame() {
    game = new GuandanGame();
    const result = game.startGame();
    
    if (result.success) {
        document.getElementById('start-screen').style.display = 'none';
        document.getElementById('game-over-modal').style.display = 'none';
        document.getElementById('game-status').style.display = 'none';
        
        // 显示规则
        showRules();
        
        // 更新UI
        updateGameInfo();
        renderHandCards();
        updatePlayerStatus();
        
        // 清除提示
        document.getElementById('played-by').textContent = '等待出牌...';
        document.getElementById('played-cards').innerHTML = '';
        
        // 显示当前玩家
        showTurnIndicator();
        
        // 如果AI先手
        if (game.currentPlayer !== 0) {
            setTimeout(() => processAITurn(), 1000);
        }
    }
}

// 显示规则
function showRules() {
    document.getElementById('rule-level').textContent = game.currentLevel;
    document.getElementById('rule-wild').textContent = game.currentLevel;
    document.getElementById('rules-modal').style.display = 'flex';
    
    setTimeout(() => {
        document.getElementById('rules-modal').style.display = 'none';
    }, 3000);
}

// 更新游戏信息
function updateGameInfo() {
    document.getElementById('current-level').textContent = game.currentLevel;
    document.getElementById('team-a-level').textContent = game.teamLevels[0];
    document.getElementById('team-b-level').textContent = game.teamLevels[1];
}

// 渲染手牌
function renderHandCards() {
    const container = document.getElementById('hand-cards');
    container.innerHTML = '';
    
    const player = game.players[0];
    selectedCards.clear();
    updatePlayButton();
    
    player.cards.forEach((card, index) => {
        const cardEl = createCardElement(card, index);
        container.appendChild(cardEl);
    });
    
    document.getElementById('my-card-count').textContent = `${player.cards.length}张`;
}

// 创建牌元素
function createCardElement(card, index) {
    const el = document.createElement('div');
    el.className = 'card';
    el.dataset.cardId = card.id;
    
    const isRed = card.suit === '♥' || card.suit === '♦';
    const colorClass = isRed ? 'red' : 'black';
    const isWild = game.isWildCard(card);
    
    if (isWild) {
        el.classList.add('wild');
    }
    
    // 王牌的显示
    let displayRank = card.rank;
    let displaySuit = card.suit;
    
    if (card.isJoker) {
        displaySuit = '🃏';
        displayRank = card.rank === '大王' ? '大' : '小';
    }
    
    el.innerHTML = `
        <div class="card-top">
            <span class="rank ${colorClass}">${displayRank}</span>
            <span class="suit ${colorClass}">${displaySuit}</span>
        </div>
        <div class="card-center ${colorClass}">${displaySuit}</div>
    `;
    
    el.addEventListener('click', () => toggleCardSelection(card.id, el));
    
    return el;
}

// 切换牌选择
function toggleCardSelection(cardId, el) {
    if (selectedCards.has(cardId)) {
        selectedCards.delete(cardId);
        el.classList.remove('selected');
    } else {
        selectedCards.add(cardId);
        el.classList.add('selected');
    }
    updatePlayButton();
}

// 更新出牌按钮状态
function updatePlayButton() {
    const hasSelection = selectedCards.size > 0;
    const isMyTurn = game && game.currentPlayer === 0 && game.gameState === 'playing';
    
    document.getElementById('btn-play').disabled = !hasSelection || !isMyTurn;
    document.getElementById('btn-pass').disabled = !isMyTurn;
    document.getElementById('btn-hint').disabled = !isMyTurn;
}

// 出牌
function playSelectedCards() {
    if (!game || game.currentPlayer !== 0) return;
    
    const cardIds = Array.from(selectedCards);
    const result = game.playCards(0, cardIds);
    
    if (result.success) {
        // 显示出的牌
        showPlayedCards(result.cards, 0, result.cardType.type);
        
        // 更新手牌
        renderHandCards();
        
        // 更新玩家状态
        updatePlayerStatus();
        
        // 清空选中
        selectedCards.clear();
        
        // 检查是否出完
        if (result.isFinished) {
            showGameStatus(`${game.players[0].name} 出完啦！排名第${game.players[0].rank}`);
        }
        
        // 检查游戏是否结束
        if (game.gameState === 'ended') {
            showGameOver();
        } else {
            // AI回合
            setTimeout(() => processAITurn(), 800);
        }
    } else {
        showGameStatus(result.message, true);
    }
}

// 不出
function passTurn() {
    if (!game || game.currentPlayer !== 0) return;
    
    const result = game.pass(0);
    
    if (result.success) {
        showGameStatus('你选择了不出');
        
        if (result.roundEnd) {
            showGameStatus('本轮结束，重新开始');
            document.getElementById('played-cards').innerHTML = '';
            document.getElementById('played-by').textContent = '等待出牌...';
        }
        
        updatePlayButton();
        setTimeout(() => processAITurn(), 800);
    } else {
        showGameStatus(result.message, true);
    }
}

// 提示
function showHint() {
    // 简化提示：选择最小的几张牌
    const player = game.players[0];
    if (player.cards.length > 0) {
        // 清除之前的选择
        selectedCards.clear();
        document.querySelectorAll('.card.selected').forEach(el => el.classList.remove('selected'));
        
        // 选择最小的牌（简化处理）
        const card = player.cards[player.cards.length - 1];
        selectedCards.add(card.id);
        
        const el = document.querySelector(`[data-card-id="${card.id}"]`);
        if (el) el.classList.add('selected');
        
        updatePlayButton();
        showGameStatus('提示：已选择一张较小的牌');
    }
}

// AI回合处理
function processAITurn() {
    if (!game || game.gameState === 'ended') return;
    
    const playerId = game.currentPlayer;
    if (playerId === 0) return; // 回到玩家回合
    
    const player = game.players[playerId];
    const decision = game.makeAIDecision(playerId);
    
    if (decision.action === 'play') {
        const cardIds = decision.cards.map(c => c.id);
        const result = game.playCards(playerId, cardIds);
        
        if (result.success) {
            showPlayedCards(result.cards, playerId, result.cardType.type);
            updatePlayerStatus();
            
            if (result.isFinished) {
                showGameStatus(`${player.name} 出完啦！排名第${player.rank}`);
            }
            
            if (game.gameState === 'ended') {
                showGameOver();
                return;
            }
        }
    } else {
        // 不出
        game.pass(playerId);
        showGameStatus(`${player.name} 不出`);
    }
    
    showTurnIndicator();
    updatePlayButton();
    
    // 继续AI回合或等待玩家
    if (game.currentPlayer !== 0 && game.gameState !== 'ended') {
        setTimeout(() => processAITurn(), 800);
    }
}

// 显示出的牌
function showPlayedCards(cards, playerId, cardType) {
    const container = document.getElementById('played-cards');
    const player = game.players[playerId];
    
    container.innerHTML = '';
    
    cards.forEach(card => {
        const el = document.createElement('div');
        el.className = 'card small';
        
        const isRed = card.suit === '♥' || card.suit === '♦';
        const colorClass = isRed ? 'red' : 'black';
        const isWild = game.isWildCard(card);
        
        if (isWild) el.classList.add('wild');
        
        // 王牌的显示
        let displayRank = card.rank;
        let displaySuit = card.suit;
        
        if (card.isJoker) {
            displaySuit = '🃏';
            displayRank = card.rank === '大王' ? '大' : '小';
        }
        
        el.innerHTML = `
            <div class="card-top">
                <span class="rank ${colorClass}">${displayRank}</span>
                <span class="suit ${colorClass}">${displaySuit}</span>
            </div>
            <div class="card-center ${colorClass}">${displaySuit}</div>
        `;
        
        container.appendChild(el);
    });
    
    // 更新谁出的
    const typeNames = {
        'single': '单张', 'pair': '对子', 'triple': '三张',
        'triple_pair': '三带二', 'straight': '顺子',
        'consecutive_pairs': '三连对', 'steel_plate': '钢板',
        'bomb4': '炸弹(4)', 'bomb5': '炸弹(5)', 'bomb6': '炸弹(6)',
        'bomb7': '炸弹(7)', 'bomb8': '炸弹(8)', 'joker_bomb': '天王炸'
    };
    
    document.getElementById('played-by').innerHTML = 
        `<span class="player-name-${player.team === 0 ? 'ally' : 'enemy'}">${player.name}</span> 出了 ${typeNames[cardType] || cardType}`;
    
    // 更新玩家剩余牌数
    updateCardCount(playerId);
}

// 更新玩家状态
function updatePlayerStatus() {
    // 更新剩余牌数显示
    for (let i = 0; i < 4; i++) {
        updateCardCount(i);
    }
}

// 更新某玩家牌数
function updateCardCount(playerId) {
    const player = game.players[playerId];
    const count = player.cards.length;
    
    let selector;
    if (playerId === 0) {
        selector = '#my-card-count';
    } else if (playerId === 1) {
        selector = '#player-left .card-count';
    } else if (playerId === 2) {
        selector = '#player-top .card-count';
    } else {
        selector = '#player-right .card-count';
    }
    
    const el = document.querySelector(selector);
    if (el) el.textContent = `${count}张`;
}

// 显示回合指示
function showTurnIndicator() {
    if (!game) return;
    
    const player = game.players[game.currentPlayer];
    
    // 更新出牌提示文字
    const playedBy = document.getElementById('played-by');
    if (playedBy && playedBy.textContent === '等待出牌...') {
        playedBy.innerHTML = `<span class="turn-text">轮到 ${player.name} 出牌</span>`;
    }
    
    // 高亮当前玩家
    document.querySelectorAll('.player, .player-self').forEach(el => {
        el.classList.remove('active-turn');
    });
    
    const playerEl = document.getElementById(
        game.currentPlayer === 0 ? 'player-self' :
        game.currentPlayer === 1 ? 'player-left' :
        game.currentPlayer === 2 ? 'player-top' : 'player-right'
    );
    if (playerEl) playerEl.classList.add('active-turn');
}

// 显示游戏状态提示
function showGameStatus(message, isError = false) {
    const el = document.getElementById('game-status');
    el.textContent = message;
    el.className = isError ? 'game-status error' : 'game-status';
    el.style.display = 'block';
    
    setTimeout(() => {
        el.style.display = 'none';
    }, 2000);
}

// 显示游戏结束
function showGameOver() {
    const result = game.endGame();
    
    document.getElementById('game-result-title').textContent = 
        result.winner === 0 ? '我方胜利！' : '对方胜利！';
    
    // 排名列表
    const rankList = document.getElementById('rank-list');
    rankList.innerHTML = '';
    
    result.ranks.sort((a, b) => a.rank - b.rank).forEach(r => {
        const div = document.createElement('div');
        div.className = 'rank-item';
        div.innerHTML = `
            <span class="rank-num">第${r.rank}名</span>
            <span class="rank-name ${r.team === 0 ? 'ally' : 'enemy'}">${r.name}</span>
        `;
        rankList.appendChild(div);
    });
    
    // 升级信息
    const upgradeInfo = document.getElementById('upgrade-info');
    const levelNames = { 1: '险胜(+1)', 2: '单上(+2)', 3: '双上(+3)' };
    upgradeInfo.innerHTML = `
        <p>获胜方升 ${result.upgrade} 级</p>
        <p>我方：${game.teamLevels[0]} → ${result.winner === 0 ? getNextLevel(game.teamLevels[0], result.upgrade) : game.teamLevels[0]}</p>
    `;
    
    document.getElementById('game-over-modal').style.display = 'flex';
}

// 获取下一级
function getNextLevel(current, upgrade) {
    const levels = ['2', '3', '4', '5', '6', '7', '8', '9', '10', 'J', 'Q', 'K', 'A'];
    const idx = levels.indexOf(current);
    return levels[Math.min(idx + upgrade, levels.length - 1)];
}

// 下一局
function nextRound() {
    if (!game) return;
    
    const result = game.endGame();
    const nextResult = game.nextRound(result.winner, result.upgrade);
    
    if (nextResult.gameOver) {
        showGameStatus(nextResult.finalWinner === 0 ? '恭喜！你们赢得了整场比赛！' : '对方赢得了整场比赛！');
        document.getElementById('start-screen').style.display = 'flex';
        document.getElementById('game-over-modal').style.display = 'none';
        return;
    }
    
    // 重置UI
    document.getElementById('game-over-modal').style.display = 'none';
    document.getElementById('played-cards').innerHTML = '';
    document.getElementById('played-by').textContent = '等待出牌...';
    
    updateGameInfo();
    renderHandCards();
    updatePlayerStatus();
    showTurnIndicator();
    
    if (game.currentPlayer !== 0) {
        setTimeout(() => processAITurn(), 1000);
    }
}