Improve Continuous Integration graphs page
* fix commit duration graph * make graphs responsive * fix wrong padding * add a bit of explanation to colors Signed-off-by: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>
This commit is contained in:
parent
354b69dde2
commit
1b7a2fc536
|
@ -1,10 +1,16 @@
|
|||
- page_title "Continuous Integration", "Graphs"
|
||||
= render "header_title"
|
||||
= render 'head'
|
||||
.gray-content-block
|
||||
%ul.breadcrumb.repo-breadcrumb
|
||||
= commits_breadcrumbs
|
||||
.gray-content-block.append-bottom-default
|
||||
.oneline
|
||||
A collection of graphs for Continuous Integration
|
||||
|
||||
#charts.ci-charts
|
||||
.row
|
||||
.col-md-6
|
||||
= render 'projects/graphs/ci/overall'
|
||||
.col-md-6
|
||||
= render 'projects/graphs/ci/build_times'
|
||||
|
||||
%hr
|
||||
= render 'projects/graphs/ci/builds'
|
||||
= render 'projects/graphs/ci/build_times'
|
||||
= render 'projects/graphs/ci/overall'
|
||||
|
|
|
@ -1,21 +1,22 @@
|
|||
%fieldset
|
||||
%legend
|
||||
%div
|
||||
%p.light
|
||||
Commit duration in minutes for last 30 commits
|
||||
|
||||
%canvas#build_timesChart.padded{width: 800, height: 300}
|
||||
%canvas#build_timesChart{height: 200}
|
||||
|
||||
:javascript
|
||||
var data = {
|
||||
labels : #{@charts[:build_times].labels.to_json},
|
||||
datasets : [
|
||||
{
|
||||
fillColor : "#4A3",
|
||||
strokeColor : "rgba(151,187,205,1)",
|
||||
pointColor : "rgba(151,187,205,1)",
|
||||
pointStrokeColor : "#fff",
|
||||
fillColor : "rgba(220,220,220,0.5)",
|
||||
strokeColor : "rgba(220,220,220,1)",
|
||||
barStrokeWidth: 1,
|
||||
barValueSpacing: 1,
|
||||
barDatasetSpacing: 1,
|
||||
data : #{@charts[:build_times].build_times.to_json}
|
||||
}
|
||||
]
|
||||
}
|
||||
var ctx = $("#build_timesChart").get(0).getContext("2d");
|
||||
new Chart(ctx).Line(data,{"scaleOverlay": true});
|
||||
new Chart(ctx).Bar(data,{"scaleOverlay": true, responsive: true, maintainAspectRatio: false});
|
||||
|
|
|
@ -1,20 +1,30 @@
|
|||
%fieldset
|
||||
%legend
|
||||
Builds chart for last week
|
||||
%h4 Build charts
|
||||
%p
|
||||
|
||||
%span.cgreen
|
||||
= icon("circle")
|
||||
success
|
||||
|
||||
%span.cgray
|
||||
= icon("circle")
|
||||
all
|
||||
|
||||
.prepend-top-default
|
||||
%p.light
|
||||
Builds for last week
|
||||
(#{date_from_to(Date.today - 7.days, Date.today)})
|
||||
%canvas#weekChart{height: 200}
|
||||
|
||||
%canvas#weekChart.padded{width: 800, height: 200}
|
||||
|
||||
%fieldset
|
||||
%legend
|
||||
.prepend-top-default
|
||||
%p.light
|
||||
Builds chart for last month
|
||||
(#{date_from_to(Date.today - 30.days, Date.today)})
|
||||
%canvas#monthChart{height: 200}
|
||||
|
||||
%canvas#monthChart.padded{width: 800, height: 300}
|
||||
|
||||
%fieldset
|
||||
%legend Builds chart for last year
|
||||
%canvas#yearChart.padded{width: 800, height: 400}
|
||||
.prepend-top-default
|
||||
%p.light
|
||||
Builds chart for last year
|
||||
%canvas#yearChart.padded{height: 250}
|
||||
|
||||
- [:week, :month, :year].each do |scope|
|
||||
:javascript
|
||||
|
@ -22,20 +32,20 @@
|
|||
labels : #{@charts[scope].labels.to_json},
|
||||
datasets : [
|
||||
{
|
||||
fillColor : "rgba(220,220,220,0.5)",
|
||||
strokeColor : "rgba(220,220,220,1)",
|
||||
pointColor : "rgba(220,220,220,1)",
|
||||
fillColor : "#7f8fa4",
|
||||
strokeColor : "#7f8fa4",
|
||||
pointColor : "#7f8fa4",
|
||||
pointStrokeColor : "#EEE",
|
||||
data : #{@charts[scope].total.to_json}
|
||||
},
|
||||
{
|
||||
fillColor : "#4A3",
|
||||
strokeColor : "rgba(151,187,205,1)",
|
||||
pointColor : "rgba(151,187,205,1)",
|
||||
fillColor : "#44aa22",
|
||||
strokeColor : "#44aa22",
|
||||
pointColor : "#44aa22",
|
||||
pointStrokeColor : "#fff",
|
||||
data : #{@charts[scope].success.to_json}
|
||||
}
|
||||
]
|
||||
}
|
||||
var ctx = $("##{scope}Chart").get(0).getContext("2d");
|
||||
new Chart(ctx).Line(data,{"scaleOverlay": true});
|
||||
new Chart(ctx).Line(data,{"scaleOverlay": true, responsive: true, maintainAspectRatio: false});
|
||||
|
|
|
@ -1,22 +1,20 @@
|
|||
- ci_project = @project.gitlab_ci_project
|
||||
%fieldset
|
||||
%legend Overall
|
||||
%p
|
||||
%h4 Overall stats
|
||||
%ul
|
||||
%li
|
||||
Total:
|
||||
%strong= pluralize ci_project.builds.count(:all), 'build'
|
||||
%p
|
||||
%li
|
||||
Successful:
|
||||
%strong= pluralize ci_project.builds.success.count(:all), 'build'
|
||||
%p
|
||||
%li
|
||||
Failed:
|
||||
%strong= pluralize ci_project.builds.failed.count(:all), 'build'
|
||||
|
||||
%p
|
||||
%li
|
||||
Success ratio:
|
||||
%strong
|
||||
#{success_ratio(ci_project.builds.success, ci_project.builds.failed)}%
|
||||
|
||||
%p
|
||||
%li
|
||||
Commits covered:
|
||||
%strong
|
||||
= ci_project.commits.count(:all)
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
= render "header_title"
|
||||
= render 'head'
|
||||
|
||||
.gray-content-block
|
||||
.gray-content-block.append-bottom-default
|
||||
.tree-ref-holder
|
||||
= render 'shared/ref_switcher', destination: 'graphs_commits'
|
||||
%ul.breadcrumb.repo-breadcrumb
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
= render "header_title"
|
||||
= render 'head'
|
||||
|
||||
.gray-content-block
|
||||
.gray-content-block.append-bottom-default
|
||||
.tree-ref-holder
|
||||
= render 'shared/ref_switcher', destination: 'graphs'
|
||||
%ul.breadcrumb.repo-breadcrumb
|
||||
|
|
|
@ -60,7 +60,8 @@ module Ci
|
|||
|
||||
class BuildTime < Chart
|
||||
def collect
|
||||
commits = project.commits.joins(:builds).where("#{Ci::Build.table_name}.finished_at is NOT NULL AND #{Ci::Build.table_name}.started_at is NOT NULL").last(30)
|
||||
commits = project.commits.last(30)
|
||||
|
||||
commits.each do |commit|
|
||||
@labels << commit.short_sha
|
||||
@build_times << (commit.duration / 60)
|
||||
|
|
Loading…
Reference in New Issue