Fortifying works

This commit is contained in:
jude 2023-02-17 12:46:21 +00:00
parent bcbd407d7d
commit 8b5f7df592
5 changed files with 129 additions and 39 deletions

View File

@ -87,7 +87,7 @@
} }
.hidden { .hidden {
display: none; display: none !important;
} }
.east { .east {
@ -114,3 +114,27 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
#modal {
position: fixed;
z-index: 99;
width: 100vw;
height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background: rgba(0, 0, 0, 0.2);
}
.modal-content {
display: block;
padding: 12px;
background: white;
}
.button-row {
display: flex;
justify-content: space-between;
margin: 4px;
}

View File

@ -116,13 +116,65 @@ document.addEventListener("DOMContentLoaded", () => {
socket.emit("message", Packet.createEndTurn()); socket.emit("message", Packet.createEndTurn());
}); });
document.querySelectorAll(".actions button").forEach((el) => document.querySelectorAll(".reinforce").forEach((el) =>
el.addEventListener("click", (ev) => { el.addEventListener("click", (ev) => {
let region = ev.target.closest(".node").dataset.name; let region = ev.target.closest(".node").dataset.name;
socket.emit("message", Packet.createRegionClaim(region)); socket.emit("message", Packet.createRegionClaim(region));
}) })
); );
document.querySelectorAll(".attack").forEach((el) =>
el.addEventListener("click", (ev) => {
let modal = document.querySelector("#modal");
modal.dataset["region"] = ev.target.closest(".node").dataset.name;
modal.dataset["action"] = "ATTACK";
modal.classList.remove("hidden");
})
);
document.querySelectorAll(".fortify").forEach((el) =>
el.addEventListener("click", (ev) => {
let modal = document.querySelector("#modal");
let region = ev.target.closest(".node").dataset["name"];
modal.dataset["region"] = region;
modal.dataset["action"] = "FORTIFY";
let selector = modal.querySelector(".target");
selector.replaceChildren("");
for (let neighbour of Region.getRegion(region).neighbours) {
let opt = document.createElement("option");
opt.value = neighbour.name;
opt.textContent = neighbour.name;
selector.appendChild(opt);
}
modal.classList.remove("hidden");
})
);
document.querySelector(".submit-modal").addEventListener("click", () => {
let modal = document.querySelector("#modal");
let startRegion = modal.dataset["region"];
let action = modal.dataset["action"];
let amount = modal.querySelector(".amount").value;
let endRegion = modal.querySelector(".target").value;
socket.emit(
"message",
Packet.createAction(action, startRegion, endRegion, amount)
);
});
document.querySelector(".cancel-modal").addEventListener("click", () => {
document.querySelector("#modal").classList.add("hidden");
});
document.querySelector("#shuffleColors").addEventListener("click", () => { document.querySelector("#shuffleColors").addEventListener("click", () => {
Object.values(players).forEach((player) => { Object.values(players).forEach((player) => {
player.resetColor(); player.resetColor();
@ -144,15 +196,3 @@ function showRemainingReinforcements() {
}</span>`; }</span>`;
} }
} }
function addInfoMessage(message) {
let child = document.createElement("div");
child.textContent = message;
let info = document.querySelector("#info");
info.appendChild(child);
setTimeout(() => {
info.removeChild(child);
}, 8000);
}

View File

@ -40,10 +40,13 @@ class Packet {
}; };
} }
static createReinforce(region) { static createAction(action, startRegion, endRegion, amount) {
return { return {
...this._createBase("ACT"), ...this._createBase("ACT"),
region: region, startRegion: startRegion,
endRegion: endRegion,
strength: amount,
action: action,
}; };
} }

View File

@ -82,6 +82,9 @@ class Player {
* @returns {boolean} Whether this player's turn has ended or not. * @returns {boolean} Whether this player's turn has ended or not.
*/ */
act(data) { act(data) {
console.log(`player: ${this.id}`);
console.log(data);
if (this.turnPhase === PHASE_REINFORCE) { if (this.turnPhase === PHASE_REINFORCE) {
if (this.reinforce(data)) { if (this.reinforce(data)) {
this.reinforcementsPlaced += 1; this.reinforcementsPlaced += 1;
@ -128,16 +131,17 @@ class Player {
* @param data Data received via socket * @param data Data received via socket
*/ */
fortify(data) { fortify(data) {
let sender = Region.getRegion(data.sender); let sender = Region.getRegion(data.startRegion);
let receiver = Region.getRegion(data.receiver); let receiver = Region.getRegion(data.endRegion);
let strength = parseInt(data.strength);
if ( if (
sender.owner === this && sender.owner === this &&
receiver.owner === this && receiver.owner === this &&
sender.strength > data.strength sender.strength > strength
) { ) {
receiver.reinforce(data.strength); receiver.reinforce(strength);
sender.strength -= data.strength; sender.strength -= strength;
return true; return true;
} else { } else {
return false; return false;

View File

@ -1,23 +1,43 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<title>Riskless</title> <title>Riskless</title>
<link href="{{ url_for('static', filename='css/style.css') }}" rel="stylesheet"> <link href="{{ url_for('static', filename='css/style.css') }}" rel="stylesheet">
<script src="https://cdn.socket.io/4.5.4/socket.io.min.js"></script> <script src="https://cdn.socket.io/4.5.4/socket.io.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js"></script>
<script src="{{ url_for('static', filename='js/index.js') }}"></script> <script src="{{ url_for('static', filename='js/index.js') }}"></script>
<script src="{{ url_for('static', filename='js/player.js') }}"></script> <script src="{{ url_for('static', filename='js/player.js') }}"></script>
<script src="{{ url_for('static', filename='js/dom.js') }}"></script> <script src="{{ url_for('static', filename='js/dom.js') }}"></script>
<script src="{{ url_for('static', filename='js/random.js') }}"></script> <script src="{{ url_for('static', filename='js/random.js') }}"></script>
<script src="{{ url_for('static', filename='js/barrier.js') }}"></script> <script src="{{ url_for('static', filename='js/barrier.js') }}"></script>
<script src="{{ url_for('static', filename='js/packet.js') }}"></script> <script src="{{ url_for('static', filename='js/packet.js') }}"></script>
<script src="{{ url_for('static', filename='js/map.js') }}"></script> <script src="{{ url_for('static', filename='js/map.js') }}"></script>
<script src="{{ url_for('static', filename='js/random_primes.js') }}"></script> <script src="{{ url_for('static', filename='js/random_primes.js') }}"></script>
<script src="{{ url_for('static', filename='js/paillier.js') }}"></script> <script src="{{ url_for('static', filename='js/paillier.js') }}"></script>
</head> </head>
<body> <body>
<div id="modal" class="hidden">
<div class="modal-content">
<div>
<label>
Amount
<input type="number" class="amount">
</label>
</div>
<div>
<label>
Target
<select class="target"></select>
</label>
</div>
<div class="button-row">
<button class="submit-modal">Submit</button>
<button class="cancel-modal">Cancel</button>
</div>
</div>
</div>
<div id="players"> <div id="players">
<strong>Players</strong> <strong>Players</strong>
@ -145,6 +165,5 @@
<button id="ready-button">Not ready</button> <button id="ready-button">Not ready</button>
<button id="end-turn" class="hidden">End Turn</button> <button id="end-turn" class="hidden">End Turn</button>
</div> </div>
</body>
</body>
</html> </html>