128 lines
3.6 KiB
Plaintext
128 lines
3.6 KiB
Plaintext
- @no_container = true
|
|
- page_title "Charts"
|
|
- content_for :page_specific_javascripts do
|
|
= page_specific_javascript_bundle_tag('common_d3')
|
|
= page_specific_javascript_bundle_tag('graphs')
|
|
= render "projects/commits/head"
|
|
|
|
.repo-charts{ class: container_class }
|
|
%h4.sub-header
|
|
Programming languages used in this repository
|
|
|
|
.row
|
|
.col-md-4
|
|
%ul.bordered-list
|
|
- @languages.each do |language|
|
|
%li
|
|
%span{ style: "color: #{language[:color]}" }
|
|
= icon('circle')
|
|
|
|
= language[:label]
|
|
.pull-right
|
|
= language[:value]
|
|
\%
|
|
.col-md-8
|
|
%canvas#languages-chart{ height: 400 }
|
|
|
|
.repo-charts{ class: container_class }
|
|
.sub-header-block.border-top
|
|
|
|
.row.tree-ref-header
|
|
.col-md-6
|
|
%h4
|
|
Commit statistics for
|
|
%strong= @ref
|
|
#{@commits_graph.start_date.strftime('%b %d')} - #{@commits_graph.end_date.strftime('%b %d')}
|
|
|
|
.col-md-6
|
|
.tree-ref-container
|
|
.tree-ref-holder
|
|
= render 'shared/ref_switcher', destination: 'graphs_commits'
|
|
%ul.breadcrumb.repo-breadcrumb
|
|
= commits_breadcrumbs
|
|
|
|
.row
|
|
.col-md-6
|
|
%ul.commit-stats
|
|
%li
|
|
Total:
|
|
%strong #{@commits_graph.commits.size} commits
|
|
%li
|
|
Average per day:
|
|
%strong #{@commits_graph.commit_per_day} commits
|
|
%li
|
|
Authors:
|
|
%strong= @commits_graph.authors
|
|
.col-md-6
|
|
%div
|
|
%p.slead
|
|
Commits per day of month
|
|
%canvas#month-chart
|
|
.row
|
|
.col-md-6
|
|
.col-md-6
|
|
%div
|
|
%p.slead
|
|
Commits per weekday
|
|
%canvas#weekday-chart
|
|
.row
|
|
.col-md-6
|
|
.col-md-6
|
|
%div
|
|
%p.slead
|
|
Commits per day hour (UTC)
|
|
%canvas#hour-chart
|
|
|
|
:javascript
|
|
var responsiveChart = function (selector, data) {
|
|
var options = { "scaleOverlay": true, responsive: true, pointHitDetectionRadius: 2, maintainAspectRatio: false };
|
|
// get selector by context
|
|
var ctx = selector.get(0).getContext("2d");
|
|
// pointing parent container to make chart.js inherit its width
|
|
var container = $(selector).parent();
|
|
var generateChart = function() {
|
|
selector.attr('width', $(container).width());
|
|
if (window.innerWidth < 768) {
|
|
// Scale fonts if window width lower than 768px (iPad portrait)
|
|
options.scaleFontSize = 8
|
|
}
|
|
return new Chart(ctx).Bar(data, options);
|
|
};
|
|
// enabling auto-resizing
|
|
$(window).resize(generateChart);
|
|
return generateChart();
|
|
};
|
|
|
|
var chartData = function (keys, values) {
|
|
var data = {
|
|
labels : keys,
|
|
datasets : [{
|
|
fillColor : "rgba(220,220,220,0.5)",
|
|
strokeColor : "rgba(220,220,220,1)",
|
|
barStrokeWidth: 1,
|
|
barValueSpacing: 1,
|
|
barDatasetSpacing: 1,
|
|
data : values
|
|
}]
|
|
};
|
|
return data;
|
|
};
|
|
|
|
var hourData = chartData(#{@commits_per_time.keys.to_json}, #{@commits_per_time.values.to_json});
|
|
responsiveChart($('#hour-chart'), hourData);
|
|
|
|
var dayData = chartData(#{@commits_per_week_days.keys.to_json}, #{@commits_per_week_days.values.to_json});
|
|
responsiveChart($('#weekday-chart'), dayData);
|
|
|
|
var monthData = chartData(#{@commits_per_month.keys.to_json}, #{@commits_per_month.values.to_json});
|
|
responsiveChart($('#month-chart'), monthData);
|
|
|
|
var data = #{@languages.to_json};
|
|
var ctx = $("#languages-chart").get(0).getContext("2d");
|
|
var options = {
|
|
scaleOverlay: true,
|
|
responsive: true,
|
|
maintainAspectRatio: false
|
|
}
|
|
var myPieChart = new Chart(ctx).Pie(data, options);
|