summaryrefslogtreecommitdiff
path: root/web/static
diff options
context:
space:
mode:
Diffstat (limited to 'web/static')
-rw-r--r--web/static/dartboat.js208
-rw-r--r--web/static/index.html24
-rw-r--r--web/static/style.css16
3 files changed, 124 insertions, 124 deletions
diff --git a/web/static/dartboat.js b/web/static/dartboat.js
index 662fd3f..292c50d 100644
--- a/web/static/dartboat.js
+++ b/web/static/dartboat.js
@@ -1,92 +1,85 @@
-let user_rem;
-let oi_timeout;
-let prompt_handler;
-
-const POINT_CLASSES = [180, 140, 100, 60, 40, 20, 1, 0];
-
-let prompt_handler_visit = {
- append(val) {
- let elem = document.getElementById('prompt');
- if (elem.textContent.length < 3) {
- elem.textContent += val;
- promptUpdateRem();
- }
- },
-
- backspace() {
- let elem = document.getElementById('prompt');
- elem.textContent = elem.textContent.slice(0, -1);
- promptUpdateRem();
- },
-
- clear() {
- document.getElementById('prompt').textContent = '';
- promptUpdateRem();
- },
-
- submit(pts_is_rem) {
- let elem = document.getElementById('prompt');
- let pts = elem.textContent;
- if (!pts) return;
- promptClear();
-
- if (pts_is_rem)
- pts = user_rem - pts;
-
- Module.ccall('user_visit', 'number', ['number'], [pts]);
- },
-
- submit_rem() {
- this.submit(true);
- }
+function _promptGet() {
+ return document.getElementById('prompt').textContent;
}
-let prompt_handler_num_darts = {
- append(val) {
- let elem = document.getElementById('prompt');
- if (elem.textContent.length < 3)
- elem.textContent += val;
- },
-
- backspace() {
- let elem = document.getElementById('prompt');
- elem.textContent = elem.textContent.slice(0, -1);
- },
-
- clear() {
- document.getElementById('prompt').textContent = '';
- },
-
- submit() {
- let elem = document.getElementById('prompt');
- let val = elem.textContent;
- if (!val) return;
- promptClear();
-
- Module.ccall('resp_numdarts', null, ['number'], [val]);
- }
+function _promptGetAndClear() {
+ let val = _promptGet();
+ promptClear();
+ return val;
}
-let prompt_handler_init = {
- submit() {
- initMatch();
- }
+function _promptDeleteLast() {
+ let elem = document.getElementById('prompt');
+ elem.textContent = elem.textContent.slice(0, -1);
}
-function setPromptHandlerVisit() {
- prompt_handler = prompt_handler_visit;
+function _promptClear() {
+ document.getElementById('prompt').textContent = '';
}
-function setPromptHandlerInit() {
- prompt_handler = prompt_handler_init;
-}
+let prompt_handler;
+let prompt_handlers = {
+ visit: {
+ append(val) {
+ let elem = document.getElementById('prompt');
+ if (elem.textContent.length < 3) {
+ elem.textContent += val;
+ promptUpdateRem();
+ }
+ },
+
+ backspace() {
+ _promptDeleteLast();
+ promptUpdateRem();
+ },
-function setPromptHandlerNumDarts() {
- prompt_handler = prompt_handler_num_darts;
+ clear() {
+ _promptClear();
+ promptUpdateRem();
+ },
+
+ submit() {
+ let pts = _promptGetAndClear();
+ if (pts)
+ Module.ccall('user_visit', 'number', ['number'], [pts]);
+ },
+
+ submit_rem() {
+ let pts = _promptGetAndClear();
+ if (pts)
+ Module.ccall('user_visit', 'number', ['number'], [user_rem - pts]);
+ }
+ },
+ num_darts: {
+ append(val) {
+ let elem = document.getElementById('prompt');
+ if (elem.textContent.length < 3)
+ elem.textContent += val;
+ },
+
+ backspace() {
+ _promptDeleteLast();
+ },
+
+ clear() {
+ _promptClear();
+ },
+
+ submit() {
+ let n = _promptGetAndClear();
+ if (n)
+ Module.ccall('resp_numdarts', null, ['number'], [n]);
+ }
+ },
+ init: {
+ submit() {
+ Module.ccall('start_match');
+ }
+ }
}
-function setPromptHandlerNull() {
- prompt_handler = null;
+function setPromptHandler(ptr) {
+ prompt_handler = prompt_handlers[UTF8ToString(ptr)];
}
function promptAppend(...args) {
@@ -118,10 +111,7 @@ function clearMatchLog() {
document.getElementById('match').textContent = '';
}
-function initMatch() {
- Module.ccall('start_match');
-}
-
+let oi_timeout;
function oi() {
document.getElementById('oi').style.visibility = 'visible';
@@ -137,37 +127,50 @@ function clearOi() {
}
}
+let user_rem;
function updateUserRem(rem) {
user_rem = rem;
updateUserStateRem(rem);
}
function updateUserStateRem(rem) {
- let elem = document.getElementById('user-rem');
+ let elem = document.getElementById('p1-rem');
elem.textContent = rem < 0 || rem == 1 ? 'BUST' : rem;
Module.ccall('get_suggested', null, ['number', 'number'], [rem, 1]);
}
function updateBoatStateRem(rem) {
- let elem = document.getElementById('boat-rem');
+ let elem = document.getElementById('p2-rem');
elem.textContent = rem < 0 || rem == 1 ? 'BUST' : rem;
Module.ccall('get_suggested', null, ['number', 'number'], [rem, 2]);
}
+function updateUserName(p) {
+ document.getElementById('p1-name').textContent = UTF8ToString(p);
+}
+
+function updateBoatName(p) {
+ document.getElementById('p2-name').textContent = UTF8ToString(p);
+}
+
function userSugg(p) {
- document.getElementById('user-sugg').textContent = UTF8ToString(p);
+ document.getElementById('p1-sugg').textContent = UTF8ToString(p);
}
function boatSugg(p) {
- document.getElementById('boat-sugg').textContent = UTF8ToString(p);
+ document.getElementById('p2-sugg').textContent = UTF8ToString(p);
}
function updateUserAvg(avg) {
- document.getElementById('user-avg').textContent = avg.toFixed(2);
+ document.getElementById('p1-avg').textContent = avg.toFixed(2);
}
function updateBoatAvg(avg) {
- document.getElementById('boat-avg').textContent = avg.toFixed(2);
+ document.getElementById('p2-avg').textContent = avg.toFixed(2);
+}
+
+function setPromptText(ptr) {
+ document.getElementById('prompt').textContent = UTF8ToString(ptr);
}
function promptMsg(p) {
@@ -179,29 +182,25 @@ function promptSugg(p) {
}
function promptUpdateRem() {
- let elem = document.getElementById('user-rem');
- let pts = document.getElementById('prompt').textContent;
+ let elem = document.getElementById('p1-rem');
+ let pts = _promptGet();
updateUserStateRem(pts ? user_rem - pts : user_rem);
}
-function setBoatActive() {
- document.getElementById('user-state').classList.remove('active');
- document.getElementById('boat-state').classList.add('active');
-}
-
function setUserActive() {
- document.getElementById('boat-state').classList.remove('active');
- document.getElementById('user-state').classList.add('active');
+ document.getElementById('p2-state').classList.remove('active');
+ document.getElementById('p1-state').classList.add('active');
}
-function setNoOneActive() {
- document.getElementById('user-state').classList.remove('active');
- document.getElementById('boat-state').classList.remove('active');
+function setBoatActive() {
+ document.getElementById('p1-state').classList.remove('active');
+ document.getElementById('p2-state').classList.add('active');
}
-function setPromptText(ptr) {
- document.getElementById('prompt').textContent = UTF8ToString(ptr);
+function setNoneActive() {
+ document.getElementById('p1-state').classList.remove('active');
+ document.getElementById('p2-state').classList.remove('active');
}
function scheduleBoatThrowing(pts, ptr, delay_ms) {
@@ -220,6 +219,7 @@ function scheduleEndBoatThrowing(rem, avg, delay_ms) {
delay_ms);
}
+const POINT_CLASSES = [180, 140, 100, 60, 40, 20, 1, 0];
function drawVisit(visit_no, u_pts, u_rem, b_pts, b_rem, b_darts) {
let elem = document.getElementById('match');
@@ -238,7 +238,7 @@ function drawVisit(visit_no, u_pts, u_rem, b_pts, b_rem, b_darts) {
elem.scrollTop = elem.scrollHeight;
}
-function stdevChanged(val) {
+function setStdev(val) {
Module.ccall('change_stdev', null, ['number', 'number'], [val, val]);
}
@@ -246,7 +246,7 @@ function updateStdev(val) {
document.getElementById('stdev').value = val;
}
-function delayChanged(val) {
+function setDelay(val) {
Module.ccall('change_delay', null, ['number'], [val]);
}
diff --git a/web/static/index.html b/web/static/index.html
index 7f3e5fc..1db6537 100644
--- a/web/static/index.html
+++ b/web/static/index.html
@@ -12,17 +12,17 @@
<div id="main">
<div id="rem-bar">
<div id="oi">oi!</div>
- <div id="user-state">
- <div id="user-name">User</div>
- <div id="user-rem"></div>
- <div id="user-sugg"></div>
- <div id="user-avg"></div>
+ <div id="p1-state">
+ <div id="p1-name"></div>
+ <div id="p1-rem"></div>
+ <div id="p1-sugg"></div>
+ <div id="p1-avg"></div>
</div>
- <div id="boat-state">
- <div id="boat-name">Bot</div>
- <div id="boat-rem"></div>
- <div id="boat-sugg"></div>
- <div id="boat-avg"></div>
+ <div id="p2-state">
+ <div id="p2-name"></div>
+ <div id="p2-rem"></div>
+ <div id="p2-sugg"></div>
+ <div id="p2-avg"></div>
</div>
</div>
<div id="keypad">
@@ -46,8 +46,8 @@
</div>
<div id="settings-bar">
<div>dartboat™</div>
- <div class="input first"><span>delay</span><input id="delay" onchange="delayChanged(this.value)" maxlength="4" value="1000"></div>
- <div class="input"><span>stdev</span><input id="stdev" onchange="stdevChanged(this.value)" maxlength="4" value=""></div>
+ <div class="input first"><span>delay</span><input id="delay" onchange="setDelay(this.value)" maxlength="4" value="1000"></div>
+ <div class="input"><span>stdev</span><input id="stdev" onchange="setStdev(this.value)" maxlength="4" value=""></div>
<div class="help-button" onclick="modal('help-modal')">?</div>
</div>
<div id="match"></div>
diff --git a/web/static/style.css b/web/static/style.css
index e099f86..fe686a2 100644
--- a/web/static/style.css
+++ b/web/static/style.css
@@ -66,7 +66,7 @@ div#rem-bar {
grid-template-columns: repeat(2, 1fr);
}
-div#user-state, div#boat-state {
+div#p1-state, div#p2-state {
background-color: #222;
font-size: 1.5em;
@@ -78,35 +78,35 @@ div#user-state, div#boat-state {
align-items: center;
}
-div#user-state.active, div#boat-state.active {
+div#p1-state.active, div#p2-state.active {
background-color: #2a390a;
}
-div#user-rem, div#boat-rem {
+div#p1-rem, div#p2-rem {
font-size: 3em;
font-weight: bold;
}
-div#user-name, div#boat-name {
+div#p1-name, div#p2-name {
color: #aaa;
}
-div#user-sugg, div#boat-sugg {
+div#p1-sugg, div#p2-sugg {
color: #aaa;
font-size: 0.8em;
}
-div#user-sugg:after, div#boat-sugg:after {
+div#p1-sugg:after, div#p2-sugg:after {
content: '\200b';
}
-div#user-avg, div#boat-avg {
+div#p1-avg, div#p2-avg {
font-size: 0.8em;
align-self: left;
width: 100%;
}
-div#user-avg:before, div#boat-avg:before {
+div#p1-avg:before, div#p2-avg:before {
content: 'avg: ';
}
generated by cgit v1.2.3-70-g09d2 (git 2.47.0) at 2024-11-25 16:53:08 +0000