summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--play.css11
-rw-r--r--play.js18
2 files changed, 29 insertions, 0 deletions
diff --git a/play.css b/play.css
index b633b72..b69659f 100644
--- a/play.css
+++ b/play.css
@@ -41,6 +41,12 @@
--color-role-russia: hsl(120, 50%, 70%);
--color-role-austria: hsl(0, 0%, 98%);
--color-role-france: hsl(0, 70%, 80%);
+
+ --color-spades: #004b70;
+ --color-clubs: #037a37;
+ --color-hearts: #ed1c23;
+ --color-diamonds: #c2253e;
+ --color-reserve: #0094c9;
}
#role_Frederick { background-color: var(--color-role-prussia) }
@@ -76,6 +82,11 @@ header.your_turn.austria { background-color: var(--color-light-austria); }
header.your_turn.imperial { background-color: var(--color-light-imperial); }
header.your_turn.france { background-color: var(--color-light-france); }
+span.suit.spades { color: var(--color-spades) }
+span.suit.clubs { color: var(--color-clubs) }
+span.suit.hearts { color: var(--color-hearts) }
+span.suit.diamonds { color: var(--color-diamonds) }
+span.suit.reserve { color: var(--color-reserve); font-weight: bold; }
#mapwrap {
width: 2485px;
diff --git a/play.js b/play.js
index 561fb0f..46e0083 100644
--- a/play.js
+++ b/play.js
@@ -265,6 +265,7 @@ function sort_power_panel() {
/* BUILD UI */
const ui = {
+ prompt: document.getElementById("prompt"),
header: document.querySelector("header"),
roads_element: document.getElementById("roads"),
spaces_element: document.getElementById("spaces"),
@@ -835,7 +836,24 @@ function cmp_tc(a, b) {
return ax - bx
}
+const colorize_S = '<span class="spades">$&</span>'
+const colorize_C = '<span class="clubs">$&</span>'
+const colorize_H = '<span class="hearts">$&</span>'
+const colorize_D = '<span class="diamonds">$&</span>'
+const colorize_R = '<span class="reserve">$&</span>'
+
+function colorize(text) {
+ text = text.replace(/\d+\u2660/g, colorize_S)
+ text = text.replace(/\d+\u2663/g, colorize_C)
+ text = text.replace(/\d+\u2665/g, colorize_H)
+ text = text.replace(/\d+\u2666/g, colorize_D)
+ text = text.replace(/\d+R/g, colorize_R)
+ return text
+}
+
function on_update() {
+ ui.prompt.innerHTML = colorize(view.prompt)
+
ui.header.classList.toggle("prussia", view.power === P_PRUSSIA)
ui.header.classList.toggle("hanover", view.power === P_HANOVER)
ui.header.classList.toggle("russia", view.power === P_RUSSIA)