반응형
<script>
constholes=document.querySelectorAll('.hole');
constscoreBoard=document.querySelector('.score');
constmoles=document.querySelectorAll('.mole');
letlastHole;
lettimeUp= false;
letscore= 0;
function randomTime(min, max) {
returnMath.round(Math.random() * (max - min) + min);
}
function randomHole(holes) {
const idx =Math.floor(Math.random() * holes.length);
const hole = holes[idx];
if (hole ===lastHole) {
console.log('Ah nah thats the same one bud');
return randomHole(holes);
}
lastHole= hole;
return hole;
}
function peep() {
const time = randomTime(200, 1000);
const hole = randomHole(holes);
hole.classList.add('up');
setTimeout(() => {
hole.classList.remove('up');
if (!timeUp) peep();
}, time);
}
function startGame() {
scoreBoard.textContent = 0;
timeUp= false;
score= 0;
peep();
setTimeout(() =>timeUp= true, 10000)
}
function bonk(e) {
if(!e.isTrusted) return; // cheater!
score++;
this.parentNode.classList.remove('up');
scoreBoard.textContent =score;
}
moles.forEach(mole => mole.addEventListener('click', bonk));
</script>
두더지 게임을 만드는 미니 프로젝트였다.
반응형
'챌린지 > JavaScript 30일 챌린지' 카테고리의 다른 글
[JavaScript 30일 챌린지] : 29일차 (0) | 2022.02.25 |
---|---|
[JavaScript 30일 챌린지] : 28일차 (0) | 2022.02.24 |
[JavaScript 30일 챌린지] : 27일차 (0) | 2022.02.23 |
[JavaScript 30일 챌린지] : 26일차 (0) | 2022.02.22 |
[JavaScript 30일 챌린지] : 25일차 (0) | 2022.02.21 |
댓글