- add ping on multi online
This commit is contained in:
Kum1ta
2024-09-28 21:47:09 +02:00
parent 05b7c5b0b9
commit ed66c52be0
5 changed files with 65 additions and 17 deletions

View File

@ -1,3 +1,6 @@
<div class="pingDiv">
<p id="ping">0 ms</p>
</div>
<div class="gamePad">
<div id="fullscreen" style="background-image: url('/static/img/multiOnlineGamePage/fullscreen.png');"></div>
<div class="gamePadLeft">

File diff suppressed because one or more lines are too long

View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/18 00:53:53 by edbernar #+# #+# */
/* Updated: 2024/09/28 03:15:02 by edbernar ### ########.fr */
/* Updated: 2024/09/28 21:46:40 by edbernar ### ########.fr */
/* */
/* ************************************************************************** */
@ -62,7 +62,9 @@ let spotLight = null;
let ambiantLight = null;
let opponent = null;
let interval = null;
let intervalPing = null;
let debug = false;
let lastPingTime = 0;
// ------------------- (need to be remove) -------------------- //
const stats = new Stats();
@ -164,6 +166,13 @@ class MultiOnlineGamePage
sendRequest('game', {action: 3, pos: player.object.position.x, up: player.isUp});
}
}, 1000 / 20);
intervalPing = setInterval(() => {
if (!lastPingTime)
{
sendRequest('game', {action: 4});
lastPingTime = Date.now();
}
}, 16);
}
static dispose()
@ -172,6 +181,9 @@ class MultiOnlineGamePage
if (interval)
clearInterval(interval);
interval = null;
if (intervalPing)
clearInterval(intervalPing);
intervalPing = null;
if (renderer)
renderer.dispose();
renderer = null;
@ -206,6 +218,21 @@ class MultiOnlineGamePage
{
pageRenderer.changePage('lobbyPage');
}
static ping()
{
const text = document.getElementById('ping');
const ping = Date.now() - lastPingTime;
if (ping < 90)
text.style.color = 'white';
else if (ping >= 90 && ping < 150)
text.style.color = 'orange';
else
text.style.color = 'red';
text.innerText = ping + ' ms';
lastPingTime = null;
}
}
function createBarPlayer(skin)

View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/09/15 12:00:01 by edbernar #+# #+# */
/* Updated: 2024/09/28 00:56:23 by edbernar ### ########.fr */
/* Updated: 2024/09/28 21:33:31 by edbernar ### ########.fr */
/* */
/* ************************************************************************** */
@ -16,25 +16,28 @@ import { pageRenderer } from '/static/javascript/main.js'
function typeGame(content)
{
if (content.action == 1 && pageRenderer.actualPage == WaitingGamePage)
if (pageRenderer.actualPage == WaitingGamePage)
{
if (content.action == 1)
WaitingGamePage.showOpponent(content);
}
else if (content.action == 3 && pageRenderer.actualPage == MultiOnlineGamePage)
else if (pageRenderer.actualPage == MultiOnlineGamePage)
{
if (content.is_opponent)
if (content.action == 3 && content.is_opponent)
opponent.movePlayer(content);
}
else if (content.action == 4 && pageRenderer.actualPage == MultiOnlineGamePage)
else if (content.action == 4)
MultiOnlineGamePage.opponentDisconnect();
else if (content.action == 5 && pageRenderer.actualPage == MultiOnlineGamePage)
else if (content.action == 5)
ball.updatePos(content);
else if (content.action == 6 && pageRenderer.actualPage == MultiOnlineGamePage)
else if (content.action == 6)
player.makeAnimation(content.is_opponent);
else if (content.action == 7 && pageRenderer.actualPage == MultiOnlineGamePage)
else if (content.action == 7)
map.placeObject(content);
else if (content.action == 8 && pageRenderer.actualPage == MultiOnlineGamePage)
else if (content.action == 8)
map.activeJumper(content.name);
else if (content.action == 9)
MultiOnlineGamePage.ping();
}
}
export { typeGame };

View File

@ -6,7 +6,7 @@
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/20 11:23:41 by edbernar #+# #+# */
/* Updated: 2024/09/27 21:59:51 by edbernar ### ########.fr */
/* Updated: 2024/09/28 21:38:24 by edbernar ### ########.fr */
/* */
/* ************************************************************************** */
@ -190,3 +190,17 @@ body {
-ms-user-select: none;
touch-action: none;
}
.pingDiv {
position: absolute;
top: 100px;
left: 100px;
font-size: 20px;
color: white;
z-index: 800;
}
#ping {
font-size: 20px;
color: white;
}