some more graphics

1 files changed, 46 insertions, 34 deletions

diff --git a/app/views/matches/index.html.erb b/app/views/matches/index.html.erb
index 031b2a9..6fd831f 100644
--- a/app/views/matches/index.html.erb
+++ b/app/views/matches/index.html.erb
@@ -27,38 +27,50 @@
 <br>
 
 <div id="match-tree">
-<SVG version="1.1"
-   baseProfile="full"
-   width="<%= @width %>" height="<%= @height = [@height, 500].max %>"
-   xmlns="http://www.w3.org/2000/svg">
-   <line x1="300" y1="0" x2="300" y2="<%= @height %>" stroke="black" />
-   <% (1..@matches.count).each do |i| %>
-    <g class="svg-match">
-      <rect height="120px" width="213px" 
-          x="<%= @width - (i-1)*50 -  250*(Math.log2(i).floor+1) %>"
-          y="<%= (@height/(Math.log2(i).floor+2)) - 60 + 250*(i - 2**(Math.log2(i).floor)) %>"
-          fill="#ffd281"
-          rx="20px"
-          stroke-width="2"
-          <% case @matches[i-1].status %>
-          <% when 0 %>
-            <% if @matches[i-1].teams.count < @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 %>
-          />
-    </g>
-   <% end %>
-
-
+  <SVG version="1.1"
+  baseProfile="full"
+  width="<%= @width %>" height="<%= @height = [@height, 500].max %>"
+  xmlns="http://www.w3.org/2000/svg">
+   <script type="text/ecmascript"><![CDATA[
+    function redirect(i){
+      window.location.replace("<%= request.original_url %>"+"/"+i);
+    }
+    ]]>
+  </script>
+  <% (1..@matches.count).each do |i| %>
+  <g id="svg-match-<%= i %>" onmouseover="dispStats(<%= i %>)" onclick="redirect(<%= @matches[i-1].id %>)" cursor="pointer">
+    <rect height="120px" width="213px" 
+    x="<%= @width - (i-1)*50 - 250*(Math.log2(i).floor+1) %>"
+    y="<%= (@height/(Math.log2(i).floor+2)) - 60 + 250*(i - 2**(Math.log2(i).floor)) %>"
+    fill="#ffd281"
+    rx="20px"
+    stroke-width="2"
+    <% case @matches[i-1].status %>
+    <% when 0 %>
+    <% if @matches[i-1].teams.count < @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 %>
+    />
+  </g>
+  <% if i > 1 %>
+  <line 
+  stroke="black"
+  x1="<%= @width - (i-2)*50 -  250*(Math.log2(i-1).floor+1) %>"
+  y1="<%= (@height/(Math.log2(i-1).floor+2)) - 60 + 250*((i-1) - 2**(Math.log2(i-1).floor)) + 60 %>"
+  x2="<%= @width - (i-1)*50 -  250*(Math.log2(i).floor+1) + 213 %>"
+  y2="<%= (@height/(Math.log2(i).floor+2)) - 60 + 250*(i - 2**(Math.log2(i).floor)) + 60 %>"
+  />
+  <% end %>
+  <% end %>
 </SVG>
-</div>
\ No newline at end of file
+</div>