<!-- TODO FIXME: javascript

<script language="JavaScript">
  N = navigator.appName.indexOf('Netscape') != -1
  M = navigator.appName.indexOf('Microsoft') != -1

  Vis = new Array()
  Vis[0] = M ? 'hidden' : 'hide'
  Vis[1] = M ? 'visible' : 'show'

  function GetDiv(divId, divY, divX, divW, divH, bCol, visb, zInd) {
    bkCol = bCol != '' ? (N ? ' bgColor=' + bCol : ';background:' + bCol) : ''

    DivTyp = M ? '<DIV' : '<LAYER'
    if (M) {
      Styl =
        ' ID=' +
        divId +
        " style='position:absolute;top:" +
        divY +
        ';left:' +
        divX +
        ';width:' +
        divW +
        ';height:' +
        divH +
        bkCol +
        ';visibility:' +
        Vis[visb] +
        ';z-index:' +
        zInd +
        "'>"
    }
    if (N) {
      Styl =
        ' ID=' +
        divId +
        ' top=' +
        divY +
        ' left=' +
        divX +
        ' width=' +
        divW +
        ' height=' +
        divH +
        bkCol +
        ' visibility=' +
        Vis[visb] +
        ' z-index=' +
        zInd +
        '>'
    }
    document.writeln(DivTyp + Styl)
  }
  function EndDiv() {
    M ? document.writeln('</DIV>') : document.writeln('</LAYER>')
  }
</script>

<script language="JavaScript">
  corr = new Array()
  gnum = 0
  score = 0
  ind = 0
  for (rows = 0; rows < 4; rows++) {
    for (cols = 0; cols < 5; cols++) {
      ind++
      corr[ind] = 0
      eval(
        "GetDiv('d" +
          ind +
          "'," +
          rows * 38 +
          ',' +
          cols * 38 +
          ",38,38,'',1,0)"
      )
      document.write('<img src=Pop', ind, '.gif width=38 height=38 border=0>')
      EndDiv()
      eval(
        "GetDiv('dvTop" +
          ind +
          "'," +
          rows * 38 +
          ',' +
          cols * 38 +
          ",38,38,'',0,1)"
      )
      document.write(
        "<a href='javascript:TestMe(",
        ind,
        ")'><img name = Pix",
        ind,
        ' src=Pop-Cover.gif width=38 height=38 border=1></a>'
      )
      EndDiv()
    }
  }
  GetDiv('Card1', 205, 10, 170, 15, 'silver', 1, 0)
  document.write(
    "<p align=center><font face=Arial color=#FF0000 size=2>Study the above then <a href='javascript:StartTest()'>Click</a>.</center>"
  )
  EndDiv()
  GetDiv('Card2', 205, 0, 200, 15, 'silver', 0, 1)
  document.write('<p align=center>Uncover the matching component')
  EndDiv()
  GetDiv('TestPix', 160, 70, 38, 38, '', 1, 1)
  document.write('<img src=Pop-Cover.gif name=Try width=38 height=38')
  EndDiv()
  function StartTest() {
    if (M) {
      eval("document.all.Card2.style.visibility = 'visible'")
    }
    if (N) {
      eval("document.layers.Card2.visibility = 'show'")
    }
    for (x = 1; x < 21; x++) {
      if (corr[x] == 0) {
        if (M) {
          eval('document.all.dvTop' + x + ".style.visibility = 'visible'")
        }
        if (N) {
          eval('document.layers.dvTop' + x + ".visibility = 'show'")
        }
      }
    }
    PickRandom()
    document.Try.src = 'Pop' + picked + '.gif'
  }
  function PickRandom() {
    chk = 0
    while (chk == 0) {
      picked = 1 + Math.floor(20 * Math.random())
      if (corr[picked] == 0) {
        chk = 1
        break
      }
    }
  }
  function TestMe(x) {
    gnum++
    if (x == picked) {
      score++
      corr[x] = 1
    }
    if (M) {
      eval('document.all.dvTop' + x + ".style.visibility = 'hidden'")
    }
    if (N) {
      eval('document.layers.dvTop' + x + ".visibility = 'hide'")
    }
    if (gnum > 19) {
      alert('Test over! Score = ' + score)
      for (x = 1; x < 21; x++) {
        corr[x] = 0
      }
      if (score == 20) alert('All correct!')
      gnum = 0
      score = 0
    }
    setTimeout('StartTest()', 1000)
  }
</script>