diff options
| author | Tor Andersson <tor@ccxvii.net> | 2025-02-27 21:26:03 +0100 |
|---|---|---|
| committer | Tor Andersson <tor@ccxvii.net> | 2025-02-27 21:26:03 +0100 |
| commit | 27872e4dc0bd20451d502be58cbed91aca7339a6 (patch) | |
| tree | 46bfea5431266e61c21c75cbb9b75d437ac2669e | |
| parent | 1f54f997168cda4b20585baccfc260004994e355 (diff) | |
| download | land-and-freedom-27872e4dc0bd20451d502be58cbed91aca7339a6.tar.gz | |
wip client
| -rw-r--r-- | play.html | 27 | ||||
| -rw-r--r-- | play.ts | 2 | ||||
| -rw-r--r-- | play2.css | 137 | ||||
| -rw-r--r-- | play2.js | 491 |
4 files changed, 395 insertions, 262 deletions
@@ -13,7 +13,7 @@ <script defer src="/common/client.js"></script> <script>var exports = {};</script> <script defer src="data.js"></script> -<script defer src="play.js"></script> +<script defer src="play2.js"></script> </head> <body> @@ -69,31 +69,6 @@ <main> <div id="mapwrap"> <div id="map"> - <div id="fronts"> - <div id="northern_front" class="front" style="left: 89px; top: 96px;"> - <div class="contributions"></div> - <span class="value"></span> - </div> - <div id="aragon_front" class="front" style="left: 340px; top: 182px;"> - <div class="contributions"></div> - <span class="value"></span> - </div> - <div id="madrid_front" class="front" style="left: 115px; top: 262px;"> - <div class="contributions"></div> - <span class="value"></span> - </div> - <div id="southern_front" class="front" style="left: 205px; top: 426px;"> - <div class="contributions"></div> - <span class="value"></span> - </div> - </div> - <div id="glory"></div> - <div id="spaces"></div> - <div id="pieces"></div> - <div id="markers"></div> - <div id="medallions"></div> - <div id="tracks"></div> - <div id="current_events"></div> </div> </div> <div id="selectable_cards"></div> @@ -14,7 +14,7 @@ const BONUSES_COUNT = 2; // const PIECE_COUNT = 32; const CARD_COUNT = 109; const GLORY_COUNT = 9; -const medallionS_COUNT = 9; +const MEDALLIONS_COUNT = 9; const STANDEES_COUNT = 5; const TRACK_COUNT = 5; const TRACK_LENGTH = 11; @@ -19,6 +19,104 @@ main { #map { background-image: url(images/map150.jpg); } } +#map > .token { + position: absolute; +} + +.track { + position: absolute; + background-color: #fff4; + border: 3px solid lime; + width: 52px; + height: 54px; +} + +.front { + position: absolute; + background-color: #fff4; + border: 6px solid lime; + border-radius: 34px; + + display: flex; + flex-wrap: wrap; + gap: 4px; +} + +.token { + background-color: #fff4; + border: 3px solid black; + width: 45px; + height: 45px; + box-shadow: 0 0 0 1px black, 1px 1px 4px #0006; +} + +.token.round { width: 58px; height: 58px; } +.token.square { width: 45px; height: 45px; } +.token.standee { width: 44px; height: 54px; } +.token.medallion { width: 53px; height: 53px; } + +.token.blank { + width: 45px; + height: 45px; + background-color: red; + border-radius: 50%; +} + +.token.round, .token.blank { + background-color: red; + border-radius: 50%; + border-color: pink darkred darkred pink; +} + +.token.round.off { + background-color: gray; + border-color: silver gray gray silver; +} + +.token.standee { + background-color: white; + border-radius: 10px; + border-color: #ddd #888 #888 #ddd; +} + +.standee_0 { background-image: url(images/tokens75/standee_0.png); } +.standee_1 { background-image: url(images/tokens75/standee_1.png); } +.standee_2 { background-image: url(images/tokens75/standee_2.png); } +.standee_3 { background-image: url(images/tokens75/standee_3.png); } +.standee_4 { background-image: url(images/tokens75/standee_4.png); } + +.medallion_0 { background-image: url(images/tokens75/medallion_0.png); } +.medallion_1 { background-image: url(images/tokens75/medallion_1.png); } +.medallion_2 { background-image: url(images/tokens75/medallion_2.png); } +.medallion_3 { background-image: url(images/tokens75/medallion_3.png); } +.medallion_4 { background-image: url(images/tokens75/medallion_4.png); } +.medallion_5 { background-image: url(images/tokens75/medallion_5.png); } +.medallion_6 { background-image: url(images/tokens75/medallion_6.png); } +.medallion_7 { background-image: url(images/tokens75/medallion_7.png); } +.medallion_8 { background-image: url(images/tokens75/medallion_8.png); } +.medallion_9 { background-image: url(images/tokens75/medallion_9.png); } + +.bonus_morale.off { background-image: url(images/tokens75/bonus_morale_off.png); } +.bonus_morale.on { background-image: url(images/tokens75/bonus_morale_on.png); } +.bonus_teamwork.off { background-image: url(images/tokens75/bonus_teamwork_off.png); } +.bonus_teamwork.on { background-image: url(images/tokens75/bonus_teamwork_on.png); } + +.token.medallion { + background-color: tan; + border-radius: 10px; + border-color: wheat brown brown wheat; +} + +.medallion_container { + position: absolute; + display: flex; + flex-wrap: wrap; + justify-content: center; + align-items: center; + width: 70px; + height: 70px; +} + /* PANELS */ .panel { @@ -72,45 +170,6 @@ main { background-image: url("images/initiative_counter_clockwise.png"); } -.standee[data-standee-id="0"] { - background-image: url("images/standees/standee_0.png"); -} - -.standee[data-standee-id="1"] { - background-image: url("images/standees/standee_1.png"); -} - -.standee[data-standee-id="2"] { - background-image: url("images/standees/standee_2.png"); -} - -.standee[data-standee-id="3"] { - background-image: url("images/standees/standee_3.png"); -} - -.standee[data-standee-id="4"] { - background-image: url("images/standees/standee_4.png"); -} - -.bonus[data-bonus-id="0"][data-bonus-on="0"] { - background-image: url("images/bonus/bonus_0_off.png"); -} - -.bonus[data-bonus-id="0"][data-bonus-on="1"] { - background-image: url("images/bonus/bonus_0_on.png"); -} - -.bonus[data-bonus-id="1"][data-bonus-on="0"] { - background-image: url("images/bonus/bonus_1_off.png"); -} - -.bonus[data-bonus-id="1"][data-bonus-on="1"] { - background-image: url("images/bonus/bonus_1_on.png"); -} - -.medallion[data-medallion-id="0"] { - background-image: url("images/medallions/medallion_0.png"); -} .medallion[data-medallion-id="1"] { background-image: url("images/medallions/medallion_1.png"); @@ -1,23 +1,56 @@ "use strict" const ui = { - map: document.getElementById('map'), - glory_container: document.getElementById('glory'), - hand: document.getElementById('hand'), - player_areas: { - Anarchist: document.getElementById('player_area_Anarchist'), - Communist: document.getElementById('player_area_Communist'), - Moderate: document.getElementById('player_area_Moderate'), - }, + map: document.getElementById("map"), + + hand: document.getElementById("hand"), tableaus: { - a: document.getElementById('tableau_a'), - c: document.getElementById('tableau_c'), - m: document.getElementById('tableau_m'), + a: document.getElementById("tableau_a"), + c: document.getElementById("tableau_c"), + m: document.getElementById("tableau_m"), }, - standees: [], + + // spaces + tracks: [], fronts: [], + + // tokens + standees: [], + bonuses: [], + medallions: [], + blank_markers: [], + + // cards cards: [], -}; +} + +const boxes = { + "Northern": [149,146,149,149], + "Aragon": [563,275,149,149], + "Southern": [341,641,149,149], + "Madrid": [195,398,161,161], + "Liberty": [955,65,662,59], + "Collectivization": [954,231,663,60], + "SovietSupport": [954,564,663,59], + "ForeignAid": [954,730,663,59], + "Government": [1015,398,602,58], + "Medallion1": [608,834,69,70], + "Medallion2": [690,834,70,70], + "Medallion3": [772,834,70,70], + "Medallion4": [855,834,70,70], + "Medallion5": [937,834,70,70], + "CurrentYearDeck": [38,976,187,261], + "CurrentEvent1": [301,976,187,261], + "CurrentEvent2": [526,976,187,261], + "CurrentEvent3": [751,976,187,261], + "CurrentEvent4": [976,976,187,261], + "Glory1": [1320,966,59,59], + "Glory2": [1418,966,119,59], + "Glory3": [1399,1075,58,58], + "Glory4": [1278,1153,300,59], + "Bonus1": [728,726,74,73], + "Bonus2": [818,726,74,73], +} let action_register = [] @@ -40,70 +73,135 @@ function is_action(action, arg) { return !!(view.actions && view.actions[action] && view.actions[action].includes(arg)) } -let on_init_once = false; +let on_init_once = false + +function build_track(t, action_name, track_name, a, b) { + let [x, y, w, h] = boxes[track_name] + let e + + ui.tracks[t] = [] + for (let s = a; s <= b; ++s) { + const bm = t * 11 + s + + e = (ui.blank_markers[bm] = document.createElement("div")) + e.className = "token blank" + e.style.top = Math.round(y+4) + "px" + e.style.left = Math.round(x+3) + "px" + register_action(e, "blank_marker", bm) + ui.map.appendChild(e) + + e = ui.tracks[t][s] = document.createElement("div") + e.className = "track" + e.style.top = y + "px" + e.style.left = (x|0) + "px" + register_action(e, action_name, s); + //ui.map.appendChild(e) + + x += 60.5 + } + + e = (ui.standees[t] = document.createElement("div")) + e.className = "token standee standee_" + t + e.style.top = y - 10 + "px" + e.style.left = boxes[track_name][0] + 5 + "px" + register_action(e, "standee", t) + ui.map.appendChild(ui.standees[t]) + +} + +function build_bonus(b, box_name, cname) { + let e = ui.bonuses[b] = document.createElement("div") + let [x, y, w, h] = boxes[box_name] + e.className = "token round " + cname + e.style.top = Math.round(y + w/2 - 32) + "px" + e.style.left = Math.round(x + w/2 - 32) + "px" + register_action(e, "bonus", b) + ui.map.appendChild(e) +} + +function build_front(i, box_name) { + let e = ui.fronts[i] = document.createElement("div") + let [x, y, w, h] = boxes[box_name] + e.className = "front" + e.style.top = Math.round(y-3) + "px" + e.style.left = Math.round(x-3) + "px" + e.style.width = Math.round(w - 6) + "px" + e.style.height = Math.round(h - 6) + "px" + register_action(e, "front", i) + ui.map.appendChild(e) + + for (let i = 0; i < 5; ++i) { + let m = document.createElement("div") + m.className = "token square front_plus" + e.appendChild(m) + } +} function on_init() { - if (on_init_once) - return; - on_init_once = true; - for (let t = 0; t < TRACK_COUNT; ++t) { - for (let s = 0; s < TRACK_LENGTH; ++s) { - const bm = t * 11 + s; - let e = (ui.blank_markers[bm] = document.createElement('div')); - e.className = 'blank_marker'; - register_action(e, 'blank_marker', bm); - } - } - for (let b = 0; b < BONUSES_COUNT; ++b) { - let e = (ui.bonuses[b] = document.createElement('div')); - e.className = 'bonus'; - e.setAttribute('data-bonus-id', '' + b); - e.style.left = LAYOUT_BONUSES[b][0] + 'px'; - e.style.top = LAYOUT_BONUSES[b][1] + 'px'; - LAYOUT_BONUSES; - register_action(e, 'bonus', b); - ui.map.appendChild(ui.bonuses[b]); - } - for (let g = 0; g < GLORY_COUNT; ++g) { - let e = (ui.glory[g] = document.createElement('div')); - e.className = 'faction_token'; - ui.glory_container.appendChild(ui.glory[g]); - e.style.left = LAYOUT_GLORY[g][0] + 'px'; - e.style.top = LAYOUT_GLORY[g][1] + 'px'; - } - for (let m = 0; m < medallionS_COUNT; ++m) { - let e = (ui.medallions[m] = document.createElement('div')); - e.className = 'medallion'; - e.setAttribute('data-medallion-id', '' + m); - register_action(e, 'medallion', m); - } - for (let s = 0; s < STANDEES_COUNT; ++s) { - let e = (ui.standees[s] = document.createElement('div')); - e.className = 'standee'; - e.setAttribute('data-standee-id', '' + s); - register_action(e, 'standee', s); - ui.tracks.appendChild(ui.standees[s]); - } - for (let c = 1; c < CARD_COUNT; ++c) { - let e = (ui.cards[c] = document.createElement('div')); - e.className = 'card'; - e.setAttribute('data-card-id', '' + data.cards[c].id); - register_action(e, 'card', c); - } - let e = (ui.initiative_token = document.createElement('div')); - e.className = 'initiative_token'; - data.fronts.forEach((front) => { - ui.tokens_on_front[front.id] = {}; - FACTIONS.forEach((faction_id) => { - let e = (ui.tokens_on_front[front.id][faction_id] = - document.createElement('div')); - e.className = 'faction_token'; - e.setAttribute('data-faction-id', faction_id); - }); - }); - Object.keys(ui.fronts).forEach((front_id) => { - register_action(ui.fronts[front_id].front, 'front', front_id); - }); + if (on_init_once) + return + on_init_once = true + + build_track(LIBERTY, "tr_liberty", "Liberty", 0, 10) + build_track(COLLECTIVIZATION, "tr_collectivization", "Collectivization", 0, 10) + build_track(GOVERNMENT, "tr_government", "Government", 1, 10) + build_track(SOVIET_SUPPORT, "tr_soviet_support", "SovietSupport", 0, 10) + build_track(FOREIGN_AID, "tr_foreign_aid", "ForeignAid", 0, 10) + + build_bonus(0, "Bonus1", "bonus_morale on") + build_bonus(1, "Bonus2", "bonus_teamwork off") + + build_front(0, "Aragon") + build_front(1, "Madrid") + build_front(2, "Northern") + build_front(3, "Southern") + + ui.medallion_container = [] + for (let i = 0; i < 5; ++i) { + ui.medallion_container[i] = document.createElement("div") + ui.medallion_container[i].classList = "medallion_container" + ui.medallion_container[i].style.top = boxes["Medallion"+(i+1)][1] + "px" + ui.medallion_container[i].style.left = boxes["Medallion"+(i+1)][0] + "px" + ui.map.appendChild(ui.medallion_container[i]) + } + + for (let m = 0; m < 9; ++m) { + let e = (ui.medallions[m] = document.createElement("div")) + e.className = "token medallion medallion_" + m + register_action(e, "medallion", m) + if (m < 5) + ui.medallion_container[m].appendChild(ui.medallions[m]) + } + + for (let c = 1; c < CARD_COUNT; ++c) { + let e = (ui.cards[c] = document.createElement("div")) + e.className = "card" + e.setAttribute("data-card-id", "" + data.cards[c].id) + register_action(e, "card", c) + } + + for (let g = 0; g < GLORY_COUNT; ++g) { + let e = (ui.glory[g] = document.createElement("div")) + e.className = "token player" + ui.glory_container.appendChild(ui.glory[g]) + e.style.left = LAYOUT_GLORY[g][0] + "px" + e.style.top = LAYOUT_GLORY[g][1] + "px" + } + + let e = (ui.initiative_token = document.createElement("div")) + e.className = "initiative_token" + + data.fronts.forEach((front) => { + ui.tokens_on_front[front.id] = {} + FACTIONS.forEach((faction_id) => { + let e = (ui.tokens_on_front[front.id][faction_id] = document.createElement("div")) + e.className = "faction_token" + e.setAttribute("data-faction-id", faction_id) + }) + }) + Object.keys(ui.fronts).forEach((front_id) => { + register_action(ui.fronts[front_id].front, "front", front_id) + }) } function place_cards(e, cards) { @@ -118,125 +216,126 @@ function place_cards(e, cards) { } function on_update() { - console.log('on_update', view); - on_init(); - for (let key of Object.keys(view.hero_points)) { - ui.roles[key].hero_points.replaceChildren(`Hero Points: ${view.hero_points[key]}`); - } - ui.bag_of_glory.replaceChildren(`Bag of Glory: ${view.bag_of_glory_count}`); - ui.current_events.replaceChildren(); - for (let i = 0; i < view.current_events.length; i++) { - const cardId = view.current_events[i]; - ui.current_events.appendChild(ui.cards[cardId]); - ui.cards[cardId].classList.add('event'); - ui.cards[cardId].style.left = LAYOUT_CURRENT_EVENTS[i][0] + 'px'; - ui.cards[cardId].style.top = LAYOUT_CURRENT_EVENTS[i][1] + 'px'; - } - ui.markers.replaceChildren(); - for (let bm of view.triggered_track_effects) { - const s = bm % 11; - const t = Math.floor(bm / 11); - ui.markers.appendChild(ui.blank_markers[bm]); - ui.blank_markers[bm].style.left = LAYOUT_TRACKS[t][s][0] + 'px'; - ui.blank_markers[bm].style.top = LAYOUT_TRACKS[t][s][1] + 'px'; - } - for (let bonus_id of Object.keys(view.bonuses)) { - ui.bonuses[bonus_id].setAttribute('data-bonus-on', view.bonuses[bonus_id] + 0); - } - place_cards(ui.hand, view.hand); - ui.player_area_tabs.hand_tab.replaceChildren(`Hand (${view.hand.length})`); - place_cards(ui.player_area_cards.deck, view.deck); - ui.player_area_tabs.deck_tab.replaceChildren(`Deck (${view.deck.length})`); - place_cards(ui.player_area_cards.discard, view.discard); - ui.player_area_tabs.discard_tab.replaceChildren(`Discard (${view.discard.length})`); - place_cards(ui.player_area_cards.trash, view.trash); - ui.player_area_tabs.trash_tab.replaceChildren(`Trash (${view.trash.length})`); - place_cards(ui.selectable_cards, view.selectable_cards); - for (let faction_id of FACTIONS) { - place_cards(ui.tableaus[faction_id], view.tableaus[faction_id]); - } - for (let i = 0; i < view.tracks.length; ++i) { - ui.standees[i].style.left = LAYOUT_TRACKS[i][view.tracks[i]][0] + 'px'; - ui.standees[i].style.top = LAYOUT_TRACKS[i][view.tracks[i]][1] + 'px'; - } - for (let front_id of Object.keys(view.fronts)) { - const front_data = view.fronts[front_id]; - ui.fronts[front_id].value.replaceChildren(front_data.status !== null ? front_data.status : front_data.value); - ui.fronts[front_id].contributions.replaceChildren(); - for (let faction_id of front_data.contributions) { - ui.fronts[front_id].contributions.appendChild(ui.tokens_on_front[front_id][faction_id]); - } - } - ui.medallions_container.replaceChildren(); - for (let i = 0; i < view.medallions.pool.length; ++i) { - if (view.medallions.pool[i] !== null) { - const id = view.medallions.pool[i]; - ui.medallions[id].style.left = LAYOUT_medallionS[i][0] + 'px'; - ui.medallions[id].style.top = LAYOUT_medallionS[i][1] + 'px'; - ui.medallions_container.appendChild(ui.medallions[id]); - } - } - for (let f of FACTIONS) { - ui.roles[f].medallions.replaceChildren(); - for (let m of view.medallions[f]) { - ui.roles[f].medallions.appendChild(ui.medallions[m]); - } - } - ui.roles[view.initiative].medallions.appendChild(ui.initiative_token); - ui.initiative_token.setAttribute('data-year', view.year); - if (view.played_card === null) { - ui.turn_info.style.display = 'none'; - } - else { - ui.turn_info.style.display = ''; - ui.turn_info_card.setAttribute('data-card-id', view.played_card + ''); - } - Object.values(ui.glory).forEach((elt) => elt.removeAttribute('data-faction-id')); - for (let g = 0; g < view.glory.length; ++g) { - ui.glory[g].setAttribute('data-faction-id', view.glory[g]); - } - for (let e of action_register) - e.classList.toggle('action', is_action(e.my_action, e.my_id)); - ui.year.replaceChildren(`Year ${view.year}`); - action_button('add_to_front', '+1 to a Front'); - action_button('d_liberty', 'Decrease Liberty'); - action_button('soviet_support', 'Soviet Support'); - action_button('collectivization', 'Collectivization'); - action_button('d_collectivization', 'Decrease Collectivization'); - action_button('d_foreign_aid', 'Decrease Foreign Aid'); - action_button('d_government', 'Decrease Government'); - action_button('d_soviet_support', 'Decrease Soviet Support'); - action_button('foreign_aid', 'Foreign Aid'); - action_button('government', 'Government'); - action_button('liberty', 'Liberty'); - action_button('government_to_center', 'Government towards center'); - action_button('teamwork_on', 'Teamwork Bonus On'); - action_button('Anarchist', 'Anarchist'); - action_button('Communist', 'Communist'); - action_button('Moderate', 'Moderate'); - action_button('gain_hp', 'Gain Hero Points'); - action_button('lose_hp', 'Lose Hero Points'); - action_button('draw_card', 'Draw a card'); - action_button('draw_cards', 'Draw cards'); - action_button('play_to_tableau', 'Play card to Tableau'); - action_button('play_for_event', 'Play card for Event'); - action_button('use_ap', 'Use Action Points'); - action_button('use_morale_bonus', 'Use Morale Bonus'); - action_button('move_track', 'Move a Track'); - action_button('turn_on_bonus', 'Turn on a Bonus'); - action_button('add_glory', 'Add to Bag of Glory'); - action_button('draw_glory', 'Draw from Bag of Glory'); - action_button('up', 'Up'); - action_button('down', 'Down'); - action_button('next', 'Next'); - action_button('remove_blank_marker', 'Remove Blank marker'); - action_button('confirm', 'Confirm'); - action_button('yes', 'Yes'); - action_button('no', 'No'); - action_button('skip', 'Skip'); - action_button('spend_hp', 'Spend Hero Points'); - action_button('use_momentum', 'Play second card (Momentum)'); - action_button('done', 'Done'); - action_button('end_turn', 'End turn'); - action_button('undo', 'Undo'); + console.log("on_update", view) + on_init() + for (let key of Object.keys(view.hero_points)) { + ui.roles[key].hero_points.replaceChildren(`Hero Points: ${view.hero_points[key]}`) + } + ui.bag_of_glory.replaceChildren(`Bag of Glory: ${view.bag_of_glory_count}`) + ui.current_events.replaceChildren() + for (let i = 0; i < view.current_events.length; i++) { + const cardId = view.current_events[i] + ui.current_events.appendChild(ui.cards[cardId]) + ui.cards[cardId].classList.add("event") + ui.cards[cardId].style.left = LAYOUT_CURRENT_EVENTS[i][0] + "px" + ui.cards[cardId].style.top = LAYOUT_CURRENT_EVENTS[i][1] + "px" + } + ui.markers.replaceChildren() + for (let bm of view.triggered_track_effects) { + const s = bm % 11 + const t = Math.floor(bm / 11) + ui.markers.appendChild(ui.blank_markers[bm]) + ui.blank_markers[bm].style.left = LAYOUT_TRACKS[t][s][0] + "px" + ui.blank_markers[bm].style.top = LAYOUT_TRACKS[t][s][1] + "px" + } + for (let bonus_id of Object.keys(view.bonuses)) { + ui.bonuses[bonus_id].setAttribute("data-bonus-on", view.bonuses[bonus_id] + 0) + } + place_cards(ui.hand, view.hand) + ui.player_area_tabs.hand_tab.replaceChildren(`Hand (${view.hand.length})`) + place_cards(ui.player_area_cards.deck, view.deck) + ui.player_area_tabs.deck_tab.replaceChildren(`Deck (${view.deck.length})`) + place_cards(ui.player_area_cards.discard, view.discard) + ui.player_area_tabs.discard_tab.replaceChildren(`Discard (${view.discard.length})`) + place_cards(ui.player_area_cards.trash, view.trash) + ui.player_area_tabs.trash_tab.replaceChildren(`Trash (${view.trash.length})`) + place_cards(ui.selectable_cards, view.selectable_cards) + for (let faction_id of FACTIONS) { + place_cards(ui.tableaus[faction_id], view.tableaus[faction_id]) + } + for (let i = 0; i < view.tracks.length; ++i) { + ui.standees[i].style.left = LAYOUT_TRACKS[i][view.tracks[i]][0] + "px" + ui.standees[i].style.top = LAYOUT_TRACKS[i][view.tracks[i]][1] + "px" + } + for (let front_id of Object.keys(view.fronts)) { + const front_data = view.fronts[front_id] + ui.fronts[front_id].value.replaceChildren(front_data.status !== null ? front_data.status : front_data.value) + ui.fronts[front_id].contributions.replaceChildren() + for (let faction_id of front_data.contributions) { + ui.fronts[front_id].contributions.appendChild(ui.tokens_on_front[front_id][faction_id]) + } + } + ui.medallions_container.replaceChildren() + for (let i = 0; i < view.medallions.pool.length; ++i) { + if (view.medallions.pool[i] !== null) { + const id = view.medallions.pool[i] + ui.medallions[id].style.left = LAYOUT_MEDALLIONS[i][0] + "px" + ui.medallions[id].style.top = LAYOUT_MEDALLIONS[i][1] + "px" + ui.medallions_container.appendChild(ui.medallions[id]) + } + } + for (let f of FACTIONS) { + ui.roles[f].medallions.replaceChildren() + for (let m of view.medallions[f]) { + ui.roles[f].medallions.appendChild(ui.medallions[m]) + } + } + ui.roles[view.initiative].medallions.appendChild(ui.initiative_token) + ui.initiative_token.setAttribute("data-year", view.year) + if (view.played_card === null) { + ui.turn_info.style.display = "none" + } else { + ui.turn_info.style.display = "" + ui.turn_info_card.setAttribute("data-card-id", view.played_card + "") + } + Object.values(ui.glory).forEach((elt) => elt.removeAttribute("data-faction-id")) + for (let g = 0; g < view.glory.length; ++g) { + ui.glory[g].setAttribute("data-faction-id", view.glory[g]) + } + for (let e of action_register) + e.classList.toggle("action", is_action(e.my_action, e.my_id)) + ui.year.replaceChildren(`Year ${view.year}`) + + action_button("add_to_front", "+1 to a Front") + action_button("d_liberty", "Decrease Liberty") + action_button("soviet_support", "Soviet Support") + action_button("collectivization", "Collectivization") + action_button("d_collectivization", "Decrease Collectivization") + action_button("d_foreign_aid", "Decrease Foreign Aid") + action_button("d_government", "Decrease Government") + action_button("d_soviet_support", "Decrease Soviet Support") + action_button("foreign_aid", "Foreign Aid") + action_button("government", "Government") + action_button("liberty", "Liberty") + action_button("government_to_center", "Government towards center") + action_button("teamwork_on", "Teamwork Bonus On") + action_button("Anarchist", "Anarchist") + action_button("Communist", "Communist") + action_button("Moderate", "Moderate") + action_button("gain_hp", "Gain Hero Points") + action_button("lose_hp", "Lose Hero Points") + action_button("draw_card", "Draw a card") + action_button("draw_cards", "Draw cards") + action_button("play_to_tableau", "Play card to Tableau") + action_button("play_for_event", "Play card for Event") + action_button("use_ap", "Use Action Points") + action_button("use_morale_bonus", "Use Morale Bonus") + action_button("move_track", "Move a Track") + action_button("turn_on_bonus", "Turn on a Bonus") + action_button("add_glory", "Add to Bag of Glory") + action_button("draw_glory", "Draw from Bag of Glory") + action_button("up", "Up") + action_button("down", "Down") + action_button("next", "Next") + action_button("remove_blank_marker", "Remove Blank marker") + action_button("confirm", "Confirm") + action_button("yes", "Yes") + action_button("no", "No") + action_button("skip", "Skip") + action_button("spend_hp", "Spend Hero Points") + action_button("use_momentum", "Play second card (Momentum)") + action_button("done", "Done") + action_button("end_turn", "End turn") + action_button("undo", "Undo") + } |