From aea2e24bc734bebde542f574cdac4d098c38573c Mon Sep 17 00:00:00 2001
From: Mischa Untaga <99098079+MischaU8@users.noreply.github.com>
Date: Sat, 21 Oct 2023 12:55:27 +0200
Subject: dice WIP
---
images/die_black_pips.svg | 37 +++++++++++++++++++++++++++++++++++++
images/die_white_pips.svg | 37 +++++++++++++++++++++++++++++++++++++
play.html | 31 +++++++++++++++++++++++++++++++
play.js | 23 +++++++++++++++++++++++
4 files changed, 128 insertions(+)
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 d95f920..0323043 100644
--- a/play.html
+++ b/play.html
@@ -197,6 +197,37 @@ main { background-color: dimgray }
.counter.fln_front{background-position:33.33333333333333% 55.55555555555556%}
/* .counter.neut{background-position:44.44444444444444% 55.55555555555556%} */
+.dice {
+ width: 36px;
+ height: 36px;
+ border-radius: 6px;
+ border-width: 2px;
+ border-style: solid;
+ background-size: 600% 100%;
+ background-repeat: no-repeat;
+}
+
+.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; }
+
+.dice.black {
+ background-image: url(images/die_white_pips.svg);
+ background-color: #444;
+}
+
+.dice.white {
+ background-image: url(images/die_black_pips.svg);
+ background-color: #eee;
+}
+
+.dice.black { border-color: #595959 #303030 #303030 #595959; box-shadow: 0 0 0 1px #0c0c0c, 1px 2px 4px #0008; }
+.dice.white { border-color: #ffffff #b1b1b1 #b1b1b1 #ffffff; box-shadow: 0 0 0 1px #424242, 1px 2px 4px #0008; }
+
.panel {
max-width: 900px;
margin: 36px auto;
diff --git a/play.js b/play.js
index d05b184..4ecf7fd 100644
--- a/play.js
+++ b/play.js
@@ -603,6 +603,27 @@ function on_update() { // eslint-disable-line no-unused-vars
action_button("reset", "Reset")
}
+const ICONS = {
+ B0: '',
+ B1: '',
+ B2: '',
+ B3: '',
+ B4: '',
+ B5: '',
+ B6: '',
+ W0: '',
+ W1: '',
+ W2: '',
+ W3: '',
+ W4: '',
+ W5: '',
+ W6: '',
+}
+
+function sub_icon(match) {
+ return ICONS[match]
+}
+
function on_focus_area_tip(x) { // eslint-disable-line no-unused-vars
ui.areas[x].classList.add("tip")
}
@@ -653,6 +674,8 @@ function on_log(text) { // eslint-disable-line no-unused-vars
text = text.replace(/U(\d+)/g, sub_unit_name)
text = text.replace(/A(\d+)/g, sub_area_name)
+ text = text.replace(/\b[BW]\d\b/g, sub_icon)
+
if (text.match(/^\.h1/)) {
text = text.substring(4)
p.className = 'h1'
--
cgit v1.2.3