mirror of
https://github.com/Tautulli/Tautulli.git
synced 2025-08-19 21:03:21 -07:00
Nicer y-axis intervals for duration graphs
This commit is contained in:
parent
d9edeb747d
commit
54af92251c
1 changed files with 74 additions and 56 deletions
|
@ -341,6 +341,14 @@
|
||||||
|
|
||||||
|
|
||||||
var music_visible = (${config['music_logging_enable']} == 1 ? true : false);
|
var music_visible = (${config['music_logging_enable']} == 1 ? true : false);
|
||||||
|
|
||||||
|
function dataSecondsToHours(data) {
|
||||||
|
$.each(data.series, function (i, series) {
|
||||||
|
series.data = $.map(series.data, function (value) {
|
||||||
|
return value / 60 / 60;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
function loadGraphsTab1(time_range, yaxis) {
|
function loadGraphsTab1(time_range, yaxis) {
|
||||||
$('#days-selection').show();
|
$('#days-selection').show();
|
||||||
|
@ -354,18 +362,19 @@
|
||||||
dataType: "json",
|
dataType: "json",
|
||||||
success: function(data) {
|
success: function(data) {
|
||||||
var dateArray = [];
|
var dateArray = [];
|
||||||
for (var i = 0; i < data.categories.length; i++) {
|
$.each(data.categories, function (i, day) {
|
||||||
dateArray.push(moment(data.categories[i], 'YYYY-MM-DD').valueOf());
|
dateArray.push(moment(day, 'YYYY-MM-DD').valueOf());
|
||||||
// Highlight the weekend
|
// Highlight the weekend
|
||||||
if ((moment(data.categories[i], 'YYYY-MM-DD').format('ddd') == 'Sat') ||
|
if ((moment(day, 'YYYY-MM-DD').format('ddd') == 'Sat') ||
|
||||||
(moment(data.categories[i], 'YYYY-MM-DD').format('ddd') == 'Sun')) {
|
(moment(day, 'YYYY-MM-DD').format('ddd') == 'Sun')) {
|
||||||
hc_plays_by_day_options.xAxis.plotBands.push({
|
hc_plays_by_day_options.xAxis.plotBands.push({
|
||||||
from: i-0.5,
|
from: i-0.5,
|
||||||
to: i+0.5,
|
to: i+0.5,
|
||||||
color: 'rgba(80,80,80,0.3)'
|
color: 'rgba(80,80,80,0.3)'
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
});
|
||||||
|
if (yaxis === 'duration') { dataSecondsToHours(data); }
|
||||||
hc_plays_by_day_options.yAxis.min = 0;
|
hc_plays_by_day_options.yAxis.min = 0;
|
||||||
hc_plays_by_day_options.xAxis.categories = dateArray;
|
hc_plays_by_day_options.xAxis.categories = dateArray;
|
||||||
hc_plays_by_day_options.series = data.series;
|
hc_plays_by_day_options.series = data.series;
|
||||||
|
@ -380,6 +389,7 @@
|
||||||
data: { time_range: time_range, y_axis: yaxis, user_id: selected_user_id },
|
data: { time_range: time_range, y_axis: yaxis, user_id: selected_user_id },
|
||||||
dataType: "json",
|
dataType: "json",
|
||||||
success: function(data) {
|
success: function(data) {
|
||||||
|
if (yaxis === 'duration') { dataSecondsToHours(data); }
|
||||||
hc_plays_by_dayofweek_options.xAxis.categories = data.categories;
|
hc_plays_by_dayofweek_options.xAxis.categories = data.categories;
|
||||||
hc_plays_by_dayofweek_options.series = data.series;
|
hc_plays_by_dayofweek_options.series = data.series;
|
||||||
hc_plays_by_dayofweek_options.series[2].visible = music_visible;
|
hc_plays_by_dayofweek_options.series[2].visible = music_visible;
|
||||||
|
@ -393,6 +403,7 @@
|
||||||
data: { time_range: time_range, y_axis: yaxis, user_id: selected_user_id },
|
data: { time_range: time_range, y_axis: yaxis, user_id: selected_user_id },
|
||||||
dataType: "json",
|
dataType: "json",
|
||||||
success: function(data) {
|
success: function(data) {
|
||||||
|
if (yaxis === 'duration') { dataSecondsToHours(data); }
|
||||||
hc_plays_by_hourofday_options.xAxis.categories = data.categories;
|
hc_plays_by_hourofday_options.xAxis.categories = data.categories;
|
||||||
hc_plays_by_hourofday_options.series = data.series;
|
hc_plays_by_hourofday_options.series = data.series;
|
||||||
hc_plays_by_hourofday_options.series[2].visible = music_visible;
|
hc_plays_by_hourofday_options.series[2].visible = music_visible;
|
||||||
|
@ -406,6 +417,7 @@
|
||||||
data: { time_range: time_range, y_axis: yaxis, user_id: selected_user_id },
|
data: { time_range: time_range, y_axis: yaxis, user_id: selected_user_id },
|
||||||
dataType: "json",
|
dataType: "json",
|
||||||
success: function(data) {
|
success: function(data) {
|
||||||
|
if (yaxis === 'duration') { dataSecondsToHours(data); }
|
||||||
hc_plays_by_platform_options.xAxis.categories = data.categories;
|
hc_plays_by_platform_options.xAxis.categories = data.categories;
|
||||||
hc_plays_by_platform_options.series = data.series;
|
hc_plays_by_platform_options.series = data.series;
|
||||||
hc_plays_by_platform_options.series[2].visible = music_visible;
|
hc_plays_by_platform_options.series[2].visible = music_visible;
|
||||||
|
@ -419,6 +431,7 @@
|
||||||
data: { time_range: time_range, y_axis: yaxis, user_id: selected_user_id },
|
data: { time_range: time_range, y_axis: yaxis, user_id: selected_user_id },
|
||||||
dataType: "json",
|
dataType: "json",
|
||||||
success: function(data) {
|
success: function(data) {
|
||||||
|
if (yaxis === 'duration') { dataSecondsToHours(data); }
|
||||||
hc_plays_by_user_options.xAxis.categories = data.categories;
|
hc_plays_by_user_options.xAxis.categories = data.categories;
|
||||||
hc_plays_by_user_options.series = data.series;
|
hc_plays_by_user_options.series = data.series;
|
||||||
hc_plays_by_user_options.series[2].visible = music_visible;
|
hc_plays_by_user_options.series[2].visible = music_visible;
|
||||||
|
@ -439,18 +452,19 @@
|
||||||
dataType: "json",
|
dataType: "json",
|
||||||
success: function(data) {
|
success: function(data) {
|
||||||
var dateArray = [];
|
var dateArray = [];
|
||||||
for (var i = 0; i < data.categories.length; i++) {
|
$.each(data.categories, function (i, day) {
|
||||||
dateArray.push(moment(data.categories[i], 'YYYY-MM-DD').valueOf());
|
dateArray.push(moment(day, 'YYYY-MM-DD').valueOf());
|
||||||
// Highlight the weekend
|
// Highlight the weekend
|
||||||
if ((moment(data.categories[i], 'YYYY-MM-DD').format('ddd') == 'Sat') ||
|
if ((moment(day, 'YYYY-MM-DD').format('ddd') == 'Sat') ||
|
||||||
(moment(data.categories[i], 'YYYY-MM-DD').format('ddd') == 'Sun')) {
|
(moment(day, 'YYYY-MM-DD').format('ddd') == 'Sun')) {
|
||||||
hc_plays_by_stream_type_options.xAxis.plotBands.push({
|
hc_plays_by_day_options.xAxis.plotBands.push({
|
||||||
from: i-0.5,
|
from: i-0.5,
|
||||||
to: i+0.5,
|
to: i+0.5,
|
||||||
color: 'rgba(80,80,80,0.3)'
|
color: 'rgba(80,80,80,0.3)'
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
});
|
||||||
|
if (yaxis === 'duration') { dataSecondsToHours(data); }
|
||||||
hc_plays_by_stream_type_options.yAxis.min = 0;
|
hc_plays_by_stream_type_options.yAxis.min = 0;
|
||||||
hc_plays_by_stream_type_options.xAxis.categories = dateArray;
|
hc_plays_by_stream_type_options.xAxis.categories = dateArray;
|
||||||
hc_plays_by_stream_type_options.series = data.series;
|
hc_plays_by_stream_type_options.series = data.series;
|
||||||
|
@ -464,6 +478,7 @@
|
||||||
data: { time_range: time_range, y_axis: yaxis, user_id: selected_user_id },
|
data: { time_range: time_range, y_axis: yaxis, user_id: selected_user_id },
|
||||||
dataType: "json",
|
dataType: "json",
|
||||||
success: function(data) {
|
success: function(data) {
|
||||||
|
if (yaxis === 'duration') { dataSecondsToHours(data); }
|
||||||
hc_plays_by_source_resolution_options.xAxis.categories = data.categories;
|
hc_plays_by_source_resolution_options.xAxis.categories = data.categories;
|
||||||
hc_plays_by_source_resolution_options.series = data.series;
|
hc_plays_by_source_resolution_options.series = data.series;
|
||||||
var hc_plays_by_source_resolution = new Highcharts.Chart(hc_plays_by_source_resolution_options);
|
var hc_plays_by_source_resolution = new Highcharts.Chart(hc_plays_by_source_resolution_options);
|
||||||
|
@ -476,6 +491,7 @@
|
||||||
data: { time_range: time_range, y_axis: yaxis, user_id: selected_user_id },
|
data: { time_range: time_range, y_axis: yaxis, user_id: selected_user_id },
|
||||||
dataType: "json",
|
dataType: "json",
|
||||||
success: function(data) {
|
success: function(data) {
|
||||||
|
if (yaxis === 'duration') { dataSecondsToHours(data); }
|
||||||
hc_plays_by_stream_resolution_options.xAxis.categories = data.categories;
|
hc_plays_by_stream_resolution_options.xAxis.categories = data.categories;
|
||||||
hc_plays_by_stream_resolution_options.series = data.series;
|
hc_plays_by_stream_resolution_options.series = data.series;
|
||||||
var hc_plays_by_stream_resolution = new Highcharts.Chart(hc_plays_by_stream_resolution_options);
|
var hc_plays_by_stream_resolution = new Highcharts.Chart(hc_plays_by_stream_resolution_options);
|
||||||
|
@ -488,6 +504,7 @@
|
||||||
data: { time_range: time_range, y_axis: yaxis, user_id: selected_user_id },
|
data: { time_range: time_range, y_axis: yaxis, user_id: selected_user_id },
|
||||||
dataType: "json",
|
dataType: "json",
|
||||||
success: function(data) {
|
success: function(data) {
|
||||||
|
if (yaxis === 'duration') { dataSecondsToHours(data); }
|
||||||
hc_plays_by_platform_by_stream_type_options.xAxis.categories = data.categories;
|
hc_plays_by_platform_by_stream_type_options.xAxis.categories = data.categories;
|
||||||
hc_plays_by_platform_by_stream_type_options.series = data.series;
|
hc_plays_by_platform_by_stream_type_options.series = data.series;
|
||||||
var hc_plays_by_platform_by_stream_type = new Highcharts.Chart(hc_plays_by_platform_by_stream_type_options);
|
var hc_plays_by_platform_by_stream_type = new Highcharts.Chart(hc_plays_by_platform_by_stream_type_options);
|
||||||
|
@ -500,6 +517,7 @@
|
||||||
data: { time_range: time_range, y_axis: yaxis, user_id: selected_user_id },
|
data: { time_range: time_range, y_axis: yaxis, user_id: selected_user_id },
|
||||||
dataType: "json",
|
dataType: "json",
|
||||||
success: function(data) {
|
success: function(data) {
|
||||||
|
if (yaxis === 'duration') { dataSecondsToHours(data); }
|
||||||
hc_plays_by_user_by_stream_type_options.xAxis.categories = data.categories;
|
hc_plays_by_user_by_stream_type_options.xAxis.categories = data.categories;
|
||||||
hc_plays_by_user_by_stream_type_options.series = data.series;
|
hc_plays_by_user_by_stream_type_options.series = data.series;
|
||||||
var hc_plays_by_user_by_stream_type = new Highcharts.Chart(hc_plays_by_user_by_stream_type_options);
|
var hc_plays_by_user_by_stream_type = new Highcharts.Chart(hc_plays_by_user_by_stream_type_options);
|
||||||
|
@ -518,6 +536,7 @@
|
||||||
data: { y_axis: yaxis, user_id: selected_user_id },
|
data: { y_axis: yaxis, user_id: selected_user_id },
|
||||||
dataType: "json",
|
dataType: "json",
|
||||||
success: function(data) {
|
success: function(data) {
|
||||||
|
if (yaxis === 'duration') { dataSecondsToHours(data); }
|
||||||
hc_plays_by_month_options.yAxis.min = 0;
|
hc_plays_by_month_options.yAxis.min = 0;
|
||||||
hc_plays_by_month_options.xAxis.categories = data.categories;
|
hc_plays_by_month_options.xAxis.categories = data.categories;
|
||||||
hc_plays_by_month_options.series = data.series;
|
hc_plays_by_month_options.series = data.series;
|
||||||
|
@ -610,56 +629,55 @@
|
||||||
if (type === 'plays') {
|
if (type === 'plays') {
|
||||||
yaxis_format = function() { return this.value; };
|
yaxis_format = function() { return this.value; };
|
||||||
tooltip_format = function() {
|
tooltip_format = function() {
|
||||||
if (moment(this.x, 'X').isValid() && (this.x > 946684800)) {
|
if (moment(this.x, 'X').isValid() && (this.x > 946684800)) {
|
||||||
var s = '<b>'+ moment(this.x).format("ddd MMM D") +'</b>';
|
var s = '<b>'+ moment(this.x).format('ddd MMM D') +'</b>';
|
||||||
} else {
|
} else {
|
||||||
var s = '<b>'+ this.x +'</b>';
|
var s = '<b>'+ this.x +'</b>';
|
||||||
}
|
}
|
||||||
if (this.points.length > 1) {
|
if (this.points.length > 1) {
|
||||||
var total = 0;
|
var total = 0;
|
||||||
$.each(this.points, function(i, point) {
|
$.each(this.points, function(i, point) {
|
||||||
s += '<br/>'+point.series.name+': '+point.y;
|
s += '<br/>'+point.series.name+': '+point.y;
|
||||||
total += point.y;
|
total += point.y;
|
||||||
});
|
});
|
||||||
s += '<br><b>Total: '+total+'</b>';
|
s += '<br><b>Total: '+total+'</b>';
|
||||||
} else {
|
} else {
|
||||||
$.each(this.points, function(i, point) {
|
$.each(this.points, function(i, point) {
|
||||||
s += '<br/>'+point.series.name+': '+point.y;
|
s += '<br/>'+point.series.name+': '+point.y;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
return s;
|
return s;
|
||||||
}
|
}
|
||||||
stack_labels_format = function() {
|
stack_labels_format = function() {
|
||||||
return this.total;
|
return this.total;
|
||||||
}
|
}
|
||||||
|
|
||||||
$('.yaxis-text').html('Play count');
|
$('.yaxis-text').html('Play count');
|
||||||
} else {
|
} else {
|
||||||
yaxis_format = function() { return moment.duration(this.value, 'seconds').format("H [h] m [m]"); };
|
yaxis_format = function() { return moment.duration(this.value, 'hours').format('H [h] m [m]'); };
|
||||||
tooltip_format = function() {
|
tooltip_format = function() {
|
||||||
if (moment(this.x, 'X').isValid() && (this.x > 946684800)) {
|
if (moment(this.x, 'X').isValid() && (this.x > 946684800)) {
|
||||||
var s = '<b>'+ moment(this.x).format("ddd MMM D") +'</b>';
|
var s = '<b>'+ moment(this.x).format('ddd MMM D') +'</b>';
|
||||||
} else {
|
} else {
|
||||||
var s = '<b>'+ this.x +'</b>';
|
var s = '<b>'+ this.x +'</b>';
|
||||||
}
|
}
|
||||||
if (this.points.length > 1) {
|
if (this.points.length > 1) {
|
||||||
var total = 0;
|
var total = 0;
|
||||||
$.each(this.points, function(i, point) {
|
$.each(this.points, function(i, point) {
|
||||||
s += '<br/>'+point.series.name+': '+moment.duration(point.y, 'seconds').format('D [days] H [hrs] m [mins]');
|
s += '<br/>'+point.series.name+': '+moment.duration(point.y, 'hours').format('D [days] H [hrs] m [mins]');
|
||||||
total += point.y;
|
total += point.y;
|
||||||
});
|
});
|
||||||
s += '<br/><b>Total: '+moment.duration(total, 'seconds').format('D [days] H [hrs] m [mins]')+'</b>';
|
s += '<br/><b>Total: '+moment.duration(total, 'hours').format('D [days] H [hrs] m [mins]')+'</b>';
|
||||||
} else {
|
} else {
|
||||||
$.each(this.points, function(i, point) {
|
$.each(this.points, function(i, point) {
|
||||||
s += '<br/>'+point.series.name+': '+moment.duration(point.y, 'seconds').format('D [days] H [hrs] m [mins]');
|
s += '<br/>'+point.series.name+': '+moment.duration(point.y, 'hours').format('D [days] H [hrs] m [mins]');
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
return s;
|
return s;
|
||||||
}
|
}
|
||||||
stack_labels_format = function() {
|
stack_labels_format = function() {
|
||||||
var s = moment.duration(this.total, 'seconds').format("H [hrs] m [mins]");
|
var s = moment.duration(this.total, 'hours').format('H [h] m [m]');
|
||||||
return s;
|
return s;
|
||||||
}
|
}
|
||||||
$('.yaxis-text').html('Play duration');
|
$('.yaxis-text').html('Play duration');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue