JavaScript - Collision Detection In A Game Using Javascript

// awesome goblin game
// assetLoader
  /**
   * Ensure all assets are loaded before using them
   * @param {number} dic  - Dictionary name ('imgs', 'sounds', 'fonts')
   * @param {number} name - Asset name in the dictionary
   */
  function assetLoaded(dic, name) {
    // don't count assets that have already loaded
    if (this[dic][name].status !== 'loading') {
      return;
    }
    this[dic][name].status = 'loaded';
    assetsLoaded++;
    // progress callback
    if (typeof this.progress === 'function') {
      this.progress(assetsLoaded, this.totalAssest);
    }
    // finished callback
    if (assetsLoaded === this.totalAssest && typeof this.finished === 'function') {
      this.finished();
    }
  }
// before assetLoader.finished()
/**
 * Show asset loading progress
 * @param {integer} progress - Number of assets loaded
 * @param {integer} total - Total number of assets
 */
assetLoader.progress = function(progress, total) {
  var pBar = document.getElementById('progress-bar');
  pBar.value = progress / total;
  document.getElementById('p').innerHTML = Math.round(pBar.value * 100) + "%";
}
/**
 * Show the main menu after loading all assets
 */
// Create the canvas
var canvas = document.createElement("canvas");
var ctx = canvas.getContext("2d");
canvas.width = 512;
canvas.height = 480;
document.body.appendChild(canvas);

function mainMenu() {
  $('#progress').hide();
  $('#main').show();
  $('#menu').addClass('main');
}

// Background image
var bgReady = false;
var bgImage = new Image();
bgImage.onload = function () {
	bgReady = true;
};
bgImage.src = "images/background.png";

// Hero image
var heroReady = false;
var heroImage = new Image();
heroImage.onload = function () {
	heroReady = true;
};
heroImage.src = "images/hero_sheet.png";

// Treasure image
var treasureReady = false;
var treasureImage = new Image();
treasureImage.onload = function () {
	treasureReady = true;
};
treasureImage.src = "images/treasure.png";

// Monster image
var monsterReady = false;
var monsterImage = new Image();
monsterImage.onload = function () {
	monsterReady = true;
};
monsterImage.src = "images/monster.png";

// Game objects
var backgrounder = {
	speed: 0,
	x: 0,
	y: 0
};
var hero = {
	speed: 256, // movement in pixels per second
	x: 0,
	y: 0
};
var monster = {
	speed: 256, 
	x: 0,
	y: 0
};
var treasure = {
	x:0,
	y:0
};
var treasureCaught = 0;
var treasureTimer= 0;
var treasureTime= 50;
var monstersCaught = 0;
var delta = 0;
var lives = 3;
var directionMonster = 0;
var directionDuration = 20;



var goThisWay = 1;
// Handle keyboard controls
var keysDown = {};

addEventListener("keydown", function (e) {
	keysDown[e.keyCode] = true;
}, false);

addEventListener("keyup", function (e) {
	delete keysDown[e.keyCode];
}, false);

