Make accuracy information expandable.

diff --git a/xonstat/templates/base.mako b/xonstat/templates/base.mako
index 6219eb121330930b3b0f058896fb67030e762f9b..c421da7cf74f791e51adf53f1fcc61975827e3eb 100755 (executable)
--- a/xonstat/templates/base.mako
+++ b/xonstat/templates/base.mako
@@ -17,6 +17,7 @@
         padding-bottom: 40px;
       }
     </style>
+
     <%block name="css">
     <link href="../assets/css/bootstrap-responsive.css" rel="stylesheet">
     <link href="/static/css/style.min.css" rel="stylesheet">
@@ -45,8 +46,6 @@
       </%block>
 
       <%block name="js">
-      <script src="/static/js/jquery-1.7.1.min.js"></script>
-      <script src="/static/js/bootstrap-collapse.min.js"></script>
       </%block>
     </body>
 </html>

diff --git a/xonstat/templates/game_info.mako b/xonstat/templates/game_info.mako
index bacc1a04ac297ac846cfbe5c1d26abde3a5f4d79..2ce6f7148363bac75a553380902dd36553312fad 100755 (executable)
--- a/xonstat/templates/game_info.mako
+++ b/xonstat/templates/game_info.mako
@@ -7,6 +7,14 @@
 ${nav.nav('games')}
 </%block>
 
+<%block name="js">
+      <script src="/static/js/jquery-1.7.1.min.js"></script>
+      <script src="/static/js/bootstrap-collapse.min.js"></script>
+      <script>
+        $(".collapse").collapse()
+      </script>
+</%block>
+
 <%block name="title">
 Game Information
 </%block>
@@ -16,29 +24,49 @@ Game Information
 <h2>Sorry, that game wasn't found!</h2>
 
 % else:
-<h2>Game Detail</h2>
-<p>
-Played on: ${game.start_dt.strftime('%m/%d/%Y at %I:%M %p')}<br />
-Game Type: ${game.game_type_cd}<br />
-Server: <a href="${request.route_url("server_info", id=server.server_id)}" name="Server info page for ${server.name}">${server.name}</a><br />
-Map: <a href="${request.route_url("map_info", id=map.map_id)}" name="Map info page for ${map.name}">${map.name}</a><br />
-</p>
-
-##### SCOREBOARD #####
-<h2>Scoreboard</h2>
-${scoreboard(game.game_type_cd, pgstats)}
-
-
-##### ACCURACY #####
-<h2>Accuracy</h2>
-% for pgstat in pgstats:
-% if pgstat.player_game_stat_id in pwstats:
-<a name="accuracy-${pgstat.player_game_stat_id}" />
-Accuracy for <a href="${request.route_url('player_info', id=pgstat.player_id)}" title="Go to the player detail page for this player">${pgstat.nick_html_colors()|n}</a>:
-${accuracy(pwstats[pgstat.player_game_stat_id])}
-<br />
-<br />
+<div class="row">
+  <div class="span6">
+    <h2>Game Detail</h2>
+    <p>
+      Played on: ${game.start_dt.strftime('%m/%d/%Y at %I:%M %p')}<br />
+      Game Type: ${game.game_type_cd}<br />
+      Server: <a href="${request.route_url("server_info", id=server.server_id)}" name="Server info page for ${server.name}">${server.name}</a><br />
+      Map: <a href="${request.route_url("map_info", id=map.map_id)}" name="Map info page for ${map.name}">${map.name}</a><br />
+    </p>
+  </div>
+</div>
+
+<div class="row">
+  <div class="span12">
+    <h3>Scoreboard</h3>
+    ${scoreboard(game.game_type_cd, pgstats)}
+  </div>
+</div>
+
+% if len(pgstats) > 0:
+<div class="row">
+  <div class="span12">
+    <h3>Accuracy Information</h3>
+    <div class="accordion" id="acc-accordion">
+    % for pgstat in pgstats:
+    % if pgstat.player_game_stat_id in pwstats:
+      <div class="accordion-group">
+        <div class="accordion-heading">
+          <a class="accordion-toggle" data-toggle="collapse" data-parent="#acc-accordion" href="#${pgstat.player_game_stat_id}">
+          Accuracy for ${pgstat.nick_html_colors()|n}
+          </a>
+        </div>
+        <div id="${pgstat.player_game_stat_id}" class="accordion-body collapse in">
+          <div class="accordion-inner">
+            ${accuracy(pwstats[pgstat.player_game_stat_id])}
+          </div>
+        </div>
+      </div>
+    % endif
+    % endfor
+  </div>
+</div>
 % endif
-% endfor
 
+</div>
 % endif