summaryrefslogtreecommitdiff
path: root/app/views/projects/graphs/commits.html.haml
blob: 55cec0e7dc58d06149ec2510da7c83bbfa70c07b (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
- page_title "提交", "图表"
= render "header_title"
= render 'head'

.gray-content-block.append-bottom-default
  .tree-ref-holder
    = render 'shared/ref_switcher', destination: 'graphs_commits'
  %ul.breadcrumb.repo-breadcrumb
    = commits_breadcrumbs

%p.lead
  提交统计
  %strong #{@ref}
  #{@commits_graph.start_date.strftime('%m-%d')} - #{@commits_graph.end_date.strftime('%m-%d')}

.row
  .col-md-6
    %ul
      %li
        %p.lead
          %strong #{@commits_graph.commits.size}
          次提交花费
          %strong #{@commits_graph.duration}
          天
      %li
        %p.lead
          平均每天
          %strong #{@commits_graph.commit_per_day}
          次提交
      %li
        %p.lead
          贡献者
          %strong #{@commits_graph.authors}
          人
  .col-md-6
    %div
      %p.slead
        每月按天提交数
      %canvas#month-chart
.row
  .col-md-6
    %div
      %p.slead
        每天按小时提交数 (UTC)
      %canvas#hour-chart
  .col-md-6
    %div
      %p.slead
        每周按天提交数
      %canvas#weekday-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());
      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);