// Reset the game when the player catches a monster
var reset = function () {
	hero.x = canvas.width / 2;
	hero.y = canvas.height / 2;

	// Throw the monster somewhere on the screen randomly
	monster.x = 32 + (Math.random() * (canvas.width - 64));
	monster.y = 32 + (Math.random() * (canvas.height - 64));
};
//restart the game
var restartGame = function (){
	
//when you die screen turns black
ctx.fillStyle="#000000";//color
ctx.fillRect(32,32,canvas.width-64,canvas.height-64);//draw rectangle with the bushes still in place
//show that you're dead
ctx.fillStyle = "rgb(250, 250, 250)";
ctx.textAlign = "center";
ctx.fillText("GameOver Press R to reset",canvas.width/2, canvas.height/2);
//R to reset pressed	
if (82 in keysDown){
	//reset assets
	lives = 3;
	treasureCaught = 0;
}	
	
};
// Update game objects
var update = function (modifier) {
	if (38 in keysDown) { // Player holding up
		
		//check if hero walks from screen
		if (hero.y <= 32){
			//if hero walks from screen top, stay at exact y axle
			hero.y = hero.y;
		} 
		else{
			//move hero up
		hero.y -= hero.speed * modifier;
		}
		// end of upmovement
	}
	if (40 in keysDown) { // Player holding down
		//check if hero walks from screen
		if (hero.y >= canvas.height -64){
			//if hero walks from screen bottom, stay at exact y axle
			hero.y = hero.y;
		} 
		else{
			//move hero down
		hero.y += hero.speed * modifier;
		}// end of downmovement
	}
	
	if (37 in keysDown) { // Player holding left
		//check if hero walks from screen
		if (hero.x <= 32){
			//if hero walks from screen left, stay at exact x axle
		hero.x = hero.x;
			
		}
		else{
			//move hero left
		hero.x -= hero.speed * modifier;
		}//end of left movement
	}
	if (39 in keysDown) { // Player holding right
		//check if hero walks from screen
		if (hero.x >= canvas.width -64){
			//if hero walks from screen right, stay at exact x axle
			hero.x=hero.x;
		}
		else{
			//move hero right
		hero.x += hero.speed * modifier;
		}//end of right movement
	}

	// Are they touching? MONSTER
	if (
		hero.x <= (monster.x + 32)
		&& monster.x <= (hero.x + 32)
		&& hero.y <= (monster.y + 32)
		&& monster.y <= (hero.y + 32)
	) {
		--lives;
		reset();
	}
	// Are they touching? TREASURE
	if (
		hero.x <= (treasure.x + 32)
		&& treasure.x <= (hero.x + 32)
		&& hero.y <= (treasure.y + 32)
		&& treasure.y <= (hero.y + 32)
	) {
		treasureTimer = treasureTime;
		++treasureCaught;

	}
};
//make our monster move :)
var monsterMove = function (modifier){
	
	
	
	++directionMonster;
	
	if (directionMonster <= directionDuration){
		//bewegingen
		//rechts => links
	if (goThisWay == 1)	{
		monster.x = monster.x - (monster.speed * modifier);
	if (monster.x <= 32){
		goThisWay = 2;
	}
	}
	//links => rechts
	if (goThisWay == 2)	{
		monster.x = monster.x + (monster.speed * modifier);
	if (monster.x >= canvas.width-64){
		goThisWay=1;
	}
	}
	//boven => onderen
	if (goThisWay == 3)	{
		monster.y = monster.y + (monster.speed * modifier);
	if (monster.y >= canvas.height-64){
		goThisWay=4;

	}
	}
	//onderen => boven
	if (goThisWay == 4)	{
		monster.y = monster.y - (monster.speed * modifier);
	if (monster.y <= 32){
		goThisWay=3;

	}
	}		
	//bepalen welke richting
	if (directionMonster ==directionDuration){
		directionMonster = 0;
		goThisWay = Math.floor((Math.random() * 4) + 1);
		//console.log (goThisWay);
	}	
	}
	};
// Draw everything
var render = function () {
	if (bgReady) {
	 //backgrounder.x = backgrounder.x +1;	
	backgrounder.x = 0;
		ctx.drawImage(bgImage, backgrounder.x, 0);
	}
	

	if (heroReady) {
		ctx.drawImage(heroImage, hero.x, hero.y);
	}

	if (monsterReady) {
		ctx.drawImage(monsterImage, monster.x, monster.y);
	}
if (treasureReady) {
		ctx.drawImage(treasureImage, treasure.x, treasure.y);
	}
	// Score
	ctx.fillStyle = "rgb(250, 250, 250)";
	ctx.font = "24px Helvetica";
	ctx.textAlign = "left";
	ctx.textBaseline = "top";
	ctx.fillText("Treasure caught: " + treasureCaught, 32, canvas.height-64);
	ctx.fillText("Lives: " + lives, 32, 32);
};
var spawnTreasure = function(){
	
	if (treasureTimer >= treasureTime){
treasure.x = 32 + (Math.random() * (canvas.width - 64));
	treasure.y = 32 + (Math.random() * (canvas.height - 64));
	treasureTimer = 0;
	
	}
	
	++treasureTimer;
};
// The main game loop
var main = function () {
	var now = Date.now();
	delta = now - then;

if (lives > 0){
	update(delta / 1000);		
		render();
monsterMove(delta / 1000);
spawnTreasure();
} 
else {
	restartGame();
}
	then = now;
	

	// Request to do this again ASAP
	requestAnimationFrame(main);
};

// Cross-browser support for requestAnimationFrame
var w = window;
requestAnimationFrame = w.requestAnimationFrame || w.webkitRequestAnimationFrame || w.msRequestAnimationFrame || w.mozRequestAnimationFrame;

// Let's play this game!
var then = Date.now();
reset();
main();

