Skip to content

Commit

Permalink
Add graph params box, always provide split in routes
Browse files Browse the repository at this point in the history
  • Loading branch information
ryft committed Jun 6, 2015
1 parent b381531 commit afb3ece
Show file tree
Hide file tree
Showing 6 changed files with 61 additions and 19 deletions.
3 changes: 2 additions & 1 deletion bower.json
Expand Up @@ -19,6 +19,7 @@
"dependencies": {
"angular": "~1.4.0",
"angular-chart.js": "~0.7.1",
"bootswatch": "~3.3.4+1"
"bootswatch": "~3.3.4+1",
"angular-bootstrap-slider": "~0.1.3"
}
}
19 changes: 14 additions & 5 deletions index.pl
Expand Up @@ -30,9 +30,14 @@
{ mysql_auto_reconnect => 1 }
) or die $DBI::errstr;

sub metric {
my $metric = shift;
return $METRICS{$metric} ? $metric : $DEFAULT_METRIC;
}

sub metric_name {
my $metric = shift;
return $METRICS{$metric} || $METRICS{$DEFAULT_METRIC};
return $METRICS{metric($metric)};
}

sub splits {
Expand Down Expand Up @@ -197,18 +202,22 @@ sub data_series {

# Prepare routes
get '/standings/' => sub { my $c = shift; $c->stash(page => 'standings', split => 0); $c->render(template => 'standings') };
get '/standings/*split' => sub { my $c = shift; $c->stash(page => 'standings'); $c->render(template => 'standings') };
get '/standings/:split' => sub { my $c = shift; $c->stash(page => 'standings'); $c->render(template => 'standings') };

get '/graph/:metric/' => sub { my $c = shift; $c->stash(page => 'graphs', title => metric_name($c->param('metric')), split => 0); $c->render(template => 'graph') };
get '/graph/:metric/:split' => sub { my $c = shift; $c->stash(page => 'graphs', title => metric_name($c->param('metric'))); $c->render(template => 'graph') };
get '/graph/:metric/:split' => sub {
my $c = shift;
my $metric = metric($c->param('metric'));
$c->stash(page => "graph/$metric", title => metric_name($metric));
$c->render(template => 'graph');
};

get '/api/standings' => sub { my $c = shift; $c->render(json => standings()) };
get '/api/standings/:split' => sub { my $c = shift; $c->render(json => standings($c->param('split'))) };

get '/api/:metric/' => sub { my $c = shift; $c->render(json => data_series($c->param('metric'))) };
get '/api/:metric/:split' => sub { my $c = shift; $c->render(json => data_series($c->param('metric'), $c->param('split'))) };

get '/' => sub { my $c = shift; $c->redirect_to('standings') };
get '/' => sub { my $c = shift; $c->redirect_to('standings/0') };

app->secrets($config->{secrets});
app->start;
Expand Down
5 changes: 4 additions & 1 deletion public/js/salt.js
@@ -1,4 +1,4 @@
var app = angular.module('SaltApp', ['chart.js']);
var app = angular.module('SaltApp', ['chart.js', 'ui.bootstrap-slider']);

app.controller('StandingsCtrl', function($scope, $attrs, $http) {
var api_url = ($attrs.split) ? '/api/standings/' + $attrs.split : '/api/standings';
Expand All @@ -12,6 +12,9 @@ app.controller('StandingsCtrl', function($scope, $attrs, $http) {
});

app.controller('ChartCtrl', function($scope, $attrs, $http) {
$scope.movingAverageLength = 12;


var api_url = ($attrs.split) ? '/api/' + $attrs.metric + '/' + $attrs.split : '/api/' + $metric;
$http.get(api_url)
.success(function(response) {
Expand Down
24 changes: 23 additions & 1 deletion templates/graph.html.ep
@@ -1,5 +1,27 @@
%layout 'wrapper', title => $title;
%layout 'wrapper';
<div ng-controller="ChartCtrl" metric="<%= $metric %>" split="<%= $split %>">

<div class="well well--params">
<p class="caption">Graph Parameters</p>
<div class="checkbox">
<label>
<input type="checkbox"> Normalise values
</label>
</div>
<div class="btn-group btn-group-sm" role="group">
<button type="button" class="btn btn-default">Raw values</button>
<button type="button" class="btn btn-default">Cumulative</button>
<button type="button" class="btn btn-default">Mean deviation</button>
</div>
<p>Moving average length</p>
<span id="slider">
<slider ng-model="movingAverageLength" min="'1'" max="'21'" tooltip="hide"></slider>
<label class="pull-right" ng-bind="movingAverageLength"></label>
</slider>
</div>

<h2><%= $title %></h2>

<canvas id="line" class="chart chart-line" data="data"
labels="labels" legend="true" series="series"
click="onClick">
Expand Down
25 changes: 15 additions & 10 deletions templates/layouts/wrapper.html.ep
Expand Up @@ -7,13 +7,17 @@

<link rel="stylesheet" href="/bootswatch/flatly/bootstrap.min.css">
<link rel="stylesheet" href="/angular-chart.js/dist/angular-chart.css">
<link rel="stylesheet" href="/seiyria-bootstrap-slider/dist/css/bootstrap-slider.min.css">
<link rel="stylesheet" href="/css/salt.css">

<script src="/angular/angular.min.js"></script>
<script src="/jquery/dist/jquery.min.js"></script>

<script src="/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="/Chart.js/Chart.min.js"></script>
<script src="/angular-chart.js/dist/angular-chart.min.js"></script>
<script src="/seiyria-bootstrap-slider/dist/bootstrap-slider.min.js"></script>
<script src="/angular-bootstrap-slider/slider.js"></script>
<script src="/js/salt.js"></script>
</head>
<body>
Expand All @@ -30,23 +34,25 @@
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="<%= ($page eq 'standings') ? 'active' : '' %>"><a href="/">Standings</a></li>
<li class="<%= ($page eq 'standings') ? 'active' : '' %>"><a href="/standings/<%= $split %>">Standings</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Summoners <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="#">kek</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Charts <span class="caret"></span></a>
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Graphs <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="/charts/pf">Points For</a></li>
<li><a href="/charts/pa">Points Against</a></li>
<li><a href="/charts/pd">Points Difference</a></li>
<!--<li class="divider"></li>
<li class="dropdown-header">Nav header</li>
<li><a href="#">Separated link</a></li>
<li><a href="#">One more separated link</a></li>-->
<li class="dropdown-header">Matches</li>
<li class="<%= $page eq 'graph/won' ? 'active' : '' %>"><a href="/graph/won/<%= $split %>">Wins</a></li>
<li class="<%= $page eq 'graph/tied' ? 'active' : '' %>"><a href="/graph/tied/<%= $split %>">Ties</a></li>
<li class="<%= $page eq 'graph/lost' ? 'active' : '' %>"><a href="/graph/lost/<%= $split %>">Losses</a></li>
<li class="divider"></li>
<li class="dropdown-header">Points Totals</li>
<li class="<%= $page eq 'graph/pf' ? 'active' : '' %>"><a href="/graph/pf/<%= $split %>">Points For</a></li>
<li class="<%= $page eq 'graph/pa' ? 'active' : '' %>"><a href="/graph/pa/<%= $split %>">Points Against</a></li>
<li class="<%= $page eq 'graph/pd' ? 'active' : '' %>"><a href="/graph/pd/<%= $split %>">Points Difference</a></li>
</ul>
</li>
</ul>
Expand All @@ -63,7 +69,6 @@
</nav>

<div class="container">
<h2><%= $title %></h2>
<%= content %>
</div>

Expand Down
4 changes: 3 additions & 1 deletion templates/standings.html.ep
@@ -1,4 +1,6 @@
%layout 'wrapper', title => 'Standings';
%layout 'wrapper';
<h2>Standings</h2>

<table ng-controller="StandingsCtrl" split="<%= $split %>" class="table">
<thead>
<tr>
Expand Down

0 comments on commit afb3ece

Please sign in to comment.