From: Christian Heller Date: Thu, 3 Dec 2020 01:00:52 +0000 (+0100) Subject: Fix delay flickering in web client. X-Git-Url: https://plomlompom.com/repos/%7B%7B%20web_path%20%7D%7D/decks/static/%27%29;%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20chunks.push%28escapeHTML%28span%5B2%5D%29%29;%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20chunks.push%28%27?a=commitdiff_plain;h=0d1c7bab88cdc052e3de28a1b1bd67813c721d03;p=plomrogue2 Fix delay flickering in web client. --- diff --git a/rogue_chat.html b/rogue_chat.html index 0a70962..cc505bc 100644 --- a/rogue_chat.html +++ b/rogue_chat.html @@ -627,6 +627,8 @@ let tui = { 'door': 'DOOR', 'consume': 'INTOXICATE', }, + offset: [0,0], + map_lines: [], init: function() { this.mode_chat.available_modes = ["play", "study", "edit", "admin_enter"] this.mode_play.available_modes = ["chat", "study", "edit", "admin_enter"] @@ -889,85 +891,87 @@ let tui = { this.full_refresh(); }, draw_map: function() { - let map_lines_split = []; - let line = []; - for (let i = 0, j = 0; i < game.map.length; i++, j++) { - if (j == game.map_size[1]) { - map_lines_split.push(line); - line = []; - j = 0; + if (game.turn_complete) { + let map_lines_split = []; + let line = []; + for (let i = 0, j = 0; i < game.map.length; i++, j++) { + if (j == game.map_size[1]) { + map_lines_split.push(line); + line = []; + j = 0; + }; + if (this.map_mode == 'protections') { + line.push(game.map_control[i] + ' '); + } else { + line.push(game.map[i] + ' '); + } }; - if (this.map_mode == 'protections') { - line.push(game.map_control[i] + ' '); - } else { - line.push(game.map[i] + ' '); - } - }; - 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 '; + 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 '; + } + } else if (this.map_mode == 'terrain + things') { + for (const p in game.portals) { + let coordinate = p.split(',') + let original = map_lines_split[coordinate[0]][coordinate[1]]; + map_lines_split[coordinate[0]][coordinate[1]] = original[0] + 'P'; + } + let used_positions = []; + for (const thing_id in game.things) { + let t = game.things[thing_id]; + let symbol = game.thing_types[t.type_]; + let meta_char = ' '; + if (t.thing_char) { + meta_char = t.thing_char; + } + if (used_positions.includes(t.position.toString())) { + meta_char = '+'; + }; + map_lines_split[t.position[0]][t.position[1]] = symbol + meta_char; + used_positions.push(t.position.toString()); + }; } - } else if (this.map_mode == 'terrain + things') { - for (const p in game.portals) { - let coordinate = p.split(',') - let original = map_lines_split[coordinate[0]][coordinate[1]]; - map_lines_split[coordinate[0]][coordinate[1]] = original[0] + 'P'; + 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]] = '??'; } - let used_positions = []; - for (const thing_id in game.things) { - let t = game.things[thing_id]; - let symbol = game.thing_types[t.type_]; - let meta_char = ' '; - if (t.thing_char) { - meta_char = t.thing_char; - } - if (used_positions.includes(t.position.toString())) { - meta_char = '+'; + this.map_lines = [] + if (game.map_geometry == 'Square') { + for (let line_split of map_lines_split) { + this.map_lines.push(line_split.join('')); }; - map_lines_split[t.position[0]][t.position[1]] = symbol + meta_char; - used_positions.push(t.position.toString()); - }; - } - 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]] = '??'; - } - let map_lines = [] - if (game.map_geometry == 'Square') { - for (let line_split of map_lines_split) { - map_lines.push(line_split.join('')); - }; - } else if (game.map_geometry == 'Hex') { - let indent = 0 - for (let line_split of map_lines_split) { - map_lines.push(' '.repeat(indent) + line_split.join('')); - if (indent == 0) { - indent = 1; - } else { - indent = 0; + } else if (game.map_geometry == 'Hex') { + let indent = 0 + for (let line_split of map_lines_split) { + this.map_lines.push(' '.repeat(indent) + line_split.join('')); + if (indent == 0) { + indent = 1; + } else { + indent = 0; + }; }; + } + let window_center = [terminal.rows / 2, this.window_width / 2]; + let center_position = [player.position[0], player.position[1]]; + if (tui.mode.shows_info || tui.mode.name == 'control_tile_draw') { + center_position = [explorer.position[0], explorer.position[1]]; + } + center_position[1] = center_position[1] * 2; + this.offset = [center_position[0] - window_center[0], + center_position[1] - window_center[1]] + if (game.map_geometry == 'Hex' && this.offset[0] % 2) { + this.offset[1] += 1; }; - } - let window_center = [terminal.rows / 2, this.window_width / 2]; - let center_position = [player.position[0], player.position[1]]; - if (tui.mode.shows_info || tui.mode.name == 'control_tile_draw') { - center_position = [explorer.position[0], explorer.position[1]]; - } - center_position[1] = center_position[1] * 2; - let offset = [center_position[0] - window_center[0], - center_position[1] - window_center[1]] - if (game.map_geometry == 'Hex' && offset[0] % 2) { - offset[1] += 1; }; - let term_y = Math.max(0, -offset[0]); - let term_x = Math.max(0, -offset[1]); - let map_y = Math.max(0, offset[0]); - let map_x = Math.max(0, offset[1]); + let term_y = Math.max(0, -this.offset[0]); + let term_x = Math.max(0, -this.offset[1]); + let map_y = Math.max(0, this.offset[0]); + let map_x = Math.max(0, this.offset[1]); for (; term_y < terminal.rows && map_y < game.map_size[0]; term_y++, map_y++) { - let to_draw = map_lines[map_y].slice(map_x, this.window_width + offset[1]); + let to_draw = this.map_lines[map_y].slice(map_x, this.window_width + this.offset[1]); terminal.write(term_y, term_x, to_draw); } }, @@ -979,7 +983,9 @@ let tui = { terminal.write(0, this.window_width, 'MODE: ' + this.mode.short_desc + ' – ' + help); }, draw_turn_line: function(n) { - terminal.write(1, this.window_width, 'TURN: ' + game.turn); + if (game.turn_complete) { + terminal.write(1, this.window_width, 'TURN: ' + game.turn); + } }, draw_history: function() { let log_display_lines = []; @@ -1097,10 +1103,8 @@ let tui = { this.draw_history(); this.draw_input(); } else { - if (game.turn_complete) { - this.draw_map(); - this.draw_turn_line(); - } + this.draw_map(); + this.draw_turn_line(); this.draw_mode_line(); if (this.mode.shows_info) { this.draw_info();