blob: 91b8f6a617646cde68bf96ec6b85d3afb84e6af2 (
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
|
<%
matches = @tournament_stage.matches_ordered
# depth of SVG tree
depth = Math.log2(matches.count).floor+1;
# height of SVG
height = 200 * 2**Math.log2(matches.count).floor + 100;
lastrx = 0
lastry = 0
lastrh = 0
lastrw = 0
%><svg version="1.1" baseProfile="full"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
width="100%" height="<%= height = [height, 500].max %>">
<% %>
<defs>
<radialGradient id="gradMatch" cx="50%" cy="50%" r="80%" fx="80%" fy="80%">
<stop offset="0%" style="stop-color:#ffd281; stop-opacity:0" />
<stop offset="100%" style="stop-color:#ccc;stop-opacity:1" />
</radialGradient>
</defs>
<% (1..matches.count).each do |i| %>
<a id="svg-match-<%= i %>" xlink:href="<%= match_path(matches[i-1]) %>">
<rect height="<%= rh = 100/(2**(depth-1)+1) - 5 %>%"
width="<%= rw = 100/(depth+1) - 5 %>%"
x="<%= rx = 50/(depth+1) + 100/(depth+1)*(depth-(Math.log2(i).floor+1)) %>%"
y="<%= ry = ( 100/(2**(Math.log2(i).floor)+1) + rh * 1.1 * (2**Math.log2(i).ceil-i)) %>%"
fill="url(#gradMatch)"
rx="5px"
stroke-width="2"
<% case matches[i-1].status %>
<% when 0 %>
<% if matches[i-1].teams.count < @tournament_stage.tournament.min_teams_per_match %>
stroke="red"
fill-opacity="0.6"
<% else %>
stroke="green"
<% end %>
<% when 1 %>
stroke="orange"
<% when 2 %>
stroke="yellow"
<% when 3 %>
stroke="grey"
<% end %> />
<rect width="<%= rw-5 %>%" height="<%= rh/4 %>%" x="<%= rx + 2.5 %>%" y="<%= ry + rh/6 %>%" fill="<%= matches[i-1].teams.first and matches[i-1].teams.first.users.include?(current_user) ? "#BCED91" : "white" %>" />
<text x="<%= rx + rw/4 %>%" y="<%= ry + rh/3 %>%" font-size="<%= rh %>">
<% if matches[i-1].teams.first %>
Team <%= matches[i-1].teams.first.id %>
<% end %>
</text>
<text x="<%= rx + 1.3*rw/3 %>%" y="<%= ry + 5.2*rh/9 %>%" font-size="<%= rh %>"> VS </text>
<rect width="<%= rw-5 %>%" height="<%= rh/4 %>%" x="<%= rx + 2.5 %>%" y="<%= ry + 3*rh/5 %>%" fill="<%= matches[i-1].teams[1] and matches[i-1].teams[1].users.include?(current_user) ? "#BCED91" : "white" %>" />
<text x="<%= rx + rw/4 %>%" y="<%= ry + 4*rh/5 %>%" font-size="<%= rh %>">
<% if matches[i-1].teams[1] %>
Team <%= matches[i-1].teams[1].id %>
<% end %>
</text>
<% if i > 1 %>
<line x1="<%= rx+rw %>%" y1="<%= ry+rh/2 %>%" x2="<%= lastrx %>%" y2="<%= lastry+lastrh/2 %>%" stroke="black" stroke-width="2" >
<% end %>
<% if Math.log2(i+1) == Math.log2(i+1).ceil %>
<% lastrx = rx
lastry = ry
lastrh = rh
lastrw = rw %>
<% end %>
</a>
<% end %>
</svg>
|
