Merge branch 'bar-graphs' into 'master'

Change plots to bar graphs

Since line plot does not make sense for this kind of plots, change them to bar graphs. Bar graphs are easier to read and they look cool too.

I would like to change commits per author plots to bar graphs too, but code looks too messy to modify.

See merge request !645

CHANGELOG

@@ -307,6 +307,7 @@ v 7.11.0
   - Protect OmniAuth request phase against CSRF.
   - Don't send notifications to mentioned users that don't have access to the project in question.
   - Add search issues/MR by number
+  - Change plots to bar graphs in commit statistics screen
   - Move snippets UI to fluid layout
   - Improve UI for sidebar. Increase separation between navigation and content
   - Improve new project command options (Ben Bodenmiller)

app/views/projects/graphs/commits.html.haml

@@ -50,39 +50,42 @@
     datasets : [{
       fillColor : "rgba(220,220,220,0.5)",
       strokeColor : "rgba(220,220,220,1)",
-      pointColor : "rgba(220,220,220,1)",
-      pointStrokeColor : "#EEE",
+      barStrokeWidth: 1,
+      barValueSpacing: 1,
+      barDatasetSpacing: 1,
       data : #{@commits_per_time.values.to_json}
     }]
   }
 
   ctx = $("#hour-chart").get(0).getContext("2d");
-  new Chart(ctx).Line(data,{"scaleOverlay": true, responsive: true, pointHitDetectionRadius: 2})
+  new Chart(ctx).Bar(data,{"scaleOverlay": true, responsive: true, pointHitDetectionRadius: 2})
 
   data = {
     labels : #{@commits_per_week_days.keys.to_json},
     datasets : [{
       fillColor : "rgba(220,220,220,0.5)",
       strokeColor : "rgba(220,220,220,1)",
-      pointColor : "rgba(220,220,220,1)",
-      pointStrokeColor : "#EEE",
+      barStrokeWidth: 1,
+      barValueSpacing: 1,
+      barDatasetSpacing: 1,
       data : #{@commits_per_week_days.values.to_json}
     }]
   }
 
   ctx = $("#weekday-chart").get(0).getContext("2d");
-  new Chart(ctx).Line(data,{"scaleOverlay": true, responsive: true, pointHitDetectionRadius: 2})
+  new Chart(ctx).Bar(data,{"scaleOverlay": true, responsive: true, pointHitDetectionRadius: 2})
 
   data = {
     labels : #{@commits_per_month.keys.to_json},
     datasets : [{
       fillColor : "rgba(220,220,220,0.5)",
       strokeColor : "rgba(220,220,220,1)",
-      pointColor : "rgba(220,220,220,1)",
-      pointStrokeColor : "#EEE",
+      barStrokeWidth: 1,
+      barValueSpacing: 1,
+      barDatasetSpacing: 1,
       data : #{@commits_per_month.values.to_json}
     }]
   }
 
   ctx = $("#month-chart").get(0).getContext("2d");
-  new Chart(ctx).Line(data, {"scaleOverlay": true, responsive: true, pointHitDetectionRadius: 2})
+  new Chart(ctx).Bar(data, {"scaleOverlay": true, responsive: true, pointHitDetectionRadius: 2})