summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--web/static/dartboat.js1
-rw-r--r--web/static/dartboat.webmanifest2
-rw-r--r--web/static/fonts/bootstrap-icons-sub.woff2bin1036 -> 1088 bytes
-rw-r--r--web/static/icons/dartboat_192_mask.pngbin28441 -> 28408 bytes
-rw-r--r--web/static/icons/dartboat_512_mask.pngbin105408 -> 105181 bytes
-rw-r--r--web/static/index.html11
-rw-r--r--web/static/style.css157
-rw-r--r--web/static/sw.js2
-rw-r--r--web/web_control.c2
-rw-r--r--web/web_prompt.c17
10 files changed, 127 insertions, 65 deletions
diff --git a/web/static/dartboat.js b/web/static/dartboat.js
index 6051b7e..9e97dfc 100644
--- a/web/static/dartboat.js
+++ b/web/static/dartboat.js
@@ -158,6 +158,7 @@ document.addEventListener('DOMContentLoaded', () => {
command.split(';').forEach(x =>
promptHandle(...x.split(':', 2)));
});
+ $('#key-exit').addEventListener('click', () => promptHandle('exit'));
f = e => _set_opt(toCString(e.target.dataset.opt),
toCString(e.target.value));
diff --git a/web/static/dartboat.webmanifest b/web/static/dartboat.webmanifest
index f6023bd..7c7ff6d 100644
--- a/web/static/dartboat.webmanifest
+++ b/web/static/dartboat.webmanifest
@@ -5,7 +5,7 @@
"display": "standalone",
"background_color": "#1a1a1a",
- "theme_color": "#311d52",
+ "theme_color": "#583a90",
"icons": [
{ "src": "icons/dartboat_16.png", "sizes": "16x16", "type": "image/png" },
diff --git a/web/static/fonts/bootstrap-icons-sub.woff2 b/web/static/fonts/bootstrap-icons-sub.woff2
index 0d765be..391919f 100644
--- a/web/static/fonts/bootstrap-icons-sub.woff2
+++ b/web/static/fonts/bootstrap-icons-sub.woff2
Binary files differ
diff --git a/web/static/icons/dartboat_192_mask.png b/web/static/icons/dartboat_192_mask.png
index c1bc8cd..b84efec 100644
--- a/web/static/icons/dartboat_192_mask.png
+++ b/web/static/icons/dartboat_192_mask.png
Binary files differ
diff --git a/web/static/icons/dartboat_512_mask.png b/web/static/icons/dartboat_512_mask.png
index 47a7f50..4734e76 100644
--- a/web/static/icons/dartboat_512_mask.png
+++ b/web/static/icons/dartboat_512_mask.png
Binary files differ
diff --git a/web/static/index.html b/web/static/index.html
index 472247d..609161a 100644
--- a/web/static/index.html
+++ b/web/static/index.html
@@ -5,7 +5,7 @@
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Darts opponent for when you've got no friends.">
- <meta name="theme-color" content="#311d52">
+ <meta name="theme-color" content="#583a90">
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="manifest" href="dartboat.webmanifest">
<link rel="icon" type="image/png" sizes="48x48" href="icons/dartboat_48.png">
@@ -15,11 +15,12 @@
<body>
<div id="main">
<div id="titlebar">
- <div>dartboat™</div>
- <div title="Delay between computer's darts (ms)" class="input first"><label for="delay" class="icon">&#xf597;</label><input id="delay" data-opt="delay" maxlength="4" value=""></div>
- <div title="Difficulty (precision of computer's throws)" class="input"><label for="difficulty" class="icon">&#xf1de;</label><input id="difficulty" data-opt="difficulty" maxlength="2" value=""></div>
+ <div title="End match" class="button icon" id="key-exit">&#xf659;</div>
+ <div class="name">dartboat™</div>
+ <div title="Delay between computer's darts (ms)" class="opt-input first"><label for="delay" class="icon">&#xf597;</label><input id="delay" data-opt="delay" maxlength="4" value=""></div>
+ <div title="Difficulty (precision of computer's throws)" class="opt-input"><label for="difficulty" class="icon">&#xf1de;</label><input id="difficulty" data-opt="difficulty" maxlength="2" value=""></div>
<div title="Toggle controls side" class="button icon" id="flip-controls-button">&#xf1c3;</div>
- <div title="Help and info" class="button icon" data-modal="help-modal">&#xf50b;</div>
+ <div title="Help and info" class="button icon" data-modal="help-modal">&#xf50c;</div>
</div>
<div id="info">
<div id="oi">oi!</div>
diff --git a/web/static/style.css b/web/static/style.css
index f0f4b2f..64ae4df 100644
--- a/web/static/style.css
+++ b/web/static/style.css
@@ -47,6 +47,8 @@
}
html {
+ font-size: clamp(1.5vh, 2.5vw, 2vh);
+
height: 100vh;
}
@@ -66,7 +68,6 @@ body {
#main {
background-color: #111;
- font-size: clamp(1.5vh, 2.5vw, 2vh);
height: 100%;
margin: 0 auto;
@@ -115,12 +116,65 @@ body {
gap: 0.4rem;
}
-#titlebar div.input.first {
+#titlebar .name {
+ font-family: 'Source Serif 4', serif;
+ line-height: 1em;
+
+ margin-top: 0.05em;
+}
+
+#titlebar .button {
+ color: #eee;
+ background-color: #583a90;
+ border-radius: 0.4rem;
+ text-align: center;
+
+ height: 100%;
+ padding: 0 0.4rem;
+
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+#titlebar #key-exit {
+ display: none;
+}
+
+#titlebar #key-exit.visible {
+ display: flex;
+}
+
+#titlebar #key-exit.active {
+ background-color: #680018;
+}
+
+@media (hover: hover) and (pointer: fine) {
+ #titlebar .button:hover {
+ color: #fff;
+ background-color: #6e49b4;
+ }
+
+ #titlebar #key-exit.active:hover {
+ background-color: #82001e;
+ }
+}
+
+#titlebar .button:active {
+ color: #fff;
+ background-color: #7b51ca;
+}
+
+#titlebar #key-exit.active:active {
+ background-color: #920022;
+}
+
+#titlebar .opt-input.first {
margin-left: auto;
}
-#titlebar div.input {
- background-color: #222;
+#titlebar .opt-input {
+ height: 100%;
display: flex;
flex-wrap: wrap;
@@ -128,13 +182,22 @@ body {
justify-content: center;
}
-#titlebar label {
+#titlebar .opt-input label {
+ color: #ccc;
+ background-color: #282828;
+ border-radius: 0.4rem 0 0 0.4rem;
+
+ height: 100%;
padding: 0 0.4rem;
+
+ display: flex;
+ align-items: center;
+ justify-content: center;
}
-#titlebar input {
+#titlebar .opt-input input {
color: #eee;
- background-color: #3d2466;
+ background-color: #583a90;
font-family: inherit;
font-size: 1em;
text-align: right;
@@ -142,57 +205,34 @@ body {
width: 4ch;
padding: 0 0.4rem;
border: 0;
+ border-radius: 0 0.4rem 0.4rem 0;
}
-#titlebar input#difficulty {
+#titlebar .opt-input input#difficulty {
width: 2ch;
}
-#titlebar div.button {
- background-color: #3d2466;
- font-weight: 700;
-
- height: 100%;
- padding: 0em 0.2em;
-
- display: flex;
- align-items: center;
-}
-
@media (hover: hover) and (pointer: fine) {
- #titlebar input:hover {
- background-color: #5c3699;
+ #titlebar .opt-input:hover label {
+ color: #ddd;
+ background-color: #323232;
}
- #titlebar div.button:hover {
- background-color: #5c3699;
+ #titlebar .opt-input input:hover {
+ color: #fff;
+ background-color: #6e49b4;
}
}
-#titlebar input:focus {
- color: #fff;
- background-color: #6e41b8;
- outline: #7eab1e solid 2px;
+#titlebar .opt-input:focus-within label {
+ color: #eee;
+ background-color: #383838;
}
-#titlebar div.button:active {
+#titlebar .opt-input:focus-within input {
color: #fff;
- background-color: #6e41b8;
-}
-
-@media (max-aspect-ratio: 9/20) {
- #titlebar div.input {
- display: flex;
- flex-direction: column;
- }
-
- #titlebar label {
- padding: 0 0.4rem;
- }
-
- #titlebar .button {
- font-size: 2em;
- }
+ background-color: #7b51ca;
+ outline: 0;
}
@media (max-aspect-ratio: 8/5) {
@@ -224,7 +264,7 @@ body {
}
#controls #prompt.active {
- background-color: #311d52;
+ background-color: #352356;
}
#controls #prompt-msg-l, #controls #prompt-input, #controls #prompt-msg-r {
@@ -235,7 +275,7 @@ body {
align-items: center;
}
-#controls #prompt-msg-l, #prompt-msg-r {
+#controls #prompt-msg-l, #controls #prompt-msg-r {
flex: 1;
color: #ccc;
padding: 0 0.4rem;
@@ -328,29 +368,31 @@ body {
@media (hover: hover) and (pointer: fine) {
#controls .key:hover {
- background-color: #304010;
+ color: #fff;
+ background-color: #35481d;
}
}
#controls .key:active {
color: #fff;
- background-color: #384810;
+ background-color: #3b5120;
}
#controls .key.active {
- color: #eee;
+ color: #fff;
background-color: #3d2466;
}
@media (hover: hover) and (pointer: fine) {
#controls .key.active:hover {
- background-color: #5c3699;
+ color: #fff;
+ background-color: #4c2d80;
}
}
#controls .key.active:active {
color: #fff;
- background-color: #6e41b8;
+ background-color: #55328f;
}
#controls .key span.keyboard-val {
@@ -380,7 +422,8 @@ body {
#info #oi {
visibility: hidden;
- background-color: #640016;
+ color: #fff;
+ background-color: #680018;
font-size: 3em;
height: 1.2em;
width: 3ch;
@@ -415,7 +458,7 @@ body {
}
#info #p1-info.active, #info #p2-info.active {
- background-color: #304010;
+ background-color: #35481d;
}
#info #p1-info-inner, #info #p2-info-inner {
@@ -551,7 +594,7 @@ body {
.modal-content {
background-color: #222;
- font-size: 1.4em;
+ font-size: 1.2em;
font-family: 'Source Serif 4', serif;
user-select: text;
@@ -559,7 +602,7 @@ body {
max-height: calc(100% - 8em);
margin: 2em auto;
padding: 2em;
- outline: #7eab1e solid 2px;
+ outline: #94ca51 solid 2px;
overflow: auto;
}
@@ -578,11 +621,11 @@ body {
}
.modal-content a, .modal-content .modal-close {
- color: #7eab1e;
+ color: #94ca51;
}
.modal-content a:hover, .modal-content .modal-close:hover {
- color: #a8e428;
+ color: #b9fd65;
}
.modal-content .modal-close {
diff --git a/web/static/sw.js b/web/static/sw.js
index 172cf0d..5510e3f 100644
--- a/web/static/sw.js
+++ b/web/static/sw.js
@@ -1,5 +1,5 @@
const CACHE_PREFIX = 'dartboat-'
-const CACHE_VERSION = '7';
+const CACHE_VERSION = '8';
const CACHE_NAME = `${CACHE_PREFIX}${CACHE_VERSION}`;
const CACHE_FILES = [
diff --git a/web/web_control.c b/web/web_control.c
index 6d61f5c..8148e89 100644
--- a/web/web_control.c
+++ b/web/web_control.c
@@ -289,12 +289,14 @@ void start_match()
}
dom_enable_exit_dialogue(true);
+ dom_add_class("#key-exit", "visible");
draw_visits();
handle_next();
}
void end_match()
{
+ dom_remove_class("#key-exit", "visible");
dom_enable_exit_dialogue(false);
if (state) free_state();
handle_next();
diff --git a/web/web_prompt.c b/web/web_prompt.c
index f2aaa68..edb9f99 100644
--- a/web/web_prompt.c
+++ b/web/web_prompt.c
@@ -166,7 +166,7 @@ void prompt_num_darts()
void prompt_end_match()
{
- scoreboard_set_player_active(-1); // sets all inactive
+ scoreboard_set_player_active(-1);
set_prompt_mode(PM_END_MATCH);
prompt_set_msgl(
@@ -346,6 +346,9 @@ void prompt_handle_pre(char *command)
if (pm == PM_END_MATCH && strcmp(command, "submit"))
deactivate_key("submit");
+
+ if (strcmp(command, "exit"))
+ deactivate_key("exit");
}
void prompt_handle_on_change()
@@ -473,6 +476,16 @@ void prompt_handle_undo()
toggle_key("undo");
}
+void prompt_handle_exit()
+{
+ if (key_is_active("exit")) {
+ // FIXME clear scheduled c calls (comp throwing)
+ scoreboard_set_player_active(-1);
+ end_match();
+ }
+ toggle_key("exit");
+}
+
EMSCRIPTEN_KEEPALIVE
void prompt_handle(char *command, char *data)
{
@@ -490,4 +503,6 @@ void prompt_handle(char *command, char *data)
prompt_handle_rem();
else if (!strcmp(command, "undo"))
prompt_handle_undo();
+ else if (!strcmp(command, "exit"))
+ prompt_handle_exit();
}
generated by cgit v1.2.3-70-g09d2 (git 2.47.0) at 2024-11-25 08:52:12 +0000