tilde-projects/public_html/chatstats/index.html

107 lines
5.0 KiB
HTML

<!DOCTYPE html>
<html content="text/html; charset=UTF-8;charset=utf-8">
<head>
<title>IRC chat stats</title>
</head>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<!--<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"
charset="utf-8"></script>-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.10.1/lodash.min.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("visualization", "1.1", {packages:["table"]});
$(loadData);
function loadData() {
data = [];
brutalMode = $("#onlyReal").is(":checked");
jQuery.getJSON("/~krowbar/data/chatStats.json", function(json) {
now = new Date();
nowSec = Math.round(now.getTime()/1000)
_.forEach(json, function(userData, user) {
if(brutalMode && (userData.mentions < 3 || userData.lineCount < 20)) {
return;
}
data.push([user, new Date(userData.startTime*1000), new Date(userData.endTime*1000),
Number(((userData.endTime - userData.startTime) / 86400).toFixed(2)),
userData.daysActive,
Math.min(Number(((86400 * userData.daysActive) / (nowSec - userData.startTime)).toFixed(2)), 1),
userData.lineCount,
userData.wordCount, Number((userData.wordCount / userData.lineCount).toFixed(2)),
userData.charCount, Number((userData.charCount / userData.lineCount).toFixed(2)),
userData.streak,
userData.mentions,
(userData.mentions / userData.daysActive),
(userData.mentions / userData.lineCount),
userData.botUse,
Number((userData.responseTime / (userData.mentions ? userData.mentions : 1) / 60).toFixed(2)),
userData.happyEmotes,
userData.sadEmotes,
(userData.happyEmotes + userData.sadEmotes) == 0 ? 0 : userData.happyEmotes / (userData.happyEmotes + userData.sadEmotes)
]);
});
console.log("* Loaded the data!");
//google.setOnLoadCallback(drawTable);
$(drawTable)
});
}
function drawTable() {
var dataTable = new google.visualization.DataTable();
var userFormatter = new google.visualization.PatternFormat('<a href="/~{0}">{0}</a>');
var minFormatter = new google.visualization.NumberFormat({pattern: '##.## minutes'});
var dayFormatter = new google.visualization.NumberFormat({pattern: '## days'});
var wordFormatter = new google.visualization.NumberFormat({pattern: '##.## words'});
var charFormatter = new google.visualization.NumberFormat({pattern: '##.## char'});
var streakFormatter = new google.visualization.NumberFormat({pattern: '## lines'});
var mentionsFormatter = new google.visualization.NumberFormat({pattern: '## mentions'});
dataTable.addColumn('string', 'User'); //col0
dataTable.addColumn('datetime', 'First Spoke'); //col1
dataTable.addColumn('datetime', 'Last Spoke'); //col2
dataTable.addColumn('number', 'Total'); //col3
dataTable.addColumn('number', 'Active'); //col4
dataTable.addColumn('number', 'Ratio'); //col5
dataTable.addColumn('number', 'Lines'); //col6
dataTable.addColumn('number', 'Words'); //col7
dataTable.addColumn('number', 'per Line'); //col8
dataTable.addColumn('number', 'Characters'); //col9
dataTable.addColumn('number', 'per Line'); //col10
dataTable.addColumn('number', 'Streak'); //col11
dataTable.addColumn('number', 'Popularity'); //col12
dataTable.addColumn('number', 'by Day'); //col13
dataTable.addColumn('number', 'by Line'); //col14
dataTable.addColumn('number', 'Bot Use'); //col15
dataTable.addColumn('number', 'Response time'); //col16
dataTable.addColumn('number', 'Happy'); //col17
dataTable.addColumn('number', 'Sad'); //col18
dataTable.addColumn('number', 'Ratio'); //col19
dataTable.addRows(data);
userFormatter.format(dataTable, [0]);
dayFormatter.format(dataTable, 3);
dayFormatter.format(dataTable, 4);
wordFormatter.format(dataTable, 8);
charFormatter.format(dataTable, 10);
streakFormatter.format(dataTable, 11);
mentionsFormatter.format(dataTable, 12);
minFormatter.format(dataTable, 16);
console.log("* Set up the columns!");
var table = new google.visualization.Table(document.getElementById('statTable'));
table.draw(dataTable, {showRowNumber: false, width:'95%', height: '60%', sortColumn:2, sortAscending:false, allowHtml: true});
console.log("* Drew the tables! (I hope.)");
}
</script>
<body>
<input id="onlyReal" type="checkbox" onClick="loadData()">Only real people</input>
<div id="statTable"></div>
</body>
</html>