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
|
import Raphael from 'raphael/raphael';
Raphael.prototype.commitTooltip = function commitTooltip(x, y, commit) {
const boxWidth = 300;
const icon = this.image(gon.relative_url_root + commit.author.icon, x, y, 20, 20);
const nameText = this.text(x + 25, y + 10, commit.author.name);
const idText = this.text(x, y + 35, commit.id);
const messageText = this.text(x, y + 50, commit.message.replace(/\r?\n/g, ' \n '));
const textSet = this.set(icon, nameText, idText, messageText).attr({
'text-anchor': 'start',
font: '12px Monaco, monospace',
});
nameText.attr({
font: '14px Arial',
'font-weight': 'bold',
});
idText.attr({
fill: '#AAA',
});
messageText.node.style['white-space'] = 'pre';
this.textWrap(messageText, boxWidth - 50);
const rect = this.rect(x - 10, y - 10, boxWidth, 100, 4).attr({
fill: '#FFF',
stroke: '#000',
'stroke-linecap': 'round',
'stroke-width': 2,
});
const tooltip = this.set(rect, textSet);
rect.attr({
height: tooltip.getBBox().height + 10,
width: tooltip.getBBox().width + 10,
});
tooltip.transform(['t', 20, 20]);
return tooltip;
};
Raphael.prototype.textWrap = function testWrap(t, width) {
const content = t.attr('text');
const abc = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
t.attr({
text: abc,
});
const letterWidth = t.getBBox().width / abc.length;
t.attr({
text: content,
});
const words = content.split(' ');
let x = 0;
const s = [];
for (let j = 0, len = words.length; j < len; j += 1) {
const word = words[j];
if (x + word.length * letterWidth > width) {
s.push('\n');
x = 0;
}
if (word === '\n') {
s.push('\n');
x = 0;
} else {
s.push(`${word} `);
x += word.length * letterWidth;
}
}
t.attr({
text: s.join('').trim(),
});
const b = t.getBBox();
const h = Math.abs(b.y2) + 1;
return t.attr({
y: h,
});
};
export default Raphael;
|