function guessing()
{
	words = "album";
	guess = document.getElementById("txt1").value;
	answer = document.getElementById("result").value = parseInt();
		alert("You have " + answer + " matches");
		
	used = false;
	for(i = 0; i<=guess.length; i++)
	{
		for(j = 0; j<=answer.length; j++)
		if(!used[j] && guess[i] == words)
		{
			alert("Congradulations! You got it!");
			used[j] = true;
			count++;
			break;
		}
		
		else
		{
				count = 5;
				while(count > 5)
				{
					alert("Sorry, that's game over!");
					count++;
				}
		}
		
	}
}

<html>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
var deck=new Array; var hand=new Array(53); var hcrd=new Array(53); var hsut=new Array(53);
var isPlaying=-1; var betn=1; var dpos=0; var crdts; var ncard=0;
/* ----------------------------------------------------------------------------------------- */
function initdeck(){
crd=0;
for(i=0;i<4;i++){
if(i==0){st="club";} else if(i==1){st="heart";} else if(i==2){st="diamond";}else{st="spade";}
for(c=1;c<14;c++){
if(c==1){num="ace";}else if(c==11){num="jack";}
else if(c==12){num="queen";}else if(c==13){num="king";}else{num=c;}
deck[crd++]=st+"|"+num;
} //for c
} //for i
}

/* ----------------------------------------------------------------------------------------- */
function showcard(cnum)
{
p = hand[cnum].indexOf("|");
s = hand[cnum].substring(0,p);
c = hand[cnum].substring(p+1,hand[cnum].length);
if(cnum==0){document.images.card1.src="cards/"+s+c+".jpg";}
else if(cnum==1){document.images.card2.src="cards/"+s+c+".jpg";}
else if(cnum==2){document.images.card3.src="cards/"+s+c+".jpg";}
else if(cnum==3){document.images.card4.src="cards/"+s+c+".jpg";}
else{document.images.card11.src="cards/"+s+c+".jpg";}
}
function hit(ncard)
{
p = hand[ncard].indexOf("|");
s = hand[ncard].substring(0,p);
c = hand[ncard].substring(p+1,hand[ncard].length);
if(ncard==4){document.images.card5.src="cards/"+s+c+".jpg";}
else if(ncard==5){document.images.card6.src="cards/"+s+c+".jpg";}
else if(ncard==6){document.images.card7.src="cards/"+s+c+".jpg";}
}
function stand()
{
document.images.card8.src="cards/"+s+c+".jpg";
}

function deal()
{
if(isPlaying < 0)
{ // new game
dpos = 0; isPlaying=1;
for(i=0;i<500;i++)
{ //shuffle the cards(mix up the deck)
tmp = Math.round(Math.random()*51); tmp2= Math.round(Math.random()*51);
stmp = deck[tmp]; deck[tmp] = deck[tmp2]; deck[tmp2] = stmp;
}
for(i=0;i<53;i++)
{
hand[i]=deck[dpos++];showcard(i);
hand[i]=deck[dpos++];hit(i);
}
} 
}
function quit(){window.close();}
/* ----------------------------------------------------------------------------------------- */
initdeck();

// End -->
</script>
</HEAD>
<BODY>
<table>
<tr><form name="drwcrd">
<td width=590></td>
<td><b>Computer</b></td>
</tr><tr></form> 
<table>
<tr><form name="drwcrd">
<td width=500></td>
<td width=30 align=center><img name="card1" src="cards/cardback.jpg"></td>
<td width=30 align=center><img name="card3" src="cards/cardback.jpg"></td>
<td width=30 align=center><img name="card8" src=""></td>
<td width=30 align=center><img name="card9" src=""></td>
<td width=30 align=center><img name="card10" src=""></td>
<table>
<tr><form name="drwcrd">
<td width=590></td>
<td><b>Player</b></td>
</tr><tr></form> 
<table>
<tr><form name="drwcrd">
<td width=500></td>
<td width=30 align=center><img name="card2" src="cards/cardback.jpg"</td>
<td width=30 align=center><img name="card4" src="cards/cardback.jpg"</td>
<td width=30 align=center><img name="card5" src=""</td>
<td width=30 align=center><img name="card6" src=""</td>
<td width=30 align=center><img name="card7" src=""</td>
</tr><tr></form>
<table>
<tr><td><input type="button" value ="DEAL Cards" onClick="javascript:deal();"></td>
<td><input type="button" value ="Hit" onClick="javascript:hit();"></td>
<td><input type="button" value ="Stand" onClick="javascript:stand();"></td>
</body>
</html>

