// Function to show an element
function showElement(selector) {
    const element = document.querySelector(selector);
    if (element) {
        element.style.display = 'block';
    }
}

// Function to hide an element
function hideElement(selector){
    const element = document.querySelector(selector);
    if (element) {
        element.style.display = 'none';
    }
}

const customers = [
    ["#customer1 img", "#customer1-2 img", "#customer1-3 img"],
    ["#customer2 img", "#customer2-2 img", "#customer2-3 img"],
    ["#customer3 img", "#customer3-2 img", "#customer3-3 img"],
]

const RandomCustomerIndex = Math.floor(Math.random() * customers.length);

const elizabethes = [
    '#elizabeth img',
    '#elizabeth1 img',
    '#elizabeth2 img'
]

function checkAnswer(dishName){
    var answer = answers[QAlist[currentIndex]]
    return answer == dishName
}

function handleHint(hint) {
    console.log(hint + " 被点击了!");
    if (hint == "bottom") {
        hideElement("#hint img")
        showElement("#hintpage img")
    }
    if (hint == "page") {
        hideElement("#hintpage img")
        showElement("#hint img")
    }
    
}

function handleClick(dishName) {
    console.log(dishName + " 被点击了!");
    if (checkAnswer(dishName)){
        // 正确答案的处理逻辑
        console.log("恭喜，你选对了！");
        if (currentIndex == 9){
            setTimeout(function() {
                    window.location.href = 'elizabethwin.html';
                }, 2000);
            
        }else{
            // customer calm down
            hideElement(customers[RandomCustomerIndex][failedTimes]);
            showElement(customers[RandomCustomerIndex][0]);

            // elizabeth safe
            hideElement(elizabethes[failedTimes])
            showElement(elizabethes)

            failedTimes = 0;

            // display next question
            currentIndex = currentIndex + 1
            var nextQuestion = questions[QAlist[currentIndex]];
            document.getElementById("dialogueText").innerHTML = nextQuestion;
            console.log(answers[QAlist[currentIndex]]);
        }
        
    } else {
        // 错误答案的处理逻辑
        console.log("不幸，这不是正确答案。");
        addShakeEffect()
        failedTimes = failedTimes + 1;
        switch (failedTimes) {
            case 1:
                hideElement(customers[RandomCustomerIndex][0])
                showElement(customers[RandomCustomerIndex][1])

                hideElement(elizabethes[0])
                showElement(elizabethes[1])
                break;
            case 2:
                hideElement(customers[RandomCustomerIndex][1])
                showElement(customers[RandomCustomerIndex][2])

                break;
            case 3:
                hideElement(elizabethes[1])
                showElement(elizabethes[2])
                // Delay for 2 seconds before redirecting
                setTimeout(function() {
                    window.location.href = 'elizabethlose.html';
                }, 2000);
                // 这里可以添加结束游戏或其他逻辑
                break;
            default:
                console.log("失败次数：" + failedTimes);
        }
    }
}

var failedTimes = 0

// Questions list
var questions = [
        "How to deal with religious conflicts in different churches?",
        "How to consolidate links with new churches, especially in the early years of the reign?",
        "How to deal with the privileges of the aristocracy and balance the conflicts between social classes?",
        "How to cope with tensions between Scotland and Spain, especially during the Anglo-Spanish War",
        "What role should it play in the American War of Independence?",
        "How to deal with the demand of the Third Estate for the convening of Congress?",
        "How should the storming of the Bastille be confronted?",
        "What should be the attitude towards the formulation of a new constitution?",
        "How should one respond to the rise of counterrevolutionary forces?",
        "How should relations with other European countries be handled in the midst of a wave of revolutions?"
    ];

// Answers list
var answers = [
    'fish&chips',
    'cream_tea',
    'pudding',
    'pudding',
    'fish&chips',
    'breakfast',
    'spaghetti',
    'spaghetti',
    'breakfast',
    'cream_tea'
]

var QAlist = Array.from(Array(questions.length).keys());

// Fisher-Yates 洗牌算法
function shuffleArray(array) {
    for (let i = array.length - 1; i > 0; i--) {
        let j = Math.floor(Math.random() * (i + 1));
        [array[i], array[j]] = [array[j], array[i]]; // 交换元素
    }
}

// 打乱问题数组
shuffleArray(QAlist);

// 当前问题索引
var currentIndex = 0;

// Execute on all DOM loaded
document.addEventListener("DOMContentLoaded", function() {
    // Show dialogue box
    showElement("#dialogueBox img");

    // Show all dishes
    showElement('#fish_chips img');
    showElement('#english_breakfast img');
    showElement('#pudding img');
    showElement('#spaghetti_bolognes img');
    showElement('#cream_tea img');

    // Show a random customer
    showElement(customers[RandomCustomerIndex][0]);

    // Show normal elizabeth
    showElement('#elizabeth img');

    // Show hint bottom
    showElement('#hint img')

    // Show first question
    var randomQuestion = questions[QAlist[currentIndex]];
    document.getElementById("dialogueText").innerHTML = randomQuestion;
    console.log(answers[QAlist[currentIndex]]);
});

// 为所有元素添加抖动效果
function addShakeEffect() {
    const allElements = document.querySelectorAll('body *'); // 选择页面上的所有元素
    allElements.forEach(el => {
        el.classList.add('shake-animation');
    });
    // 设置定时器以在动画完成后移除抖动效果
    setTimeout(() => {
        allElements.forEach(el => {
            el.classList.remove('shake-animation');
        });
    }, 800); // 与 CSS 动画时间相同
}

// 点击页面播放bgm
document.addEventListener('click', function play() {
    document.getElementById('bgm').play();
    document.removeEventListener('click', play);
});