From f325e1673fa843d06e47ef1ce558ea6606b3c92b Mon Sep 17 00:00:00 2001 From: Tor Andersson Date: Thu, 22 Aug 2024 10:50:56 +0200 Subject: Space ordering. --- data.js | 50 ++++++++++++++++++++++++------------------------- play.css | 18 +++++++++++++++--- play.html | 6 +++--- play.js | 15 +++++++++------ rules.js | 1 + tools/layout.json | 24 ++++++++++++------------ tools/layout.svg | 16 ++++++++-------- tools/process-layout.js | 2 ++ 8 files changed, 75 insertions(+), 57 deletions(-) diff --git a/data.js b/data.js index 7449228..ba639f7 100644 --- a/data.js +++ b/data.js @@ -219,17 +219,17 @@ const data = { 214, 207 ], - "Continental Congress Dispersed": [ - 542, - 332, - 88, - 104 - ], "Captured Generals": [ 1400, 46, 205, 136 + ], + "Continental Congress Dispersed": [ + 542, + 332, + 88, + 104 ] } }, @@ -1517,6 +1517,17 @@ const data = { "x": 807, "y": 1353 }, + { + "name": "British Reinforcement Box", + "type": "box", + "adjacent": [], + "path": [], + "wilderness": [], + "port": -1, + "colony": -1, + "x": 1465, + "y": 1776 + }, { "name": "American Leader Reinforcements", "type": "box", @@ -1529,15 +1540,15 @@ const data = { "y": 361 }, { - "name": "British Reinforcement Box", + "name": "French Reinforcements", "type": "box", "adjacent": [], "path": [], "wilderness": [], "port": -1, "colony": -1, - "x": 1465, - "y": 1776 + "x": 170, + "y": 362 }, { "name": "Captured Generals", @@ -1560,17 +1571,6 @@ const data = { "colony": -1, "x": 586, "y": 384 - }, - { - "name": "French Reinforcements", - "type": "box", - "adjacent": [], - "path": [], - "wilderness": [], - "port": -1, - "colony": -1, - "x": 170, - "y": 362 } ], "space_index": { @@ -1640,11 +1640,11 @@ const data = { "Wilmington": 63, "York": 64, "Yorktown": 65, - "American Leader Reinforcements": 66, - "British Reinforcement Box": 67, - "Captured Generals": 68, - "Continental Congress Dispersed": 69, - "French Reinforcements": 70 + "British Reinforcement Box": 66, + "American Leader Reinforcements": 67, + "French Reinforcements": 68, + "Captured Generals": 69, + "Continental Congress Dispersed": 70 }, "colonies": [ [ diff --git a/play.css b/play.css index 871bb54..40fadd3 100644 --- a/play.css +++ b/play.css @@ -2,9 +2,6 @@ main { background-color: slategray; } -.x_britain { background-color: hsl(15, 88%, 66%) } -.x_america { background-color: hsl(211, 52%, 64%) } - body.Britain header.your_turn { background-color: hsl(15, 90%, 75%) } body.America header.your_turn { background-color: hsl(211, 50%, 75%) } @@ -66,6 +63,21 @@ body.America header.your_turn { background-color: hsl(211, 50%, 75%) } #log div.i { padding-left: 32px; text-indent: -12px; } #log div.ii { padding-left: 44px; text-indent: -12px; } +#turn_info { + position: relative; + white-space: normal; +} + +#reshuffle { + position: absolute; + bottom: 6px; + right: 4px; + font-style: normal; + font-size: 16px; + line-height: 16px; + color: #000a; +} + #tooltip { pointer-events: none; position: fixed; diff --git a/play.html b/play.html index 3c78e97..6698361 100644 --- a/play.html +++ b/play.html @@ -36,18 +36,18 @@
Britain
-
VP
+
-
America
-
VP
+
-
-
+
🔄
diff --git a/play.js b/play.js index f601076..991bf75 100644 --- a/play.js +++ b/play.js @@ -5,7 +5,6 @@ */ // TODO: show "reshuffle" flag next to card deck display -// TODO: improve animations by having one CU stack per general and one CU stack per space function toggle_counters() { // Cycle between showing everything, only markers, and nothing. @@ -19,7 +18,6 @@ function toggle_counters() { } } - /* COMMON */ function lerp(a, b, t) { @@ -59,6 +57,7 @@ const CARDS = data.cards const P_BRITAIN = "Britain" const P_AMERICA = "America" +const F_RESHUFFLE = 1 const F_REGULARS = 2 const F_EUROPEAN_WAR = 4 const F_MUTINIES = 16 @@ -156,7 +155,10 @@ let ui = { header: document.querySelector("header"), status: document.getElementById("status"), + turn_info: document.getElementById("turn_info"), + war_ends: document.getElementById("war_ends"), last_played: document.getElementById("last_played"), + reshuffle: document.getElementById("reshuffle"), hand: document.getElementById("hand"), map: document.getElementById("map"), spaces_element: document.getElementById("spaces"), @@ -225,11 +227,11 @@ function build_piece(cn, w, h) { } function on_init() { - document.getElementById("war_ends").addEventListener("mouseenter", on_focus_war_ends) - document.getElementById("war_ends").addEventListener("mouseleave", on_blur_war_ends) + ui.war_ends.addEventListener("mouseenter", on_focus_war_ends) + ui.war_ends.addEventListener("mouseleave", on_blur_war_ends) - document.getElementById("last_played").addEventListener("mouseenter", on_focus_last_played) - document.getElementById("last_played").addEventListener("mouseleave", on_blur_last_played) + ui.last_played.addEventListener("mouseenter", on_focus_last_played) + ui.last_played.addEventListener("mouseleave", on_blur_last_played) for (let c = 0; c <= 110; ++c) { let e = ui.cards[c] = document.createElement("div") @@ -703,6 +705,7 @@ function on_update() { toggle_marker(ui.a_colony[i], control > 0) } + ui.reshuffle.classList.toggle("hide", !(view.flags & F_RESHUFFLE)) ui.turn_marker.classList.toggle("no_regulars", !(view.flags & F_REGULARS)) ui.french_alliance.classList.toggle("european_war", !!(view.flags & F_EUROPEAN_WAR)) diff --git a/rules.js b/rules.js index 117a310..cac0bbd 100644 --- a/rules.js +++ b/rules.js @@ -3257,6 +3257,7 @@ events.advance_french_alliance = function (card) { events.remove_french_navy = function () { // TODO: remove french navy manual? + // NOTE: Technically it should be game.year but this way we avoid stacking with the turn marker. game.french_navy = game.year + 1 end_strategy_card() } diff --git a/tools/layout.json b/tools/layout.json index 8e0bc12..e2c4c2d 100644 --- a/tools/layout.json +++ b/tools/layout.json @@ -641,19 +641,19 @@ "h": 207, "name": "French Reinforcements" }, - { - "x": 542, - "y": 332, - "w": 88, - "h": 104, - "name": "Continental Congress Dispersed" - }, { "x": 1400, "y": 46, "w": 205, "h": 136, "name": "Captured Generals" + }, + { + "x": 542, + "y": 332, + "w": 88, + "h": 104, + "name": "Continental Congress Dispersed" } ], "Card Boxes": [ @@ -1286,15 +1286,15 @@ "y": 361.5, "name": "French Reinforcements" }, - { - "x": 586, - "y": 384, - "name": "Continental Congress Dispersed" - }, { "x": 1502.5, "y": 114, "name": "Captured Generals" + }, + { + "x": 586, + "y": 384, + "name": "Continental Congress Dispersed" } ], "Card Boxes": [ diff --git a/tools/layout.svg b/tools/layout.svg index aded2e6..629e3c4 100644 --- a/tools/layout.svg +++ b/tools/layout.svg @@ -774,14 +774,6 @@ x="63" y="258" inkscape:label="French Reinforcements" /> - + { + if (a.type === "box" && b.type === "box") + return 0 let at = TYPE_SORT.indexOf(a.type) let bt = TYPE_SORT.indexOf(b.type) if (at < bt) return -1 -- cgit v1.2.3