114 lines
3.1 KiB
JavaScript
114 lines
3.1 KiB
JavaScript
import { Game } from "./game.js";
|
|
import { startInputListener } from "./input.js";
|
|
import { multiplayer } from "./multiplayer.js";
|
|
import { advance, initState } from "./logic.js";
|
|
import { startGraphicsUpdater } from "./gfx/graphics.js";
|
|
|
|
const join = document.getElementById("join")
|
|
const lobby = document.getElementById("lobby")
|
|
lobby.style.display = "none"
|
|
|
|
join.onsubmit = async function(event) {
|
|
event.preventDefault()
|
|
|
|
const room_code = this.elements.room_code.value.trim()
|
|
const player_name = this.elements.name.value.trim()
|
|
|
|
if (room_code == '') {
|
|
alert('Please enter a room code')
|
|
return
|
|
}
|
|
|
|
if (player_name == '') {
|
|
alert('Please enter a player name')
|
|
return
|
|
}
|
|
|
|
join.style.display = "none"
|
|
|
|
startGame(room_code, player_name)
|
|
}
|
|
|
|
function startGame(code, name) {
|
|
|
|
const game = window.game = new Game(3000, advance);
|
|
const fps = 60;
|
|
let delay = 3;
|
|
|
|
// set up the game up
|
|
// const ui = document.getElementById("ui");
|
|
// ui.style.display = "block";
|
|
|
|
multiplayer(
|
|
game,
|
|
code,
|
|
(startFrame, latency, player, update, ping, desyncCheck) => {
|
|
// document.getElementById("desynccheck").onclick = function(e) {
|
|
// e.preventDefault();
|
|
// this.textContent = "check for desyncs: checking...";
|
|
// desyncCheck(game.currentFrame - 5)
|
|
// .then(res => {
|
|
// this.textContent = "check for desyncs: " + (res ? "desync" : "no desync");
|
|
// });
|
|
// }
|
|
console.log("started game at frame", startFrame);
|
|
window.desyncCheck = () => desyncCheck(game.currentFrame - 5);
|
|
|
|
lobby.style.display = ""
|
|
|
|
let startTs = performance.now() - latency;
|
|
let lastFrame = startFrame;
|
|
update({
|
|
name,
|
|
}, startFrame + 1);
|
|
|
|
const getInput = startInputListener();
|
|
const updateGraphics = startGraphicsUpdater();
|
|
|
|
const start_data = game.getHistory(startFrame)
|
|
if (start_data.data.started) {
|
|
alert('Room has already started')
|
|
return false
|
|
}
|
|
|
|
let players = Object.values(start_data.data.players).filter(p => { return p.name !== undefined })
|
|
if (players.length >= 4) {
|
|
alert('Room is full')
|
|
return false
|
|
}
|
|
|
|
// main game loop
|
|
let lastTs = performance.now();
|
|
function f(ts) {
|
|
const frame = Math.floor((ts - startTs) / 1000 * fps) + startFrame;
|
|
if(frame !== lastFrame) { // update input once per frame, regardless of the display refresh rate
|
|
lastFrame = frame;
|
|
|
|
// gather input
|
|
const input = getInput();
|
|
|
|
// apply input
|
|
update(input, frame + delay);
|
|
}
|
|
|
|
// set up graphics
|
|
game.currentFrame = frame;
|
|
const data = game.getHistory(frame);
|
|
updateGraphics(data ? data.data : initState);
|
|
lastTs = ts;
|
|
|
|
requestAnimationFrame(f);
|
|
}
|
|
|
|
requestAnimationFrame(f);
|
|
if(startFrame === -1) {
|
|
update({
|
|
name,
|
|
}, 0);
|
|
}
|
|
|
|
return true
|
|
}
|
|
);
|
|
}
|