|
This is the Pong game, made by Joe Nasbella.
<HTML>
<TITLE>JinrohScript Pong</TITLE>
<HEAD>
<STYLE>
#ball
{
position: absolute;
left: 32px;
top: 32px;
}
#playingField
{
position: absolute;
left: 100px;
top: 10px;
width: 400px;
height: 200px;
line-height:1px;
background:white;
border:1px solid black;
}
#paddleLeft
{
position: absolute;
left: 102px;
top: 100px;
width: 10px;
height: 50px;
line-height:1px;
background:cyan;
border:1px solid black;
}
#paddleRight
{
position: absolute;
left: 488px;
top: 100px;
width: 10px;
height: 50px;
line-height:1px;
background:green;
border:1px solid black;
}
</STYLE>
<SCRIPT language="JavaScript">
<!--hide
/*Are you using Internet Explorer?*/
var usingIE = document.all?true:false
/*If You Are Not, setup The Document Capture Jaunts*/
if (!usingIE)
document.captureEvents(Event.MOUSEMOVE)
/*Name: PD.html
Date: 3/18/11
By: Joe Nesbella - Shared By: Java Games
Desc: Pong
*/
/*Court Attributes*/
var courtLeft = 100;
var courtRight = 500;
var courtTop = 10;
var courtBot = 210;
/*Ball Attributes*/
var ballX = (courtLeft + courtRight) / 2;
var ballY = (courtTop + courtBot) / 2;
var ballDirX = 1;
var ballDirY = 1;
/*Paddle Left's Attributes*/
var p1Left = 102;
var p1Right = 115;
var p1Top = 100;
var p1Bot = 150;
/*Paddle Right's Attributes*/
var p2Left = 488;
var p2Right = 495;
var p2Top = 100;
var p2Bot = 150;
var predictedHeight = 110;
var avgDivide = 0;
/*Scoring Variables*/
var pcScore = 0;
var humanScore = 0;
var gameOn = 0;
function moveBall()
{
/*Handle Court Collisions*/
if(ballX + ballDirX < (courtRight - 8) && ballX + ballDirX > courtLeft)
{
ballX += ballDirX;
}else{
if(ballDirX > 0)
{
/*Increase Human Player's Score and Reset Ball*/
if(humanScore < 10)
humanScore += 1;
else
gameOn = 1;
/*Take A Running Total Of Where the Ball Is When AI Gets Scored On So It Can 'Predict' where the ball will be.*/
if(avgDivide < 3)
{
predictedHeight += ballY;
avgDivide += 1;
}else{
predictedHeight = ballY;
avgDivide = 0;
}
ballX = (courtLeft + courtRight) / 2;
ballY = (courtTop + courtBot) / 2;
ballDirX = -1;
ballDirY = 1;
}else{
/*Increase Computer Player's Score and Reset Ball*/
if(pcScore < 10)
pcScore += 1;
else
gameOn = 1;
ballX = (courtLeft + courtRight) / 2;
ballY = (courtTop + courtBot) / 2;
ballDirX = 1;
ballDirY = 1;
}
ballDirX *= -1;
}
if(ballY + ballDirY < (courtBot - 8) && ballY + ballDirY > courtTop)
ballY += ballDirY;
else
ballDirY *= -1;
/*Handle Paddle Collision*/
if(ballY > p1Top && ballY < p1Bot && ballX < p1Right)
{
ballDirX *= -1;
if(ballDirX < 0)
if(ballDirX > -5)
ballDirX -= 1;
else
if(ballDirX < 5)
ballDirX += 1;
}
if(ballY > p2Top && ballY < p2Bot && ballX + 8 > p2Left)
{
ballDirX *= -1;
if(ballDirX < 0)
if(ballDirX > -5)
ballDirX -= 1;
else
if(ballDirX < 5)
ballDirX += 1;
}
if(ballX >= p1Left && ballX <= p1Right && ballY <= p1Bot && ballDirY < -0 && ballDirX < 0 ||
ballX >= p1Left && ballX <= p1Right && ballY >= p1Top && ballDirY > 0 && ballDirX > 0)
{
ballDirY *= -1;
if(ballDirY < 0)
if(ballDirY > -5)
ballDirY -= 1;
else
if(ballDirY < 5)
ballDirY += 1;
}
if(ballX >= p2Left && ballX <= p2Right && ballY <= p2Bot && ballDirY < 0 && ballDirX < 0 ||
ballX >= p2Left && ballX <= p2Right && ballY >= p2Top && ballDirY > 0 && ballDirX > 0)
{
ballDirY *= -1;
if(ballDirY < 0)
if(ballDirY > -5)
ballDirY -= 1;
else
if(ballDirY < 5)
ballDirY += 1;
}
/*Really Simple Paddle AI*/
if(ballDirX > 0 && ballX > 200)
{
if(ballY < p2Top + 25)
{
if(p2Top - 3 > courtTop)
{
p2Top -= 3;
p2Bot -= 3;
}
}
if(ballY > p2Bot - 25)
{
if(p2Bot + 3 < courtBot)
{
p2Top += 3;
p2Bot += 3;
}
}
}
/*Recenter the Paddle when the Ball is Going Away To Make AI Look Smart ^_^*/
if(ballDirX < 0)
{
var centerHeight = 0;
if(avgDivide > 0)
centerHeight = predictedHeight / avgDivide;
else
centerHeight = predictedHeight;
if(p2Top + 25 < centerHeight)
{
p2Top += 1;
p2Bot += 1;
}else if(p2Bot - 25 > centerHeight){
p2Top -= 1;
p2Bot -= 1;
}
}
/*Write Debug Data*/
document.getElementById('txtBox').value = ballX + 'px';
document.getElementById('txtBoxY').value = ballY + 'px';
document.getElementById('txtBoxXDir').value = ballDirX + 'px';
document.getElementById('txtBoxYDir').value = ballDirY + 'px';
document.getElementById('txtBoxHScore').value = humanScore;
document.getElementById('txtBoxCScore').value = pcScore;
/*Animate Things*/
ball.style.left = ballX + 'px';
ball.style.top = ballY + 'px';
paddleLeft.style.top = p1Top + 'px';
paddleRight.style.top = p2Top + 'px';
/*Recursively Call This!*/
if(gameOn == 0)
setTimeout(moveBall, 0);
else
alert("Game Over. Refresh Browser To Play Again.");
}
function movePaddle(e)
{
if(usingIE)
{
p1Top = event.clientY + document.body.scrollTop;
p1Bot = p1Top + 50;
}else{
var tempMouseY = e.pageY;
if(tempMouseY < 0)
tempMouseY = 0;
p1Top = tempMouseY;
p1Bot = p1Top + 50;
}
if(p1Top < courtTop)
p1Top = courtTop;
if(p1Bot > courtBot)
p1Top = courtBot - 50;
}
window.onload = moveBall;
document.onmousemove = movePaddle;
//-->
</SCRIPT>
</HEAD>
<BODY bgcolor = "Blue">
<DIV ID="playingField" alt="playingField"></DIV>
<DIV ID="paddleLeft" alt="paddleLeft"></DIV>
<DIV ID="paddleRight" alt="paddleRight"></DIV>
<img id="ball" alt="ball" src="ball.png">
<br>
<FONT COLOR="WHITE" FACE="SYSTEM">
Ball's X
<br>
<input id = "txtBox" type = "text" size = "10" readonly = "true">
<br>
Ball's Y
<br>
<input id = "txtBoxY" type = "text" size = "10" readonly = "true">
<br>
Ball's X Dir
<br>
<input id = "txtBoxXDir" type = "text" size = "10" readonly = "true">
<br>
Ball's Y Dir
<br>
<input id = "txtBoxYDir" type = "text" size = "10" readonly = "true">
<br>
Human Score
<br>
<input id = "txtBoxHScore" type = "text" size = "10" readonly = "true">
<br>
Computer Score
<br>
<input id = "txtBoxCScore" type = "text" size = "10" readonly = "true">
</FONT>
</BODY>
</HTML>
18-03-2011, 21:46
Geschreven door Java Games
|