<html>

<head>

<title>
Blackjack </title>

<script LANGUAGE="JavaScript1.1">


var dealer_hand = new Array();

var player_hand = new Array();

var game_over = false;


function Card(num,suit) {

   this.num = num;

   this.suit = suit;

   this.fname = fname;

}

function fname() {

   return this.num + this.suit + ".gif";

}



function Deck() {

   this.cards = new Array(52);

   this.next_card = 0;

   // fill the deck (in order, for now)

   for (i=1; i<14; i++) {

     this.cards[i-1] = new Card(i,"c");

     this.cards[i+12] = new Card(i,"h");

     this.cards[i+25] = new Card(i,"s");

     this.cards[i+38] = new Card(i,"d");

   }

   this.shuffle = shuffle;

   this.dealCard = dealCard;

}

function shuffle() {

   for (i=1; i<1000; i++) {

      // switch two randomly selected cards

      card1 = Math.floor( 52*Math.random() );

      card2 = Math.floor( 52*Math.random() );

      temp = this.cards[card2];

      this.cards[card2] = this.cards[card1];

      this.cards[card1] = temp;

   }

   this.next_card = 0;

}

function dealCard() {

   return this.cards[ this.next_card++ ];

}


var deck = new Deck();

deck.shuffle();


function newGame() {


   if ( deck.next_card > 39 ) {  

      deck.shuffle();            

   }

   dealer_hand = new Array();

   player_hand = new Array();
   
   dealer_hand[ 0 ] = deck.dealCard();   // This is the hole card.

   document.images[0].src = "http://www.litchzen.com/cardback.PNG"; // The hole card is not shown

   dealer_hand[ 1 ] = deck.dealCard();

   document.images[ 1 ].src = dealer_hand[ 1 ].fname();

   for ( i=2; i<6; i++) {

      document.images[i].src = "http://www.litchzen.com/cardback.PNG";

   }
    num = i + 1;     

   player_hand[ 0 ] = deck.dealCard();

   document.images[ 6 ].src = player_hand[ 0 ].fname();

   player_hand[ 1 ] = deck.dealCard();

   document.images[ 7 ].src = player_hand[ 1 ].fname();

   for (i=8; i<12; i++) {

      document.images[i].src = "http://www.litchzen.com/cardback.PNG";

   }


   window.status = "";

   document.form1.dealer.value = "";

   document.form1.result.value = "";

   document.form1.player.value = score( player_hand );

   game_over = false;


} // end function newGame()


function hit() {

   var total = 0;

   var new_card = 0;  // index for the new card position

   if ( game_over ) {

      window.status = "Game over.  Click the Deal button to start a new hand."

   } else {

      new_card = player_hand.length;

      player_hand[ new_card ] = deck.dealCard();

      document.images[ new_card + 6 ].src = player_hand[ new_card ].fname();

      total = score( player_hand );

      if ( total > 21 ) {  // Busted, game over.

         document.form1.player.value = total + "  busted";

         document.images[ 0 ].src = dealer_hand[ 0 ].fname(); 

         document.form1.dealer.value = score( dealer_hand );

         winner();

         game_over = true;

      } else {

         document.form1.player.value = total;

      }

   }

} // end function hit()


function stand() {

   var total = 0;

   var new_card = 0;  

   if ( game_over ) {

      window.status = "Game over.  Click the Deal button to start a new hand."

   } else {

      document.images[ 0 ].src = dealer_hand[ 0 ].fname(); 

      while ( score( dealer_hand ) < 17 ) {  

         new_card = dealer_hand.length;

         dealer_hand[ new_card ] = deck.dealCard();

         document.images[ new_card ].src = dealer_hand[ new_card ].fname();

      }


      total = score( dealer_hand );

      if ( total > 21 ) {  // Busted

         document.form1.dealer.value = total + "  busted";

      } else {

         document.form1.dealer.value = total;

      }



   }

   winner();

   game_over = true; // The game ends after the player stands.



} // end function stand()


function score(hand) {

   var total = 0;

   var soft = 0; // This variable counts the number of aces in the hand.

   var pips = 0; // The trump pictures on a card used to be called pips.

   for ( i=0; i<hand.length; i++ ) {

      pips = hand[i].num;

      if ( pips == 1 ) { 

         soft = soft + 1;

         total = total + 11;

      } else {

         if ( pips == 11 || pips == 12 || pips == 13 ) {

            total = total + 10;

         } else {

            total = total + pips;

         }

      }

   }

   while ( soft > 0 && total > 21 ) {  // Count the aces as 1 instead

      total = total - 10;              // of 11 if the total is over 21

      soft = soft - 1;

   }   

   return total;

}  // end function score


