/* <title>Logarithm levels</title>
<!--

I’ve wanted to memorize a table of logarithms for years.  Who wouldn’t
like to be able to calculate, in a flash, products of several numbers
and their square roots?  I mean, suppose you want to know how many
square meters an 8½×11" sheet of paper is, to four significant
figures.  log₁₀ 8.5 ≈ .92942; log₁₀ 1.1 ≈ .04139.  Adding these two in
my head, plus 1 for the factor of 10, I get 1.97081 for the number of
square inches.  But getting to square centimeters involves multiplying
by 2.54 a couple of times; log₁₀ 2.54 ≈ .40483, or .80966 doubled, so
we have 2.78047.  Divide that by 10000 to get square meters, and we
have .78047 - 2.  The base-10 exponential of .78047 is 6.0321 to five
places, so we have 0.06032 square meters, which is correct.  For about
half the work, you can figure it out to two significant figures
instead of four.

How can you do this in your head?  Well, there are only 90 two-digit
numbers in the range 1.0 to 9.9, and only 900 in the range 1.00 to
9.99; you can memorize 90 or 900 five-digit logarithms through simple
rote memorization.  If you only memorized 90, you have to interpolate
the logarithm of 2.54: 2.5 is .39794 and 2.6 is .41497, so you want to
add .4 of the difference .01703, which is .00681, giving .40475, which
is off but still correct to four places, so you end up with 2.78031
for the log of the number of square centimeters.  Then you interpolate
back.  With only 90 logs memorized, .78031 is between
log₁₀ 6.0 ≈ 0.77815 and log₁₀ 6.1 ≈ .78533; the difference there is
.00718, of which .00216 is between log₁₀ 6.0 and .78031.  Although you
could try to be more precise, that’s about 2/7, or about 0.3, so it’s
about 6.03, or actually .0603, which is correct to three significant
figures.  If you have 900 logs memorized, you have the more precise
.78047 to work with, and you know it’s between the logs of 6.03
(.78032) and 6.04 (.78104).  Specifically it’s 15 points into a
72-point range, so about 6.032, which is correct.

But, supposing you’re the kind of person who finds that kind of
ability appealing, how can you memorize 900 logarithms?  Through rote
practice using gamification.  First, you memorize a single logarithm,
such as the logarithm of 2 or 5, and practice that until you can type
it in without errors.  That’s level 1.  At level 2, you memorize three
more, say 1.4, 2, 5, and 7, and practice those until you are reliable
at them.  At level 3, you memorize twelve more, covering all nine
nonzero single-digit numbers and six fractions between 1 and 2, until
you’re reliable at those.  At level 4, you memorize another 48,
covering nearly all the even-one-decimal numbers, such as 2.4, 3.2,
4.8, 5.6, and so on.  At level 5, you're up to 256 logarithms, and at
level 6, you have all 900.  At each level, you have less time to
answer when questioned on the ones you supposedly already know.

-->
<!-- XXX how do I center this vertically? -->
<style>
.card { font-size: 566%; text-align: center; height: 100%; }
.card input { font-size: 100% }
.meter { background-color: red; height: 6.25% }
.timeleft { background-color: green; height: 100% }
.n { color: #272; font-size: 141% }
</style>
<div class=card>
   log<sub>10</sub> <span class=n>N</span> = <input id=answer size=5 autofocus>
   <div class=meter><div class=timeleft></div></div>
</div>
<script src="jquery-1.2.6.js"></script>
<script>
// */
$(go)

var n = '2.0'
  , rightAnswer
  , maxTimeLeft = 4
  , failed = false

function go() {
  setInterval(updateTimeLeft, 25)
  $('.n').text(n)
  rightAnswer = format(log10(2), 5)
  startMeter()
}

var endTime = 0

function startMeter() {
  endTime = new Date() / 1000 + maxTimeLeft
  updateTimeLeft()
}

function updateTimeLeft() {
  var timeLeft = endTime - new Date() / 1000
  if (timeLeft < 0) {
    timeLeft = 0
    if (!failed) fail()
  }
  $('.timeleft').css('width', '' + (timeLeft / maxTimeLeft * 100) + '%')
}

function fail() {
  failed = true
  $('#answer').val(rightAnswer).attr('disabled', 1).css('background-color', 'red')
  setTimeout(finishfailing, 750)
}

function finishfailing() {
  $('#answer').attr('disabled', '').css('background-color', '').val('')
  failed = false
  startMeter()
}

function log10(n) {
  return Math.log(n) / Math.log(10)
}

function format(logarithm, places) {
  // Assuming 0 ≤ logarithm < 1.0.
  return ('' + logarithm).substring(1, places+2)
}

// </script>