diff options
| -rw-r--r-- | play.html | 100 | ||||
| -rw-r--r-- | play.js | 16 | ||||
| -rw-r--r-- | rules.js | 13 |
3 files changed, 78 insertions, 51 deletions
@@ -43,56 +43,53 @@ header.your_turn { background-color: orange; } font-variant-numeric: tabular-nums; } +/* PANELS */ + +.panel { + user-select: none; + max-width: 1275px; + margin: 36px auto; + //box-shadow: 0px 0px 4px #0008; +} + +.panel_header { + font-weight: bold; + text-align: center; + padding: 3px 1em; +} + /* ARTS OF WAR */ #arts_of_war { - background-color: white; - border: 1px solid black; - position: fixed; - top: 80px; - left: 36px; - box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.5); - z-index: 50; - user-select: none; + background-color: slategray; } #arts_of_war_header { - font-weight: bold; - cursor: move; - border-bottom: 1px solid black; background-color: lightsteelblue; - padding: 3px 1em; } #arts_of_war_list { - padding: 12px; - width: calc(186px * 4 + 12px * 3 + 12px); - height: 400px; - background-color: slategray; + min-height: 260px; display: flex; justify-content: center; flex-wrap: wrap; - overflow-y: scroll; + padding: 18px; gap: 12px; } /* PLAN */ #plan { - user-select: none; - max-width: 1275px; - margin: 36px auto; + background-color: #555; } #plan_header { - font-weight: bold; - text-align: center; background-color: #444; color: white; - padding: 3px 1em; } #plan_list { + min-height: 260px; display: flex; flex-wrap: wrap; justify-content: center; @@ -101,6 +98,8 @@ header.your_turn { background-color: orange; } } #plan_actions { + background-color: #444; + min-height: 130px; display: flex; flex-wrap: wrap; justify-content: center; @@ -109,15 +108,6 @@ header.your_turn { background-color: orange; } flex-wrap: wrap; } -#plan_list { - background-color: #555; -} - -#plan_actions { - //border-top: 2px dotted white; - background-color: #444; -} - body.Russians #plan_actions .teutonic { display: none } body.Teutons #plan_actions .russian { display: none } @@ -493,11 +483,15 @@ body.shift .mustered_vassals { flex-wrap: wrap; justify-content: center; align-items: center; - min-height: 350px; + min-height: 260px; max-width: 1275px; gap: 16px; } +.hand:empty { + display: none; +} + .card { background-size: 186px 260px; width: 186px; @@ -518,6 +512,9 @@ body.shift .mustered_vassals { filter: grayscale(100%) brightness(66%); } +.card.selected.teutonic { background-color: #e1e6e8; box-shadow: 0 0 0 1px #666a6c, 0 0 0 3px yellow; } +.card.selected.russian { background-color: #e1d6c1; box-shadow: 0 0 0 1px #665c4a, 0 0 0 3px yellow; } + /* MAP */ #mapwrap { @@ -806,14 +803,20 @@ body.shift .mustered_vassals { position: absolute; } -.service_marker.teutonic.lord.action, +.service_marker.teutonic.lord.action { + box-shadow: 0 0 0 1px #111, 0 0 0 3px red; +} + +.service_marker.russian.lord.action { + box-shadow: 0 0 0 1px #555, 0 0 0 3px red; +} + .service_marker.teutonic.vassal.action { - box-shadow: 0 0 0 3px red; + box-shadow: 0 0 0 1px #0f0d0d, 0 0 0 3px white; } -.service_marker.russian.lord.action, .service_marker.russian.vassal.action { - box-shadow: 0 0 0 3px red; + box-shadow: 0 0 0 1px #736e5e, 0 0 0 3px white; } .service_marker.teutonic.lord.selected, @@ -1030,11 +1033,6 @@ body.shift .mustered_vassals { </head> <body> -<div id="arts_of_war" class="hide"> -<div id="arts_of_war_header">Arts of War</div> -<div id="arts_of_war_list"></div> -</div> - <header> <div id="toolbar"> <div class="menu"> @@ -1085,6 +1083,9 @@ body.shift .mustered_vassals { </aside> <main> + +<div id="center"> + <div id="mapwrap"> <div id="map"> @@ -1116,18 +1117,25 @@ body.shift .mustered_vassals { <div id="events"></div> -<div id="plan" class="hide"> -<div id="plan_header">~ Plan ~</div> +<div id="arts_of_war" class="panel hide"> +<div id="arts_of_war_header" class="panel_header">~ Arts of War ~</div> +<div id="arts_of_war_list"></div> +</div> + +<div id="plan" class="panel hide"> +<div id="plan_header" class="panel_header">~ Plan ~</div> <div id="plan_list"></div> <div id="plan_actions"></div> </div> +<div id="hand" class="hand"></div> + +</div> + <div id="court1" class="court"></div> <div id="court2" class="court"></div> -<div id="hand" class="hand"></div> - </main> <footer id="status"></footer> @@ -1119,13 +1119,24 @@ function update_plan() { } function update_cards() { - if (view.show_arts_of_war) { + if (Array.isArray(view.show_arts_of_war)) { + ui.arts_of_war_dialog.classList.remove("hide") + ui.arts_of_war_list.replaceChildren() + for (let c of view.show_arts_of_war) { + let elt = ui.cards[c] + ui.arts_of_war_list.appendChild(ui.cards[c]) + elt.classList.toggle("selected", c === view.what) + elt.classList.toggle("action", is_card_action(c)) + elt.classList.remove("disabled") + } + } else if (view.show_arts_of_war === 1) { ui.arts_of_war_dialog.classList.remove("hide") ui.arts_of_war_list.replaceChildren() for_each_friendly_card(c => { if (!is_card_in_use(c)) { let elt = ui.cards[c] ui.arts_of_war_list.appendChild(elt) + elt.classList.toggle("selected", c === view.what) elt.classList.toggle("action", is_card_action(c)) elt.classList.toggle("disabled", !is_card_action(c)) } @@ -1134,8 +1145,9 @@ function update_cards() { ui.arts_of_war_dialog.classList.add("hide") for (let c = 0; c < 42; ++c) { let elt = ui.cards[c] + elt.classList.toggle("selected", false) elt.classList.toggle("action", is_card_action(c)) - elt.classList.remove("disabled") + elt.classList.toggle("disabled", false) } } @@ -2,6 +2,8 @@ // TODO: delay pay step if there is no feed or disband to be done +// TODO: discard too many global capabilities + // TODO: Lodya capability during supply! // TODO: 2nd edition supply rule - no reuse of transports // TODO: 2nd edition ravage cost @@ -1619,10 +1621,10 @@ function resume_levy_arts_of_war_first() { end_levy_arts_of_war_first() } -// TODO: show and assign capabilities simultaneously states.levy_arts_of_war_first = { prompt() { let c = game.what[0] + view.show_arts_of_war = game.what view.what = c if (data.cards[c].this_lord) { view.prompt = `Arts of War: Assign ${data.cards[c].capability} to a Lord.` @@ -1644,18 +1646,21 @@ states.levy_arts_of_war_first = { } }, lord(lord) { + push_undo() let c = game.what.shift() logi(`C${c} - L${lord}`) add_lord_capability(lord, c) resume_levy_arts_of_war_first() }, deploy() { + push_undo() let c = game.what.shift() logi(`C${c}`) set_add(game.capabilities, c) resume_levy_arts_of_war_first() }, discard() { + push_undo() let c = game.what.shift() logi(`C${c} - discarded`) resume_levy_arts_of_war_first() @@ -1663,6 +1668,7 @@ states.levy_arts_of_war_first = { } function end_levy_arts_of_war_first() { + clear_undo() game.what = NOTHING set_active_enemy() if (game.active === P2) @@ -2414,12 +2420,13 @@ states.actions = { prompt_march(avail) + if (can_action_supply(avail)) + view.actions.supply = 1 + if (can_action_siege(avail)) view.actions.siege = 1 if (can_action_storm(avail)) view.actions.storm = 1 - if (can_action_supply(avail)) - view.actions.supply = 1 if (can_action_forage(avail)) view.actions.forage = 1 if (can_action_ravage(avail)) |