server reconciliation OK (a little rubberbanding)

This commit is contained in:
LuckyLaszlo
2022-11-23 10:43:12 +01:00
parent 2b9058ad49
commit 7d5895a6cc
10 changed files with 110 additions and 33 deletions

View File

@@ -3,10 +3,11 @@ import {pong, gc} from "./global.js"
import * as ev from "../shared_js/class/Event.js"
import {matchmaking, matchmakingComplete, startGame} from "./pong.js";
import * as en from "../shared_js/enums.js"
import { Racket } from "../shared_js/class/Rectangle.js";
import { RacketClient } from "./class/RectangleClient.js";
import { sleep } from "./utils.js";
import * as c from "./constants.js"
import {soundRoblox} from "./audio.js"
import { repeatInput } from "./handleInput.js";
const wsPort = 8042;
const wsUrl = "ws://" + document.location.hostname + ":" + wsPort + "/pong";
@@ -15,7 +16,7 @@ const socket = new WebSocket(wsUrl, "json");
class ClientInfo {
id = "";
side: en.PlayerSide;
racket: Racket;
racket: RacketClient;
}
export const clientInfo = new ClientInfo();
@@ -24,7 +25,7 @@ socket.addEventListener("open", (event) => {
socket.send(JSON.stringify( new ev.ClientAnnounce(en.ClientRole.player, clientInfo.id) ));
});
socket.addEventListener("message", logListener);
// socket.addEventListener("message", logListener); // for testing purpose
socket.addEventListener("message", preMatchListener);
function logListener(this: WebSocket, event: MessageEvent) {
@@ -48,6 +49,7 @@ function preMatchListener(this: WebSocket, event: MessageEvent) {
else if (clientInfo.side === en.PlayerSide.right) {
clientInfo.racket = gc.playerRight;
}
clientInfo.racket.color = "darkgreen"; // for testing purpose
socket.send(JSON.stringify( new ev.ClientEvent(en.EventTypes.clientPlayerReady) ));
matchmakingComplete();
break;
@@ -65,6 +67,7 @@ function inGameListener(event: MessageEvent)
switch (data.type) {
case en.EventTypes.gameUpdate:
console.log("gameUpdate");
// setTimeout(gameUpdate, 1000, data as ev.EventGameUpdate); // artificial latency for testing purpose
gameUpdate(data as ev.EventGameUpdate);
break;
case en.EventTypes.scoreUpdate:
@@ -78,14 +81,15 @@ function inGameListener(event: MessageEvent)
}
}
async function gameUpdate(data: ev.EventGameUpdate)
function gameUpdate(data: ev.EventGameUpdate)
{
// await sleep(1000); // artificial latency for testing purpose
gc.playerLeft.pos.y = Math.floor(data.playerLeft.y);
gc.playerRight.pos.y = Math.floor(data.playerRight.y);
gc.ball.pos.x = Math.floor(data.ball.x);
gc.ball.pos.y = Math.floor(data.ball.y);
gc.ball.speed = Math.floor(data.ball.speed);
repeatInput(data.lastInputId); // server reconciliation
}
function scoreUpdate(data: ev.EventScoreUpdate)