From c1ade0f7b543591989ffb90a54d147de155e3d0a Mon Sep 17 00:00:00 2001 From: Tor Andersson Date: Sun, 26 May 2024 00:05:43 +0200 Subject: colorize cards in prompt (need better colors) --- play.css | 11 +++++++++++ play.js | 18 ++++++++++++++++++ 2 files changed, 29 insertions(+) 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 = '$&' +const colorize_C = '$&' +const colorize_H = '$&' +const colorize_D = '$&' +const colorize_R = '$&' + +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) -- cgit v1.2.3