function winner() {

   var player_total = score( player_hand );

   var dealer_total = score( dealer_hand );

   if ( player_total > 21 ) {  // Busted

      document.form1.result.value = "Dealer wins";

   } else {

      if ( dealer_total > 21 ) { // Busted

         document.form1.result.value = "Player wins";

      } else {

         if ( player_total  == dealer_total ) {

            document.form1.result.value = "Tie game";

         } else {

            if ( player_total  > dealer_total ) {

               document.form1.result.value = "Player wins";

            } else {

               document.form1.result.value = "Dealer wins";

            }

         }

      }

   }

}


</script>



</head>



<body>

<h1>Blackjack Javascript Example</h1>

<hr>

<form NAME="form1">

<table>

<tr>

  <td> <B>Dealer: </B>

  <td> <img border=0 src="http://www.litchzen.com/cardback.PNG" height=125 width=95>

  <td> <img border=0 src="http://www.litchzen.com/cardback.PNG" height=125 width=95>

  <td> <img border=0 src="http://www.litchzen.com/cardback.PNG" height=125 width=95>

  <td> <img border=0 src="http://www.litchzen.com/cardback.PNG" height=125 width=95>

  <td> <img border=0 src="http://www.litchzen.com/cardback.PNG" height=125 width=95>

  <td> <img border=0 src="http://www.litchzen.com/cardback.PNG" height=125 width=95>

  <td> </td>

</tr>

<tr>

  <td> <B>Player: <B>

  <td> <img border=0 src="http://www.litchzen.com/cardback.PNG" height=125 width=95>

  <td> <img border=0 src="http://www.litchzen.com/cardback.PNG" height=125 width=95>

  <td> <img border=0 src="http://www.litchzen.com/cardback.PNG" height=125 width=95>

  <td> <img border=0 src="http://www.litchzen.com/cardback.PNG" height=125 width=95>

  <td> <img border=0 src="http://www.litchzen.com/cardback.PNG" height=125 width=95>

  <td> <img border=0 src="http://www.litchzen.com/cardback.PNG" height=125 width=95>

</tr>

<tr>

  <td> <B>Dealer Sco </B><BR>

       <input TYPE="TEXT" SIZE=12 NAME="Dealer" VALUE="0"></td>

  <td> <B>Player Sco </B><BR>

       <input TYPE="TEXT" SIZE=12 NAME="You" VALUE="0">

  <td> <input TYPE="BUTTON" VALUE="      Stay      " onClick="stand();">

  <td> <input TYPE="BUTTON" VALUE="         Hit         " onClick="hit();">

  <td> <a href="#" onClick="newGame();"

        onMouseOver = "window.status = 'Deal a new hand.'; return true; "

        onMouseOut = "window.status = '';">

       <img border=0 src="http://us.cdn3.123rf.com/168nwm/fuzzbones/fuzzbones1105/fuzzbones110500782/9628185-deal-word-in-male-hand.jpg" height=50 width=106></a>

  <td> <B>Game Result:</B><BR>

       <input TYPE="TEXT" SIZE=10 NAME="result" VALUE=""</td>

</tr>

</table>

</form>

<P>Click the Deal button to start a new game.<BR>

Click the Hit button to get another card.<BR>

Click the Stay button to end your turn.
Try and get as close to 21 as possible to win. Good luck!</P>


</body>

</html>

<SCRIPT LANGUAGE="JavaScript">
<!-- Original:  Brian Gosselin (bgaudiodr@aol.com) -->
<!-- Web Site:  http://www.bgaudiodr.iwarp.com -->

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://www.javascriptsource.com -->


