X-Git-Url: https://plomlompom.com/repos/%7B%7B%20web_path%20%7D%7D/decks/%7B%7Bdeck_id%7D%7D/cards/%7B%7Bcard_id%7D%7D/form?a=blobdiff_plain;f=rogue_chat.html;h=653a7034e672d3b2d96e262c146d9b1d2d679e3f;hb=b5440b01de1253e7741d2d48f56557f269943263;hp=dfeeecdba69e2570d88c4ea1f08fafa512b2c14e;hpb=c7a3af00680ba0449310bbb7336a187dd4ed6bcf;p=plomrogue2

diff --git a/rogue_chat.html b/rogue_chat.html
index dfeeecd..653a703 100644
--- a/rogue_chat.html
+++ b/rogue_chat.html
@@ -16,10 +16,7 @@ terminal rows: <input id="n_rows" type="number" step=4 min=24 value=24 />
 </div>
 <pre id="terminal"></pre>
 <textarea id="input" style="opacity: 0; width: 0px;"></textarea>
-<div>
-keyboard input/control: <span id="keyboard_control"></span>
-</div>
-<h3>button controls for mouse players</h3>
+<h3>button controls for hard-to-remember keybindings</h3>
 <table id="move_table" style="float: left">
   <tr>
     <td style="text-align: right"><button id="hex_move_upleft"></button></td>
@@ -52,12 +49,13 @@ keyboard input/control: <span id="keyboard_control"></span>
     <td><button id="switch_to_play"></button></td>
     <td>
       <button id="switch_to_take_thing"></button>
-      <button id="drop_thing"></button>
+      <button id="switch_to_drop_thing"></button>
       <button id="door"></button>
       <button id="consume"></button>
       <button id="switch_to_command_thing"></button>
       <button id="teleport"></button>
-      <button id="install"></button>
+      <button id="wear"></button>
+      <button id="spin"></button>
     </td>
   </tr>
   <tr>
@@ -65,11 +63,13 @@ keyboard input/control: <span id="keyboard_control"></span>
     <td>
       <button id="switch_to_write"></button>
       <button id="flatten"></button>
+      <button id="install"></button>
       <button id="switch_to_annotate"></button>
       <button id="switch_to_portal"></button>
       <button id="switch_to_name_thing"></button>
       <button id="switch_to_password"></button>
       <button id="switch_to_enter_face"></button>
+      <button id="switch_to_enter_hat"></button>
     </td>
   </tr>
   <tr>
@@ -98,11 +98,14 @@ keyboard input/control: <span id="keyboard_control"></span>
 <li>help: <input id="key_help" type="text" value="h" />
 <li>flatten surroundings: <input id="key_flatten" type="text" value="F" />
 <li>teleport: <input id="key_teleport" type="text" value="p" />
-<li>drop thing: <input id="key_drop_thing" type="text" value="u" />
+<li>spin: <input id="key_spin" type="text" value="S" />
 <li>open/close: <input id="key_door" type="text" value="D" />
 <li>consume: <input id="key_consume" type="text" value="C" />
 <li>install: <input id="key_install" type="text" value="I" />
+<li>(un-)wear: <input id="key_wear" type="text" value="W" />
+<li><input id="key_switch_to_drop_thing" type="text" value="u" />
 <li><input id="key_switch_to_enter_face" type="text" value="f" />
+<li><input id="key_switch_to_enter_hat" type="text" value="H" />
 <li><input id="key_switch_to_take_thing" type="text" value="z" />
 <li><input id="key_switch_to_chat" type="text" value="t" />
 <li><input id="key_switch_to_play" type="text" value="p" />
@@ -125,7 +128,7 @@ keyboard input/control: <span id="keyboard_control"></span>
 <script>
 "use strict";
 let websocket_location = "wss://plomlompom.com/rogue_chat/";
