To check out this repository please hg clone the following URL, or open the URL using EasyMercurial or your preferred Mercurial client.
root / public / javascripts / revision_graph.js @ 912:5e80956cc792
History | View | Annotate | Download (6.72 KB)
| 1 | 909:cbb26bc654de | Chris | var commits = chunk.commits,
|
|---|---|---|---|
| 2 | comms = {},
|
||
| 3 | pixelsX = [], |
||
| 4 | pixelsY = [], |
||
| 5 | mmax = Math.max, |
||
| 6 | max_rdmid = 0,
|
||
| 7 | max_space = 0,
|
||
| 8 | parents = {};
|
||
| 9 | for (var i = 0, ii = commits.length; i < ii; i++) { |
||
| 10 | for (var j = 0, jj = commits[i].parents.length; j < jj; j++) { |
||
| 11 | parents[commits[i].parents[j][0]] = true; |
||
| 12 | } |
||
| 13 | max_rdmid = Math.max(max_rdmid, commits[i].rdmid); |
||
| 14 | max_space = Math.max(max_space, commits[i].space); |
||
| 15 | } |
||
| 16 | |||
| 17 | for (i = 0; i < ii; i++) { |
||
| 18 | if (commits[i].scmid in parents) { |
||
| 19 | commits[i].isParent = true;
|
||
| 20 | } |
||
| 21 | comms[commits[i].scmid] = commits[i]; |
||
| 22 | } |
||
| 23 | var colors = ["#000"]; |
||
| 24 | for (var k = 0; k < max_space; k++) { |
||
| 25 | colors.push(Raphael.getColor()); |
||
| 26 | } |
||
| 27 | |||
| 28 | function branchGraph(holder) { |
||
| 29 | var xstep = 20; |
||
| 30 | var ystep = $$('tr.changeset')[0].getHeight(); |
||
| 31 | var ch, cw;
|
||
| 32 | cw = max_space * xstep + xstep; |
||
| 33 | ch = max_rdmid * ystep + ystep; |
||
| 34 | var r = Raphael("holder", cw, ch), |
||
| 35 | top = r.set(); |
||
| 36 | var cuday = 0, cumonth = ""; |
||
| 37 | |||
| 38 | for (i = 0; i < ii; i++) { |
||
| 39 | var x, y;
|
||
| 40 | y = 10 + ystep *(max_rdmid - commits[i].rdmid);
|
||
| 41 | x = 3 + xstep * commits[i].space;
|
||
| 42 | var stroke = "none"; |
||
| 43 | r.circle(x, y, 3).attr({fill: colors[commits[i].space], stroke: stroke}); |
||
| 44 | if (commits[i].refs != null && commits[i].refs != "") { |
||
| 45 | var longrefs = commits[i].refs
|
||
| 46 | var shortrefs = commits[i].refs;
|
||
| 47 | if (shortrefs.length > 15) { |
||
| 48 | shortrefs = shortrefs.substr(0,13) + "..."; |
||
| 49 | } |
||
| 50 | var t = r.text(x+5,y+5,shortrefs).attr({font: "12px Fontin-Sans, Arial", fill: "#666", |
||
| 51 | title: longrefs, cursor: "pointer", rotation: "0"}); |
||
| 52 | |||
| 53 | var textbox = t.getBBox();
|
||
| 54 | t.translate(textbox.width / 2, textbox.height / -3); |
||
| 55 | } |
||
| 56 | for (var j = 0, jj = commits[i].parents.length; j < jj; j++) { |
||
| 57 | var c = comms[commits[i].parents[j][0]]; |
||
| 58 | var p,arrow;
|
||
| 59 | if (c) {
|
||
| 60 | var cy, cx;
|
||
| 61 | cy = 10 + ystep * (max_rdmid - c.rdmid),
|
||
| 62 | cx = 3 + xstep * c.space;
|
||
| 63 | |||
| 64 | if (c.space == commits[i].space) {
|
||
| 65 | p = r.path("M" + x + "," + y + "L" + cx + "," + cy); |
||
| 66 | } else {
|
||
| 67 | p = r.path(["M", x, y, "C",x,y,x, y+(cy-y)/2,x+(cx-x)/2, y+(cy-y)/2, |
||
| 68 | "C", x+(cx-x)/2,y+(cy-y)/2, cx, cy-(cy-y)/2, cx, cy]); |
||
| 69 | } |
||
| 70 | } else {
|
||
| 71 | p = r.path("M" + x + "," + y + "L" + x + "," + ch); |
||
| 72 | } |
||
| 73 | p.attr({stroke: colors[commits[i].space], "stroke-width": 1.5});
|
||
| 74 | } |
||
| 75 | (function (c, x, y) {
|
||
| 76 | top.push(r.circle(x, y, 10).attr({fill: "#000", opacity: 0, |
||
| 77 | cursor: "pointer", href: commits[i].href}) |
||
| 78 | .hover(function () {}, function () {}) |
||
| 79 | ); |
||
| 80 | }(commits[i], x, y)); |
||
| 81 | } |
||
| 82 | top.toFront(); |
||
| 83 | var hw = holder.offsetWidth,
|
||
| 84 | hh = holder.offsetHeight, |
||
| 85 | drag, |
||
| 86 | dragger = function (e) { |
||
| 87 | if (drag) {
|
||
| 88 | e = e || window.event; |
||
| 89 | holder.scrollLeft = drag.sl - (e.clientX - drag.x); |
||
| 90 | holder.scrollTop = drag.st - (e.clientY - drag.y); |
||
| 91 | } |
||
| 92 | }; |
||
| 93 | holder.onmousedown = function (e) { |
||
| 94 | e = e || window.event; |
||
| 95 | drag = {x: e.clientX, y: e.clientY, st: holder.scrollTop, sl: holder.scrollLeft};
|
||
| 96 | document.onmousemove = dragger; |
||
| 97 | }; |
||
| 98 | document.onmouseup = function () { |
||
| 99 | drag = false;
|
||
| 100 | document.onmousemove = null;
|
||
| 101 | }; |
||
| 102 | holder.scrollLeft = cw; |
||
| 103 | }; |
||
| 104 | |||
| 105 | Raphael.fn.popupit = function (x, y, set, dir, size) { |
||
| 106 | dir = dir == null ? 2 : dir; |
||
| 107 | size = size || 5;
|
||
| 108 | x = Math.round(x); |
||
| 109 | y = Math.round(y); |
||
| 110 | var bb = set.getBBox(),
|
||
| 111 | w = Math.round(bb.width / 2),
|
||
| 112 | h = Math.round(bb.height / 2),
|
||
| 113 | dx = [0, w + size * 2, 0, -w - size * 2], |
||
| 114 | dy = [-h * 2 - size * 3, -h - size, 0, -h - size], |
||
| 115 | p = ["M", x - dx[dir], y - dy[dir], "l", -size, (dir == 2) * -size, -mmax(w - size, 0), |
||
| 116 | 0, "a", size, size, 0, 0, 1, -size, -size, |
||
| 117 | "l", 0, -mmax(h - size, 0), (dir == 3) * -size, -size, (dir == 3) * size, -size, 0, |
||
| 118 | -mmax(h - size, 0), "a", size, size, 0, 0, 1, size, -size, |
||
| 119 | "l", mmax(w - size, 0), 0, size, !dir * -size, size, !dir * size, mmax(w - size, 0), |
||
| 120 | 0, "a", size, size, 0, 0, 1, size, size, |
||
| 121 | "l", 0, mmax(h - size, 0), (dir == 1) * size, size, (dir == 1) * -size, size, 0, |
||
| 122 | mmax(h - size, 0), "a", size, size, 0, 0, 1, -size, size, |
||
| 123 | "l", -mmax(w - size, 0), 0, "z"].join(","), |
||
| 124 | xy = [{x: x, y: y + size * 2 + h},
|
||
| 125 | {x: x - size * 2 - w, y: y},
|
||
| 126 | {x: x, y: y - size * 2 - h},
|
||
| 127 | {x: x + size * 2 + w, y: y}]
|
||
| 128 | [dir]; |
||
| 129 | set.translate(xy.x - w - bb.x, xy.y - h - bb.y); |
||
| 130 | return this.set(this.path(p).attr({fill: "#234", stroke: "none"}) |
||
| 131 | .insertBefore(set.node ? set : set[0]), set);
|
||
| 132 | }; |
||
| 133 | |||
| 134 | Raphael.fn.popup = function (x, y, text, dir, size) { |
||
| 135 | dir = dir == null ? 2 : dir > 3 ? 3 : dir; |
||
| 136 | size = size || 5;
|
||
| 137 | text = text || "$9.99";
|
||
| 138 | var res = this.set(), |
||
| 139 | d = 3;
|
||
| 140 | res.push(this.path().attr({fill: "#000", stroke: "#000"})); |
||
| 141 | res.push(this.text(x, y, text).attr(this.g.txtattr).attr({fill: "#fff", "font-family": "Helvetica, Arial"})); |
||
| 142 | res.update = function (X, Y, withAnimation) { |
||
| 143 | X = X || x; |
||
| 144 | Y = Y || y; |
||
| 145 | var bb = this[1].getBBox(), |
||
| 146 | w = bb.width / 2,
|
||
| 147 | h = bb.height / 2,
|
||
| 148 | dx = [0, w + size * 2, 0, -w - size * 2], |
||
| 149 | dy = [-h * 2 - size * 3, -h - size, 0, -h - size], |
||
| 150 | p = ["M", X - dx[dir], Y - dy[dir], "l", -size, (dir == 2) * -size, |
||
| 151 | -mmax(w - size, 0), 0, "a", size, size, 0, 0, 1, -size, -size, |
||
| 152 | "l", 0, -mmax(h - size, 0), (dir == 3) * -size, -size, (dir == 3) * size, -size, |
||
| 153 | 0, -mmax(h - size, 0), "a", size, size, 0, 0, 1, size, -size, |
||
| 154 | "l", mmax(w - size, 0), 0, size, !dir * -size, size, !dir * size, mmax(w - size, 0), |
||
| 155 | 0, "a", size, size, 0, 0, 1, size, size, |
||
| 156 | "l", 0, mmax(h - size, 0), (dir == 1) * size, size, (dir == 1) * -size, size, 0, |
||
| 157 | mmax(h - size, 0), "a", size, size, 0, 0, 1, -size, size, |
||
| 158 | "l", -mmax(w - size, 0), 0, "z"].join(","), |
||
| 159 | xy = [{x: X, y: Y + size * 2 + h},
|
||
| 160 | {x: X - size * 2 - w, y: Y},
|
||
| 161 | {x: X, y: Y - size * 2 - h},
|
||
| 162 | {x: X + size * 2 + w, y: Y}]
|
||
| 163 | [dir]; |
||
| 164 | xy.path = p; |
||
| 165 | if (withAnimation) {
|
||
| 166 | this.animate(xy, 500, ">"); |
||
| 167 | } else {
|
||
| 168 | this.attr(xy);
|
||
| 169 | } |
||
| 170 | return this; |
||
| 171 | }; |
||
| 172 | return res.update(x, y);
|
||
| 173 | }; |