<!-- Begin
var image_directory = "http://www.your-web-site-address-here.com/simon-says-pics/";
var ok = false; 
var pcbusy = false; 
var userturn = true;
var butdown = false;
var stage = 1;
var cnt = 1;
var pcclicks = new Array();
var userclicks = new Array();
var pos;
var tst = true;
var msg = "Click Go!";
btn1 = new Image();
btn1.src = image_directory + "purple.gif";
btn2 = new Image();
btn2.src = image_directory + "yellow.gif";
function updown(isdn) {
if (isdn) {
document.f[('pl'+pos)].src = image_directory + 'yellow.gif';
}
else {
document.f[('pl'+pos)].src= image_directory + 'purple.gif';
   }
}
function getPattern() {
  if(stage=1)
    return new Array(1);
  if(stage=2)
   return new Array(1,2);
  if(stage=3)
   return new Array(1,2,3);
  if(stage=4)
   return new Array(1,2,3,4);
  if(stage=5)
   return new Array(1,2,3,4,5);
  if(stage=6)
   return new Array(1,2,3,4,5,6);
  else
    return new Array(1,2,3,4,5,6,7);
}
function dopc() {
document.f.st.value = stage;
if (cnt <= stage) {
pcbusy = true;
userturn = false;
document.f.s.value = getPattern()[0];
pos=getPattern()[cnt - 1];
setTimeout("updown(true)",500);
setTimeout("updown(false) ; pcclicks[cnt]=pos; cnt++; dopc()",1200);
}
else {
userclicks = new Array();
cnt = 1;
document.f.s.value = "Player's  Turn";
pcbusy = false;
userturn = true;
document.f.b.focus();
   }
}
function testclicks() {
tst = true;
for(i = 1;cnt > i; i++) {
if (pcclicks[i] == userclicks[i]) {
tst = true && tst;
}
else {
tst = false && tst;
   }
}
if(tst) {
setTimeout("stage++ ; document.f.st.value=stage ; alert('That is correct!  Advancing to the next level....'); document.f.s.value=msg ; document.f.b.focus()",300);
}
else {
setTimeout("stage=1 ; cnt=1 ; pcclicks=new Array() ; document.f.st.value=stage ; alert('Sorry, that is not correct.  Start a new game if you would like to play again.') ; document.f.s.value=msg",300);
}
cnt = 1;
}
function testclk(downflag, pos) {
if (userturn&&(!pcbusy)) {
if (downflag) {
document.f[('pl'+pos)].src = image_directory + 'yellow.gif';
}else{
document.f[('pl'+pos)].src = image_directory + 'purple.gif';
}
if (ok && !downflag) {
userclicks[cnt] = pos;
cnt++;
if (pcclicks.length == userclicks.length) {
testclicks();
         }
      }
   }
}
//  End -->
</script>
</HEAD>

<!-- STEP TWO: Copy this code into the BODY of your HTML document  -->


<BODY>

<embed src="G#.wav" autostart="false" hidden="true" name="sound1" enablejavascript="true">	

<!-- <a href="#" onclick="playSound('G#.wav');"></a> !-->

<img src="piano.png" />

<center>
<form name="f">
<table cellspacing="20" cols="8" width="600">
<tr height="60">
<td align="center" width="20%"><img src="purple.gif" onclick="playsound('G#.wav')"; name="1" onMousedown="testclk(true,1)" onMouseup="testclk(false,1)"></td>
<td align="center" width="20%"><img src="purple.gif" name="2" onMousedown="testclk(true,2)" onMouseup="testclk(false,2)"></td>
<td align="center" width="20%"><img src="purple.gif" name="3" onMousedown="testclk(true,3)" onMouseup="testclk(false,3)"></td>
<td align="center" width="20%"><img src="purple.gif" name="4" onMousedown="testclk(true,4)" onMouseup="testclk(false,4)"></td>
<td align="center" width="20%"><img src="purple.gif" name="5" onMousedown="testclk(true,5)" onMouseup="testclk(false,5)"></td>
<td align="center" width="20%"><img src="purple.gif" name="6" onMousedown="testclk(true,6)" onMouseup="testclk(false,6)"></td>
<td align="center" width="20%"><img src="purple.gif" name="7" onMousedown="testclk(true,7)" onMouseup="testclk(false,7)"></td>
<td align="center" width="20%"><img src="purple.gif" name="8" onMousedown="testclk(true,8)" onMouseup="testclk(false,8)"></td>

</tr>
<tr height = 60>
<td width="20%" align="center"><font size="3">Level<br></font><input type="text" size="2" value="1" name="st" readonly></td>
<td align="center" colspan="3"><input type="text"  name="s" value="Click 'Go!' to start" readonly></td>
<td align="center"><input type="button" value="    Go!    " name="b" onClick="ok=true ; if(!pcbusy) dopc()"></td>
</tr>
</table>
</form>
</center>

<p><center>
<font face="arial, helvetica" size="-2">Free JavaScripts provided<br/>
by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
</center><p>

<!-- Script Size:  4.21 KB -->