home · contact · privacy
Fix color setting bug.
[plomrogue2] / rogue_chat.html
index 9be10523e911239400965e16eac91783bba4308c..0a70962a0d72e30218980101b90ecea16736789d 100644 (file)
@@ -20,60 +20,62 @@ terminal rows: <input id="n_rows" type="number" step=4 min=24 value=24 />
 keyboard input/control: <span id="keyboard_control"></span>
 </div>
 <h3>button controls for mouse players</h3>
-<table style="float: left">
+<table id="move_table" style="float: left">
   <tr>
-    <td style="text-align: right"><button id="hex_move_upleft">up-left</button></td>
-    <td style="text-align: center"><button id="square_move_up">up</button></td>
-    <td><button id="hex_move_upright">up-right</button></td>
+    <td style="text-align: right"><button id="hex_move_upleft"></button></td>
+    <td style="text-align: center"><button id="square_move_up"></button></td>
+    <td><button id="hex_move_upright"></button></td>
   </tr>
   <tr>
-    <td style="text-align: right;"><button id="square_move_left">left</button><button id="hex_move_left">left</button></td>
+    <td style="text-align: right;"><button id="square_move_left"></button><button id="hex_move_left">left</button></td>
     <td stlye="text-align: center;">move</td>
-    <td><button id="square_move_right">right</button><button id="hex_move_right">right</button></td>
+    <td><button id="square_move_right"></button><button id="hex_move_right"></button></td>
   </tr>
   <tr>
-    <td><button id="hex_move_downleft">down-left</button></td>
-    <td style="text-align: center"><button id="square_move_down">down</button></td>
-    <td><button id="hex_move_downright">down-right</button></td>
+    <td><button id="hex_move_downleft"></button></td>
+    <td style="text-align: center"><button id="square_move_down"></button></td>
+    <td><button id="hex_move_downright"></button></td>
   </tr>
 </table>
 <table>
   <tr>
-    <td><button id="help">help</button></td>
+    <td><button id="help"></button></td>
   </tr>
   <tr>
-    <td><button id="switch_to_chat">chat mode</button><br /></td>
+    <td><button id="switch_to_chat"></button><br /></td>
   </tr>
   <tr>
-    <td><button id="switch_to_study">study mode</button></td>
-    <td><button id="toggle_map_mode">toggle map view</button>
+    <td><button id="switch_to_study"></button></td>
+    <td><button id="toggle_map_mode"></button>
   </tr>
   <tr>
-    <td><button id="switch_to_play">play mode</button></td>
+    <td><button id="switch_to_play"></button></td>
     <td>
-      <button id="take_thing">pick up thing</button>
-      <button id="drop_thing">drop thing</button>
-      <button id="teleport">teleport</button>
+      <button id="take_thing"></button>
+      <button id="drop_thing"></button>
+      <button id="door"></button>
+      <button id="consume"></button>
+      <button id="teleport"></button>
     </td>
   </tr>
   <tr>
-    <td><button id="switch_to_edit">world edit mode</button></td>
+    <td><button id="switch_to_edit"></button></td>
     <td>
-      <button id="switch_to_write">change terrain</button>
-      <button id="flatten">flatten surroundings</button>
-      <button id="switch_to_annotate">annotate tile</button>
-      <button id="switch_to_portal">edit portal</button>
-      <button id="switch_to_name_thing">name thing</button>
-      <button id="switch_to_password">enter world edit password</button>
+      <button id="switch_to_write"></button>
+      <button id="flatten"></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>
     </td>
   </tr>
   <tr>
-    <td><button id="switch_to_admin_enter">admin mode</button></td>
+    <td><button id="switch_to_admin_enter"></button></td>
     <td>
-      <button id="switch_to_control_pw_type">change protection character password</button>
-      <button id="switch_to_control_tile_type">change protection areas</button>
-      <button id="switch_to_admin_thing_protect">change thing protection</button>
-      <button id="toggle_tile_draw">toggle protection character drawing</button>
+      <button id="switch_to_control_pw_type"></button>
+      <button id="switch_to_control_tile_type"></button>
+      <button id="switch_to_admin_thing_protect"></button>
+      <button id="toggle_tile_draw"></button>
     </td>
   <tr>
   </tr>
@@ -95,6 +97,8 @@ keyboard input/control: <span id="keyboard_control"></span>
 <li>teleport: <input id="key_teleport" type="text" value="p" />
 <li>pick up thing: <input id="key_take_thing" type="text" value="z" />
 <li>drop thing: <input id="key_drop_thing" type="text" value="u" />
