JavaScript and Frames, Part II (9)

The Code

<HTML>
<HEAD>
<SCRIPT language="JavaScript">
<!--
pictures = new Array("hose.gif", "propellorairplane.gif",
  "motorcycle2034.gif", "thunderbird.gif",
  "jeep.gif", "z.gif", "wagon.gif", "clock.gif",
  "house.gif", "mustang.gif", "bike.gif", "antique.gif",
  "fuse.gif", "gargage.gif", "citroen.gif", "baloon.gif",
  "cabriolet.gif", "tractortrailer.gif", "housefly.gif", "tractor.gif",
  "doubledeckbus.gif", "boat.gif", "officechair.gif", "schoolbus.gif",
  "ferrari.gif", "plumbing.gif", "semitrailer.gif", "radio.gif",
  "unmbrella.gif", "vase.gif", "airplane.gif", "apple.gif"
);
var dim1 = 8;
var dim2 = 8;
var mixIteration = 500;
var source, target;
var rowFound, colFound;
var nowRevealed = false;
var revealedLocation, revealedRow, revealedCol;
var tobeRevealedLocation, tobeRevealedRow, tobeRevealedCol;
var tobeCoveredLocation, tobeCoveredRow, tobeCoveredCol;
var bingos = 0;
var leftBingos = 0;
var rightBingos = 0;
var attempts = 0;
var cover = "doc50x50.gif";
var blank = "blank.gif";
var coverPause = 1000;
var blockClicking = false;
var minPause = 4000;

boardLength = dim1 * dim2;
halfBoardLength = boardLength/2;
assignAr = new Array(boardLength);
var players = 0;
while (players < 1 || players > 2)
  players = prompt("Enter number of players (1 or 2)", 1);
