diff options
Diffstat (limited to 'web/static')
| -rw-r--r-- | web/static/dartboat.js | 14 | ||||
| -rw-r--r-- | web/static/index.html | 36 | ||||
| -rw-r--r-- | web/static/style.css | 18 |
3 files changed, 50 insertions, 18 deletions
diff --git a/web/static/dartboat.js b/web/static/dartboat.js index 7324ad0..016742b 100644 --- a/web/static/dartboat.js +++ b/web/static/dartboat.js @@ -124,6 +124,12 @@ let prompt_handlers = { } }, + match_over: { + submit() { + Module.ccall('match_init'); + }, + }, + init: { append(val) { let e = document.getElementById('prompt-input'); @@ -153,6 +159,14 @@ let prompt_handlers = { function setPromptHandler(ptr) { prompt_handler = prompt_handlers[UTF8ToString(ptr)]; + + if (UTF8ToString(ptr) === "init") { + document.querySelectorAll('.keypad').forEach(e => e.style.display = 'none'); + document.getElementById('keypad-init').style.removeProperty('display'); + } else { + document.querySelectorAll('.keypad').forEach(e => e.style.display = 'none'); + document.getElementById('keypad-default').style.removeProperty('display'); + } } function promptHandle(action, ...args) { diff --git a/web/static/index.html b/web/static/index.html index dbd2b6e..59df139 100644 --- a/web/static/index.html +++ b/web/static/index.html @@ -25,26 +25,32 @@ <div id="p2-avg"></div> </div> </div> - <div id="keypad"> + <div id="controls"> <div id="prompt-container"> <div id="prompt-msg-l"></div> <div id="prompt-input"></div> <div id="prompt-msg-r"></div> </div> - <div onclick="promptHandle('append', 1)" class="key num">1</div> - <div onclick="promptHandle('append', 2)" class="key num">2</div> - <div onclick="promptHandle('append', 3)" class="key num">3</div> - <div onclick="promptHandle('append', 4)" class="key num">4</div> - <div onclick="promptHandle('append', 5)" class="key num">5</div> - <div onclick="promptHandle('append', 6)" class="key num">6</div> - <div onclick="promptHandle('append', 7)" class="key num">7</div> - <div onclick="promptHandle('append', 8)" class="key num">8</div> - <div onclick="promptHandle('append', 9)" class="key num">9</div> - <div onclick="promptHandle('clear')" class="key">CLEAR</div> - <div onclick="promptHandle('append', 0)" class="key num">0</div> - <div onclick="promptHandle('submit')" class="key ok">OK</div> - <div onclick="promptHandle('undo')" class="key" id="key_undo">UNDO</div> - <div onclick="promptHandle('submit_rem')" class="key">REMAINING</div> + <div id="keypad-default" class="keypad" style="display: none"> + <div onclick="promptHandle('append', 1)" class="key num">1</div> + <div onclick="promptHandle('append', 2)" class="key num">2</div> + <div onclick="promptHandle('append', 3)" class="key num">3</div> + <div onclick="promptHandle('append', 4)" class="key num">4</div> + <div onclick="promptHandle('append', 5)" class="key num">5</div> + <div onclick="promptHandle('append', 6)" class="key num">6</div> + <div onclick="promptHandle('append', 7)" class="key num">7</div> + <div onclick="promptHandle('append', 8)" class="key num">8</div> + <div onclick="promptHandle('append', 9)" class="key num">9</div> + <div onclick="promptHandle('clear')" class="key">CLEAR</div> + <div onclick="promptHandle('append', 0)" class="key num">0</div> + <div onclick="promptHandle('submit')" class="key ok">OK</div> + <div onclick="promptHandle('undo')" class="key" id="key_undo">UNDO</div> + <div onclick="promptHandle('submit_rem')" class="key">REMAINING</div> + </div> + <div id="keypad-init" class="keypad"> + <div onclick="promptHandle('append', 1); promptHandle('submit')" class="key">(1) Play against bot</div> + <div onclick="promptHandle('append', 2); promptHandle('submit')" class="key">(2) Scoreboard (2-player)</div> + </div> </div> <div id="settings-bar"> <div>dartboat™</div> diff --git a/web/static/style.css b/web/static/style.css index 8da0cbc..62cdcaa 100644 --- a/web/static/style.css +++ b/web/static/style.css @@ -22,11 +22,11 @@ div#main { display: grid; grid-template-columns: 1fr; grid-template-rows: min-content min-content 2fr 3fr; - grid-template-areas: "settings-bar" "rem-bar" "visits" "keypad"; + grid-template-areas: "settings-bar" "rem-bar" "visits" "controls"; } -div#keypad { - grid-area: keypad; +div#controls { + grid-area: controls; font-size: clamp(1.5vh, 2vw, 2vh); @@ -36,6 +36,18 @@ div#keypad { grid-auto-rows: 1fr; } +div#controls .keypad { + display: contents; +} + +div#controls #keypad-init .key { + grid-column: 1 / -1; + + padding-left: 0.4rem; + + justify-content: left; +} + div#oi { visibility: hidden; |