From: Ant Zucaro <azucaro@gmail.com>
Date: Fri, 6 Sep 2013 13:03:25 +0000 (-0400)
Subject: Initial version of AJAX chart updates.
X-Git-Url: http://de.git.xonotic.org/?p=xonotic%2Fxonstat.git;a=commitdiff_plain;h=69f1f4a95469133aad91aee77c40c4fb789d4e7b

Initial version of AJAX chart updates.

The game type icons still look wonky because they are no longer
links. The graph updates but there are errors thrown and the hover
doesn't work. I am probably not updating the chart properly.
---

diff --git a/xonstat/templates/nvd3_damage.mako b/xonstat/templates/nvd3_damage.mako
index 5832ba5..6a59e61 100644
--- a/xonstat/templates/nvd3_damage.mako
+++ b/xonstat/templates/nvd3_damage.mako
@@ -11,17 +11,10 @@ Player Damage
 
 <%block name="css">
 ${parent.css()}
+<link href="/static/css/sprites.css" rel="stylesheet">
 <link href="/static/css/nv.d3.css" rel="stylesheet" type="text/css">
 
 <style>
-body {
-  overflow-y:scroll;
-}
-
-text {
-  font: 12px sans-serif;
-}
-
 #damageChartSVG {
   height: 500px;
 }
@@ -41,6 +34,13 @@ ${parent.js()}
 % else:
     d3.json("${request.route_url('player_weaponstats_data_json', id=player_id, _query={'limit':limit})}", drawDamageChart);
 % endif
+
+% for gt in ('overall','duel','ctf','dm','tdm','ca','kh','ft','lms','as','dom','nb','cts','rc'):
+d3.select('.sprite-${gt}').on("click", function() {
+  d3.json("${request.route_url('player_weaponstats_data_json', id=player_id, _query={'limit':limit, 'game_type':gt})}", drawDamageChart);
+});
+% endfor
+
 </script>
 </%block>
 
@@ -51,5 +51,24 @@ ${parent.js()}
       <svg id="damageChartSVG"></svg>
     </div>
 
+  </div> <!-- end span12 -->
+</div> <!-- end row -->
+
+##### ROW OF GAME TYPE ICONS #####
+<div class="row">
+  <div class="span12 tabbable">
+    <ul class="nav nav-tabs">
+      % for gt in ('overall','duel','ctf','dm','tdm','ca','kh','ft','lms','as','dom','nb','cts','rc'):
+      <li 
+      % if game_type_cd == gt or (game_type_cd is None and gt == 'overall'):
+      class="active"
+      % endif
+      >
+        <span class="sprite sprite-${gt}"> </span><br />
+        ${gt} <br />
+      </li>
+      % endfor
+    </ul>
+    <br />
   </div>
 </div>