if (players == 2) alert("Rule 1: The player on the left starts.
  Rule 2: The match maker gets to go next");
  // (The above two lines should be joined as one line.
  // They have been split for formatting purposes.)
var nowPlaying = "left";

function fillBoard() {
  for (var i = 0; i < halfBoardLength; i++) {
    assignAr[i] = i;
    assignAr[halfBoardLength + i] = i;
  }
}

function coverBoard() {
  for (var i = 0; i < dim1; i++) {
    for (var j = 0; j < dim2; j++) {
      top.frames[j].frames[i].document.images[0].src = cover;
    }
  }
}

function loadPictures() {
  for (var i = 0; i < dim1; i++) {
    for (var j = 0; j < dim2; j++) {
      var location = i * dim1 + j;
      top.frames[j].frames[i].document.images[0].src =
        pictures[assignAr[location]];
  // (The above two lines should be joined as one line.
  // They have been split for formatting purposes.)
    }
  }
}

function initialize() {
  fillBoard();
  loadPictures()
  setTimeout("coverBoard()", minPause);
  mix();
  revealedNow = "false";
  attempts = 0;
  bingos = 0;
  leftBingos = 0;
  rightBingos = 0;
  nowPlaying = "left";
  if (players == 1) top.status = "You have tried 0 times"
  else top.status =   "Left:0  Right:0";
}

function mix() {
  for (var j = 0; j <= mixIteration; j++) {
    source = Math.round(Math.random() * (boardLength-1));
    target = Math.round(Math.random() * (boardLength-1));
    temp = assignAr[source];
    assignAr[source] = assignAr[target];
    assignAr[target] = temp;
  }
}

function findClickedBox(boxObject) {
  for (var i = 0; i < dim1; i++) {
    for (var j = 0; j < dim2; j++) {
      if (boxObject == top.frames[i].frames[j]) {
        rowFound = j;
        colFound = i;
        if (blockClicking == false)
        if (top.frames[i].frames[j].document.images[0].src.indexOf(blank)
          == -1)
  // (The above two lines should be joined as one line.
  // They have been split for formatting purposes.)
            revealBox(rowFound, colFound);
        return;
      }
    }
  }
}

function revealBox(rowFound, colFound) {
  var newLocation = rowFound * dim1 + colFound;
  tobeRevealedLocation = newLocation;
  tobeRevealedRow = rowFound;
  tobeRevealedCol = colFound;
  revealNow();
  if (nowRevealed == false) {
    nowRevealed = true;
    revealedLocation = newLocation;
    revealedRow = rowFound;
    revealedCol = colFound;
  }
  else {
    if (newLocation == revealedLocation) return;
    blockClicking = true;
    if (assignAr[revealedLocation] == assignAr[newLocation]) {
      setTimeout("removeCards()", coverPause);
      bingos++;
      if (nowPlaying == "left") {
        leftBingos++;
      }
      else {
        rightBingos++;
      }
      if (players == 2) top.status = "Left: " + leftBingos + "
           Right: " + rightBingos;
  // (The above two lines should be joined as one line.
  // They have been split for formatting purposes.)
      if (bingos == halfBoardLength) {
        if (players == 2)
          alert("Congratulations! The " + nowPlaying + " won.
            Left Player: " + leftBingos + " Right Player: " + rightBingos);
  // (The above two lines should be joined as one line.
  // They have been split for formatting purposes.)
        else alert("Congratulations. You made it in " + attempts);
        initialize();
      }
    }
    else {
      attempts++;
      if (players == 1)
        if (attempts == 1) top.status = "You have tried one time"
        else top.status = "You have tried " + attempts + " times";
      setTimeout("coverNow()", coverPause);
    }
  }
}

function revealNow() {
top.frames[tobeRevealedCol].frames[tobeRevealedRow].document.
  images[0].src = pictures[assignAr[tobeRevealedLocation]];
  // (The above two lines should be joined as one line.
  // They have been split for formatting purposes.)
}

function coverNow() { top.frames[tobeRevealedCol].frames
  [tobeRevealedRow].document.images[0].src = cover; top.frames[revealedCol]
  .frames[revealedRow].document.images[0].src = cover;
  // (The above three lines should be joined as one line.
  // They have been split for formatting purposes.)
nowRevealed = false;
blockClicking = false;
if (nowPlaying == "left") nowPlaying = "right"
else nowPlaying = "left";
}

function removeCards() { top.frames[tobeRevealedCol].frames[tobeRevealedRow].
  document.images[0].src = blank; top.frames[revealedCol].frames[revealedRow]
  .document.images[0].src = blank;
  // (The above three lines should be joined as one line.
  // They have been split for formatting purposes.)
nowRevealed = false;
blockClicking = false;
}
onload = initialize;
// -->
</SCRIPT>
<TITLE> memory game board </TITLE>

</HEAD>
<FRAMESET COLS="50, 50, 50, 50, 50, 50, 50, 50" FRAMEBORDER="no"
  FRAMESPACING="1">
  <FRAME SRC="column3.html" NAME="column0" SCROLLING="no"
    MARGINHEIGHT="1" MARGINWIDTH="1">
  <FRAME SRC="column3.html" NAME="column1" SCROLLING="no" MARGINHEIGHT="1"
    MARGINWIDTH="1">
  <FRAME SRC="column3.html" NAME="column2" SCROLLING="no" MARGINHEIGHT="1"
    MARGINWIDTH="1">
  <FRAME SRC="column3.html" NAME="column3" SCROLLING="no" MARGINHEIGHT="1"
    MARGINWIDTH="1">
  <FRAME SRC="column3.html" NAME="column4" SCROLLING="no" MARGINHEIGHT="1"
    MARGINWIDTH="1">
  <FRAME SRC="column3.html" NAME="column5" SCROLLING="no" MARGINHEIGHT="1"
    MARGINWIDTH="1">
  <FRAME SRC="column3.html" NAME="column6" SCROLLING="no" MARGINHEIGHT="1"
    MARGINWIDTH="1">
  <FRAME SRC="column3.html" NAME="column7" SCROLLING="no" MARGINHEIGHT="1"
    MARGINWIDTH="1">
</FRAMESET>
</HTML>