- % if player is not None:
- <script src="/static/js/jquery-1.7.1.min.js"></script>
- <script src="/static/js/jquery.flot.min.js"></script>
- <script src="/static/js/bootstrap-tab.js"></script>
- <script type="text/javascript">
- $(function () {
- $('#gbtab li').click(function(e) {
- e.preventDefault();
- $(this).tab('show');
- })
-
- $('#gbtab a:first').tab('show');
- })
- </script>
-
- <script type="text/javascript">
- $(function () {
- // plot the accuracy graph
- function plot_acc_graph(data) {
- var games = new Array();
- var avgs = new Array();
- var accs = new Array();
-
- var i=0;
- for(i=0; i < data.games; i++) {
- avgs[i] = [i, data.avg];
- accs[i] = [i, data.accs[i][1]];
- game_link = '/game/' + data.accs[i][0];
- j = data.games - i;
- games[i] = [i, '<a href="' + game_link + '">' + j + '</a>'];
- }
-
- $.plot(
- $("#acc-graph"),
- [ { label: 'average', data: avgs, hoverable: true, clickable: false },
- { label: 'accuracy', data: accs, lines: {show:true}, points: {show:false}, hoverable: true, clickable: true }, ],
- { yaxis: {ticks: 10, min: 0, max: 100 },
- xaxis: {ticks: games},
- grid: { hoverable: true, clickable: true },
- });
- }
-
- // plot the damage graph
- function plot_dmg_graph(data) {
- var games = new Array();
- var avgs = new Array();
- var dmgs = new Array();
-
- var i=0;
- for(i=0; i < data.games; i++) {
- avgs[i] = [i, data.avg];
- dmgs[i] = [i, data.dmgs[i][1]];
- game_link = '/game/' + data.dmgs[i][0];
- j = data.games - i;
- games[i] = [i, '<a href="' + game_link + '">' + j + '</a>'];
- }
-
- $.plot(
- $("#dmg-graph"),
- [ { label: 'average', data: avgs, hoverable: true, clickable: false },
- { label: 'efficiency', data: dmgs, lines: {show:true}, points: {show:false}, hoverable: true, clickable: true }, ],
- { yaxis: {ticks: 10, min: 0 },
- xaxis: {ticks: games},
- grid: { hoverable: true, clickable: true },
- });
- }
-
- function showTooltip(x, y, contents) {
- $('<div id="tooltip">' + contents + '</div>').css( {
- position: 'absolute',
- display: 'none',
- top: y - 35,
- left: x + 10,
- border: '1px solid #fdd',
- padding: '2px',
- 'background-color': '#333333',
- opacity: 0.80
- }).appendTo("body").fadeIn(200);
- }
-
- var previousPoint = null;
- var previousLabel = null;
- $('#acc-graph').bind("plothover", function (event, pos, item) {
- if (item) {
- if ((previousLabel != item.series.label) || (previousPoint != item.dataIndex)) {
- previousLabel = item.series.label;
- previousPoint = item.dataIndex;
-
- $("#tooltip").remove();
- var x = item.datapoint[0].toFixed(2),
- y = item.datapoint[1].toFixed(2);
-
- showTooltip(item.pageX, item.pageY, y + "%");
- }
- }
- else {
- $("#tooltip").remove();
- previousPoint = null;
- previousLabel = null;
- }
- });
-
- $('#dmg-graph').bind("plothover", function (event, pos, item) {
- if (item) {
- if ((previousLabel != item.series.label) || (previousPoint != item.dataIndex)) {
- previousPoint = item.dataIndex;
- previousLabel = item.series.label;
-
- $("#tooltip").remove();
- var x = item.datapoint[0].toFixed(2),
- y = item.datapoint[1].toFixed(2);
-
- showTooltip(item.pageX, item.pageY, y);
- }
- }
- else {
- $("#tooltip").remove();
- previousPoint = null;
- previousLabel = null;
- }
- });
-
- // bind click events to the weapon images
- $(".acc-weap").click(function () {
- var dataurl = $(this).find('a').attr('href');
-
- $('.accuracy-nav').find('.weapon-active').removeClass('weapon-active');
- $(this).addClass('weapon-active');
-
- $.ajax({
- url: dataurl,
- method: 'GET',
- dataType: 'json',
- success: plot_acc_graph
- });
- });
-
- $(".dmg-weap").click(function () {
- var dataurl = $(this).find('a').attr('href');
-
- $('.damage-nav').find('.weapon-active').removeClass('weapon-active');
- $(this).addClass('weapon-active');
-
- $.ajax({
- url: dataurl,
- method: 'GET',
- dataType: 'json',
- success: plot_dmg_graph
- });
- });
-
- // populate the graphs with the default weapons
- $.ajax({
- url: '${request.route_url("player_accuracy", id=player.player_id)}',
- method: 'GET',
- dataType: 'json',
- success: plot_acc_graph
- });
-
- $.ajax({
- url: '${request.route_url("player_damage", id=player.player_id)}',
- method: 'GET',
- dataType: 'json',
- success: plot_dmg_graph
- });
- })
- </script>
- % endif
+ ${parent.js()}
+ <script type="text/javascript" src="/static/js/vendor/d3.min.js"></script>
+ <script type="text/javascript" src="/static/js/vendor/nv.d3.min.js"></script>
+ <script type="text/javascript" src="/static/js/weaponCharts.min.js"></script>
+ ##### <script src="/static/js/weaponCharts.min.js"></script>
+ <script type="text/javascript">
+
+ // game type buttons
+ % for g in games_played:
+ $('#tab-${g.game_type_cd}').click(function() {
+ $.getJSON("${request.route_url('player_weaponstats_data_json', id=player.player_id, _query={'limit':20, 'game_type':g.game_type_cd})}", function(data) {
+ drawDamageChart("#damageChart", data);
+ drawAccuracyChart("#accuracyChart", data);
+ });
+ });
+ % endfor
+
+ // weapon accuracy and damage charts
+ $.getJSON("${request.route_url('player_weaponstats_data_json', id=player.player_id, _query={'limit':20})}", function(data) {
+
+ if(data.games.length < 5) {
+ d3.select(".row #damageChart").remove();
+ d3.select(".row #accuracyChart").remove();
+ }
+ drawDamageChart("#damageChart", data);
+ drawAccuracyChart("#accuracyChart", data);
+ });
+ </script>