basic Websocket client-server

This commit is contained in:
LuckyLaszlo
2022-11-16 15:40:44 +01:00
parent 2f62331559
commit a873b23d0f
9 changed files with 305 additions and 40 deletions

View File

@@ -6,6 +6,8 @@ import {TextElem, TextNumericValue} from "./class/Text.js";
import * as d from "./draw.js";
import {gameLoop, newRound} from "./gameLoop.js"
import {random} from "./utils.js";
import {socket} from "./ws.js";
/* Keys
Player 1: W/S
@@ -31,10 +33,56 @@ export let h_grid_mid: Rectangle;
export let h_grid_u1: Rectangle;
export let h_grid_d1: Rectangle;
function init()
{
initGame();
initGameClientOnly();
console.log("socket state %i", socket.readyState);
}
function startGame()
{
pong = new GameArea();
// 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);
}
function initGameClientOnly()
{
let pos = new VectorInteger;
// 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 gridSize = Math.floor(w/500);
// 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);
}
function initGame()
{
pong = new GameArea();
// Const
const w = pong.canvas.width;
const h = pong.canvas.height;
@@ -46,7 +94,6 @@ function startGame()
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
@@ -75,34 +122,11 @@ function startGame()
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();
init();
export {startGame}