diff options
| author | David Vazgenovich Shakaryan <dvshakaryan@gmail.com> | 2022-05-09 15:56:22 -0700 |
|---|---|---|
| committer | David Vazgenovich Shakaryan <dvshakaryan@gmail.com> | 2022-05-09 15:56:22 -0700 |
| commit | 9ba644fd849ef7664be009e00206bf5eb1b85762 (patch) | |
| tree | 2a154ab0891b4c4d070a547341893f47072f7b4e /web/static | |
| parent | 22750c5853698817278cef512d253175ccc08c56 (diff) | |
| download | dartboat-9ba644fd849ef7664be009e00206bf5eb1b85762.tar.gz dartboat-9ba644fd849ef7664be009e00206bf5eb1b85762.tar.xz | |
web: dynamically generate (list-mode) keypad keys
This is currently only for match mode selection, but we'll reuse it to
implement more menus.
Diffstat (limited to 'web/static')
| -rw-r--r-- | web/static/dartboat.js | 9 | ||||
| -rw-r--r-- | web/static/index.html | 9 | ||||
| -rw-r--r-- | web/static/style.css | 2 |
3 files changed, 9 insertions, 11 deletions
diff --git a/web/static/dartboat.js b/web/static/dartboat.js index 22c0728..eb1b8fa 100644 --- a/web/static/dartboat.js +++ b/web/static/dartboat.js @@ -122,9 +122,12 @@ function flipControls(store_opt = true) { document.addEventListener('DOMContentLoaded', () => { let f; - f = e => e.target.dataset.command.split(';').forEach(x => - promptHandle(...x.split(':', 2))); - $$('[data-command]').forEach(x => x.addEventListener('click', f)); + $('#controls').addEventListener('click', e => { + const command = e.target.dataset.command; + if (!command) return; + command.split(';').forEach(x => + promptHandle(...x.split(':', 2))); + }); f = e => _set_opt(toCString(e.target.dataset.opt), toCString(e.target.value)); diff --git a/web/static/index.html b/web/static/index.html index feea2d6..d9d8718 100644 --- a/web/static/index.html +++ b/web/static/index.html @@ -58,14 +58,9 @@ <div data-command="undo" class="key" id="key-undo">UNDO</div> <div data-command="rem" class="key" id="key-rem">REMAINING</div> </div> - <div id="keypad-select_mode" class="keypad"> - <div data-command="append:1;submit" class="key"><span class="keyboard-val">[1]</span> Play against bot</div> - <div data-command="append:2;submit" class="key"><span class="keyboard-val">[2]</span> One-player scoreboard</div> - <div data-command="append:3;submit" class="key"><span class="keyboard-val">[3]</span> Two-player scoreboard</div> - </div> + <div id="keypad-list" class="keypad"></div> <div id="keypad-dartboard" class="keypad"> - <div id="dartboard-container"> - </div> + <div id="dartboard-container"></div> </div> </div> <div id="visits"></div> diff --git a/web/static/style.css b/web/static/style.css index 1383b5c..3df1d92 100644 --- a/web/static/style.css +++ b/web/static/style.css @@ -194,7 +194,7 @@ body { display: contents; } -#controls #keypad-select_mode .key { +#controls #keypad-list .key { grid-column: 1 / -1; padding-left: 0.4rem; |