JSFiddle - React, Tailwind, and code Playground

by dariusk

HTML

<h1>FLAP</h1>
<h2>Press space to increase number</h2>
<h2 id="goal">Keep number between 40 and 60</h2>

<h1 id="num"></h1>

JavaScript

var num = 50;
var over = false;
var timer = 20;
var top = 60, bot = 40;
function down() {
  num = num - 1;
    timer--;
    if (timer === 0) {
        timer = 20;
      var off = Math.floor(Math.random()*2)*10+10;
       if (Math.random() < .5) off = -1 * off;
        top = top + off;
        bot = bot + off;
        document.getElementById('goal').innerText = 'Keep number between ' + bot + ' and ' + top;
    }
    if (num < bot || num > top) {
       over = true;
    }
    else {
      over = false;
    }
  document.getElementById('num').innerText = num;
    if (over) {
      document.getElementById('num').innerText += ' CRASH!!';
    }
}


setInterval(down, 1000/6);

document.onkeypress = checkKey;

function checkKey(e) {

    e = e || window.event;

    if (e.keyCode == '32') {
        num+= 2;
    }
}