kingdom_map.js

document.addEventListener('DOMContentLoaded', function() {
    // 檢查是否有玩家資料
    const currentPlayerId = localStorage.getItem('currentPlayerId');
    
    // 如果沒有玩家資料，重定向到首頁
    if (!currentPlayerId) {
        alert('請先登入遊戲！');
        window.location.href = 'index.html';
        return;
    }
    
    // 檢查並顯示待處理的成就通知
    if (window.achievementSystem) {
        const pendingAchievements = window.achievementSystem.getAndClearPendingAchievements();
        if (pendingAchievements.length > 0) {
            console.log('發現待處理成就:', pendingAchievements);
            // 延遲顯示成就通知，確保頁面完全載入
            setTimeout(() => {
                pendingAchievements.forEach(achievementId => {
                    const achievement = window.achievementSystem.achievements.find(a => a.id === achievementId);
                    if (achievement) {
                        window.achievementSystem.showAchievementToast(achievement);
                    }
                });
            }, 1000);
        }
    }
    
    // 獲取DOM元素
    const springLocation = document.getElementById('spring-location');
    const valleyLocation = document.getElementById('valley-location');
    const towerLocation = document.getElementById('tower-location');
    const backToPrologueBtn = document.getElementById('back-to-prologue');
    const achievementsBtn = document.getElementById('achievements-btn');
    const springStars = document.getElementById('spring-stars').children;
    const valleyStars = document.getElementById('valley-stars').children;
    const towerStars = document.getElementById('tower-stars').children;
    const valleyLockMessage = document.getElementById('valley-lock-message');
    const towerLockMessage = document.getElementById('tower-lock-message');
    const bgmAudio = document.getElementById('bgm');
    const toggleBgmBtn = document.getElementById('toggle-bgm');
    
    // 音樂控制
    let isBgmPlaying = false;
    
    // 播放背景音樂
    function playBgm() {
        bgmAudio.volume = 0.3; // 設置音量
        bgmAudio.play().catch(e => console.log('自動播放被阻止:', e));
        isBgmPlaying = true;
    }
    
    // 嘗試自動播放背景音樂（大多數瀏覽器會阻止）
    playBgm();
    
    // 音樂開關按鈕
    toggleBgmBtn.addEventListener('click', function() {
        if (isBgmPlaying) {
            bgmAudio.pause();
            isBgmPlaying = false;
            toggleBgmBtn.textContent = '音樂開';
        } else {
            bgmAudio.play();
            isBgmPlaying = true;
            toggleBgmBtn.textContent = '音樂關';
        }
    });
    
    // 獲取遊戲進度
    const gameProgress = JSON.parse(localStorage.getItem(`gameProgress_${currentPlayerId}`)) || {
        completedTrials: {
            "平方之泉": { completed: false, score: 0, challengesCompleted: [false, false, false, false, false, false] },
            "變換山谷": { completed: false, score: 0, challengesCompleted: [false, false, false, false, false, false] },
            "展開之塔": { completed: false, score: 0, challengesCompleted: [false, false, false, false, false, false] }
        },
        currentLocation: "王國地圖",
        lastSaved: new Date().toISOString()
    };
    
    // 更新星級顯示
    function updateStars() {
        // 平方之泉星級
        const springCorrect = gameProgress.completedTrials["平方之泉"].challengesCompleted.filter(Boolean).length;
        updateLocationStars(springStars, springCorrect);
        
        // 變換山谷星級
        const valleyCorrect = gameProgress.completedTrials["變換山谷"].challengesCompleted.filter(Boolean).length;
        updateLocationStars(valleyStars, valleyCorrect);
        
        // 展開之塔星級
        const towerCorrect = gameProgress.completedTrials["展開之塔"].challengesCompleted.filter(Boolean).length;
        updateLocationStars(towerStars, towerCorrect);
    }
    
    // 更新特定位置的星級
    function updateLocationStars(starsElements, correctCount) {
        // 根據答對題數顯示星星
        // 6題全對 = 3星, 5題對 = 2星, 4題對 = 1星, 少於4題 = 0星
        let earnedStars = 0;
        if (correctCount >= 6) earnedStars = 3;
        else if (correctCount >= 5) earnedStars = 2;
        else if (correctCount >= 4) earnedStars = 1;
        
        // 更新星星顯示
        for (let i = 0; i < starsElements.length; i++) {
            if (i < earnedStars) {
                starsElements[i].classList.add('earned');
            } else {
                starsElements[i].classList.remove('earned');
            }
        }
        
        return earnedStars;
    }
    
    // 更新解鎖狀態
    function updateLockStatus() {
        // 檢查平方之泉是否完成（至少4題正確）
        const springCorrect = gameProgress.completedTrials["平方之泉"].challengesCompleted.filter(Boolean).length;
        const springCompleted = springCorrect >= 4;
        
        // 檢查變換山谷是否完成（至少4題正確）
        const valleyCorrect = gameProgress.completedTrials["變換山谷"].challengesCompleted.filter(Boolean).length;
        const valleyCompleted = valleyCorrect >= 4;
        
        // 更新變換山谷解鎖狀態
        if (springCompleted) {
            valleyLocation.classList.remove('locked');
            valleyLockMessage.style.display = 'none';
        } else {
            valleyLocation.classList.add('locked');
            valleyLockMessage.style.display = 'block';
        }
        
        // 更新展開之塔解鎖狀態
        if (springCompleted && valleyCompleted) {
            towerLocation.classList.remove('locked');
            towerLockMessage.style.display = 'none';
        } else {
            towerLocation.classList.add('locked');
            towerLockMessage.style.display = 'block';
            
            // 更新鎖定訊息
            if (!springCompleted) {
                towerLockMessage.textContent = '需先完成平方之泉與變換山谷試煉';
            } else {
                towerLockMessage.textContent = '需先完成變換山谷試煉';
            }
        }
    }
    
    // 初始化頁面
    updateStars();
    updateLockStatus();
    
    // 整個卡片區域點擊事件 - 平方之泉
    springLocation.addEventListener('click', function() {
        window.location.href = 'spring.html';
    });
    
    // 整個卡片區域點擊事件 - 變換山谷
    valleyLocation.addEventListener('click', function() {
        // 檢查是否已解鎖
        const springCorrect = gameProgress.completedTrials["平方之泉"].challengesCompleted.filter(Boolean).length;
        const springCompleted = springCorrect >= 4;
        
        if (springCompleted) {
            window.location.href = 'valley.html';
        } else {
            alert('需先完成平方之泉試煉才能進入變換山谷！');
        }
    });
    
    // 整個卡片區域點擊事件 - 展開之塔
    towerLocation.addEventListener('click', function() {
        // 檢查是否已解鎖
        const springCorrect = gameProgress.completedTrials["平方之泉"].challengesCompleted.filter(Boolean).length;
        const springCompleted = springCorrect >= 4;
        const valleyCorrect = gameProgress.completedTrials["變換山谷"].challengesCompleted.filter(Boolean).length;
        const valleyCompleted = valleyCorrect >= 4;
        
        if (springCompleted && valleyCompleted) {
            window.location.href = 'tower.html';
        } else {
            if (!springCompleted) {
                alert('需先完成平方之泉與變換山谷試煉才能進入展開之塔！');
            } else {
                alert('需先完成變換山谷試煉才能進入展開之塔！');
            }
        }
    });
    
    // 返回序章按鈕點擊事件
    backToPrologueBtn.addEventListener('click', function() {
        window.location.href = 'prologue.html';
    });
    
    // 成就圖鑑按鈕點擊事件
    if (achievementsBtn) {
        achievementsBtn.addEventListener('click', function() {
            window.location.href = 'achievements.html';
        });
    }
    
    // 為星星添加動畫效果
    function initializeStarAnimations() {
        // 獲取所有已獲得的星星
        const earnedStars = document.querySelectorAll('.star.earned');
        
        // 為每個已獲得的星星設置隨機延遲的動畫
        earnedStars.forEach((star, index) => {
            // 設置隨機延遲，使星星不同步閃爍
            const randomDelay = Math.random() * 2; // 0-2秒的隨機延遲
            star.style.animationDelay = `${randomDelay}s`;
            
            // 添加微小的旋轉效果
            const randomRotation = (Math.random() - 0.5) * 10; // -5到5度的隨機旋轉
            star.style.transform = `rotate(${randomRotation}deg)`;
        });
    }
    
    // 初始化星星動畫
    initializeStarAnimations();
    
    // 檢查成就
    if (window.achievementSystem) {
        // 構建遊戲狀態
        const gameState = {
            // 基本信息
            loginCount: parseInt(localStorage.getItem('loginCount') || '1'),
            prologueCompleted: true,
            
            // 試煉相關
            visitedTrials: ['平方之泉'],
            completedTrials: {},
            
            // 其他統計
            maxCorrectStreak: 0,
            fastestTrialTime: 999,
            fastestQuestionTime: 999,
            retriesAfterFailure: 0,
            lastTrialCompletionTime: new Date(),
            lastTrialStartTime: new Date(),
            
            // 特殊條件
            allThreeStarsSameDay: false,
            firstAttemptAllThreeStars: false,
            musicEnabledAllTrials: localStorage.getItem('musicPlaying') === 'true',
            musicDisabledAllTrials: localStorage.getItem('musicPlaying') === 'false'
        };
        
        // 填充試煉相關數據
        if (gameProgress.completedTrials) {
            for (const [trialName, trialData] of Object.entries(gameProgress.completedTrials)) {
                const correctCount = trialData.challengesCompleted.filter(Boolean).length;
                if (correctCount > 0) {
                    if (!gameState.visitedTrials.includes(trialName)) {
                        gameState.visitedTrials.push(trialName);
                    }
                    
                    gameState.completedTrials[trialName] = {
                        completed: correctCount >= 4,
                        stars: correctCount >= 6 ? 3 : (correctCount >= 5 ? 2 : (correctCount >= 4 ? 1 : 0)),
                        noErrors: correctCount === 6
                    };
                }
            }
        }
        
        // 檢查成就
        window.achievementSystem.checkAllAchievements(gameState);
    }
});