diff options
-rw-r--r-- | play.css | 14 | ||||
-rw-r--r-- | play.html | 60 | ||||
-rw-r--r-- | play.js | 73 |
3 files changed, 44 insertions, 103 deletions
@@ -234,22 +234,10 @@ body.Communist header.your_turn { background-color: hsl(355, 70%, 75%); } min-height: 350px; } -.panel:has(.panel_body:empty) { +.panel.autohide:has(.panel_body:empty) { display: none; } -#scoring_card_panel { - display: flex; - flex-direction: column; - width: 100%; -} - -#scoring_card_panel .card_row { - display: flex; - gap: 10px; -} - - /* CARD IMAGES */ #tooltip { @@ -66,72 +66,49 @@ </div> </div> -<!-- EVENTS ON THE TABLE --> -<div id="table_panel" class="panel"> - <div id="table_header" class="panel_header">Cards on the Table</div> - <div id="table_cards" class="panel_body"></div> -</div> - -<!-- PLAYED CARD --> <div id="played_card_panel" class="panel"> <div id="played_card_header" class="panel_header">Played Card</div> <div id="played_card" class="panel_body"></div> - <!--- <div id="power_card_header" class="panel_header">Power Struggle</div> - <div id="communist_card" class="panel_body"></div> - <div id="democrat_card" class="panel_body"></div> ---> - -</div> - -<!-- PLAYED CARD - POWERSTRUGGLE --> -<div id="scoring_card_panel" class="panel"> - <div id="scoring_card_header" class="panel_header">Power Struggle</div> - <div class="card_row"> - <div id="scoring_card" class="panel_body"></div> - <div id="power_card_1" class="panel_body"></div> - <div id="power_card_2" class="panel_body"></div> - </div> </div> - -<!-- POWERSTRUGGLE --> -<div id="played_power_card_panel" class="panel"> - <div id="played_power_card_header" class="panel_header">Power Struggle</div> - <div id="played_power_card" class="panel_body"></div> -</div> -<div id="ceausescu_panel" class="panel"> - <div id="ceausescu_header" class="panel_header">Ceausescu Cards</div> - <div id="ceausescu_hand" class="panel_body"></div> -</div> -<div id="power_panel" class="panel"> +<div id="power_panel" class="autohide panel"> <div id="power_header" class="panel_header">Power Struggle Hand</div> <div id="power_hand" class="panel_body"></div> </div> +<div id="ceausescu_panel" class="autohide panel"> + <div id="ceausescu_header" class="panel_header">The Crowd Turns Against Ceausescu</div> + <div id="ceausescu_hand" class="panel_body"></div> +</div> +<div id="power_discard_panel" class="autohide panel"> + <div id="power_discard_header" class="panel_header">Power Struggle Discard</div> + <div id="power_discard" class="panel_body"></div> +</div> -<!-- HAND --> <div id="hand_panel" class="panel"> <div id="hand_header" class="panel_header">Hand</div> <div id="hand" class="panel_body"></div> </div> <!-- OPPONENT HAND --> -<div id="opp_hand_panel" class="panel"> +<div id="opp_hand_panel" class="autohide panel"> <div id="opp_hand_header" class="panel_header">Opponent Hand</div> <div id="opp_hand" class="panel_body"></div> </div> -<div id="opp_power_hand_panel" class="panel"> - <div id="opp_power_hand_header" class="panel_header">Opponent Power Struggle Hand</div> - <div id="opp_power_hand" class="panel_body"></div> -</div> - <!-- SAMIZDAT CARD --> -<div id="samizdat_panel" class="panel"> - <div id="samizdat_header" class="panel_header">Samizdat Card</div> +<div id="samizdat_panel" class="autohide panel"> + <div id="samizdat_header" class="panel_header">Samizdat</div> <div id="samizdat_card" class="panel_body"></div> </div> +<!-- EVENTS ON THE TABLE --> +<div id="persistent_panel" class="panel"> + <div id="persistent_header" class="panel_header">Persistent Events on the Table</div> + <div id="persistent" class="panel_body"></div> +</div> + <!-- PERMANENTLY REMOVED --> <div id="removed_panel" class="panel hide"> <div id="removed_header" class="panel_header">Permanently Removed Events</div> @@ -144,7 +121,6 @@ <div id="discard" class="panel_body"></div> </div> - </main> <footer id="status"></footer> @@ -370,17 +370,13 @@ const ui = { event_reminder_list: document.getElementById("event_reminder_list"), played_card: document.getElementById("played_card"), - scoring_card: document.getElementById("scoring_card"), - played_power_card: document.getElementById("played_power_card"), - power_card_1: document.getElementById("power_card_1"), - power_card_2: document.getElementById("power_card_2"), hand: document.getElementById("hand"), power_hand: document.getElementById("power_hand"), + power_discard: document.getElementById("power_discard"), opp_hand: document.getElementById("opp_hand"), - opp_power_hand: document.getElementById("opp_power_hand"), discard: document.getElementById("discard"), removed: document.getElementById("removed"), - table_cards: document.getElementById("table_cards"), + persistent: document.getElementById("persistent"), ceausescu_hand: document.getElementById("ceausescu_hand"), samizdat_card: document.getElementById("samizdat_card"), @@ -643,27 +639,6 @@ function on_update() { // UPDATE CARD DISPLAYS - ui.played_card.replaceChildren() - ui.power_card_1.replaceChildren() - ui.power_card_2.replaceChildren() - - if (!view.is_pwr_struggle) { - if (view.played_card > 0) - ui.played_card.appendChild(ui.cards[view.played_card]) - document.getElementById("scoring_card_panel").style.display = "none" - } else { - document.getElementById("scoring_card_panel").style.display = "flex" - if (view.played_card > 0) - ui.scoring_card.appendChild(ui.cards[view.played_card]) - if (view.power_card_1) - ui.power_card_1.appendChild(ui.power_cards[view.power_card_1]) - if (view.power_card_2) - ui.power_card_2.appendChild(ui.power_cards[view.power_card_2]) - } -/* ui.played_power_card.replaceChildren() - if (view.played_power_card > 0) - ui.played_power_card.appendChild(ui.power_cards[view.played_power_card])*/ - ui.samizdat_card.replaceChildren() if (view.samizdat > 0) ui.samizdat_card.appendChild(ui.cards[view.samizdat]) @@ -676,14 +651,16 @@ function on_update() { if (view.power_hand) for (let c of view.power_hand) ui.power_hand.appendChild(ui.power_cards[c]) - + + ui.power_discard.replaceChildren() + if (view.power_struggle_discard) + for (let c of view.power_struggle_discard) + ui.power_discard.appendChild(ui.power_cards[c]) + ui.opp_hand.replaceChildren() - if (view.show_opp_hand && view.opp_hand) + if (view.opp_hand) for (let c of view.opp_hand) ui.opp_hand.appendChild(ui.cards[c]) - - // TODO: fix rules to set view.opp_power_hand - ui.opp_power_hand.replaceChildren() if (view.opp_power_hand) for (let c of view.opp_power_hand) ui.opp_hand.appendChild(ui.power_cards[c]) @@ -694,24 +671,24 @@ function on_update() { ui.ceausescu_hand.appendChild(ui.power_cards[c]) ui.discard.replaceChildren() - for (let c of view.strategy_discard) { - if (c === view.played_card) continue - ui.discard.appendChild(ui.cards[c]) } - if (view.discard) - document.getElementById("discard_panel").classList.remove("hide") - else - document.getElementById("discard_panel").classList.add("hide") + for (let c of view.strategy_discard) + ui.discard.appendChild(ui.cards[c]) ui.removed.replaceChildren() - for (let c of view.strategy_removed) { - if (c === view.played_card) continue - ui.removed.appendChild(ui.cards[c]) } - - ui.table_cards.replaceChildren() - if (view.table_cards) - for (let c of view.table_cards) { - if (c === view.played_card) continue - ui.table_cards.appendChild(ui.cards[c]) } + for (let c of view.strategy_removed) + ui.removed.appendChild(ui.cards[c]) + + ui.persistent.replaceChildren() + for (let c of view.persistent_events) + ui.persistent.appendChild(ui.cards[c]) + + ui.played_card.replaceChildren() + if (view.played_card > 0) + ui.played_card.appendChild(ui.cards[view.played_card]) + if (view.power_card_1 > 0) + ui.played_card.appendChild(ui.power_cards[view.power_card_1]) + if (view.power_card_2 > 0) + ui.played_card.appendChild(ui.power_cards[view.power_card_2]) for (let e of action_register) e.classList.toggle("action", is_action(e.my_action, e.my_id)) |