Intis/fairhopper
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

FE tweaks

Browse Source
This commit is contained in:
Eden Kirin
2023-03-26 15:16:51 +02:00
parent 63e7e0d21c
commit 715c6e1589
1 changed files with 16 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
frontend/index.html
View File

@ -9,12 +9,14 @@
integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous"> integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
<link rel="stylesheet" href="styles.css"> <link rel="stylesheet" href="styles.css">
<title>Document</title> <title>FiarHopper Visualisation Client</title>
</head> </head>
<body> <body>
<div class="container-fluid"> <div class="container-fluid">
<h1>FairHopper WS Client</h1> <h1 class="mt-1 mb-2">
FiarHopper Visualisation Client
</h1>
<div class="row"> <div class="row">
<div class="col-10"> <div class="col-10">
<div class="board-container"> <div class="board-container">
@ -22,7 +24,9 @@
</div> </div>
</div> </div>
<div class="col-2"> <div class="col-2">
<h3>Players</h3> <h3 class="pb-2 border-bottom">
Players
</h3>
<ul class="players" id="players-content"></ul> <ul class="players" id="players-content"></ul>
</div> </div>
</div> </div>
@ -104,17 +108,14 @@
function wsConnect() { function wsConnect() {
let ws = new WebSocket('ws://localhost:8011/bla-tra'); let ws = new WebSocket('ws://localhost:8011');
ws.onopen = function () { ws.onopen = () => {
/* console.log("WS connected")
ws.send(JSON.stringify({
}));
*/
}; };
ws.onmessage = function (e) { ws.onmessage = (e) => {
const data = JSON.parse(e.data); const data = JSON.parse(e.data);
console.log("message received:", data) console.log("WS message received:", data)
createBoard(data.board); createBoard(data.board);
renderObstacles(data.layers) renderObstacles(data.layers)
@ -123,19 +124,19 @@
renderPlayers(data.players); renderPlayers(data.players);
}; };
ws.onclose = function (e) { ws.onclose = (e) => {
setTimeout(function () { setTimeout(function () {
wsConnect(); wsConnect();
}, 1000); }, 1000);
}; };
ws.onerror = function (err) { ws.onerror = (err) => {
console.error('Socket encountered error: ', err.message, 'Closing socket'); console.error("Socket encountered error:", err.message, "Closing socket");
ws.close(); ws.close();
}; };
} }
window.onload = function () { window.onload = () => {
wsConnect(); wsConnect();
} }
</script> </script>