const 表情包 = Array.from('🐥🐦🎂🎑🌺🌼🌇💃🧋')
const 翻开的卡片 = []
let 开始时间, 翻对的数量

// 在body上添加点击事件监听
document.body.addEventListener('click', (e) => {
    if (e.target.tagName == 'BUTTON') 开始游戏()
    else if (e.target.tagName == 'CARD') 翻开(e.target)
})

function 开始游戏() {
    startButton.style.display = 'none'
    gameBoard.replaceChildren() // 清空元素的所有子元素
    翻开的卡片.length = 0 // 清空数组
    开始时间 = new Date()
    翻对的数量 = 0
    const 候选表情 = [...表情包, ...表情包]
    while (候选表情.length > 0) {
        const x = Math.floor(Math.random() * 候选表情.length) // 在剩下的表情中抓bie
        const 卡片 = document.createElement('card')
        卡片.dataset['表情'] = 候选表情[x]
        gameBoard.appendChild(卡片)
        候选表情.splice(x, 1)
    }
}

function 翻开(卡片) {
    // 判断是否可以翻看
    if (翻开的卡片.length < 2 && 卡片.innerText == '') {
        翻开的卡片.push(卡片) // 记录这张卡片
        卡片.innerText = 卡片.dataset['表情'] // 显示卡片表情

        // 如果此时已经翻了两张
        if (翻开的卡片.length == 2) {
            setTimeout(() => {
                if (翻开的卡片[0].innerText == 翻开的卡片[1].innerText){
                //两个卡片表情一致
                翻对的数量++
                翻开的卡片[0].classList.add('grayout')
                翻开的卡片[1].classList.add('grayout')
                // 全都完啦？
                if (翻对的数量 == 表情包.length) {
                    if (confirm('恭喜你成功了！再玩一次吗？')) 开始游戏()
                    else startButton.style.display = 'inline-block'
                    }
                } else {
                // 两张卡片表情不一样
                翻开的卡片[0].innerText = ''
                翻开的卡片[1].innerText = ''
                }
                翻开的卡片.length = 0 // 清空数组
            }, 600)
        }
    }
}

// 更新游戏时间
setInterval(() => {
    if (翻对的数量 !== 表情包.length) {
        const seconds = Math.round((new Date() - 开始时间) / 1000)
        gameTime.innerText = `${seconds} 秒`
    }
}, 500)

开始游戏()