From c2f610a8864840b400f18bbbae98bf0acef08f62 Mon Sep 17 00:00:00 2001 From: Mischa Untaga <99098079+MischaU8@users.noreply.github.com> Date: Fri, 24 Nov 2023 12:01:52 +0100 Subject: icons in log --- images/die_black_pips.svg | 37 ++++++++++++++++++++++ images/die_white_pips.svg | 37 ++++++++++++++++++++++ play.html | 78 +++++++++++++++++++++++++++++++++++++++++++++++ play.js | 41 ++++++++++++++++++++++++- rules.js | 31 ++++++++++--------- 5 files changed, 208 insertions(+), 16 deletions(-) create mode 100644 images/die_black_pips.svg create mode 100644 images/die_white_pips.svg diff --git a/images/die_black_pips.svg b/images/die_black_pips.svg new file mode 100644 index 0000000..d641f28 --- /dev/null +++ b/images/die_black_pips.svg @@ -0,0 +1,37 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/images/die_white_pips.svg b/images/die_white_pips.svg new file mode 100644 index 0000000..efc864b --- /dev/null +++ b/images/die_white_pips.svg @@ -0,0 +1,37 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/play.html b/play.html index 9e7ce2f..ddf77e4 100644 --- a/play.html +++ b/play.html @@ -59,6 +59,84 @@ body.Opposition header.your_turn { background-color: var(--opp-75); } #log > .p { padding-left: 20px; text-align: right; font-style: italic; opacity: 75%; } #log > .i { padding-left: 20px; } +#log .icon { + display: inline-block; + vertical-align: -2px; + width: 12px; + height: 12px; + border-radius: 0px; + box-shadow: none; + border: none; + background-size: 100% 100%; + background-repeat: no-repeat; +} + +#log .white { + background-image: url(images/die_black_pips.svg); + background-size: 600% 100%; + background-color: #fff; + border: 1px solid #444; +} + +#log .black { + background-image: url(images/die_white_pips.svg); + background-size: 600% 100%; + background-color: #666; + border: 1px solid #222; +} + +.d0 { background-position: -100% 0 } +.d1 { background-position: 0% 0; } +.d2 { background-position: 20% 0; } +.d3 { background-position: 40% 0; } +.d4 { background-position: 60% 0; } +.d5 { background-position: 80% 0; } +.d6 { background-position: 100% 0; } + +#log .purple_campaigner { + background-image: url(images/icon_purple_campaigner.png); +} + +#log .yellow_campaigner { + background-image: url(images/icon_yellow_campaigner.png); +} + +#log .red_campaigner { + background-image: url(images/icon_opposition_campaigner.png); +} + +#log .purple_cube { + background-image: url(images/icon_purple_cube.png); +} + +#log .yellow_cube { + background-image: url(images/icon_yellow_cube.png); +} + +#log .purple_or_yellow_cube { + background-image: url(images/icon_purple_or_yellow_cube.png); +} + +#log .red_cube { + background-image: url(images/icon_opposition_cube.png); +} + +#log .button { + background-image: url(images/icon_button.png); +} + +#log .congressional_marker { + background-image: url(images/icon_congressional_marker.png); +} + +#log .green_check { + background-image: url(images/icon_green_check.png); +} + +#log .red_x { + background-image: url(images/icon_red_x.png); +} + /* PANELS */ .panel_grid { diff --git a/play.js b/play.js index f4a1aa4..9878400 100644 --- a/play.js +++ b/play.js @@ -405,7 +405,7 @@ function build_user_interface() { for (let i = 0; i < 6; ++i) { elt = ui.opposition_buttons[i] = create("div", { - className: `button button_${(i % 2) + 1}`, + className: `button button_${(i % 2) + 5}`, }) } @@ -521,6 +521,40 @@ function sub_us_state_name(_match, p1, _offset, _string) { return `${n}` } +// TODO blue d4, red d6, white d8 + +const ICONS = { + B0: '', + B1: '', + B2: '', + B3: '', + B4: '', + B5: '', + B6: '', + W0: '', + W1: '', + W2: '', + W3: '', + W4: '', + W5: '', + W6: '', + PR: '', + YR: '', + RR: '', + PC: '', + YC: '', + PYC: '', + RC: '', + BM: '', + CM: '', + GV: '', + RX: '', +} + +function sub_icon(match) { + return ICONS[match] +} + function on_log(text) { // eslint-disable-line no-unused-vars let p = document.createElement("div") @@ -536,6 +570,11 @@ function on_log(text) { // eslint-disable-line no-unused-vars text = text.replace(/R(\d+)/g, sub_region_name) text = text.replace(/S(\d+)/g, sub_us_state_name) + text = text.replace(/\b[PYR]R\b/g, sub_icon) + text = text.replace(/\b[PYR]C|PYC\b/g, sub_icon) + text = text.replace(/\b[BC]M|GV|RX\b/g, sub_icon) + text = text.replace(/\b[BW]\d\b/g, sub_icon) + if (text.match(/^\.h1/)) { text = text.substring(4) p.className = 'h1' diff --git a/rules.js b/rules.js index da32079..cd90ae2 100644 --- a/rules.js +++ b/rules.js @@ -200,7 +200,7 @@ function add_campaigner(color, region) { } else { throw Error("No free campaigners") } - log(`Placed ${COLOR_CODE[color]}R in R${region}`) + log(`Placed ${COLOR_CODE[color]}R in R${region}.`) } function player_campaigners() { @@ -354,7 +354,7 @@ function us_states_with_color_cubes(us_states, cube) { } function add_cube(cube, us_state) { - log(`Added ${COLOR_CODE[cube]}C in S${us_state}`) + log(`Added ${COLOR_CODE[cube]}C in S${us_state}.`) if ((cube === RED && support_cubes(us_state) > 0) || (cube !== RED && red_cubes(us_state) > 0)) throw new Error("Can't add cube when opponent still has cubes there") @@ -366,7 +366,7 @@ function add_cube(cube, us_state) { } function remove_cube(cube, us_state) { - log(`Removed ${COLOR_CODE[cube]}C from S${us_state}`) + log(`Removed ${COLOR_CODE[cube]}C from S${us_state}.`) if ((cube === PURPLE && !purple_cubes(us_state)) || (cube === YELLOW && !yellow_cubes(us_state)) || (cube === RED && !red_cubes(us_state))) throw new Error("Can't remove cube that aint there") @@ -378,7 +378,7 @@ function remove_cube(cube, us_state) { } function remove_green_check(us_state) { - log(`Removed ${COLOR_CODE[GREEN_CHECK]} from S${us_state}`) + log(`Removed ${COLOR_CODE[GREEN_CHECK]} from S${us_state}.`) if (!is_green_check(us_state)) throw new Error("Can't remove a green check that aint there") @@ -387,7 +387,7 @@ function remove_green_check(us_state) { } function remove_red_x(us_state) { - log(`Removed ${COLOR_CODE[RED_X]} from S${us_state}`) + log(`Removed ${COLOR_CODE[RED_X]} from S${us_state}.`) if (!is_red_x(us_state)) throw new Error("Can't remove a red x that aint there") @@ -800,7 +800,7 @@ states.strategy_phase = { }, done() { - log(`Suffragist committed ${pluralize(game.support_committed, 'button')}.`) + log(`Suffragist committed ${game.support_committed} BM.`) game.active = OPP }, defer() { @@ -1416,7 +1416,8 @@ function campaigner_color(c) { function goto_campaigning_add_cubes(campaigner, die) { game.selected_campaigner = campaigner set_add(game.campaigning.assigned, campaigner) - log(`Assigned ${die} to ${COLOR_CODE[campaigner_color(campaigner)]}R in R${campaigner_region(campaigner)}.`) + // TODO die type & color + log(`Assigned B${die} to ${COLOR_CODE[campaigner_color(campaigner)]}R in R${campaigner_region(campaigner)}.`) game.campaigning.count = die game.campaigning.added = 0 game.campaigning.moved = false @@ -1604,13 +1605,13 @@ const GREEN_CHECK_VICTORY = 36 const RED_X_VICTORY = 13 function ratify_nineteenth_amendment(us_state) { - log(`S${us_state} ratified the Nineteenth Amendment`) + log(`S${us_state} ratified the Nineteenth Amendment.`) game.us_states[us_state] = 0 set_green_check(us_state) } function reject_nineteenth_amendment(us_state) { - log(`S${us_state} rejected the Nineteenth Amendment`) + log(`S${us_state} rejected the Nineteenth Amendment.`) game.us_states[us_state] = 0 set_red_x(us_state) } @@ -1618,7 +1619,7 @@ function reject_nineteenth_amendment(us_state) { function trigger_nineteenth_amendment() { if (game.nineteenth_amendment) throw Error("ASSERT: nineteenth_amendment already set") - log("Congress passed the Nineteenth Amendment") + log("Congress passed the Nineteenth Amendment.") game.nineteenth_amendment = 1 game.congress = 0 @@ -2178,7 +2179,7 @@ states.vm_add_campaigner = { } function increase_player_buttons(count=1) { - log(`+${pluralize(count, 'button')}.`) + log(`+${count} BM.`) if (game.active === SUF) { game.support_buttons = Math.min(game.support_buttons + count, MAX_SUPPORT_BUTTONS) } else { @@ -2187,7 +2188,7 @@ function increase_player_buttons(count=1) { } function decrease_player_buttons(count=1) { - log(`-${pluralize(count, 'button')}.`) + log(`-${count} BM.`) if (game.active === SUF) { game.support_buttons = Math.max(game.support_buttons - count, 0) } else { @@ -2196,7 +2197,7 @@ function decrease_player_buttons(count=1) { } function decrease_opponent_buttons(count=1) { - log(`${opponent_name()} -${pluralize(count, 'button')}.`) + log(`${opponent_name()} -${count} BM.`) if (game.active === SUF) { game.opposition_buttons = Math.max(game.opposition_buttons - count, 0) } else { @@ -2482,7 +2483,7 @@ states.vm_add_congress = { }, congress() { game.congress = Math.min(game.congress + game.vm.count, 6) - log(`+${pluralize(game.vm.count, 'Congressional marker')}.`) + log(`+${game.vm.count} CM.`) if (game.congress >= 6) { if (trigger_nineteenth_amendment()) @@ -2500,7 +2501,7 @@ states.vm_remove_congress = { }, congress() { game.congress = Math.max(game.congress - game.vm.count, 0) - log(`-${pluralize(game.vm.count, 'Congressional marker')}.`) + log(`-${game.vm.count} CM.`) vm_next() } -- cgit v1.2.3