본문 바로가기
챌린지/JavaScript 30일 챌린지

[JavaScript 30일 챌린지] : 30일차

by 오주현 2022. 2. 26.
반응형
<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>

두더지 게임을 만드는 미니 프로젝트였다.

반응형

댓글