1 files changed, 56 insertions, 0 deletions

diff --git a/app/views/projects/pipelines/charts/_builds.haml b/app/views/projects/pipelines/charts/_builds.haml
new file mode 100644
index 00000000000..b6f453b9736
--- /dev/null
+++ b/app/views/projects/pipelines/charts/_builds.haml
@@ -0,0 +1,56 @@
+%h4 Pipelines charts
+%p
+   
+  %span.cgreen
+    = icon("circle")
+    success
+   
+  %span.cgray
+    = icon("circle")
+    all
+
+.prepend-top-default
+  %p.light
+    Jobs for last week
+    (#{date_from_to(Date.today - 7.days, Date.today)})
+  %canvas#weekChart{ height: 200 }
+
+.prepend-top-default
+  %p.light
+    Jobs for last month
+    (#{date_from_to(Date.today - 30.days, Date.today)})
+  %canvas#monthChart{ height: 200 }
+
+.prepend-top-default
+  %p.light
+    Jobs for last year
+  %canvas#yearChart.padded{ height: 250 }
+
+- [:week, :month, :year].each do |scope|
+  :javascript
+    var data = {
+      labels : #{@charts[scope].labels.to_json},
+      datasets : [
+        {
+          fillColor : "#7f8fa4",
+          strokeColor : "#7f8fa4",
+          pointColor : "#7f8fa4",
+          pointStrokeColor : "#EEE",
+          data : #{@charts[scope].total.to_json}
+        },
+        {
+          fillColor : "#44aa22",
+          strokeColor : "#44aa22",
+          pointColor : "#44aa22",
+          pointStrokeColor : "#fff",
+          data : #{@charts[scope].success.to_json}
+        }
+      ]
+    }
+    var ctx = $("##{scope}Chart").get(0).getContext("2d");
+    var options = { scaleOverlay: true, responsive: true, maintainAspectRatio: false };
+    if (window.innerWidth < 768) {
+      // Scale fonts if window width lower than 768px (iPad portrait)
+      options.scaleFontSize = 8
+    }
+    new Chart(ctx).Line(data, options);