var time = document.getElementById('time');
var score = document.getElementById('score');
var show = document.getElementById('show');
var rule = document.getElementById('rule');
var li = document.getElementsByTagName('li');
//默认timeBol为false，当用户点对第一个时游戏开始，timeBol为true
var timeBol = false;
var clickBol = true;
//设置游戏时间为10秒钟
var count = 10;
var num = 0;
var colors = ['red','green','yellow','blue','black'];
var fonts = ['红','绿','黄','蓝','黑'];
var timer = setInterval(function(){
if(timeBol){
count -- ;
time.innerHTML = '剩余时间'+count;
}
if(count == 0){
// 当时间为0时，游戏结束，清除定时器
clearInterval(timer);
//右上角剩余时间设置为0
count = 0;
//当前为不可点击状态
clickBol = false;
}
}, 1000);
//随机数
function randFn(num){
return parseInt(Math.random()*num);
}
//设置show的文字和颜色
function showRand(){
colorIndex = randFn(5);//设置成全局变量方便匹配
var fontsIndex = randFn(5);
show.style.color = colors[colorIndex];
show.innerHTML = fonts[fontsIndex];
}
showRand();
//随机数组去重
function randArr(){
var arr = [];
while(arr.length<5){
var rand = randFn(5);
if(arr.indexOf(rand) == -1){
arr.push(rand);
}
}
// console.log(arr);
return arr;
}
randArr();
//LI文字和颜色的设置
function liRand(){
var colorArr = randArr();
var fontArr = randArr();
console.log(colorArr,fontArr)
//colorArr 黑黄红蓝绿 fontArr 红黑绿蓝黄
for (var i = 0; i < colorArr.length; i++) {
li[i].index = fontArr[i];
li[i].style.color = colors[colorArr[i]];
li[i].innerHTML = fonts[fontArr[i]];
}
}
liRand();
/// 游戏开始，遍历，如果show的颜色下角标=这个li的下角标即字的下角标对应并且clickBol为true，那么开始
// 上边已经把字的下角标赋给每个li的下角标
for (var i = 0; i < li.length; i++) {
li[i].onclick = function(){
if(colorIndex == this.index && clickBol){
console.log(colorIndex,this.index)
rule.style.display = 'none';
timeBol = true;
liRand();
showRand();
num++;
score.innerHTML = '完成'+num;
}
}
}
