murk/Dominion
1
0
Fork 0
Code Issues 8 Pull Requests Releases Wiki Activity

Add workshop and remodel effects

Browse Source
This commit is contained in:
Markus Wagner
2021-01-20 20:11:11 +01:00
parent d6e2543b9c
commit f2dab8a71c
2 changed files with 233 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

89
static/game.html
View File

@@ -86,6 +86,10 @@ img.card:hover {
box-shadow: 0 0 10px lime;
}
.supply-pile.selected {
box-shadow: 0 0 10px lime;
}
.chat-window {
border: 1px solid black;
width: 300px;
@@ -431,6 +435,15 @@ img.card:hover {
color: white;
visibility: hidden;
grid-template-rows: 5fr auto;
transition: top 0.1s ease-in;
}
.dialog.supply {
top: 80%;
}
.dialog.hand {
top: 50%;
}
.dialog img {
@@ -462,23 +475,47 @@ img.card:hover {
var resolve_request;
var enable_hand_selection = false;
var enable_supply_selection = false;
var toggle_hand_selection = function(index) {
document.querySelectorAll(".player-hand img.card")[index].classList.toggle("selected");
}
var toggle_supply_selection = function(index) {
document.querySelectorAll(".supply-area .supply-pile")[index].classList.toggle("selected");
}
function dialog_confirm(ev) {
var selected = [];
document.querySelectorAll(".player-hand img.card.selected").forEach((c) => {
selected.push(parseInt(c.dataset.index));
c.classList.remove("selected");
});
var msg = { type: "HandCardsChosen", choice: selected };
webSocket.send(JSON.stringify(msg));
enable_hand_selection = false;
if (resolve_request.request.type == "GainCard") {
var selected = document.querySelector(".supply-pile.selected");
if (selected) {
selected = parseInt(selected.dataset.index);
}
document.querySelectorAll(".supply-pile.selected").forEach((c) => {
c.classList.remove("selected");
});
var reply = { type: "SupplyCardChosen", choice: selected };
var msg = { type: "ResolveReply", reply: reply };
webSocket.send(JSON.stringify(msg));
enable_supply_selection = false;
} else {
var selected = [];
document.querySelectorAll(".player-hand img.card.selected").forEach((c) => {
selected.push(parseInt(c.dataset.index));
c.classList.remove("selected");
});
var reply = { type: "HandCardsChosen", choice: selected };
var msg = { type: "ResolveReply", reply: reply };
webSocket.send(JSON.stringify(msg));
enable_hand_selection = false;
}
document.querySelector("#dialog").style.visibility = "hidden";
dialog.classList.remove("hand");
dialog.classList.remove("supply");
}
var mouseenter = function(ev) {
@@ -552,6 +589,13 @@ img.card:hover {
ev.dataTransfer.setData("text", JSON.stringify(data));
}
var click = function(e) {
e.preventDefault();
if (enable_supply_selection) {
toggle_supply_selection(parseInt(e.srcElement.parentElement.dataset.index));
}
}
var doubleclick = function(ev) {
let msg = {
type: "BuyCard",
@@ -570,6 +614,7 @@ img.card:hover {
"data-index": vnode.attrs.index,
ondragstart: dragStart,
draggable: true,
onclick: click,
ondblclick: doubleclick,
},
m("img", {
@@ -722,7 +767,6 @@ img.card:hover {
}
}
return {
view: function(vnode) {
return m(".player-hand",
@@ -1024,9 +1068,26 @@ img.card:hover {
var handle_resolve_request = function(request) {
var dlg = document.querySelector("#dialog");
dlg.style.visibility = "visible";
resolve_request = request;
enable_hand_selection = true;
document.querySelector("#dialog img").src = "/static/images/cards/" + request.card.toLowerCase() + ".jpg";
if (request.request.type == "GainCard") {
let cost = request.request?.filter?.MaxCost;
if (cost) {
document.querySelector("#dialog p").innerHTML = "Choose a card to gain with max cost of " + cost + ".";
} else {
document.querySelector("#dialog p").innerHTML = "Choose a card to gain.";
}
enable_supply_selection = true;
dialog.classList.add("supply");
} else if (request.request.type == "ChooseHandCardsToDiscard") {
document.querySelector("#dialog p").innerHTML = "Choose any number of cards to discard.";
enable_hand_selection = true;
dialog.classList.add("hand");
}
dlg.style.visibility = "visible";
}
var handle_gameover = function(msg) {
@@ -1077,7 +1138,7 @@ img.card:hover {
} else if (msg.type == "PlayerId") {
my_player_id = msg.id;
} else if (msg.type == "ResolveRequest") {
handle_resolve_request(msg.request);
handle_resolve_request(msg);
} else {
console.log("event?");
console.log(event.data);