summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--images/die_black_pips.svg37
-rw-r--r--images/die_white_pips.svg37
-rw-r--r--play.html78
-rw-r--r--play.js41
-rw-r--r--rules.js31
5 files changed, 208 insertions, 16 deletions
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 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="336" height="56">
+<g fill="black">
+<g transform="translate(0 0)">
+<circle r="6" cx="28" cy="28"/>
+</g>
+<g transform="translate(56 0)">
+<circle r="6" cx="12" cy="12"/>
+<circle r="6" cx="44" cy="44"/>
+</g>
+<g transform="translate(112 0)">
+<circle r="6" cx="12" cy="44"/>
+<circle r="6" cx="44" cy="12"/>
+<circle r="6" cx="28" cy="28"/>
+</g>
+<g transform="translate(168 0)">
+<circle r="6" cx="12" cy="12"/>
+<circle r="6" cx="12" cy="44"/>
+<circle r="6" cx="44" cy="12"/>
+<circle r="6" cx="44" cy="44"/>
+</g>
+<g transform="translate(224 0)">
+<circle r="6" cx="12" cy="12"/>
+<circle r="6" cx="12" cy="44"/>
+<circle r="6" cx="44" cy="12"/>
+<circle r="6" cx="44" cy="44"/>
+<circle r="6" cx="28" cy="28"/>
+</g>
+<g transform="translate(280 0)">
+<circle r="6" cx="12" cy="12"/>
+<circle r="6" cx="12" cy="28"/>
+<circle r="6" cx="12" cy="44"/>
+<circle r="6" cx="44" cy="12"/>
+<circle r="6" cx="44" cy="28"/>
+<circle r="6" cx="44" cy="44"/>
+</g>
+</g>
+</svg>
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 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="336" height="56">
+<g fill="white">
+<g transform="translate(0 0)">
+<circle r="6" cx="28" cy="28"/>
+</g>
+<g transform="translate(56 0)">
+<circle r="6" cx="12" cy="12"/>
+<circle r="6" cx="44" cy="44"/>
+</g>
+<g transform="translate(112 0)">
+<circle r="6" cx="12" cy="44"/>
+<circle r="6" cx="44" cy="12"/>
+<circle r="6" cx="28" cy="28"/>
+</g>
+<g transform="translate(168 0)">
+<circle r="6" cx="12" cy="12"/>
+<circle r="6" cx="12" cy="44"/>
+<circle r="6" cx="44" cy="12"/>
+<circle r="6" cx="44" cy="44"/>
+</g>
+<g transform="translate(224 0)">
+<circle r="6" cx="12" cy="12"/>
+<circle r="6" cx="12" cy="44"/>
+<circle r="6" cx="44" cy="12"/>
+<circle r="6" cx="44" cy="44"/>
+<circle r="6" cx="28" cy="28"/>
+</g>
+<g transform="translate(280 0)">
+<circle r="6" cx="12" cy="12"/>
+<circle r="6" cx="12" cy="28"/>
+<circle r="6" cx="12" cy="44"/>
+<circle r="6" cx="44" cy="12"/>
+<circle r="6" cx="44" cy="28"/>
+<circle r="6" cx="44" cy="44"/>
+</g>
+</g>
+</svg>
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 `<span class="tip" onmouseenter="on_focus_us_state_tip(${s})" onmouseleave="on_blur_us_state_tip(${s})" onclick="on_click_us_state_tip(${s})">${n}</span>`
}
+// TODO blue d4, red d6, white d8
+
+const ICONS = {
+ B0: '<span class="icon black d0"></span>',
+ B1: '<span class="icon black d1"></span>',
+ B2: '<span class="icon black d2"></span>',
+ B3: '<span class="icon black d3"></span>',
+ B4: '<span class="icon black d4"></span>',
+ B5: '<span class="icon black d5"></span>',
+ B6: '<span class="icon black d6"></span>',
+ W0: '<span class="icon white d0"></span>',
+ W1: '<span class="icon white d1"></span>',
+ W2: '<span class="icon white d2"></span>',
+ W3: '<span class="icon white d3"></span>',
+ W4: '<span class="icon white d4"></span>',
+ W5: '<span class="icon white d5"></span>',
+ W6: '<span class="icon white d6"></span>',
+ PR: '<span class="icon purple_campaigner"></span>',
+ YR: '<span class="icon yellow_campaigner"></span>',
+ RR: '<span class="icon red_campaigner"></span>',
+ PC: '<span class="icon purple_cube"></span>',
+ YC: '<span class="icon yellow_cube"></span>',
+ PYC: '<span class="icon purple_or_yellow_cube"></span>',
+ RC: '<span class="icon red_cube"></span>',
+ BM: '<span class="icon button"></span>',
+ CM: '<span class="icon congressional_marker"></span>',
+ GV: '<span class="icon green_check"></span>',
+ RX: '<span class="icon red_x"></span>',
+}
+
+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()
}