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

added midLine (net)

Browse Source
This commit is contained in:
LuckyLaszlo
2022-10-20 05:00:14 +02:00
parent 1d58342c0f
commit 3f6d7c3afc
1 changed files with 50 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
src/pong.ts
View File

@@ -13,6 +13,7 @@ let player2: Player;
let ball: Ball;
let score1: TextElem;
let score2: TextElem;
let midLine: Line;
let w_grid_mid: Rectangle;
let w_grid_u1: Rectangle;
@@ -25,16 +26,18 @@ function startGame()
{
pong = new gameArea();
// Const
let w = pong.canvas.width;
let h = pong.canvas.height;
let w_mid = w/2;
let h_mid = h/2;
// Const
const w = pong.canvas.width;
const h = pong.canvas.height;
const w_mid = w/2;
const h_mid = h/2;
const pw = w/50;
const ph = pw*5;
const ball_size = pw; // const ball_size = w/50;
const score_size = w/16;
const midLineSize = w/150;
const wall_size = w/100;
const grid_size = w/500;
const playerSpeed = w/75;
const ballSpeed = w/75;
@@ -42,8 +45,8 @@ function startGame()
wall_top = new Rectangle({x: 0, y: 0}, "grey", w, wall_size);
wall_bottom = new Rectangle({x: 0, y: h-wall_size}, "grey", w, wall_size);
player1 = new Player({x: 0+w/50, y: h_mid-ph/2}, "white", pw, ph);
player2 = new Player({x: w-w/50-pw, y: h_mid-ph/2}, "white", pw, ph);
player1 = new Player({x: 0+pw, y: h_mid-ph/2}, "white", pw, ph);
player2 = new Player({x: w-pw-pw, y: h_mid-ph/2}, "white", pw, ph);
player1.speed = playerSpeed;
player2.speed = playerSpeed;
@@ -57,8 +60,9 @@ function startGame()
score2 = new TextElem({x: w_mid+w/8-score_size/2, y: w/12}, "white", score_size+"px");
score2.text = "0";
midLine = new Line({x: w_mid-midLineSize/2, y: 0+wall_size}, "white", midLineSize, h-wall_size*2, 15);
// Grid
const grid_size = w/500;
w_grid_mid = new Rectangle({x: 0, y: h_mid}, "darkgreen", w, grid_size);
w_grid_u1 = new Rectangle({x: 0, y: h/4}, "darkgreen", w, grid_size);
w_grid_d1 = new Rectangle({x: 0, y: h-h/4}, "darkgreen", w, grid_size);
@@ -66,9 +70,6 @@ function startGame()
h_grid_u1 = new Rectangle({x: w/4, y: 0}, "darkgreen", grid_size, h);
h_grid_d1 = new Rectangle({x: w-w/4, y: 0}, "darkgreen", grid_size, h);
// dashed line TODO
// midLine = new component(grid_size, h, "white", w_mid, 0);
pong.start();
}
@@ -151,10 +152,9 @@ function draw()
if (gridDisplay)
drawGrid();
// drawLine([w_mid, 0], [w_mid, h], "white", [10, 10]); // bad
wall_top.update();
wall_bottom.update();
midLine.update();
player1.update();
player2.update();
ball.update();
@@ -338,22 +338,39 @@ class TextElem implements Component {
}
}
// class line {
// width: number;
// height: number;
// color: string;
// x: number;
// y: number;
// constructor(width: number, height: number, color: string, x: number, y: number) {
// this.width = width;
// this.height = height;
// this.color = color;
// this.x = x;
// this.y = y;
// }
// update() {
// let ctx = pong.ctx;
// ctx.fillStyle = this.color;
// ctx.fillRect(this.x, this.y, this.width, this.height);
// }
// }
class Line extends Rectangle {
gapeCount: number = 0;
segmentCount: number;
segmentWidth: number;
segmentHeight: number;
constructor(pos: Vector, color: string, width: number, height: number, gapeCount?: number) {
super(pos, color, width, height);
if (gapeCount)
this.gapeCount = gapeCount;
this.segmentCount = this.gapeCount * 2 + 1;
this.segmentWidth = this.width;
this.segmentHeight = this.height / this.segmentCount;
// for Horizontal Line
// this.segmentWidth = this.width / this.segmentCount;
// this.segmentHeight = this.height;
}
update() {
let ctx = pong.ctx;
ctx.fillStyle = this.color;
let pos: Vector = {x: 0, y: 0};
let i = 0;
while (i < this.segmentCount)
{
// for Horizontal Line
// pos.y = this.pos.y;
// pos.x = this.pos.x + this.segmentWidth * i;
pos.x = this.pos.x;
pos.y = this.pos.y + this.segmentHeight * i;
ctx.fillRect(pos.x, pos.y, this.segmentWidth, this.segmentHeight);
i += 2;
}
}
}