-//let websocket_location = "ws://localhost:8001/";
+//let websocket_location = "ws://localhost:8000/";
 
 let mode_helps = {
     'play': {
@@ -157,6 +160,11 @@ let mode_helps = {
         'intro': 'Pick up a thing in reach by entering its index number.  Enter nothing to abort.',
         'long': 'You see a list of things which you could pick up.  Enter the target thing\'s index, or, to leave, nothing.'
     },
+    'drop_thing': {
+        'short': 'drop thing',
+        'intro': 'Enter number of direction to which you want to drop thing.',
+        'long': 'Drop currently carried thing by entering the target direction index.  Enter nothing to return to play mode..'
+    },
     'admin_thing_protect': {
         'short': 'change thing protection',
         'intro': '@ enter thing protection character:',
@@ -165,7 +173,12 @@ let mode_helps = {
     'enter_face': {
         'short': 'enter your face',
         'intro': '@ enter face line (enter nothing to abort):',
-        'long': 'Draw your face as ASCII art.  The string you enter must be 9 characters long, and will be divided on display into three lines of three characters each, from top to bottom..'
+        'long': 'Draw your face as ASCII art.  The string you enter must be 18 characters long, and will be divided on display into 3 lines of 6 characters each, from top to bottom.  Eat cookies to extend the ASCII characters available for drawing.'
+    },
+    'enter_hat': {
+        'short': 'enter your hat',
+        'intro': '@ enter hat line (enter nothing to abort):',
+        'long': 'Draw your hat as ASCII art.  The string you enter must be 18 characters long, and will be divided on display into 3 lines of 6 characters each, from top to bottom..'
     },
     'write': {
         'short': 'change terrain',
@@ -242,10 +255,11 @@ let key_descriptions = {
     'help': 'help',
     'flatten': 'flatten surroundings',
     'teleport': 'teleport',
-    'drop_thing': 'drop thing',
     'door': 'open/close',
     'consume': 'consume',
     'install': '(un-)install',
+    'wear': '(un-)wear',
+    'spin': 'spin',
     'toggle_map_mode': 'toggle map view',
     'toggle_tile_draw': 'toggle protection character drawing',
     'hex_move_upleft': 'up-left',
@@ -444,7 +458,6 @@ let server = {
         this.url = url;
         this.websocket = new WebSocket(this.url);
         this.websocket.onopen = function(event) {
-            server.connected = true;
             game.thing_types = {};
             game.terrains = {};
             server.send(['TASKS']);
@@ -454,7 +467,6 @@ let server = {
             tui.switch_mode('login');
         };
         this.websocket.onclose = function(event) {
-            server.connected = false;
             tui.switch_mode('waiting_for_server');
             tui.log_msg("@ server disconnected :(");
         };
@@ -471,63 +483,84 @@ let server = {
         let tokens = parser.tokenize(event.data);
         if (tokens[0] === 'TURN') {
             game.turn_complete = false;
-            explorer.empty_annotations();
-            game.things = {};
-            game.portals = {};
-            game.fov = '';
             game.turn = parseInt(tokens[1]);
+        } else if (tokens[0] === 'PSEUDO_FOV_WIPE') {
+            game.portals_new = {};
+            explorer.annotations_new = {};
+            game.things_new = [];
         } else if (tokens[0] === 'THING') {
-            let t = game.get_thing(tokens[4], true);
+            let t = game.get_thing_temp(tokens[4], true);
             t.position = parser.parse_yx(tokens[1]);
             t.type_ = tokens[2];
             t.protection = tokens[3];
             t.portable = parseInt(tokens[5]);
+            t.commandable = parseInt(tokens[6]);
         } else if (tokens[0] === 'THING_NAME') {
-            let t = game.get_thing(tokens[1], false);
+            let t = game.get_thing_temp(tokens[1]);
             t.name_ = tokens[2];
         } else if (tokens[0] === 'THING_FACE') {
-            let t = game.get_thing(tokens[1], false);
+            let t = game.get_thing_temp(tokens[1]);
             t.face = tokens[2];
+        } else if (tokens[0] === 'THING_HAT') {
+            let t = game.get_thing_temp(tokens[1]);
+            t.hat = tokens[2];
         } else if (tokens[0] === 'THING_CHAR') {
-            let t = game.get_thing(tokens[1], false);
+            let t = game.get_thing_temp(tokens[1]);
             t.thing_char = tokens[2];
         } else if (tokens[0] === 'TASKS') {
             game.tasks = tokens[1].split(',');
             tui.mode_write.legal = game.tasks.includes('WRITE');
             tui.mode_command_thing.legal = game.tasks.includes('WRITE');
             tui.mode_take_thing.legal = game.tasks.includes('PICK_UP');
+            tui.mode_drop_thing.legal = game.tasks.includes('DROP');
         } else if (tokens[0] === 'THING_TYPE') {
             game.thing_types[tokens[1]] = tokens[2]
         } else if (tokens[0] === 'THING_CARRYING') {
-            let t = game.get_thing(tokens[1], false);
-            t.carrying = true;
+            let t = game.get_thing_temp(tokens[1]);
+            t.carrying = game.get_thing(tokens[2], false);
         } else if (tokens[0] === 'THING_INSTALLED') {
-            let t = game.get_thing(tokens[1], false);
+            let t = game.get_thing_temp(tokens[1]);
             t.installed = true;
         } else if (tokens[0] === 'TERRAIN') {
             game.terrains[tokens[1]] = tokens[2]
         } else if (tokens[0] === 'MAP') {
-            game.map_geometry = tokens[1];
-            tui.init_keys();
-            game.map_size = parser.parse_yx(tokens[2]);
-            game.map = tokens[3]
+            game.map_geometry_new = tokens[1];
+            game.map_size_new = parser.parse_yx(tokens[2]);
+            game.map_new = tokens[3]
         } else if (tokens[0] === 'FOV') {
-            game.fov = tokens[1]
+            game.fov_new = tokens[1]
         } else if (tokens[0] === 'MAP_CONTROL') {
-            game.map_control = tokens[1]
+            game.map_control_new = tokens[1]
         } else if (tokens[0] === 'GAME_STATE_COMPLETE') {
+            game.portals = game.portals_new;
+            game.map_geometry = game.map_geometry_new;
+            game.map_size = game.map_size_new;
+            game.map = game.map_new;
+            game.fov = game.fov_new;
+            tui.init_keys();
+            game.map_control = game.map_control_new;
+            explorer.annotations = explorer.annotations_new;
+            explorer.info_cached = false;
+            game.things = game.things_new;
+            game.player = game.things[game.player_id];
+            game.players_hat_chars = game.players_hat_chars_new;
             game.turn_complete = true;
             if (tui.mode.name == 'post_login_wait') {
                 tui.switch_mode('play');
+            } else {
+                tui.full_refresh();
             }
-            explorer.info_cached = false;
-            tui.full_refresh();
         } else if (tokens[0] === 'CHAT') {
              tui.log_msg('# ' + tokens[1], 1);
+        } else if (tokens[0] === 'CHATFACE') {
+            tui.draw_face = tokens[1];
+            tui.full_refresh();
         } else if (tokens[0] === 'REPLY') {
              tui.log_msg('#MUSICPLAYER: ' + tokens[1], 1);
         } else if (tokens[0] === 'PLAYER_ID') {
             game.player_id = parseInt(tokens[1]);
+        } else if (tokens[0] === 'PLAYERS_HAT_CHARS') {
+            game.players_hat_chars_new = tokens[1];
         } else if (tokens[0] === 'LOGIN_OK') {
             this.send(['GET_GAMESTATE']);
             tui.switch_mode('post_login_wait');
@@ -541,11 +574,10 @@ let server = {
             tui.switch_mode('admin');
         } else if (tokens[0] === 'PORTAL') {
             let position = parser.parse_yx(tokens[1]);
-            game.portals[position] = tokens[2];
+            game.portals_new[position] = tokens[2];
         } else if (tokens[0] === 'ANNOTATION') {
             let position = parser.parse_yx(tokens[1]);
-            explorer.update_annotations(position, tokens[2]);
-            tui.full_refresh();
+            explorer.annotations_new[position] = tokens[2];
         } else if (tokens[0] === 'UNHANDLED_INPUT') {
             tui.log_msg('? unknown command');
         } else if (tokens[0] === 'PLAY_ERROR') {
@@ -664,7 +696,9 @@ let tui = {
   mode_name_thing: new Mode('name_thing', true, true),
   mode_command_thing: new Mode('command_thing', true),
   mode_take_thing: new Mode('take_thing', true),
+  mode_drop_thing: new Mode('drop_thing', true),
   mode_enter_face: new Mode('enter_face', true),
+  mode_enter_hat: new Mode('enter_hat', true),
   mode_admin_enter: new Mode('admin_enter', true),
   mode_admin: new Mode('admin'),
   mode_control_pw_pw: new Mode('control_pw_pw', true),
@@ -677,17 +711,22 @@ let tui = {
       'move': 'MOVE',
       'door': 'DOOR',
       'install': 'INSTALL',
+      'wear': 'WEAR',
       'command': 'COMMAND',
       'consume': 'INTOXICATE',
+      'spin': 'SPIN',
   },
   offset: [0,0],
   map_lines: [],
+  ascii_draw_stage: 0,
+  full_ascii_draw: '',
   selectables: [],
+  draw_face: false,
   init: function() {
       this.mode_play.available_modes = ["chat", "study", "edit", "admin_enter",
-                                        "command_thing", "take_thing"]
-      this.mode_play.available_actions = ["move", "drop_thing",
-                                          "teleport", "door", "consume", "install"];
+                                        "command_thing", "take_thing", "drop_thing"]
+      this.mode_play.available_actions = ["move", "teleport", "door", "consume",
+                                          "wear", "spin"];
       this.mode_study.available_modes = ["chat", "play", "admin_enter", "edit"]
       this.mode_study.available_actions = ["toggle_map_mode", "move_explorer"];
       this.mode_admin.available_modes = ["admin_thing_protect", "control_pw_type",
@@ -698,10 +737,10 @@ let tui = {
       this.mode_control_tile_draw.available_actions = ["toggle_tile_draw"];
       this.mode_edit.available_modes = ["write", "annotate", "portal", "name_thing",
                                         "password", "chat", "study", "play",
-                                        "admin_enter", "enter_face"]
-      this.mode_edit.available_actions = ["move", "flatten", "toggle_map_mode"]
+                                        "admin_enter", "enter_face", "enter_hat"]
+      this.mode_edit.available_actions = ["move", "flatten", "install",
+                                          "toggle_map_mode"]
       this.inputEl = document.getElementById("input");
-      this.inputEl.focus();
       this.switch_mode('waiting_for_server');
       this.recalc_input_lines();
       this.height_header = this.height_turn_line + this.height_mode_line;
@@ -745,29 +784,45 @@ let tui = {
       return game.tasks.includes(this.action_tasks[action]);
   },
   switch_mode: function(mode_name) {
+
+    function fail(msg, return_mode) {
+        tui.log_msg('? ' + msg);
+        terminal.blink_screen();
+        tui.switch_mode(return_mode);
+    }
+
     if (this.mode && this.mode.name == 'control_tile_draw') {
         tui.log_msg('@ finished tile protection drawing.')
     }
+    this.draw_face = false;
     this.tile_draw = false;
+    if (mode_name == 'command_thing' && (!game.player.carrying
+                                         || !game.player.carrying.commandable)) {
+        return fail('not carrying anything commandable', 'play');
+    } else if (mode_name == 'take_thing' && game.player.carrying) {
+        return fail('already carrying something', 'play');
+    } else if (mode_name == 'drop_thing' && !game.player.carrying) {
+        return fail('not carrying anything droppable', 'play');
+    } else if (mode_name == 'enter_hat' && !game.player.hat) {
+        return fail('not wearing hat to edit', 'edit');
+    }
     if (mode_name == 'admin_enter' && this.is_admin) {
         mode_name = 'admin';
     } else if (['name_thing', 'admin_thing_protect'].includes(mode_name)) {
-        let player_position = game.things[game.player_id].position;
         let thing_id = null;
         for (let t_id in game.things) {
             if (t_id == game.player_id) {
                 continue;
             }
             let t = game.things[t_id];
-            if (player_position[0] == t.position[0] && player_position[1] == t.position[1]) {
+            if (game.player.position[0] == t.position[0]
+                && game.player.position[1] == t.position[1]) {
                 thing_id = t_id;
                 break;
             }
         }
         if (!thing_id) {
-            terminal.blink_screen();
-            this.log_msg('? not standing over thing');
-            return;
+            return fail('not standing over thing', 'fail');
         } else {
             this.selected_thing_id = thing_id;
         }
@@ -778,11 +833,8 @@ let tui = {
     } else if (this.mode.name != "edit") {
         this.map_mode = 'terrain + things';
     };
-    if (this.mode.has_input_prompt || this.mode.is_single_char_entry) {
-        this.inputEl.focus();
-    }
     if (game.player_id in game.things && (this.mode.shows_info || this.mode.name == 'control_tile_draw')) {
-        explorer.position = game.things[game.player_id].position;
+        explorer.position = game.player.position;
     }
     this.inputEl.value = "";
     this.restore_input_values();
@@ -819,9 +871,8 @@ let tui = {
         this.show_help = true;
     } else if (this.mode.name == 'take_thing') {
         this.log_msg("Portable things in reach for pick-up:");
-        const player = game.things[game.player_id];
-        const y = player.position[0]
-        const x = player.position[1]
+        const y = game.player.position[0]
+        const x = game.player.position[1]
         let select_range = [y.toString() + ':' + x.toString(),
                             (y + 0).toString() + ':' + (x - 1).toString(),
                             (y + 0).toString() + ':' + (x + 1).toString(),
@@ -842,16 +893,28 @@ let tui = {
             if (select_range.includes(t.position[0].toString()
                                       + ':' + t.position[1].toString())
                 && t.portable) {
-                this.selectables.push([t_id, t]);
+                this.selectables.push(t_id);
             }
         };
         if (this.selectables.length == 0) {
-            this.log_msg('none')
+            this.log_msg('none');
+            terminal.blink_screen();
+            this.switch_mode('play');
+            return;
         } else {
-            for (let [i, t] of this.selectables.entries()) {
-                this.log_msg(i + ': ' + explorer.get_thing_info(t[1]));
+            for (let [i, t_id] of this.selectables.entries()) {
+                const t = game.things[t_id];
+                this.log_msg(i + ': ' + explorer.get_thing_info(t));
             }
         }
+    } else if (this.mode.name == 'drop_thing') {
+        this.log_msg('Direction to drop thing to:');
+        this.selectables = ['HERE'].concat(Object.values(this.movement_keys));
+        for (let [i, direction] of this.selectables.entries()) {
+            this.log_msg(i + ': ' + direction);
+        };
+    } else if (this.mode.name == 'enter_hat') {
+        this.log_msg('legal characters: ' + game.players_hat_chars);
     } else if (this.mode.name == 'command_thing') {
         server.send(['TASK:COMMAND', 'HELP']);
     } else if (this.mode.name == 'control_pw_pw') {
@@ -894,6 +957,14 @@ let tui = {
           if (t && t.protection) {
               this.inputEl.value = t.protection;
           }
+      } else if (['enter_face', 'enter_hat'].includes(this.mode.name)) {
+          const start = this.ascii_draw_stage * 6;
+          const end = (this.ascii_draw_stage + 1) * 6;
+          if (this.mode.name == 'enter_face') {
+              this.inputEl.value = game.player.face.slice(start, end);
+          } else if (this.mode.name == 'enter_hat') {
+              this.inputEl.value = game.player.hat.slice(start, end);
+          }
       }
   },
   recalc_input_lines: function() {
@@ -972,6 +1043,34 @@ let tui = {
       };
       this.full_refresh();
   },
+  pick_selectable: function(task_name) {
+      const i = parseInt(this.inputEl.value);
+      if (isNaN(i) || i < 0 || i >= this.selectables.length) {
+          tui.log_msg('? invalid index, aborted');
+      } else {
+          server.send(['TASK:' + task_name, tui.selectables[i]]);
+      }
+      this.inputEl.value = "";
+      this.switch_mode('play');
+  },
+  enter_ascii_art: function(command) {
+      if (this.inputEl.value.length != 6) {
+          this.log_msg('? wrong input length, try again');
+          return;
+      }
+      this.log_msg('  ' + this.inputEl.value);
+      this.full_ascii_draw += this.inputEl.value;
+      this.ascii_draw_stage += 1;
+      if (this.ascii_draw_stage < 3) {
+          this.restore_input_values();
+      } else {
+          server.send([command, this.full_ascii_draw]);
+          this.full_ascii_draw = '';
+          this.ascii_draw_stage = 0;
+          this.inputEl.value = '';
+          this.switch_mode('edit');
+      }
+  },
   draw_map: function() {
     if (!game.turn_complete && this.map_lines.length == 0) {
         return;
@@ -993,8 +1092,9 @@ let tui = {
         };
         map_lines_split.push(line);
         if (this.map_mode == 'terrain + annotations') {
-            for (const coordinate of explorer.info_hints) {
-                map_lines_split[coordinate[0]][coordinate[1]] = 'A ';
+            for (const [coordinate, _] of Object.entries(explorer.annotations)) {
+                const yx = coordinate.split(',')
+                map_lines_split[yx[0]][yx[1]] = 'A ';
             }
         } else if (this.map_mode == 'terrain + things') {
             for (const p in game.portals) {
@@ -1031,11 +1131,10 @@ let tui = {
                 }
             };
         }
-        let player = game.things[game.player_id];
         if (tui.mode.shows_info || tui.mode.name == 'control_tile_draw') {
             map_lines_split[explorer.position[0]][explorer.position[1]] = '??';
         } else if (tui.map_mode != 'terrain + things') {
-            map_lines_split[player.position[0]][player.position[1]] = '??';
+            map_lines_split[game.player.position[0]][game.player.position[1]] = '??';
         }
         this.map_lines = []
         if (game.map_geometry == 'Square') {
@@ -1054,7 +1153,7 @@ let tui = {
             };
         }
         let window_center = [terminal.rows / 2, this.window_width / 2];
-        let center_position = [player.position[0], player.position[1]];
+        let center_position = [game.player.position[0], game.player.position[1]];
         if (tui.mode.shows_info || tui.mode.name == 'control_tile_draw') {
             center_position = [explorer.position[0], explorer.position[1]];
         }
@@ -1074,6 +1173,32 @@ let tui = {
         terminal.write(term_y, term_x, to_draw);
     }
   },
+  draw_face_popup: function() {
+      const t = game.things[this.draw_face];
+      if (!t || !t.face) {
+          this.draw_face = false;
+          return;
+      }
+      const start_x = tui.window_width - 10;
+      let t_char = ' ';
+      if (t.thing_char) {
+          t_char = t.thing_char;
+      }
+      function draw_body_part(body_part, end_y) {
+          terminal.write(end_y - 4, start_x, ' _[ @' + t_char + ' ]_ ');
+          terminal.write(end_y - 3, start_x, '|        |');
+          terminal.write(end_y - 2, start_x, '| ' + body_part.slice(0, 6) + ' |');
+          terminal.write(end_y - 1, start_x, '| ' + body_part.slice(6, 12) + ' |');
+          terminal.write(end_y, start_x, '| ' + body_part.slice(12, 18) + ' |');
+      }
+      if (t.face) {
+          draw_body_part(t.face, terminal.rows - 2);
+      }
+      if (t.hat) {
+          draw_body_part(t.hat, terminal.rows - 5);
+      }
+      terminal.write(terminal.rows - 1, start_x, '|        |');
+  },
   draw_mode_line: function() {
       let help = 'hit [' + this.keys.help + '] for help';
       if (this.mode.has_input_prompt) {
@@ -1162,7 +1287,8 @@ let tui = {
       content += this.mode.list_available_modes();
       let start_x = 0;
       if (!this.mode.has_input_prompt) {
-          start_x = this.window_width
+          start_x = this.window_width;
+          this.draw_links = false;
       }
       terminal.drawBox(0, start_x, terminal.rows, this.window_width);
       let [lines, _] = this.msg_into_lines_of_width(content, this.window_width);
@@ -1189,6 +1315,7 @@ let tui = {
       }
   },
   full_refresh: function() {
+    this.draw_links = true;
     this.links = {};
     terminal.drawBox(0, 0, terminal.rows, terminal.cols);
     this.recalc_input_lines();
@@ -1209,30 +1336,49 @@ let tui = {
     if (this.show_help) {
         this.draw_help();
     }
+    if (this.draw_face && ['chat', 'play'].includes(this.mode.name)) {
+        this.draw_face_popup();
+    }
+    if (!this.draw_links) {
+        this.links = {};
+    }
     terminal.refresh();
   }
 }
 
 let game = {
     init: function() {
-        this.things = {};
         this.turn = -1;
+        this.player_id = -1;
+        this.tasks = {};
+        this.things = {};
+        this.things_new = {};
+        this.fov = "";
+        this.fov_new = "";
         this.map = "";
+        this.map_new = "";
         this.map_control = "";
+        this.map_control_new = "";
         this.map_size = [0,0];
-        this.player_id = -1;
+        this.map_size_new = [0,0];
         this.portals = {};
-        this.tasks = {};
+        this.portals_new = {};
+        this.players_hat_chars = "";
     },
-    get_thing: function(id_, create_if_not_found=false) {
-        if (id_ in game.things) {
-            return game.things[id_];
+    get_thing_temp: function(id_, create_if_not_found=false) {
+        if (id_ in game.things_new) {
+            return game.things_new[id_];
         } else if (create_if_not_found) {
             let t = new Thing([0,0]);
-            game.things[id_] = t;
+            game.things_new[id_] = t;
             return t;
         };
     },
+    get_thing: function(id_, create_if_not_found=false) {
+        if (id_ in game.things) {
+            return game.things[id_];
+        };
+    },
     move: function(start_position, direction) {
         let target = [start_position[0], start_position[1]];
         if (direction == 'LEFT') {
@@ -1276,9 +1422,8 @@ let game = {
         return target;
     },
     teleport: function() {
-        let player = this.get_thing(game.player_id);
-        if (player.position in this.portals) {
-            server.reconnect_to(this.portals[player.position]);
+        if (game.player.position in this.portals) {
+            server.reconnect_to(this.portals[game.player.position]);
         } else {
             terminal.blink_screen();
             tui.log_msg('? not standing on portal')
@@ -1294,6 +1439,7 @@ server.init(websocket_location);
 let explorer = {
     position: [0,0],
     annotations: {},
+    annotations_new: {},
     info_cached: false,
     move: function(direction) {
         let target = game.move(this.position, direction);
@@ -1307,18 +1453,6 @@ let explorer = {
             terminal.blink_screen();
         };
     },
-    update_annotations: function(yx, str) {
-        this.annotations[yx] = str;
-        if (tui.mode.name == 'study') {
-            tui.full_refresh();
-        }
-    },
-    empty_annotations: function() {
-        this.annotations = {};
-        if (tui.mode.name == 'study') {
-            tui.full_refresh();
-        }
-    },
     get_info: function() {
         if (this.info_cached) {
             return this.info_cached;
@@ -1337,10 +1471,15 @@ let explorer = {
                          protection = 'none';
                      }
                      info_to_cache += " / protection: " + protection + "\n";
+                     if (t.hat) {
+                         info_to_cache += t.hat.slice(0, 6) + '\n';
+                         info_to_cache += t.hat.slice(6, 12) + '\n';
+                         info_to_cache += t.hat.slice(12, 18) + '\n';
+                     }
                      if (t.face) {
-                         info_to_cache += t.face.slice(0, 3) + '\n';
-                         info_to_cache += t.face.slice(3, 6) + '\n';
-                         info_to_cache += t.face.slice(6, 9) + '\n';
+                         info_to_cache += t.face.slice(0, 6) + '\n';
+                         info_to_cache += t.face.slice(6, 12) + '\n';
+                         info_to_cache += t.face.slice(12, 18) + '\n';
                      }
                  }
             }
@@ -1409,18 +1548,21 @@ tui.inputEl.addEventListener('input', (event) => {
     tui.full_refresh();
 }, false);
 document.onclick = function() {
-    tui.show_help = false;
+    if (!tui.mode.is_single_char_entry) {
+        tui.show_help = false;
+    }
 };
 tui.inputEl.addEventListener('keydown', (event) => {
     tui.show_help = false;
     if (event.key == 'Enter') {
         event.preventDefault();
     }
-    if (tui.mode.has_input_prompt && event.key == 'Enter'
-        && tui.inputEl.value.length == 0
-        && ['chat', 'command_thing', 'take_thing',
-            'admin_enter'].includes(tui.mode.name)) {
-        if (tui.mode.name != 'chat') {
+    if ((!tui.mode.is_intro && event.key == 'Escape')
+        || (tui.mode.has_input_prompt && event.key == 'Enter'
+            && tui.inputEl.value.length == 0
+            && ['chat', 'command_thing', 'take_thing', 'drop_thing',
+                'admin_enter'].includes(tui.mode.name))) {
+        if (!['chat', 'play', 'study', 'edit'].includes(tui.mode.name)) {
             tui.log_msg('@ aborted');
         }
         tui.switch_mode('play');
@@ -1436,27 +1578,16 @@ tui.inputEl.addEventListener('keydown', (event) => {
         server.send(['LOGIN', tui.inputEl.value]);
         tui.inputEl.value = "";
     } else if (tui.mode.name == 'enter_face' && event.key == 'Enter') {
-        if (tui.inputEl.value.length != 9) {
-            tui.log_msg('? wrong input length, aborting');
-        } else {
-            server.send(['PLAYER_FACE', tui.inputEl.value]);
-        }
-        tui.inputEl.value = "";
-        tui.switch_mode('edit');
+        tui.enter_ascii_art('PLAYER_FACE');
+    } else if (tui.mode.name == 'enter_hat' && event.key == 'Enter') {
+        tui.enter_ascii_art('PLAYER_HAT');
     } else if (tui.mode.name == 'command_thing' && event.key == 'Enter') {
-        if (tui.task_action_on('command')) {
-            server.send(['TASK:COMMAND', tui.inputEl.value]);
-            tui.inputEl.value = "";
-        }
-    } else if (tui.mode.name == 'take_thing' && event.key == 'Enter') {
-        const i = parseInt(tui.inputEl.value);
-        if (isNaN(i) || i < 0 || i >= tui.selectables.length) {
-            tui.log_msg('? invalid index, aborted');
-        } else {
-            server.send(['TASK:PICK_UP', tui.selectables[i][0]]);
-        }
+        server.send(['TASK:COMMAND', tui.inputEl.value]);
         tui.inputEl.value = "";
-        tui.switch_mode('play');
+    } else if (tui.mode.name == 'take_thing' && event.key == 'Enter') {
+        tui.pick_selectable('PICK_UP');
+    } else if (tui.mode.name == 'drop_thing' && event.key == 'Enter') {
+        tui.pick_selectable('DROP');
     } else if (tui.mode.name == 'control_pw_pw' && event.key == 'Enter') {
         if (tui.inputEl.value.length == 0) {
             tui.log_msg('@ aborted');
@@ -1535,14 +1666,14 @@ tui.inputEl.addEventListener('keydown', (event) => {
     } else if (tui.mode.name == 'play') {
           if (tui.mode.mode_switch_on_key(event)) {
               null;
-          } else if (event.key === tui.keys.drop_thing && tui.task_action_on('drop_thing')) {
-              server.send(["TASK:DROP"]);
           } else if (event.key === tui.keys.consume && tui.task_action_on('consume')) {
               server.send(["TASK:INTOXICATE"]);
           } else if (event.key === tui.keys.door && tui.task_action_on('door')) {
               server.send(["TASK:DOOR"]);
-          } else if (event.key === tui.keys.install && tui.task_action_on('install')) {
-              server.send(["TASK:INSTALL"]);
+          } else if (event.key === tui.keys.wear && tui.task_action_on('wear')) {
+              server.send(["TASK:WEAR"]);
+          } else if (event.key === tui.keys.spin && tui.task_action_on('spin')) {
+              server.send(["TASK:SPIN"]);
           } else if (event.key in tui.movement_keys && tui.task_action_on('move')) {
               server.send(['TASK:MOVE', tui.movement_keys[event.key]]);
           } else if (event.key === tui.keys.teleport) {
@@ -1577,6 +1708,8 @@ tui.inputEl.addEventListener('keydown', (event) => {
             server.send(['TASK:MOVE', tui.movement_keys[event.key]]);
         } else if (event.key === tui.keys.flatten && tui.task_action_on('flatten')) {
             server.send(["TASK:FLATTEN_SURROUNDINGS", tui.password]);
+          } else if (event.key === tui.keys.install && tui.task_action_on('install')) {
+              server.send(["TASK:INSTALL", tui.password]);
         } else if (event.key == tui.keys.toggle_map_mode) {
             tui.toggle_map_mode();
         }
@@ -1608,30 +1741,21 @@ for (let key_selector of key_selectors) {
     }, false);
 }
 window.setInterval(function() {
-    if (server.connected) {
+    if (server.websocket.readyState == 1) {
         server.send(['PING']);
-    } else {
+    } else if (server.websocket.readyState != 0) {
         server.reconnect_to(server.url);
         tui.log_msg('@ attempting reconnect …')
     }
-}, 5000);
+}, 1000);
 window.setInterval(function() {
-    let val = "?";
-    let span_decoration = "none";
-    if (document.activeElement == tui.inputEl) {
-        val = "on (click outside terminal to change)";
-    } else {
-        val = "off (click into terminal to change)";
-        span_decoration = "line-through";
+    if (document.activeElement.tagName.toLowerCase() != 'input') {
+        const scroll_x = window.scrollX;
+        const scroll_y = window.scrollY;
+        tui.inputEl.focus();
+        window.scrollTo(scroll_x, scroll_y);
     };
-    document.getElementById("keyboard_control").textContent = val;
-    for (const span of document.querySelectorAll('.keyboard_controlled')) {
-        span.style.textDecoration = span_decoration;
-    }
 }, 100);
-document.getElementById("terminal").onclick = function() {
-    tui.inputEl.focus();
-};
 document.getElementById("help").onclick = function() {
     tui.show_help = true;
     tui.full_refresh();
@@ -1650,9 +1774,6 @@ document.getElementById("toggle_map_mode").onclick = function() {
     tui.toggle_map_mode();
     tui.full_refresh();
 };
-document.getElementById("drop_thing").onclick = function() {
-    server.send(['TASK:DROP']);
-};
 document.getElementById("flatten").onclick = function() {
     server.send(['TASK:FLATTEN_SURROUNDINGS', tui.password]);
 };
@@ -1665,19 +1786,34 @@ document.getElementById("consume").onclick = function() {
 document.getElementById("install").onclick = function() {
     server.send(['TASK:INSTALL']);
 };
+document.getElementById("wear").onclick = function() {
+    server.send(['TASK:WEAR']);
+};
+document.getElementById("spin").onclick = function() {
+    server.send(['TASK:SPIN']);
+};
 document.getElementById("teleport").onclick = function() {
     game.teleport();
 };
 for (const move_button of document.querySelectorAll('[id*="_move_"]')) {
+    if (move_button.id.startsWith('key_')) {  // not a move button
+        continue;
+    };
     let direction = move_button.id.split('_')[2].toUpperCase();
-    move_button.onclick = function() {
-        if (tui.mode.available_actions.includes("move")
-            || tui.mode.available_actions.includes("move_explorer")) {
-            server.send(['TASK:MOVE', direction]);
-        } else {
-            explorer.move(direction);
-        };
+    let move_repeat;
+    move_button.onmousedown = function() {
+        move_repeat = window.setInterval(function() {
+            if (tui.mode.available_actions.includes("move")) {
+                server.send(['TASK:MOVE', direction]);
+            } else if (tui.mode.available_actions.includes("move_explorer")) {
+                explorer.move(direction);
+                tui.full_refresh();
+            };
+        }, 100);
     };
+    move_button.onmouseup = function() {
+        window.clearInterval(move_repeat);
+    }
 };
 </script>
 </body></html>