42/42_INT_14_transcendence
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

basic ball bounce

Browse Source 
+ minors changes
This commit is contained in:
LuckyLaszlo
2022-10-16 01:51:13 +02:00
parent 0a7fb20857
commit 0f98e3328e
1 changed files with 60 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

100
pong.html
View File

@@ -26,7 +26,8 @@ canvas {
var gridDisplay = true;
function startGame() {
function startGame()
{
myGameArea.createGameArea();
// Const
@@ -49,11 +50,13 @@ function startGame() {
player1.speed = playerSpeed;
player2.speed = playerSpeed;
ball.speed = ballSpeed;
ball.dirX = -0.5;
ball.dirY = +0.5;
score1 = new score(score_size+"px", "Consolas", "white", w_mid-w/8, w/12);
score2 = new score(score_size+"px", "Consolas", "white", w_mid+w/8-score_size/2, w/12);
wall_top = new component(w, wall_size, "white", 0, 0);
wall_bottom = new component(w, wall_size, "white", 0, h-wall_size);
wall_top = new component(w, wall_size, "grey", 0, 0);
wall_bottom = new component(w, wall_size, "grey", 0, h-wall_size);
// Grid
w_grid_mid = new component(w, 1, "darkgreen", 0, h_mid);
@@ -87,11 +90,13 @@ var myGameArea = {
{ myGameArea.deleteKey(e.key); })
},
addKey : function(key) {
key = key.toLowerCase();
var i = myGameArea.keys.indexOf(key);
if (i == -1)
myGameArea.keys.push(key);
myGameArea.keys.push(key);
},
deleteKey : function(key) {
key = key.toLowerCase();
var i = myGameArea.keys.indexOf(key);
if (i != -1)
myGameArea.keys.splice(i, 1);
@@ -104,7 +109,8 @@ var myGameArea = {
}
}
function score(size, font, color, x, y) {
function score(size, font, color, x, y)
{
this.size = size;
this.font = font;
this.color = color;
@@ -119,7 +125,8 @@ function score(size, font, color, x, y) {
}
}
function component(width, height, color, x, y) {
function component(width, height, color, x, y)
{
this.width = width;
this.height = height;
this.color = color;
@@ -137,54 +144,65 @@ function component(width, height, color, x, y) {
this.x += this.dirX * this.speed;
this.y += this.dirY * this.speed;
}
this.crashWith = function(otherobj) { // From W3schools. To redo.
this.collision = function(collider) { // From W3schools. To redo.
var myleft = this.x;
var myright = this.x + (this.width);
var mytop = this.y;
var mybottom = this.y + (this.height);
var otherleft = otherobj.x;
var otherright = otherobj.x + (otherobj.width);
var othertop = otherobj.y;
var otherbottom = otherobj.y + (otherobj.height);
var crash = true;
var otherleft = collider.x;
var otherright = collider.x + (collider.width);
var othertop = collider.y;
var otherbottom = collider.y + (collider.height);
if ((mybottom < othertop) ||
(mytop > otherbottom) ||
(myright < otherleft) ||
(myleft > otherright)) {
crash = false;
return false;
}
return crash;
else
return true;
}
this.bounce = function() { // WIP
ball.dirX = ball.dirX * -1;
ball.dirY = ball.dirY * -1;
}
}
function gameLoop() {
if (ball.crashWith(player1))
myGameArea.stop();
function gameLoop()
{
handleInput();
ball.dirX = -0.5;
ball.dirY = +0.5;
ball.move();
if (ball.collision(wall_top))
ball.bounce();
if (ball.collision(wall_bottom))
ball.bounce();
if (ball.collision(player1))
ball.bounce();
if (ball.collision(player2))
ball.bounce();
draw();
}
function draw() {
function draw()
{
myGameArea.clear();
if (gridDisplay)
drawGrid();
wall_top.update();
wall_bottom.update();
player1.update();
player2.update();
ball.update();
score1.update();
score2.update();
wall_top.update();
wall_bottom.update();
}
function drawGrid() {
function drawGrid()
{
w_grid_mid.update();
w_grid_u1.update();
w_grid_d1.update();
@@ -194,7 +212,8 @@ function drawGrid() {
h_grid_d1.update();
}
function handleInput() {
function handleInput()
{
var keys = myGameArea.keys;
if (keys.length == 0)
return;
@@ -207,30 +226,31 @@ function handleInput() {
playerMove(keys);
}
function playerMove(keys) {
player1.dirX = 0;
function playerMove(keys)
{
player1.dirY = 0;
if (keys.indexOf("a") != -1)
{ player1.dirX += -1; }
if (keys.indexOf("d") != -1)
{ player1.dirX += 1; }
if (keys.indexOf("w") != -1)
{ player1.dirY += -1; }
{ player1.dirY += -1; }
if (keys.indexOf("s") != -1)
{ player1.dirY += 1; }
{ player1.dirY += 1; }
player1.move();
player2.dirX = 0;
if (player1.collision(wall_top) || player1.collision(wall_bottom))
{
player1.dirY = player1.dirY * -1;
player1.move();
}
player2.dirY = 0;
if (keys.indexOf("ArrowLeft") != -1)
{ player2.dirX += -1; }
if (keys.indexOf("ArrowRight") != -1)
{ player2.dirX += 1; }
if (keys.indexOf("ArrowUp") != -1)
if (keys.indexOf("ArrowUp".toLowerCase()) != -1)
{ player2.dirY += -1; }
if (keys.indexOf("ArrowDown") != -1)
if (keys.indexOf("ArrowDown".toLowerCase()) != -1)
{ player2.dirY += 1; }
player2.move();
if (player2.collision(wall_top) || player2.collision(wall_bottom))
{
player2.dirY = player2.dirY * -1;
player2.move();
}
}
</script>