109 lines
3.4 KiB
TypeScript
109 lines
3.4 KiB
TypeScript
|
|
import {GameArea} from "./class/GameArea.js";
|
|
import {Vector, VectorInteger} from "./class/Vector.js";
|
|
import {Rectangle, MovingRectangle, Player, Ball, Line} from "./class/Rectangle.js";
|
|
import {TextElem, TextNumericValue} from "./class/Text.js";
|
|
import * as d from "./draw.js";
|
|
import {gameLoop, newRound} from "./gameLoop.js"
|
|
import {random} from "./utils.js";
|
|
|
|
/* Keys
|
|
Player 1: W/S
|
|
Player 2: Up/Down
|
|
Grid On-Off: G
|
|
*/
|
|
|
|
export let pong: GameArea;
|
|
|
|
export let wall_top: Rectangle;
|
|
export let wall_bottom: Rectangle;
|
|
export let player1: Player;
|
|
export let player2: Player;
|
|
export let ball: Ball;
|
|
export let score1: TextNumericValue;
|
|
export let score2: TextNumericValue;
|
|
export let midLine: Line;
|
|
|
|
export let w_grid_mid: Rectangle;
|
|
export let w_grid_u1: Rectangle;
|
|
export let w_grid_d1: Rectangle;
|
|
export let h_grid_mid: Rectangle;
|
|
export let h_grid_u1: Rectangle;
|
|
export let h_grid_d1: Rectangle;
|
|
|
|
function startGame()
|
|
{
|
|
pong = new GameArea();
|
|
|
|
// Const
|
|
const w = pong.canvas.width;
|
|
const h = pong.canvas.height;
|
|
const w_mid = Math.floor(w/2);
|
|
const h_mid = Math.floor(h/2);
|
|
const pw = Math.floor(w/50);
|
|
const ph = pw*5;
|
|
const ballSize = pw;
|
|
const scoreSize = Math.floor(w/16);
|
|
const midLineSize = Math.floor(w/150);
|
|
const wallSize = Math.floor(w/100);
|
|
const gridSize = Math.floor(w/500);
|
|
const playerSpeed = Math.floor(w/1.5); // pixel per second
|
|
const ballSpeed = Math.floor(w/1.5); // pixel per second
|
|
|
|
let pos = new VectorInteger;
|
|
// Component
|
|
pos.assign(0, 0);
|
|
wall_top = new Rectangle(pong.ctx, pos, "grey", w, wallSize);
|
|
pos.assign(0, h-wallSize);
|
|
wall_bottom = new Rectangle(pong.ctx, pos, "grey", w, wallSize);
|
|
|
|
pos.assign(0+pw, h_mid-ph/2);
|
|
player1 = new Player(pong.ctx, pos, "white", pw, ph, playerSpeed);
|
|
pos.assign(w-pw-pw, h_mid-ph/2);
|
|
player2 = new Player(pong.ctx, pos, "white", pw, ph, playerSpeed);
|
|
|
|
pos.assign(w_mid-ballSize/2, h_mid-ballSize/2);
|
|
ball = new Ball(pong.ctx, pos, "white", ballSize, ballSpeed);
|
|
ball.dir.assign(-0.8, +0.2);
|
|
|
|
pos.assign(w_mid-scoreSize*1.6, scoreSize*1.5);
|
|
score1 = new TextNumericValue(pong.ctx, pos, "white", scoreSize);
|
|
pos.assign(w_mid+scoreSize*1.1, scoreSize*1.5);
|
|
score2 = new TextNumericValue(pong.ctx, pos, "white", scoreSize);
|
|
score1.value = 0;
|
|
score2.value = 0;
|
|
|
|
pos.assign(w_mid-midLineSize/2, 0+wallSize);
|
|
midLine = new Line(pong.ctx, pos, "white", midLineSize, h-wallSize*2, 15);
|
|
|
|
// Grid
|
|
pos.assign(0, h_mid);
|
|
w_grid_mid = new Rectangle(pong.ctx, pos, "darkgreen", w, gridSize);
|
|
pos.assign(0, h/4);
|
|
w_grid_u1 = new Rectangle(pong.ctx, pos, "darkgreen", w, gridSize);
|
|
pos.assign(0, h-h/4);
|
|
w_grid_d1 = new Rectangle(pong.ctx, pos, "darkgreen", w, gridSize);
|
|
pos.assign(w_mid, 0);
|
|
h_grid_mid = new Rectangle(pong.ctx, pos, "darkgreen", gridSize, h);
|
|
pos.assign(w/4, 0);
|
|
h_grid_u1 = new Rectangle(pong.ctx, pos, "darkgreen", gridSize, h);
|
|
pos.assign(w-w/4, 0);
|
|
h_grid_d1 = new Rectangle(pong.ctx, pos, "darkgreen", gridSize, h);
|
|
|
|
// Start
|
|
d.drawInit();
|
|
window.addEventListener('keydown', function (e) {
|
|
pong.addKey(e.key);
|
|
});
|
|
window.addEventListener('keyup', function (e) {
|
|
pong.deleteKey(e.key);
|
|
});
|
|
pong.interval = window.setInterval(gameLoop, 15); // min interval on Firefox seems to be 15. Chrome can go lower.
|
|
setTimeout(newRound, 1000);
|
|
}
|
|
|
|
/////////////////////////////////////////////////////////////////////////////
|
|
/////////////////////////////////////////////////////////////////////////////
|
|
|
|
startGame();
|