Skip to content
Snippets Groups Projects
Select Git revision
  • 4b1d32734d711f0ce94a51ff09a79d1934ffdfdc
  • master default protected
2 results

index.html

Blame
    • index.html 2.37 KiB 
    <!DOCTYPE html>
<html>
  <head>
  <meta charset="utf-8" />
  <meta name="viewport" content ="width=device-width,initial-scale=1,user-scalable=yes" />
    <title>Cube Root Training</title>
  </head>
  <body>
  <div id=main>
  <b>Cube Root Training</b>
  <p>
    <span style="white-space:nowrap;"><span style="font-size:larger;"
        >&#8731;</span><span id=cube style="text-decoration:overline;">
      </span>&nbsp;=&nbsp;
      <input type=number id=cuberoot value="" min=10 max=99>
    </span>
  </p>
  <p id=result></p>
  <p id=stats></p>
  </div>
  <script>
var cube = document.getElementById("cube");
var cuberoot = document.getElementById("cuberoot");
var result = document.getElementById("result");
var stats = document.getElementById("stats");
var began;
var finished;
var elapsed = 0;
var generated;
var guesses = 0;
var correct = 0;

cuberoot.addEventListener("keydown", function (e) {
  if (e.keyCode === 13) {
    check_cuberoot(e);
  }
})

function humanize_ms(ms) {
  if (ms < 1000) {
    return ms + "ms";
  } else {
    return (Math.floor(ms / 100) / 10) + "s";
  }
}

function start_round() {
  if (guesses > 0) {
    stats.innerHTML = "Got " + correct + " correct out of " + guesses +
                      ". Last round took " + humanize_ms(finished - began) +
                      "." + ((correct > 0)
                          ?" Average time of correct guess was " +
                          humanize_ms(elapsed / correct) + "."
                          :"");
  }
  generated = Math.floor(Math.random() * 90) + 10;
  cube.innerHTML = "&nbsp;" + Math.pow(generated, 3) + "&nbsp;";
  began = Date.now();
  cuberoot.value = "";
  cuberoot.focus();
}

function check_cuberoot(e) {
  var guess = e.target.value;

  guesses++;
  finished = Date.now();
  if (guess == generated) {
    correct++;
    elapsed += (finished - began);
        result.innerHTML = "Correct!";
  } else {
    result.innerHTML = 'Not correct! <span style="white-space:nowrap;">' +
      '<span style="font-size:larger;">&#8731;</span>' +
      '<span style="text-decoration:overline;">&nbsp;' +
      Math.pow(generated, 3) +
      '&nbsp;</span> = ' + generated + '</span>.';
  }
  start_round();
}

window.onload = function() {
  if (screen.size <= 480) {
    document.body.style.fontSize = "8vw";
  } else if (screen.size <= 1024) {
    document.body.style.fontSize = "6vw";
  }
}

start_round();
  </script>
  </body>
</html>