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:
parent
97191fbc11
commit
7fb064451c
26
custom.js
26
custom.js
@ -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]);
|
||||||
|
|
||||||
|
|
||||||
|
@ -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()
|
||||||
{
|
{
|
||||||
|
@ -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>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user