plexpy/data/interfaces/default/graphs.html
2015-06-24 00:10:09 +02:00

125 lines
No EOL
4.8 KiB
HTML

<%inherit file="base.html"/>
<%!
from plexpy import helpers
%>
<%def name="headIncludes()">
</%def>
<%def name="body()">
<div class="container-fluid">
<div class="row-fluid">
<div class="span12">
<div class="wellheader-bg">
<div class="dashboard-wellheader-no-chevron">
<h2><i class="fa fa-bar-chart"></i> Graphs</h2>
</div>
</div>
</div>
</div>
</div>
<div class="container-fluid">
<div class="row-fluid">
<div class="span12">
<div class="wellbg">
<div class="wellheader">
<div class="dashboard-wellheader">
<div id="currentActivityHeader">
<h3>Daily Watch History (Past 30 days)</h3>
</div>
</div>
</div>
<div>
<div class="graphs-instance">
<div class="watch-chart" id="chart_div_plays_by_day">
<div class="graphs-load"><i class="fa fa-refresh fa-spin"></i> Loading chart...</div><br>
</div>
</div>
</div>
<div class="container-fluid">
<div class="row-fluid">
<div class="span6">
<div class="wellheader">
<div class="dashboard-wellheader">
<h3>Watches by day of week (Past 30 days)</h3>
</div>
</div>
<div class="graphs-instance">
<div class="watch-chart" id="chart_div_plays_by_dayofweek" style="float: left;">
<div class="graphs-load"><i class="fa fa-refresh fa-spin"></i> Loading chart...</div><br>
</div>
</div>
</div>
<div class="span6">
<div class="wellheader">
<div class="dashboard-wellheader">
<h3>Watches by hour of day (Past 30 days)</h3>
</div>
</div>
<div class="graphs-instance">
<div class="watch-chart" id="chart_div_plays_by_hourofday">
<div class="graphs-load"><i class="fa fa-refresh fa-spin"></i> Loading chart...</div><br>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</%def>
<%def name="javascriptIncludes()">
<script src="interfaces/default/js/moment-with-locale.js"></script>
<script src="interfaces/default/js/highcharts/js/highcharts.js"></script>
<script src="interfaces/default/js/graphs/plays_by_day.js"></script>
<script src="interfaces/default/js/graphs/plays_by_dayofweek.js"></script>
<script src="interfaces/default/js/graphs/plays_by_hourofday.js"></script>
<script>
$(document).ready(function () {
$.ajax({
url: "get_plays_by_date",
type: 'get',
data: { time_range: '30' },
dataType: "json",
success: function(data) {
var dateArray = [];
for (var i = 0; i < data.categories.length; i++) {
dateArray.push(moment(data.categories[i]).valueOf());
}
hc_plays_by_day_options.yAxis.min = 0;
hc_plays_by_day_options.xAxis.categories = dateArray;
hc_plays_by_day_options.series = data.series;
var hc_plays_by_day = new Highcharts.Chart(hc_plays_by_day_options);
}
});
$.ajax({
url: "get_plays_by_dayofweek",
type: 'get',
data: { time_range: '30' },
dataType: "json",
success: function(data) {
hc_plays_by_dayofweek_options.xAxis.categories = data.categories;
hc_plays_by_dayofweek_options.series = data.series;
var hc_plays_by_dayofweek = new Highcharts.Chart(hc_plays_by_dayofweek_options);
}
});
$.ajax({
url: "get_plays_by_hourofday",
type: 'get',
data: { time_range: '30' },
dataType: "json",
success: function(data) {
hc_plays_by_hourofday_options.xAxis.categories = data.categories;
hc_plays_by_hourofday_options.series = data.series;
var hc_plays_by_hourofday = new Highcharts.Chart(hc_plays_by_hourofday_options);
}
});
});
</script>
</%def>