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

Drop old purchase views and models

Browse Source
This commit is contained in:
Eden Kirin
2023-05-10 15:49:08 +02:00
parent 24d05dc234
commit 69e087c0c9
8 changed files with 79 additions and 127 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
frontend/index.html
View File

@ -6,8 +6,9 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css"
integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
<link rel="stylesheet" href="styles.css">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.min.js" integrity="sha384-cuYeSxntonz0PPNlHhBs68uyIAVpIIOZZ5JqeqvYYIcEL727kskC66kF92t6Xl2V" crossorigin="anonymous"></script>
<script src="js/config.js"></script>
<script src="js/frontend.js"></script>
@ -19,6 +20,9 @@
<h1 class="mt-1 mb-2">
FairHopper Visualisation Client
</h1>
<button type="button" class="btn btn-primary test-button">
Launch demo modal
</button>
<div id="purchase-container" class="purchase-container d-none">
<div class="d-flex header">
<h3>
@ -42,6 +46,38 @@
</div>
</div>
</main>
<div class="modal fade" id="player-on-destination-modal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Player on destination</h5>
</div>
<div class="modal-body">
Player <strong class="player-name"></strong>
reached destination in <strong class="move-count"></strong>
moves.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary">
Finish product selection
</button>
</div>
</div>
</div>
</div>
<script>
document.querySelector(".test-button").onclick = () => {
playerReachedDestination({
player: {
name: "Pero Perić",
move_count: 123,
}
});
}
</script>
</body>
</html>

14
frontend/js/frontend.js
View File

@ -96,6 +96,17 @@ function renderGameDump(data) {
renderPlayers(data.players);
}
function playerReachedDestination(data) {
console.log(data);
const dlgElement = document.getElementById("player-on-destination-modal");
dlgElement.querySelector(".player-name").textContent = data.player.name;
dlgElement.querySelector(".move-count").textContent = data.player.move_count;
const modal = new bootstrap.Modal(dlgElement);
modal.show();
}
function productPurchaseStart(products, purchaseTimeout) {
console.log("productPurchaseStart:", products);
const containerElement = document.getElementById("purchase-container");
@ -149,6 +160,9 @@ function wsConnect() {
case "game_dump":
renderGameDump(wsMessage.data);
break;
case "player_on_destination":
playerReachedDestination(wsMessage.data);
break;
case "product_purchase_start":
productPurchaseStart(wsMessage.data.products, wsMessage.data.timeout);
break;