Merge pull request #24 from AJFaraday/expt_performance_improvement

THE CLAPPERS!
AJFaraday · Oct 14, 2019 · 92730d3 · 92730d3
2 parents fad02a8 + 9556cad
commit 92730d3
Show file tree

Hide file tree

Showing 9 changed files with 181 additions and 17 deletions.
diff --git a/index.html b/index.html
@@ -56,7 +56,7 @@
     <link rel="stylesheet" href="./style/grid_game.css"/>
   </head>
   <body>
-    <h1>My Grid Game</h1>
+    <h1>Grid Game</h1>
     <div id="grid_game"></div>
     <div id="api_space">
       <div id="forms"></div>

diff --git a/lib/classes/tile.js b/lib/classes/tile.js
@@ -11,6 +11,7 @@ GridGame.classes.tile = function (x, y) {
   this.city = false;
   this.rock = false;
   this.wall = false;
+  this.changed = true;
 
   // used in turn process
   this.value_change = 0;
@@ -83,18 +84,19 @@ GridGame.classes.tile = function (x, y) {
   // Draw
 
   this.draw = function () {
-    this.cell
-      .html(this.display_character())
-      .removeClass(function (index, css) {
-        return (css.match(/\btile_\S+/g) || []).join(' ');
-      })
-      .toggleClass('tile_city', this.city)
-      .toggleClass('tile_rock', this.rock)
-      .toggleClass('tile_wall', this.wall);
-
-
-    if (this.player && this.value > 0) {
-      this.cell.addClass('tile_' + this.player.name);
+    if (this.changed) {
+      this.cell
+        .html(this.display_character())
+        .removeClass('tile_red tile_green tile_yellow tile_blue')
+        .toggleClass('tile_city', this.city)
+        .toggleClass('tile_rock', this.rock)
+        .toggleClass('tile_wall', this.wall);
+
+
+      if (this.player && this.value > 0) {
+        this.cell.addClass('tile_' + this.player.name);
+      }
+      this.changed = false;
     }
   };
 

diff --git a/lib/grid_game.js b/lib/grid_game.js
@@ -118,6 +118,8 @@ var GridGame = {
     }
   },
 
+  turn_active: false,
+
   turn: function () {
     $.each(GridGame.apis, function (i, api) {
       api.func()

diff --git a/lib/turn_phases/do_damage_phase.js b/lib/turn_phases/do_damage_phase.js
@@ -2,6 +2,9 @@ GridGame.turn_phases.do_damage_phase = function() {
 
   this.do_damage_phase = function() {
     this.value += this.value_change;
+    if (!this.changed) {
+      this.changed = (this.value_change != 0);
+    }
     if (this.value <= 0) {this.kill()}
     this.value_change = 0;
   };

diff --git a/lib/turn_phases/do_movement_phase.js b/lib/turn_phases/do_movement_phase.js
@@ -2,6 +2,9 @@ GridGame.turn_phases.do_movement_phase = function () {
 
   this.do_movement_phase = function () {
     this.value += this.value_change;
+    if (!this.changed) {
+      this.changed = (this.value_change != 0);
+    }
     this.do_city_conversion();
     this.end_movement_phase();
   };

diff --git a/manual.html b/manual.html
@@ -48,7 +48,7 @@
   <link rel="stylesheet" href="./style/grid_game.css"/>
 </head>
 <body>
-  <h1>My Grid Game</h1>
+  <h1>Grid Game</h1>
   <div id="grid_game"></div>
   <div class="footer">
     <p>

diff --git a/obstacles.html b/obstacles.html
@@ -48,7 +48,7 @@
   <link rel="stylesheet" href="./style/grid_game.css"/>
 </head>
 <body>
-  <h1>My Grid Game</h1>
+  <h1>Grid Game</h1>
   <div id="grid_game"></div>
   <div class="footer">
     <p>

diff --git a/the_clappers.html b/the_clappers.html
@@ -0,0 +1,155 @@
+<!DOCTYPE HTML>
+<html>
+  <head>
+
+    <script>
+      (function (i, s, o, g, r, a, m) {
+        i['GoogleAnalyticsObject'] = r;
+        i[r] = i[r] || function () {
+          (i[r].q = i[r].q || []).push(arguments)
+        }, i[r].l = 1 * new Date();
+        a = s.createElement(o),
+          m = s.getElementsByTagName(o)[0];
+        a.async = 1;
+        a.src = g;
+        m.parentNode.insertBefore(a, m)
+      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
+
+      ga('create', 'XXX-google-analytics-id-XXX', 'auto');
+      ga('send', 'pageview');
+
+    </script>
+
+    <title>Grid Game</title>
+    <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
+    <meta content="utf-8" http-equiv="encoding">
+
+    <script type="text/javascript" src="./lib/external/jquery-3.1.0.min.js"></script>
+    <script type="text/javascript" src="./lib/grid_game.js"></script>
+    <script type="text/javascript" src="./lib/gist_cache.js"></script>
+
+    <script type="text/javascript" src="./lib/resize_grid.js"></script>
+
+    <script type="text/javascript" src="./config/game.js"></script>
+    <script type="text/javascript" src="./lib/positions.js"></script>
+    <script type="text/javascript" src="./config/players.js"></script>
+    <script type="text/javascript" src="./config/bots.js"></script>
+    <script type="text/javascript" src="./lib/info.js"></script>
+    <script type="text/javascript" src="./lib/data/key_maps.js"></script>
+    <script type="text/javascript" src="./lib/data/key_display.js"></script>
+
+    <script type="text/javascript" src="./lib/player_components/control_panel.js"></script>
+    <script type="text/javascript" src="./lib/player_components/direction_change.js"></script>
+
+    <script type="text/javascript" src="./lib/turn_phases/mark_movement_phase.js"></script>
+    <script type="text/javascript" src="./lib/turn_phases/do_movement_phase.js"></script>
+    <script type="text/javascript" src="./lib/turn_phases/mark_damage_phase.js"></script>
+    <script type="text/javascript" src="./lib/turn_phases/do_damage_phase.js"></script>
+
+    <script type="text/javascript" src="./lib/classes/tile.js"></script>
+    <script type="text/javascript" src="./lib/classes/board.js"></script>
+    <script type="text/javascript" src="./lib/classes/player.js"></script>
+    <script type="text/javascript" src="./lib/classes/keyboard.js"></script>
+    <script type="text/javascript" src="./lib/classes/api.js"></script>
+    <script type="text/javascript" src="./lib/api_ui.js"></script>
+
+    <link rel="stylesheet" href="./style/grid_game.css"/>
+  </head>
+  <body>
+    <h1>Grid Game</h1>
+    <div id="grid_game"></div>
+    <div id="api_space">
+      <div id="forms"></div>
+      <div class="button" data-action="start">Start</div>
+      <div class="button" data-action="stop">Stop</div>
+      <div class="button" data-action="reset">Reset</div>
+    </div>
+    <br clear="both"/>
+    <div class="info">
+      <p class="turn"><b>Turn:</b> <span id="turn">0</span></p>
+      <table id="data">
+        <tr>
+          <th>Cities</th>
+          <td data-role="cities" class=green>0</td>
+          <td data-role="cities" class="red">0</td>
+        </tr>
+
+        <tr>
+          <th>Walkers</th>
+          <td data-role="walkers" class=green>0</td>
+          <td data-role="walkers" class="red">0</td>
+        </tr>
+
+        <tr>
+          <th>Total health</th>
+          <td data-role="overall" class=green>0</td>
+          <td data-role="overall" class="red">0</td>
+        </tr>
+
+      </table>
+    </div>
+    <div class="footer">
+      <p>
+        <a href="https://www.github.com/AJFaraday/grid_game" target="_blank">Grid Game</a>
+        is a board-like game concept by
+        <a href="https://www.twitter.com/MarmiteJunction" target="_blank">Andrew Faraday</a>.
+      </p>
+      <p>It's a pretty juvenile project, so bear with me. It's still being built and updated.</p>
+      <p>
+        Feel free to let me know about any issues you find using the
+        <a href="https://github.com/AJFaraday/grid_game/issues" target="_blank">issue tracker</a>.
+      </p>
+
+      <p>Modes of play:</p>
+      <ul>
+        <li><a href="index.html">Bot v Bot</a></li>
+        <li><a href="manual.html">Manual (simple)</a></li>
+        <li><a href="obstacles.html">Manual (with obstacles)</a></li>
+        <li><a href="tournament.html">Bot v Bot (Tournament Mode)</a></li>
+      </ul>
+    </div>
+    <div class="modal_background"></div>
+    <script type="text/javascript">
+      function set_player_to_gist(colour, gist) {
+        var api_space;
+        if (colour == 'green') {
+          api_space = $('div.api_space.api_0');
+        } else if (colour == 'red') {
+          api_space = $('div.api_space.api_1');
+        }
+        var select = api_space.find('select');
+        var options = [];
+        select.find('option').each(function (i, o) {
+          options.push($(o).attr('value'));
+        });
+        if (options.includes(gist)) {
+          select.val(gist).trigger('change');
+        } else {
+          select.val('bot_id').trigger('change');
+          select.siblings('input').val(gist).trigger('change');
+        }
+      }
+
+      $(window).ready(function () {
+        GridGame.init(
+          {
+            tournament: true,
+            turn_time: 1,
+            width: 20,
+            height: 12
+          }
+        );
+        GridGame.api_ui.init();
+        url = new URL(window.location);
+        red_gist = url.searchParams.get('red');
+        if (red_gist) {
+          set_player_to_gist('red', red_gist)
+        }
+        green_gist = url.searchParams.get('green');
+        if (green_gist) {
+          set_player_to_gist('green', green_gist)
+        }
+      });
+    </script>
+  </body>
+</html>
diff --git a/tournament.html b/tournament.html
@@ -56,7 +56,7 @@
     <link rel="stylesheet" href="./style/grid_game.css"/>
   </head>
   <body>
-    <h1>My Grid Game</h1>
+    <h1>Grid Game</h1>
     <div id="grid_game"></div>
     <div id="api_space">
       <div id="forms"></div>
@@ -66,7 +66,6 @@ <h1>My Grid Game</h1>
     </div>
     <br clear="both"/>
     <div class="info">
-      <h3>Info</h3>
       <p class="turn"><b>Turn:</b> <span id="turn">0</span></p>
       <table id="data">
         <tr>