statbot/assets/js/main_stats.js

354 lines
9.1 KiB
JavaScript
Raw Normal View History

2015-11-02 19:48:29 +00:00
document.addEventListener("DOMContentLoaded", function(event) {
B("#btnChannelStats").on('click', function(e) {
B(this).addClass('pure-button-disabled');
B('#btnMessageStats').removeClass('pure-button-disabled');
B('#btnUserStats').removeClass('pure-button-disabled');
B('#channelStats').removeClass('hidden');
B('#userStats').addClass('hidden');
B('#messageStats').addClass('hidden');
});
B('#btnMessageStats').on('click', function(e) {
B(this).addClass('pure-button-disabled');
B('#btnChannelStats').removeClass('pure-button-disabled');
B('#channelStats').addClass('hidden');
B('#btnUserStats').removeClass('pure-button-disabled');
B('#userStats').addClass('hidden');
B('#messageStats').removeClass('hidden');
});
B('#btnUserStats').on('click', function(e) {
B(this).addClass('pure-button-disabled');
B('#btnChannelStats').removeClass('pure-button-disabled');
B('#channelStats').addClass('hidden');
B('#btnMessageStats').removeClass('pure-button-disabled');
B('#messageStats').addClass('hidden');
B('#userStats').removeClass('hidden');
});
B('#btnUsrHrlyStats').on('click', function(e) {
B(this).addClass('pure-button-disabled');
B('#btnUsrDowStats').removeClass('pure-button-disabled');
B('#userHourlyStats').removeClass('hidden');
B('#userDowStats').addClass('hidden');
});
B('#btnUsrDowStats').on('click', function(e) {
B(this).addClass('pure-button-disabled');
B('#btnUsrHrlyStats').removeClass('pure-button-disabled');
B('#userHourlyStats').addClass('hidden');
B('#userDowStats').removeClass('hidden');
});
2015-11-02 19:48:29 +00:00
var main_channel_names = ['general','random'],
main_member_numbers = [],
main_message_numbers = [],
other_channel_names = [],
other_member_numbers = [],
other_message_numbers = [];
for(var i = 0; i < stats.channels.length; i++) {
2015-11-02 19:48:29 +00:00
if(stats.channels[i].name == "general") {
main_member_numbers[0] = stats.channels[i].member_count;
main_message_numbers[0] = stats.channels[i].message_count;
} else if(stats.channels[i].name == "random") {
main_member_numbers[1] = stats.channels[i].member_count;
main_message_numbers[1] = stats.channels[i].message_count;
} else {
other_channel_names.push(stats.channels[i].name);
other_member_numbers.push(stats.channels[i].member_count);
other_message_numbers.push(stats.channels[i].message_count);
}
}
var mainChart = new Highcharts.Chart({
chart: {
renderTo: 'mainStatsBarChart',
type: 'column'
},
title: {
text: 'Main Channels'
},
yAxis: [{
min: 0,
title: { text: 'Messages' }
},{
min: 0,
title: { text: 'Members' },
opposite: true
}],
plotOptions: {
column: {
grouping: false,
shadow: false,
borderWidth: 0
}
},
xAxis: {
categories: main_channel_names
},
series: [{
name: 'Messages',
color: 'rgba(126,86,134,0.9)',
data: main_message_numbers,
pointPadding: 0.3
},{
name: 'Members',
color: 'rgba(165,170,217,1)',
data: main_member_numbers,
pointPadding: 0.4,
yAxis: 1
}]
});
var otherChart = new Highcharts.Chart({
chart: {
renderTo: 'statsBarChart',
type: 'column'
},
title: {
text: 'Other Channels'
},
yAxis: [{
min: 0,
title: { text: 'Members' }
},{
min: 0,
title: { text: 'Messages' },
opposite: true
}],
tooltip: { shared: true },
plotOptions: {
column: {
grouping: false,
shadow: false,
borderWidth: 0
}
},
xAxis: {
categories: other_channel_names
},
series: [{
name: 'Messages',
color: 'rgba(126,86,134,0.9)',
data: other_message_numbers,
pointPadding: 0.0
2015-11-02 19:48:29 +00:00
},{
name: 'Members',
color: 'rgba(165,170,217,1)',
data: other_member_numbers,
pointPadding: 0.2,
2015-11-02 19:48:29 +00:00
yAxis: 1
}]
});
var msg1 = [{name: 'Messages', data: []}];
for(var i = 0; i < 24; i++) {
msg1[0].data.push(stats.messages.hours[i]);
}
var msgHourlyChart = new Highcharts.Chart({
chart: {
renderTo: 'msgHourlyStats'
},
title: {
text: 'Hourly Stats'
},
xAxis: {
categories: [
'00:00', '01:00', '02:00', '03:00', '04:00', '05:00',
'06:00', '07:00', '08:00', '09:00', '10:00', '11:00',
'12:00', '13:00', '14:00', '15:00', '16:00', '17:00',
'18:00', '19:00', '20:00', '21:00', '22:00', '23:00'
]
},
yAxis: {
title: { text: '' },
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
series: msg1
});
var msg2 = [{name: 'Messages', data: []}];
msg2[0].data.push(stats.messages.dow['Sun']);
msg2[0].data.push(stats.messages.dow['Mon']);
msg2[0].data.push(stats.messages.dow['Tue']);
msg2[0].data.push(stats.messages.dow['Wed']);
msg2[0].data.push(stats.messages.dow['Thu']);
msg2[0].data.push(stats.messages.dow['Fri']);
msg2[0].data.push(stats.messages.dow['Sat']);
var msgDowChart = new Highcharts.Chart({
chart: {
renderTo: 'msgDowStats'
},
title: {
text: 'Day of Week Stats'
},
xAxis: {
categories: [
'Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'
]
},
yAxis: {
title: { text: '' },
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
series: msg2
});
var numCharts = 0,
usrHourlyCharts = [],
usrDowCharts = [],
maxMessages = 0;
stats.users.sort(function(a, b){
if(a.name < b.name) { return -1; }
if(a.name > b.name) { return 1; }
return 0;
});
for(var i = 0; i < stats.users.length; i++) {
for(var j = 0; j < 24; j++) {
if(stats.users[i].messages.hours[j] > maxMessages) {
maxMessages = stats.users[i].messages.hours[j];
}
}
}
while((numCharts*10) < stats.users.length) {
var usrList = [],
usrHourlyActivity = [],
usrDowActivity = [];
for(var i = (numCharts*10); i < 10+(numCharts*10); i++) {
if(i < stats.users.length) {
usrList.push(stats.users[i].name);
for(var j = 0; j < 24; j++) {
usrHourlyActivity.push({
x: j,
y: (i - (numCharts*10)),
value: stats.users[i].messages.hours[j]
});
}
dowArr=['Sun','Mon','Tue','Wed','Thu','Fri','Sat'];
for(var dowI = 0; dowI < 7; dowI++) {
usrDowActivity.push({
x: dowI,
y: (i - (numCharts*10)),
value: stats.users[i].messages.dow[dowArr[dowI]]
});
}
}
}
B("#userHourlyStats").append(B("<div>").attr('id','usrHourlyStats-'+numCharts));
B("#userDowStats").append(B("<div>").attr('id','usrDowStats-'+numCharts));
usrHourlyCharts.push(new Highcharts.Chart({
chart: {
type: 'heatmap',
renderTo: 'usrHourlyStats-'+numCharts
},
title: {
text: 'Hourly Activity by User'
},
xAxis: {
categories: [
'00:00','01:00','02:00','03:00','04:00','05:00',
'06:00','07:00','08:00','09:00','10:00','11:00',
'12:00','13:00','14:00','15:00','16:00','17:00',
'18:00','19:00','20:00','21:00','22:00','23:00'
]
},
yAxis: {
categories: usrList,
title: null
},
colorAxis: {
stops: [
[0, '#3060cf'],
[0.5, '#fffbbc'],
[0.9, '#c4463a']
],
min: 0,
max: maxMessages
},
series: [{
borderWidth: 1,
data: usrHourlyActivity,
name: "Messages",
tooltip: {
pointFormatter: function() {
if(this.x < 10) {
return this.series.yAxis.categories[this.y] + " - 0"+this.x+":00 ("+this.value+" messages)";
}
return this.series.yAxis.categories[this.y] + " - "+this.x+":00 ("+this.value+" messages)";
}
}
}]
}));
usrDowCharts.push(new Highcharts.Chart({
chart: {
type: 'heatmap',
renderTo: 'usrDowStats-'+numCharts
},
title: {
text: 'Day Of Week Activity by User'
},
xAxis: {
categories: [
'Sun','Mon','Tue','Wed','Thu','Fri','Sat'
]
},
yAxis: {
categories: usrList,
title: null
},
colorAxis: {
stops: [
[0, '#3060cf'],
[0.5, '#fffbbc'],
[0.9, '#c4463a']
],
min: 0,
max: maxMessages
},
series: [{
borderWidth: 1,
data: usrDowActivity,
name: "Messages",
tooltip: {
pointFormatter: function() {
if(this.x < 10) {
return this.series.yAxis.categories[this.y] + " - 0"+this.x+":00 ("+this.value+" messages)";
}
return this.series.yAxis.categories[this.y] + " - "+this.x+":00 ("+this.value+" messages)";
}
}
}]
}));
numCharts++;
}
B('#userStats').addClass('hidden');
B('#messageStats').addClass('hidden');
B('#userDowStats').addClass('hidden');
2015-11-02 19:48:29 +00:00
});