reafactoring

This commit is contained in:
LuckyLaszlo
2022-11-17 12:22:57 +01:00
parent 6fb1470dbb
commit 023b5ed485
5 changed files with 61 additions and 52 deletions

View File

@@ -1 +1,7 @@
import {w} from "../shared_js/constants.js"
export * from "../shared_js/constants.js" export * from "../shared_js/constants.js"
export const midLineSize = Math.floor(w/150);
export const scoreSize = Math.floor(w/16);
export const gridSize = Math.floor(w/500);

View File

@@ -17,43 +17,32 @@ export let h_grid_d1: Rectangle;
function initGameClientOnly(ctx: CanvasRenderingContext2D) function initGameClientOnly(ctx: CanvasRenderingContext2D)
{ {
// Const (could maybe be in constants.ts ?)
const w = c.CanvasWidth;
const h = c.CanvasWidth / c.CanvasRatio;
const w_mid = Math.floor(w/2);
const h_mid = Math.floor(h/2);
const midLineSize = Math.floor(w/150);
const scoreSize = Math.floor(w/16);
const gridSize = Math.floor(w/500);
const wallSize = Math.floor(w/100);
let pos = new VectorInteger; let pos = new VectorInteger;
// Scores // Scores
pos.assign(w_mid-scoreSize*1.6, scoreSize*1.5); pos.assign(c.w_mid-c.scoreSize*1.6, c.scoreSize*1.5);
score1 = new TextNumericValue(ctx, pos, "white", scoreSize); score1 = new TextNumericValue(ctx, pos, "white", c.scoreSize);
pos.assign(w_mid+scoreSize*1.1, scoreSize*1.5); pos.assign(c.w_mid+c.scoreSize*1.1, c.scoreSize*1.5);
score2 = new TextNumericValue(ctx, pos, "white", scoreSize); score2 = new TextNumericValue(ctx, pos, "white", c.scoreSize);
score1.value = 0; score1.value = 0;
score2.value = 0; score2.value = 0;
// Dotted Midline // Dotted Midline
pos.assign(w_mid-midLineSize/2, 0+wallSize); pos.assign(c.w_mid-c.midLineSize/2, 0+c.wallSize);
midLine = new Line(ctx, pos, "white", midLineSize, h-wallSize*2, 15); midLine = new Line(ctx, pos, "white", c.midLineSize, c.h-c.wallSize*2, 15);
// Grid // Grid
pos.assign(0, h_mid); pos.assign(0, c.h_mid);
w_grid_mid = new Rectangle(ctx, pos, "darkgreen", w, gridSize); w_grid_mid = new Rectangle(ctx, pos, "darkgreen", c.w, c.gridSize);
pos.assign(0, h/4); pos.assign(0, c.h/4);
w_grid_u1 = new Rectangle(ctx, pos, "darkgreen", w, gridSize); w_grid_u1 = new Rectangle(ctx, pos, "darkgreen", c.w, c.gridSize);
pos.assign(0, h-h/4); pos.assign(0, c.h-c.h/4);
w_grid_d1 = new Rectangle(ctx, pos, "darkgreen", w, gridSize); w_grid_d1 = new Rectangle(ctx, pos, "darkgreen", c.w, c.gridSize);
pos.assign(w_mid, 0); pos.assign(c.w_mid, 0);
h_grid_mid = new Rectangle(ctx, pos, "darkgreen", gridSize, h); h_grid_mid = new Rectangle(ctx, pos, "darkgreen", c.gridSize, c.h);
pos.assign(w/4, 0); pos.assign(c.w/4, 0);
h_grid_u1 = new Rectangle(ctx, pos, "darkgreen", gridSize, h); h_grid_u1 = new Rectangle(ctx, pos, "darkgreen", c.gridSize, c.h);
pos.assign(w-w/4, 0); pos.assign(c.w-c.w/4, 0);
h_grid_d1 = new Rectangle(ctx, pos, "darkgreen", gridSize, h); h_grid_d1 = new Rectangle(ctx, pos, "darkgreen", c.gridSize, c.h);
} }
export {initGameClientOnly} export {initGameClientOnly}

View File

@@ -155,3 +155,18 @@ class Line extends Rectangle {
} }
export {Rectangle, MovingRectangle, Player, Ball, Line} export {Rectangle, MovingRectangle, Player, Ball, Line}
// How to handle const export in initGame ?
// example for class Rectangle
/* constructor(ctx?: CanvasRenderingContext2D, pos?: VectorInteger, color?: string, width?: number, height?: number) {
if (ctx && pos && color && width && height)
this.init(ctx, pos, color, width, height);
}
// constructor() {}
init(ctx: CanvasRenderingContext2D, pos: VectorInteger, color: string, width: number, height: number) {
this.ctx = ctx;
this.pos = Object.assign({}, pos);
this.color = color;
this.width = width;
this.height = height;
} */

View File

@@ -1,4 +1,15 @@
export const CanvasWidth = 1500; export const CanvasWidth = 1500;
export const CanvasRatio = 1.66666;
/* ratio 5/3 (1.66) */ /* ratio 5/3 (1.66) */
export const CanvasRatio = 1.66666;
export const w = CanvasWidth;
export const h = CanvasWidth / CanvasRatio;
export const w_mid = Math.floor(w/2);
export const h_mid = Math.floor(h/2);
export const pw = Math.floor(w/50);
export const ph = pw*5;
export const ballSize = pw;
export const wallSize = Math.floor(w/100);
export const playerSpeed = Math.floor(w/1.5); // pixel per second
export const ballSpeed = Math.floor(w/1.5); // pixel per second

View File

@@ -11,32 +11,20 @@ export let ball: Ball;
function initGame(ctx: CanvasRenderingContext2D) function initGame(ctx: CanvasRenderingContext2D)
{ {
// Const (could maybe be in constants.ts ?)
const w = c.CanvasWidth;
const h = c.CanvasWidth / c.CanvasRatio;
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 wallSize = Math.floor(w/100);
const playerSpeed = Math.floor(w/1.5); // pixel per second
const ballSpeed = Math.floor(w/1.5); // pixel per second
let pos = new VectorInteger; let pos = new VectorInteger;
// Component // Component
pos.assign(0, 0); pos.assign(0, 0);
wall_top = new Rectangle(ctx, pos, "grey", w, wallSize); wall_top = new Rectangle(ctx, pos, "grey", c.w, c.wallSize);
pos.assign(0, h-wallSize); pos.assign(0, c.h-c.wallSize);
wall_bottom = new Rectangle(ctx, pos, "grey", w, wallSize); wall_bottom = new Rectangle(ctx, pos, "grey", c.w, c.wallSize);
pos.assign(0+pw, h_mid-ph/2); pos.assign(0+c.pw, c.h_mid-c.ph/2);
player1 = new Player(ctx, pos, "white", pw, ph, playerSpeed); player1 = new Player(ctx, pos, "white", c.pw, c.ph, c.playerSpeed);
pos.assign(w-pw-pw, h_mid-ph/2); pos.assign(c.w-c.pw-c.pw, c.h_mid-c.ph/2);
player2 = new Player(ctx, pos, "white", pw, ph, playerSpeed); player2 = new Player(ctx, pos, "white", c.pw, c.ph, c.playerSpeed);
pos.assign(w_mid-ballSize/2, h_mid-ballSize/2); pos.assign(c.w_mid-c.ballSize/2, c.h_mid-c.ballSize/2);
ball = new Ball(ctx, pos, "white", ballSize, ballSpeed); ball = new Ball(ctx, pos, "white", c.ballSize, c.ballSpeed);
ball.dir.assign(-0.8, +0.2); ball.dir.assign(-0.8, +0.2);
} }