From e63397ffb05678e4b6472ee5c8081199f88be248 Mon Sep 17 00:00:00 2001 From: Christian Heller <c.heller@plomlompom.de> Date: Thu, 29 Oct 2020 04:45:20 +0100 Subject: [PATCH] Refactor movement selector, add terminal height/width selectors. --- new2/rogue_chat_nocanvas_monochrome.html | 48 ++++++++++++++++-------- 1 file changed, 32 insertions(+), 16 deletions(-) diff --git a/new2/rogue_chat_nocanvas_monochrome.html b/new2/rogue_chat_nocanvas_monochrome.html index 3219896..11fbfc6 100644 --- a/new2/rogue_chat_nocanvas_monochrome.html +++ b/new2/rogue_chat_nocanvas_monochrome.html @@ -3,13 +3,15 @@ <style> </style> </head><body> -<pre id="terminal" style="display: inline-block; color: white; background-color: black;"></pre> <div> movement: <select id="WASD_selector" name="WASD_selector" > <option value="w, a, s, d" selected>w, a, s, d</option> <option value="arrow keys">arrow keys</option> </select> +rows: <input id="n_rows" type="number" step=2 min=10 value=24 /> +cols: <input id="n_cols" type="number" step=4 min=20 value=80 /> </div> +<pre id="terminal" style="display: inline-block;"></pre> <script> "use strict"; let websocket_location = "ws://localhost:8000"; @@ -203,21 +205,6 @@ let tui = { this.recalc_input_lines(); this.height_header = this.height_turn_line + this.height_mode_line; this.log_msg("@ waiting for server connection ..."); - this.wasd_selector = document.getElementById("WASD_selector"); - this.wasd_selector.addEventListener('input', function() { - if (tui.wasd_selector.value == 'w, a, s, d') { - tui.key_up = 'w'; - tui.key_down = 's'; - tui.key_left = 'a'; - tui.key_right = 'd'; - } else if (tui.wasd_selector.value == 'arrow keys') { - tui.key_up = 'ArrowUp'; - tui.key_down = 'ArrowDown'; - tui.key_left = 'ArrowLeft'; - tui.key_right = 'ArrowRight'; - }; - tui.movement_keys_desc = tui.wasd_selector.value; - }, false); }, init_login: function() { this.log_msg("@ please enter your username:"); @@ -593,5 +580,34 @@ document.addEventListener('keydown', (event) => { }; } }, false); + +let wasd_selector = document.getElementById("WASD_selector"); +wasd_selector.addEventListener('input', function() { + if (wasd_selector.value == 'w, a, s, d') { + tui.key_up = 'w'; + tui.key_down = 's'; + tui.key_left = 'a'; + tui.key_right = 'd'; + } else if (wasd_selector.value == 'arrow keys') { + tui.key_up = 'ArrowUp'; + tui.key_down = 'ArrowDown'; + tui.key_left = 'ArrowLeft'; + tui.key_right = 'ArrowRight'; + }; + tui.movement_keys_desc = wasd_selector.value; +}, false); +let rows_selector = document.getElementById("n_rows"); +rows_selector.addEventListener('input', function() { + terminal.rows = rows_selector.value; + terminal.initialize(); + tui.full_refresh(); +}, false); +let cols_selector = document.getElementById("n_cols"); +cols_selector.addEventListener('input', function() { + terminal.cols = cols_selector.value; + terminal.initialize(); + tui.window_width = terminal.cols / 2, + tui.full_refresh(); +}, false); </script> </body></html> -- 2.30.2