extends ../layout block content script(type="text/javascript", src="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js") style .chart rect { fill: steelblue; } .chart rect:hover { fill: #000; } script $(document).ready(function(){ // d3.js Graph var xlab = 30; var w = 5.595; var h = 120; var x = d3.scale.linear() .domain([0,1]) .range([0,w]); var y = d3.scale.linear() .domain([0,d3.max([#{chanFreq}])]) .rangeRound([0,h]); var chart = d3.select($("#chanFreqChart")[0]).append("svg") .attr("class", "chart") .attr("width", w * #{chanFreqLen} - 1) .attr("height", h + xlab); chart.selectAll("rect") .data([#{chanFreq}]) .enter().append("rect") .attr("x", function(d, i) { return x(i) - .5; }) .attr("y", function(d) { return h - y(d) - .5; }) .attr("width", w) .attr("height", function(d) { return y(d); }) .attr("title", function(d){ return d; }); chart.append("line") .attr("x1", 0) .attr("x2", w * #{chanFreqLen}) .attr("y1", h - .5) .attr("y2", h - .5) .style("stroke", "#000"); chart.selectAll("text.times") .data(["0", "6", "12", "18","0", "6", "12", "18","0", "6", "12", "18","0", "6", "12", "18" ,"0", "6", "12", "18" ,"0", "6", "12", "18" ,"0", "6", "12", "18"]) .enter().append("text") .attr("x", function(d, i){ return ((i * w * 6)+(w/2)); }) .attr("y", h + 10) .attr("text-anchor", "middle") .attr('class', 'name') .attr("font-size", 10) .text(String); chart.selectAll("text.days") .data(["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]) .enter().append("text") .attr("x", function(d, i){ return ((i+0.5) * w * 24); }) .attr("y", h + 25) .attr("text-anchor", "middle") .attr('class', 'name') .attr("font-size", 12) .text(String); // Allowing forcing of string stats data to sort as numeric jQuery.extend( jQuery.fn.dataTableExt.oSort, { "forcenum-pre": function ( a ) { a = a.replace("\,", ""); return parseFloat( a ); }, "forcenum-asc": function ( a, b ) { return a - b; }, "forcenum-desc": function ( a, b ) { return b - a; } } ); $('.tip').tooltip(); $('rect').tooltip({ }); $('.data').dataTable({ "aoColumnDefs": [ { "aDataSort": [ 1, 0 ], "asSorting": [ "asc" ], "aTargets": [ 0 ] }, { "bVisible": false, "aTargets": [ 1 ] }, { "sType": "forcenum", "asSorting": [ "desc", "asc" ], "aTargets": [ 2, 3, 4, 5, 6 ] } ], "bPaginate": false, "bLengthChange": false, "oLanguage": { "sInfo": "_TOTAL_ users", "sInfoEmpty": "No users", "sInfoFiltered": "filtered (_MAX_ total)" }, }); }); div.page-header.profile_page-header h1 #{channel} small #{connection} div#backlink a(href='/channels/'+connection) « Channel List div#row div.barchart#chanFreqChart hr div#row table.table.table-hover.data thead tr th Users th th Lines th Words th Lincent th Verbosity th Mentions tbody -each nick in userStats tr td a(href='/profile/'+connection+'/'+nick.primary) #{nick.display} span if nick.online if nick.active.active span.label.label-success.tip(data-original-title="#{nick.active.ago}", data-placement="right") Active else span.label.label-important.tip(data-original-title="#{nick.active.ago}", data-placement="right") Inactive else span.label.tip(data-original-title="#{nick.active.ago}", data-placement="right") Offline td if nick.online if nick.active.active -1 else 0 else 1 td #{nick.fields.lines.data} td #{nick.fields.words.data} td #{nick.fields.lincent.data} td #{nick.fields.wpl.data} td #{nick.fields.in_mentions.data}