+<li>open/close: <input id="key_door" type="text" value="D" />
+<li>consume: <input id="key_consume" type="text" value="C" />
 <li><input id="key_switch_to_chat" type="text" value="t" />
 <li><input id="key_switch_to_play" type="text" value="p" />
 <li><input id="key_switch_to_study" type="text" value="?" />
@@ -200,6 +204,8 @@ let key_descriptions = {
     'teleport': 'teleport',
     'take_thing': 'pick up thing',
     'drop_thing': 'drop thing',
+    'door': 'open/close',
+    'consume': 'consume',
     'toggle_map_mode': 'toggle map view',
     'toggle_tile_draw': 'toggle protection character drawing',
     'hex_move_upleft': 'up-left',
@@ -208,10 +214,10 @@ let key_descriptions = {
     'hex_move_left': 'left',
     'hex_move_downleft': 'down-left',
     'hex_move_downright': 'down-right',
-    'square_move_right': 'right',
-    'square_move_left': 'left',
     'square_move_up': 'up',
+    'square_move_left': 'left',
     'square_move_down': 'down',
+    'square_move_right': 'right',
 };
 for (const mode_name of Object.keys(mode_helps)) {
     key_descriptions['switch_to_' + mode_name] = mode_helps[mode_name].short;
@@ -248,14 +254,12 @@ function escapeHTML(str) {
 };
 
 let terminal = {
-  foreground: 'white',
-  background: 'black',
   initialize: function() {
     this.rows = rows_selector.value;
     this.cols = cols_selector.value;
     this.pre_el = document.getElementById("terminal");
-    this.pre_el.style.color = this.foreground;
-    this.pre_el.style.backgroundColor = this.background;
+    this.set_default_colors();
+    this.apply_colors();
     this.content = [];
       let line = []
     for (let y = 0, x = 0; y <= this.rows; x++) {
@@ -271,6 +275,23 @@ let terminal = {
         line.push(' ');
     }
   },
+  apply_colors: function() {
+    this.pre_el.style.color = this.foreground;
+    this.pre_el.style.backgroundColor = this.background;
+  },
+  set_default_colors: function() {
+      this.foreground = 'white';
+      this.background = 'black';
+      this.apply_colors();
+  },
+  set_random_colors: function() {
+      function rand(offset) {
+          return Math.floor(offset + Math.random() * 96).toString(16).padStart(2, '0');
+      }
+      this.foreground = '#' + rand(159) + rand(159) + rand(159);
+      this.background = '#' + rand(0) + rand(0) + rand(0);
+      this.apply_colors();
+  },
   blink_screen: function() {
       this.pre_el.style.color = this.background;
       this.pre_el.style.backgroundColor = this.foreground;
@@ -427,7 +448,7 @@ let server = {
         } else if (tokens[0] === 'THING_CHAR') {
             let t = game.get_thing(tokens[1], false);
             if (t) {
-                t.player_char = tokens[2];
+                t.thing_char = tokens[2];
             };
         } else if (tokens[0] === 'TASKS') {
             game.tasks = tokens[1].split(',');
@@ -460,6 +481,10 @@ let server = {
         } else if (tokens[0] === 'LOGIN_OK') {
             this.send(['GET_GAMESTATE']);
             tui.switch_mode('post_login_wait');
+        } else if (tokens[0] === 'DEFAULT_COLORS') {
+            terminal.set_default_colors();
+        } else if (tokens[0] === 'RANDOM_COLORS') {
+            terminal.set_random_colors();
         } else if (tokens[0] === 'ADMIN_OK') {
             tui.is_admin = true;
             tui.log_msg('@ you now have admin rights');
@@ -522,6 +547,7 @@ class Mode {
         this.name = name;
         this.short_desc = mode_helps[name].short;
         this.available_modes = [];
+        this.available_actions = [];
         this.has_input_prompt = has_input_prompt;
         this.shows_info= shows_info;
         this.is_intro = is_intro;
@@ -593,16 +619,31 @@ let tui = {
   mode_control_pw_pw: new Mode('control_pw_pw', true),
   mode_control_tile_type: new Mode('control_tile_type', true),
   mode_control_tile_draw: new Mode('control_tile_draw'),
+  action_tasks: {
+      'flatten': 'FLATTEN_SURROUNDINGS',
+      'take_thing': 'PICK_UP',
+      'drop_thing': 'DROP',
+      'move': 'MOVE',
+      'door': 'DOOR',
+      'consume': 'INTOXICATE',
+  },
   init: function() {
+      this.mode_chat.available_modes = ["play", "study", "edit", "admin_enter"]
       this.mode_play.available_modes = ["chat", "study", "edit", "admin_enter"]
+      this.mode_play.available_actions = ["move", "take_thing", "drop_thing",
+                                          "teleport", "door", "consume"];
       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",
                                          "control_tile_type", "chat",
                                          "study", "play", "edit"]
+      this.mode_admin.available_actions = ["move"];
       this.mode_control_tile_draw.available_modes = ["admin_enter"]
+      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"]
+      this.mode_edit.available_actions = ["move", "flatten", "toggle_map_mode"]
       this.mode = this.mode_waiting_for_server;
       this.inputEl = document.getElementById("input");
       this.inputEl.focus();
@@ -612,15 +653,16 @@ let tui = {
       this.init_keys();
   },
   init_keys: function() {
+    document.getElementById("move_table").hidden = true;
     this.keys = {};
     for (let key_selector of key_selectors) {
         this.keys[key_selector.id.slice(4)] = key_selector.value;
     }
     this.movement_keys = {};
-    if (!game.map_geometry) {
-        return;
+    let geometry_prefix = 'undefinedMapGeometry_';
+    if (game.map_geometry) {
+        geometry_prefix = game.map_geometry.toLowerCase() + '_';
     }
-    let geometry_prefix = game.map_geometry.toLowerCase() + '_';
     for (const key_name of Object.keys(key_descriptions)) {
         if (key_name.startsWith(geometry_prefix)) {
             let direction = key_name.split('_')[2].toUpperCase();
@@ -629,9 +671,13 @@ let tui = {
         }
     };
     for (const move_button of document.querySelectorAll('[id*="_move_"]')) {
+        if (move_button.id.startsWith('key_')) {
+            continue;
+        }
         move_button.hidden = true;
     };
     for (const move_button of document.querySelectorAll('[id^="' + geometry_prefix + 'move_"]')) {
+        document.getElementById("move_table").hidden = false;
         move_button.hidden = false;
     };
     for (let el of document.getElementsByTagName("button")) {
@@ -640,6 +686,9 @@ let tui = {
       el.innerHTML = escapeHTML(action_desc) + '<br /><span class="keyboard_controlled">' + escapeHTML(action_key) + '</span>';
     }
   },
+  task_action_on: function(action) {
+      return game.tasks.includes(this.action_tasks[action]);
+  },
   switch_mode: function(mode_name) {
     if (this.mode.name == 'control_tile_draw') {
         tui.log_msg('@ finished tile protection drawing.')
@@ -689,25 +738,21 @@ let tui = {
         el.disabled = true;
     }
     document.getElementById("help").disabled = false;
-    if (this.mode.name == 'play' || this.mode.name == 'study' || this.mode.name == 'control_tile_draw' || this.mode.name == 'edit' || this.mode.name == 'admin') {
-        for (const move_key of document.querySelectorAll('[id*="_move_"]')) {
-            move_key.disabled = false;
-        }
-    }
-    if (!this.mode.is_intro && this.mode.name != 'play') {
-        document.getElementById("switch_to_play").disabled = false;
-    }
-    if (!this.mode.is_intro && this.mode.name != 'study') {
-        document.getElementById("switch_to_study").disabled = false;
-    }
-    if (!this.mode.is_intro && this.mode.name != 'chat') {
-        document.getElementById("switch_to_chat").disabled = false;
-    }
-    if (!this.mode.is_intro && this.mode.name != 'edit') {
-        document.getElementById("switch_to_edit").disabled = false;
+    for (const action of this.mode.available_actions) {
+        if (["move", "move_explorer"].includes(action)) {
+            for (const move_key of document.querySelectorAll('[id*="_move_"]')) {
+                move_key.disabled = false;
+            }
+        } else if (Object.keys(this.action_tasks).includes(action)) {
+            if (this.task_action_on(action)) {
+                document.getElementById(action).disabled = false;
+            }
+        } else {
+            document.getElementById(action).disabled = false;
+        };
     }
-    if (!this.mode.is_intro && this.mode.name != 'admin' && this.mode.name != 'admin_enter') {
-        document.getElementById("switch_to_admin_enter").disabled = false;
+    for (const mode_name of this.mode.available_modes) {
+            document.getElementById('switch_to_' + mode_name).disabled = false;
     }
     if (this.mode.name == 'login') {
         if (this.login_name) {
@@ -715,32 +760,6 @@ let tui = {
         } else {
             this.log_msg("? need login name");
         }
-    } else if (this.mode.name == 'play') {
-        if (game.tasks.includes('PICK_UP')) {
-            document.getElementById("take_thing").disabled = false;
-        }
-        if (game.tasks.includes('DROP')) {
-            document.getElementById("drop_thing").disabled = false;
-        }
-        if (game.tasks.includes('MOVE')) {
-        }
-        document.getElementById("teleport").disabled = false;
-    } else if (this.mode.name == 'edit') {
-        if (game.tasks.includes('FLATTEN_SURROUNDINGS')) {
-            document.getElementById("flatten").disabled = false;
-        }
-        document.getElementById("switch_to_annotate").disabled = false;
-        document.getElementById("switch_to_write").disabled = false;
-        document.getElementById("switch_to_portal").disabled = false;
-        document.getElementById("switch_to_password").disabled = false;
-        document.getElementById("switch_to_name_thing").disabled = false;
-        document.getElementById("toggle_map_mode").disabled = false;
-    } else if (this.mode.name == 'admin') {
-        document.getElementById("switch_to_control_pw_type").disabled = false;
-        document.getElementById("switch_to_control_tile_type").disabled = false;
-        document.getElementById("switch_to_admin_thing_protect").disabled = false;
-    } else if (this.mode.name == 'study') {
-        document.getElementById("toggle_map_mode").disabled = false;
     } else if (this.mode.is_single_char_entry) {
         this.show_help = true;
     } else if (this.mode.name == 'admin_enter') {
@@ -754,7 +773,6 @@ let tui = {
     } else if (this.mode.name == 'control_pw_pw') {
         this.log_msg('@ enter protection password for "' + this.tile_control_char + '":');
     } else if (this.mode.name == 'control_tile_draw') {
-        document.getElementById("toggle_tile_draw").disabled = false;
         this.log_msg('@ can draw protection character "' + this.tile_control_char + '", turn drawing on/off with [' + this.keys.toggle_tile_draw + '], finish with [' +  this.keys.switch_to_admin_enter + '].')
     }
     this.full_refresh();
@@ -901,8 +919,8 @@ let tui = {
             let t = game.things[thing_id];
             let symbol = game.thing_types[t.type_];
             let meta_char = ' ';
-            if (t.player_char) {
-                meta_char = t.player_char;
+            if (t.thing_char) {
+                meta_char = t.thing_char;
             }
             if (used_positions.includes(t.position.toString())) {
                 meta_char = '+';
@@ -1017,48 +1035,28 @@ let tui = {
           movement_keys_desc = Object.keys(this.movement_keys).join(',');
       }
       let content = this.mode.short_desc + " help\n\n" + this.mode.help_intro + "\n\n";
-      if (this.mode.name == 'play') {
-          content += "Available actions:\n";
-          if (game.tasks.includes('MOVE')) {
-              content += "[" + movement_keys_desc + "] – move player\n";
-          }
-          if (game.tasks.includes('PICK_UP')) {
-              content += "[" + this.keys.take_thing + "] – pick up thing\n";
-          }
-          if (game.tasks.includes('DROP')) {
-              content += "[" + this.keys.drop_thing + "] – drop thing\n";
-          }
-          content += "[" + tui.keys.teleport + "] – teleport\n";
-          content += '\n';
-      } else if (this.mode.name == 'study') {
-          content += "Available actions:\n";
-          content += '[' + movement_keys_desc + '] – move question mark\n';
-          content += '[' + this.keys.toggle_map_mode + '] – toggle map view\n';
-          content += '\n';
-      } else if (this.mode.name == 'edit') {
-          content += "Available actions:\n";
-          if (game.tasks.includes('MOVE')) {
-              content += "[" + movement_keys_desc + "] – move player\n";
-          }
-          if (game.tasks.includes('FLATTEN_SURROUNDINGS')) {
-              content += "[" + tui.keys.flatten + "] – flatten surroundings\n";
-          }
-          content += '[' + this.keys.toggle_map_mode + '] – toggle map view\n';
-          content += '\n';
-      } else if (this.mode.name == 'control_tile_draw') {
-          content += "Available actions:\n";
-          content += "[" + tui.keys.toggle_tile_draw + "] – toggle protection character drawing\n";
-          content += '\n';
-      } else if (this.mode.name == 'chat') {
+      if (this.mode.name == 'chat') {
           content += '/nick NAME – re-name yourself to NAME\n';
           content += '/' + this.keys.switch_to_play + ' or /play – switch to play mode\n';
           content += '/' + this.keys.switch_to_study + ' or /study – switch to study mode\n';
           content += '/' + this.keys.switch_to_edit + ' or /edit – switch to world edit mode\n';
           content += '/' + this.keys.switch_to_admin_enter + ' or /admin – switch to admin mode\n';
-      } else if (this.mode.name == 'admin') {
+      } else if (this.mode.available_actions.length > 0) {
           content += "Available actions:\n";
-          if (game.tasks.includes('MOVE')) {
-              content += "[" + movement_keys_desc + "] – move player\n";
+          for (let action of this.mode.available_actions) {
+              if (Object.keys(this.action_tasks).includes(action)) {
+                  if (!this.task_action_on(action)) {
+                      continue;
+                  }
+              }
+              if (action == 'move_explorer') {
+                  action = 'move';
+              }
+              if (action == 'move') {
+                  content += "[" + movement_keys_desc + "] – move\n"
+              } else {
+                  content += "[" + this.keys[action] + "] – " + key_descriptions[action] + "\n";
+              }
           }
           content += '\n';
       }
@@ -1252,16 +1250,16 @@ let explorer = {
                  let symbol = game.thing_types[t.type_];
                  let protection = t.protection;
                  if (protection == '.') {
-                     protection = 'unprotected';
+                     protection = 'none';
                  }
-                 info += "THING: " + t.type_ + " / protection: " + protection + " / " + symbol;
-                 if (t.player_char) {
-                     info += t.player_char;
+                 info += "THING: " + t.type_ + " / " + symbol;
+                 if (t.thing_char) {
+                     info += t.thing_char;
                  };
                  if (t.name_) {
                      info += " (" + t.name_ + ")";
                  }
-                 info += "\n";
+                 info += " / protection: " + protection + "\n";
              }
         }
         if (this.position in game.portals) {
@@ -1408,14 +1406,15 @@ 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.take_thing
-                     && game.tasks.includes('PICK_UP')) {
+          } else if (event.key === tui.keys.take_thing && tui.task_action_on('take_thing')) {
               server.send(["TASK:PICK_UP"]);
-          } else if (event.key === tui.keys.drop_thing
-                     && game.tasks.includes('DROP')) {
+          } else if (event.key === tui.keys.drop_thing && tui.task_action_on('drop_thing')) {
               server.send(["TASK:DROP"]);
-          } else if (event.key in tui.movement_keys
-                     && game.tasks.includes('MOVE')) {
+          } 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 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) {
               game.teleport();
@@ -1439,18 +1438,15 @@ tui.inputEl.addEventListener('keydown', (event) => {
     } else if (tui.mode.name == 'admin') {
         if (tui.mode.mode_switch_on_key(event)) {
               null;
-        } else if (event.key in tui.movement_keys
-                   && game.tasks.includes('MOVE')) {
+        } else if (event.key in tui.movement_keys && tui.task_action_on('move')) {
             server.send(['TASK:MOVE', tui.movement_keys[event.key]]);
         };
     } else if (tui.mode.name == 'edit') {
         if (tui.mode.mode_switch_on_key(event)) {
               null;
-        } else if (event.key in tui.movement_keys
-                   && game.tasks.includes('MOVE')) {
+        } 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.flatten
-                   && game.tasks.includes('FLATTEN_SURROUNDINGS')) {
+        } 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.toggle_map_mode) {
             tui.toggle_map_mode();
@@ -1534,13 +1530,20 @@ document.getElementById("drop_thing").onclick = function() {
 document.getElementById("flatten").onclick = function() {
     server.send(['TASK:FLATTEN_SURROUNDINGS', tui.password]);
 };
+document.getElementById("door").onclick = function() {
+    server.send(['TASK:DOOR']);
+};
+document.getElementById("consume").onclick = function() {
+    server.send(['TASK:INTOXICATE']);
+};
 document.getElementById("teleport").onclick = function() {
     game.teleport();
 };
 for (const move_button of document.querySelectorAll('[id*="_move_"]')) {
     let direction = move_button.id.split('_')[2].toUpperCase();
     move_button.onclick = function() {
-        if (tui.mode.name == 'play' || tui.mode.name == 'edit') {
+        if (tui.mode.available_actions.includes("move")
+            || tui.mode.available_actions.includes("move_explorer")) {
             server.send(['TASK:MOVE', direction]);
         } else {
             explorer.move(direction);