summaryrefslogtreecommitdiff
path: root/web
diff options
context:
space:
mode:
Diffstat (limited to 'web')
-rw-r--r--web/static/dartboat.js9
-rw-r--r--web/static/style.css52
-rw-r--r--web/static/sw.js2
-rw-r--r--web/web_dom.c5
-rw-r--r--web/web_dom.h1
-rw-r--r--web/web_scoreboard.c29
6 files changed, 75 insertions, 23 deletions
diff --git a/web/static/dartboat.js b/web/static/dartboat.js
index a46ffc9..54cb29b 100644
--- a/web/static/dartboat.js
+++ b/web/static/dartboat.js
@@ -55,6 +55,15 @@ function elemScrollToBottom(sel) {
e.scrollTop = e.scrollHeight;
}
+function elemScrollToCenterChild(sel, sel_child) {
+ const e = $(UTF8ToString(sel));
+ const child = $(UTF8ToString(sel_child));
+ if (!child) return;
+
+ e.scrollLeft = child.offsetLeft + child.offsetWidth/2 -
+ e.offsetLeft - e.offsetWidth/2;
+}
+
function targetAppendElemv(target, elemc, elemv,
off_type, off_ns, off_name, off_content,
off_n_attrs, off_attr_names, off_attr_vals,
diff --git a/web/static/style.css b/web/static/style.css
index 6256709..5131eab 100644
--- a/web/static/style.css
+++ b/web/static/style.css
@@ -539,19 +539,30 @@ body {
padding: 0.4rem;
display: grid;
- grid-template-columns: repeat(5, min(calc(calc(100% - 2ch) / 5), 5ch)) min-content;
+ grid-template-columns:
+ min-content
+ repeat(5, min(calc(calc(100% - 2ch) / 5), 5ch))
+ min-content;
grid-auto-rows: min-content;
row-gap: 0.2em;
}
#visits > * {
- min-width: 0;
-
display: flex;
align-items: center;
justify-content: center;
}
+#visits .visit-p1-name { grid-column: 2 / span 2; }
+#visits .visit-p2-name { grid-column: 5 / span 2; }
+#visits .visit-p1-darts { grid-column: 1; }
+#visits .visit-p1-pts { grid-column: 2; }
+#visits .visit-p1-rem { grid-column: 3; }
+#visits .visit-n { grid-column: 4; }
+#visits .visit-p2-rem { grid-column: 5; }
+#visits .visit-p2-pts { grid-column: 6; }
+#visits .visit-p2-darts { grid-column: 7; }
+
#visits .p0 { color: #e00018; }
#visits .p20 { color: #e06000; }
#visits .p40 { color: #e09800; }
@@ -561,14 +572,7 @@ body {
#visits .p180 { color: #20e018; font-weight: bold; }
#visits .throws-first { color: #999; }
#visits .throws-first:before { content: '\f151'; font-size: 0.6em; }
-#visits .visit-p1-name { grid-column: 1 / span 2; }
-#visits .visit-p2-name { grid-column: 4 / span 2; }
-#visits .visit-p1-pts { grid-column: 1; }
-#visits .visit-p1-rem { grid-column: 2; }
-#visits .visit-n { grid-column: 3; }
-#visits .visit-p2-rem { grid-column: 4; }
-#visits .visit-p2-pts { grid-column: 5; }
-#visits .visit-p2-darts { grid-column: 6; }
+
#visits .visit-p1-name, #visits .visit-p2-name {
color: #555;
border-bottom: 2px solid #555;
@@ -576,29 +580,49 @@ body {
#visits .visit-n {
color: #555;
}
-#visits .visit-p2-darts {
+#visits .visit-p1-darts, #visits .visit-p2-darts {
color: #555;
font-size: 0.75em;
- justify-content: left;
white-space: nowrap;
}
+#visits .visit-p1-darts {
+ justify-content: right;
+}
+#visits .visit-p1-darts:not(:empty):after {
+ content: '\2003';
+}
+#visits .visit-p2-darts {
+ justify-content: left;
+}
#visits .visit-p2-darts:not(:empty):before {
content: '\2003';
}
@media (max-aspect-ratio: 8/5) {
#visits {
- grid-template-columns: 1ch 1fr repeat(5, min(calc(calc(100% - 2ch) / 5), 5ch)) 1fr 1ch;
+ grid-template-columns:
+ min-content
+ calc(calc(100% - 27ch) / 2)
+ repeat(5, min(calc(calc(100% - 2ch) / 5), 5ch))
+ calc(calc(100% - 27ch) / 2)
+ min-content;
}
#visits .visit-p1-name, #visits .visit-p2-name {
display: none;
}
+ #visits .visit-p1-spacer { grid-column: 1; width: 1ch }
+ #visits .visit-p2-spacer { grid-column: 9; width: 1ch }
+ #visits .visit-p1-darts { grid-column: 1; }
#visits .visit-p1-pts { grid-column: 3; }
#visits .visit-p1-rem { grid-column: 4; }
#visits .visit-n { grid-column: 5; }
#visits .visit-p2-rem { grid-column: 6; }
#visits .visit-p2-pts { grid-column: 7; }
#visits .visit-p2-darts { grid-column: 9; }
+
+ #visits .visit-p1-darts:not(:empty):after {
+ content: '\2003…';
+ }
#visits .visit-p2-darts:not(:empty):before {
content: '…\2003';
}
diff --git a/web/static/sw.js b/web/static/sw.js
index b9a92e6..4a207b8 100644
--- a/web/static/sw.js
+++ b/web/static/sw.js
@@ -1,5 +1,5 @@
const CACHE_PREFIX = 'dartboat-'
-const CACHE_VERSION = '18';
+const CACHE_VERSION = '19';
const CACHE_NAME = `${CACHE_PREFIX}${CACHE_VERSION}`;
const CACHE_FILES = [
diff --git a/web/web_dom.c b/web/web_dom.c
index 07602f8..162684a 100644
--- a/web/web_dom.c
+++ b/web/web_dom.c
@@ -149,6 +149,11 @@ inline void dom_scroll_to_bottom(char *sel)
EM_ASM({elemScrollToBottom($0)}, sel);
}
+inline void dom_scroll_to_center_child(char *sel, char *sel_child)
+{
+ EM_ASM({elemScrollToCenterChild($0, $1)}, sel, sel_child);
+}
+
inline void dom_enable_exit_dialogue(bool enable)
{
EM_ASM({enableExitDialogue($0)}, enable);
diff --git a/web/web_dom.h b/web/web_dom.h
index 12d173d..8813d1a 100644
--- a/web/web_dom.h
+++ b/web/web_dom.h
@@ -31,6 +31,7 @@ void dom_toggle_class(char *sel, char *class);
void dom_set_uniq_class(char *sel, char *class, char *sel_set);
void dom_scroll_to_bottom(char *sel);
+void dom_scroll_to_center_child(char *sel, char *sel_child);
void dom_enable_exit_dialogue(bool enable);
diff --git a/web/web_scoreboard.c b/web/web_scoreboard.c
index d1bfa7e..fa1a672 100644
--- a/web/web_scoreboard.c
+++ b/web/web_scoreboard.c
@@ -167,6 +167,17 @@ static const char *points_class(int pts)
"p0";
}
+static void buf_darts(char *buf, size_t size, struct visit *v)
+{
+ char *ptr = buf;
+ for (int j = 0; j < v->n_darts; ++j) {
+ char *n = segment_name(v->darts[j]);
+ ptr += snprintf(ptr, size - (ptr - buf),
+ j == 0 ? "%s" : "-%s", n);
+ free(n);
+ }
+}
+
void draw_visits()
{
dom_set_content("#visits", NULL);
@@ -174,13 +185,15 @@ void draw_visits()
int n_visits = state->legs[0]->n_visits > state->legs[1]->n_visits ?
state->legs[0]->n_visits : state->legs[1]->n_visits;
- struct dom_elem **elemv = malloc(6 * (n_visits + 1) * sizeof(*elemv));
+ struct dom_elem **elemv = malloc(7 * (n_visits + 1) * sizeof(*elemv));
int elemc = 0;
+ elemv[elemc++] = create_div("", "visit-p1-spacer");
elemv[elemc++] = create_div(state->legs[0]->name, "visit-p1-name");
if (match_num_players() != 1)
elemv[elemc++] = create_div(state->legs[1]->name,
"visit-p2-name");
+ elemv[elemc++] = create_div("", "visit-p2-spacer");
char buf[32], buf2[32];
snprintf(buf, sizeof(buf), "%d", state->legs[0]->start);
@@ -204,6 +217,11 @@ void draw_visits()
goto p2;
v = state->legs[0]->visits + i;
+ if (v->n_darts) {
+ buf_darts(buf, sizeof(buf), v);
+ elemv[elemc++] = create_div(buf, "visit-p1-darts");
+ }
+
snprintf(buf, sizeof(buf), "%d", v->points);
snprintf(buf2, sizeof(buf2), "%s %s",
"visit-p1-pts", points_class(v->points));
@@ -229,13 +247,7 @@ p2:
elemv[elemc++] = create_div(buf, buf2);
if (v->n_darts) {
- char *ptr = buf;
- for (int j = 0; j < v->n_darts; ++j) {
- char *n = segment_name(v->darts[j]);
- ptr += snprintf(ptr, sizeof(buf) - (ptr - buf),
- j == 0 ? "%s" : "-%s", n);
- free(n);
- }
+ buf_darts(buf, sizeof(buf), v);
elemv[elemc++] = create_div(buf, "visit-p2-darts");
}
}
@@ -246,4 +258,5 @@ p2:
free(elemv);
dom_scroll_to_bottom("#visits");
+ dom_scroll_to_center_child("#visits", ".visit-n");
}
generated by cgit v1.2.3-70-g09d2 (git 2.47.0) at 2024-11-25 11:30:58 +0000