| @@ -1,13 +1,18 | |||
|
|
1 | 1 | <%= javascript_include_tag 'raphael.js' %> |
|
|
2 | 2 | <%= javascript_include_tag 'revision_graph.js' %> |
|
|
3 | 3 | |
|
|
4 | 4 | <script type="text/javascript" charset="utf-8"> |
|
|
5 | Event.observe(window, 'load', function(){ | |
|
|
6 | revisionGraph( | |
|
|
7 | document.getElementById('holder'), | |
|
|
8 | <%= commits.to_json.html_safe %>, | |
|
|
9 | <%= space %>); | |
|
|
5 | ||
|
|
6 | ['load', 'resize'].each(function(window_event) { | |
|
|
7 | ||
|
|
8 | Event.observe(window, window_event, function(){ | |
|
|
9 | ||
|
|
10 | drawRevisionGraph( | |
|
|
11 | document.getElementById('holder'), | |
|
|
12 | <%= commits.to_json.html_safe %>, | |
|
|
13 | <%= space %>); | |
|
|
14 | }); | |
|
|
10 | 15 | }); |
|
|
11 | 16 | </script> |
|
|
12 | 17 | |
|
|
13 | 18 | <div id="holder" class="revision-graph" style="width: <%= (space + 1) * 20 %>px;"></div> |
| @@ -1,97 +1,104 | |||
|
|
1 | var revisionGraph = null; | |
|
|
1 | 2 |
|
|
|
2 | function revisionGraph(holder, commits_hash, graph_space) { | |
|
|
3 | function drawRevisionGraph(holder, commits_hash, graph_space) { | |
|
|
3 | 4 | |
|
|
4 | 5 | var XSTEP = 20, |
|
|
5 | 6 | CIRCLE_INROW_OFFSET = 10; |
|
|
6 | 7 | |
|
|
7 | 8 | var commits_by_scmid = $H(commits_hash), |
|
|
8 | 9 | commits = commits_by_scmid.values(); |
|
|
9 | 10 | |
|
|
10 | 11 | var max_rdmid = commits.length - 1; |
|
|
11 | 12 | |
|
|
12 | 13 | var commit_table_rows = $$('table.changesets tr.changeset'); |
|
|
13 | 14 | |
|
|
15 | // create graph | |
|
|
16 | if(revisionGraph != null) | |
|
|
17 | revisionGraph.clear(); | |
|
|
18 | else | |
|
|
19 | revisionGraph = Raphael(holder); | |
|
|
20 | ||
|
|
21 | var top = revisionGraph.set(); | |
|
|
22 | ||
|
|
14 | 23 | // init dimensions |
|
|
15 | 24 | var graph_offset = $(holder).getLayout().get('top'), |
|
|
16 | 25 | graph_width = (graph_space + 1) * XSTEP, |
|
|
17 | 26 | graph_height = commit_table_rows[max_rdmid].getLayout().get('top') + commit_table_rows[max_rdmid].getLayout().get('height') - graph_offset; |
|
|
18 | 27 | |
|
|
28 | revisionGraph.setSize(graph_width, graph_height); | |
|
|
19 | 29 | |
|
|
20 | 30 | // init colors |
|
|
21 | 31 | var colors = []; |
|
|
22 | for (var k = 0; k < graph_space + 1; k++) { | |
|
|
32 | Raphael.getColor.reset(); | |
|
|
33 | for (var k = 0; k <= graph_space; k++) { | |
|
|
23 | 34 | colors.push(Raphael.getColor()); |
|
|
24 | 35 | } |
|
|
25 | 36 | |
|
|
26 | // create graph | |
|
|
27 | var graph = Raphael(holder, graph_width, graph_height), | |
|
|
28 | top = graph.set(); | |
|
|
29 | ||
|
|
30 | 37 | var parent_commit; |
|
|
31 | 38 | var x, y, parent_x, parent_y; |
|
|
32 | 39 | var path, longrefs, shortrefs, label, labelBBox; |
|
|
33 | 40 | |
|
|
34 | 41 | commits.each(function(commit) { |
|
|
35 | 42 | |
|
|
36 | 43 | y = commit_table_rows[max_rdmid - commit.rdmid].getLayout().get('top') - graph_offset + CIRCLE_INROW_OFFSET; |
|
|
37 | 44 | x = XSTEP / 2 + XSTEP * commit.space; |
|
|
38 | 45 | |
|
|
39 |
|
|
|
|
46 | revisionGraph.circle(x, y, 3).attr({fill: colors[commit.space], stroke: 'none'}); | |
|
|
40 | 47 | |
|
|
41 | 48 | // title |
|
|
42 | 49 | if (commit.refs != null && commit.refs != '') { |
|
|
43 | 50 | longrefs = commit.refs; |
|
|
44 | 51 | shortrefs = longrefs.length > 15 ? longrefs.substr(0, 13) + '...' : longrefs; |
|
|
45 | 52 | |
|
|
46 |
label = |
|
|
|
53 | label = revisionGraph.text(x + 5, y + 5, shortrefs) | |
|
|
47 | 54 | .attr({ |
|
|
48 | 55 | font: '12px Fontin-Sans, Arial', |
|
|
49 | 56 | fill: '#666', |
|
|
50 | 57 | title: longrefs, |
|
|
51 | 58 | cursor: 'pointer', |
|
|
52 | 59 | rotation: '0'}); |
|
|
53 | 60 | |
|
|
54 | 61 | labelBBox = label.getBBox(); |
|
|
55 | 62 | label.translate(labelBBox.width / 2, -labelBBox.height / 3); |
|
|
56 | 63 | } |
|
|
57 | 64 | |
|
|
58 | 65 | // paths to parents |
|
|
59 | 66 | commit.parent_scmids.each(function(parent_scmid) { |
|
|
60 | 67 | parent_commit = commits_by_scmid.get(parent_scmid); |
|
|
61 | 68 | |
|
|
62 | 69 | if (parent_commit) { |
|
|
63 | 70 | parent_y = commit_table_rows[max_rdmid - parent_commit.rdmid].getLayout().get('top') - graph_offset + CIRCLE_INROW_OFFSET; |
|
|
64 | 71 | parent_x = XSTEP / 2 + XSTEP * parent_commit.space; |
|
|
65 | 72 | |
|
|
66 | 73 | if (parent_commit.space == commit.space) { |
|
|
67 | 74 | // vertical path |
|
|
68 |
path = |
|
|
|
75 | path = revisionGraph.path([ | |
|
|
69 | 76 | 'M', x, y, |
|
|
70 | 77 | 'V', parent_y]); |
|
|
71 | 78 | } else { |
|
|
72 | 79 | // path to a commit in a different branch (Bezier curve) |
|
|
73 |
path = |
|
|
|
80 | path = revisionGraph.path([ | |
|
|
74 | 81 | 'M', x, y, |
|
|
75 | 82 | 'C', x, y, x, y + (parent_y - y) / 2, x + (parent_x - x) / 2, y + (parent_y - y) / 2, |
|
|
76 | 83 | 'C', x + (parent_x - x) / 2, y + (parent_y - y) / 2, parent_x, parent_y-(parent_y-y)/2, parent_x, parent_y]); |
|
|
77 | 84 | } |
|
|
78 | 85 | } else { |
|
|
79 |
// vertical path ending at the bottom of the |
|
|
|
80 |
path = |
|
|
|
86 | // vertical path ending at the bottom of the revisionGraph | |
|
|
87 | path = revisionGraph.path([ | |
|
|
81 | 88 | 'M', x, y, |
|
|
82 | 89 | 'V', graph_height]); |
|
|
83 | 90 | } |
|
|
84 | 91 | path.attr({stroke: colors[commit.space], "stroke-width": 1.5}); |
|
|
85 | 92 | }); |
|
|
86 | 93 | |
|
|
87 |
top.push( |
|
|
|
94 | top.push(revisionGraph.circle(x, y, 10) | |
|
|
88 | 95 | .attr({ |
|
|
89 | 96 | fill: '#000', |
|
|
90 | 97 | opacity: 0, |
|
|
91 | 98 | cursor: 'pointer', |
|
|
92 | 99 | href: commit.href}) |
|
|
93 | 100 | .hover(function () {}, function () {})); |
|
|
94 | 101 | }); |
|
|
95 | 102 | |
|
|
96 | 103 | top.toFront(); |
|
|
97 | 104 | }; |
General Comments 0
You need to be logged in to leave comments.
Login now