1
0
mirror of https://github.com/taigrr/JSPong synced 2025-01-18 04:33:12 -08:00

Added y-movement, y-bouncing, and preliminary 'AI'

This commit is contained in:
Tai Groot 2016-04-27 14:45:12 -07:00
parent 97191fbc11
commit 7fb064451c
3 changed files with 93 additions and 15 deletions

View File

@ -1,24 +1,30 @@
addShortcut(function(){ addShortcut(function(){
toggleFullScreen(); toggleFullScreen();
},[key.F]); },[key.F]);
addShortcut(function(){ addShortcut(function(){
userDir=-1; userDir=-1;
if(userSpeed<0)
{
userSpeed=0;
}
userTimerCount=0;
userSpeed-=.25;
},[key.UP]); },[key.UP]);
addRemovalShortcut(function(){ addRemovalShortcut(function(){
userDir=0; userDir=0;
userTimerCount+=0.01;
},[key.UP]); },[key.UP]);
addRemovalShortcut(function(){ addRemovalShortcut(function(){
userDir=0; userDir=0;
},[key.DOWN]); },[key.DOWN]);
addShortcut(function(){ addShortcut(function(){
userDir=1; userDir=1;
},[key.DOWN]); if(userSpeed>0)
addRemovalShortcut(function(){ {
console.log(1); userSpeed=0;
},[key.DOWN]); }
addShortcut(function(){ userTimerCount=0;
console.log(2); userSpeed+=.25;
},[key.DOWN]); },[key.DOWN]);

View File

@ -1,4 +1,5 @@
var score=0; var score=0;
var difficulty=1;
var isMute = false; var isMute = false;
//var kingAudio = new Audio('King.mp3'), knockAudio = new Audio('Knock.mp3'), matchAudio = new Audio('match.mp3'); //var kingAudio = new Audio('King.mp3'), knockAudio = new Audio('Knock.mp3'), matchAudio = new Audio('match.mp3');
@ -12,12 +13,27 @@ var userDir=0;
var compDir=0; var compDir=0;
var gameSpeed=2; var gameSpeed=2;
var userSpeed=0;
var compSpeed=0;
var ballSpeed=0;
var userTimerCount=0;
var compTimerCount=0;
var userLoc, compLoc, ballXLoc, ballYLoc; var userLoc, compLoc, ballXLoc, ballYLoc;
var gameLoop var gameLoop;
function newGame() function newGame()
{ {
ballDir=1;
userDir=0;
compDir=0;
gameSpeed=2;
userSpeed=0;
compSpeed=0;
ballSpeed=0;
userTimerCount=0;
compTimerCount=0;
canvas = document.getElementById("myCanvas"); canvas = document.getElementById("myCanvas");
canvas.width=screen.availWidth*.98; canvas.width=screen.availWidth*.98;
canvas.height=screen.availHeight*.899; canvas.height=screen.availHeight*.899;
@ -26,7 +42,7 @@ function newGame()
height = canvas.height; height = canvas.height;
userLoc = height*.45-10; userLoc = height*.45-10;
compLoc = height*.5-10; compLoc = height*.5-10;
ballXLoc = width*.06-10; ballXLoc = width*.45-10;
ballYLoc = height*.5-10; ballYLoc = height*.5-10;
gameOver = false; gameOver = false;
drawBoard(); drawBoard();
@ -38,6 +54,7 @@ function newGame()
// isMute = false; // isMute = false;
// multPossible = false; // multPossible = false;
// gameLoop= setInterval(move,5); // gameLoop= setInterval(move,5);
} }
function toggleFullScreen() function toggleFullScreen()
@ -97,17 +114,54 @@ function drawUser()
function drawComp() function drawComp()
{ {
ctx.fillStyle = "#000000"; ctx.fillStyle = "#000000";
compLoc=compLoc+gameSpeed*difficulty/3*compDir;
if(compLoc>height*.95-175)
{
compLoc=height*.95-175;
}
else if(compLoc<height*.05)
{
compLoc=height*.05;
}
ctx.fillRect((width*.02),compLoc,50,175); ctx.fillRect((width*.02),compLoc,50,175);
} }
function drawBall() function drawBall()
{ {
if(userTimerCount>0.3)
{
userSpeed=0;
}
if(compTimerCount>0.3)
{
compSpeed=0;
}
ctx.fillStyle = "#000000"; ctx.fillStyle = "#000000";
if((ballYLoc-userLoc<=175&&userLoc-ballYLoc<=25&&Math.abs(ballXLoc-(width*.96-10))<3)||(ballYLoc-compLoc<=175&&compLoc-ballYLoc<=25&&Math.abs(ballXLoc-(width*.02+50))<3)) if((ballYLoc-userLoc<=175&&userLoc-ballYLoc<=25&&Math.abs(ballXLoc-(width*.96-10))<3))
{ {
ballDir*=-1; ballDir*=-1;
ballSpeed+=userSpeed;
if(ballSpeed*userSpeed>=0)
{
// ballSpeed*=-1;
}
console.log(ballSpeed);
console.log(ballYLoc+ballSpeed);
} }
else if((ballYLoc-compLoc<=175&&compLoc-ballYLoc<=25&&Math.abs(ballXLoc-(width*.02+50))<3))
{
ballDir*=-1;
ballSpeed+=compSpeed;
console.log(ballSpeed);
}
if(Math.abs(ballYLoc-height*.05)<25||Math.abs(ballYLoc-height*.95)<25)
{
ballSpeed*=-1;
}
ballXLoc=ballXLoc + gameSpeed*ballDir; ballXLoc=ballXLoc + gameSpeed*ballDir;
ballYLoc+=ballSpeed;
ctx.fillRect(ballXLoc,ballYLoc,25,25); ctx.fillRect(ballXLoc,ballYLoc,25,25);
if(ballXLoc>width||ballXLoc<-10) if(ballXLoc>width||ballXLoc<-10)
{ {
@ -122,7 +176,25 @@ function move()
// compDir=0; // compDir=0;
// gameSpeed=5; // gameSpeed=5;
//requestAnimationFrame(move); //requestAnimationFrame(move);
if(ballDir==-1)
{
moveAI();
}
else
{
compDir=0;
}
}
function moveAI()
{
if((ballYLoc>compLoc+175/2)&&(compLoc<height*.95-175))
{
compDir=1;
}
else if((ballYLoc<compLoc+175/2)&&(compLoc>height*.05-175))
{
compDir=-1;
}
} }
function mute() function mute()
{ {

View File

@ -7,7 +7,7 @@
</head> </head>
<link rel="stylesheet" type="text/css" href="gameStyles.css"/> <link rel="stylesheet" type="text/css" href="gameStyles.css"/>
<center> <center>
<canvas id="myCanvas" style="border:3px solid #98999A;"> <canvas id="myCanvas" style="border:3px solid #98999A;" onclick="toggleFullScreen();">
Your browser does not support the HTML5 canvas tag. <br> Your browser does not support the HTML5 canvas tag. <br>
Try using a more modern browser, like <a href="https://www.google.com/chrome/browser/">Google Chrome</a>,to play the game. Try using a more modern browser, like <a href="https://www.google.com/chrome/browser/">Google Chrome</a>,to play the game.
</canvas> </canvas>