* Fix drawing the arrows on the chart so it works with jQuery (Redmin…

…e 2.1.0+) instead of Prototype.

* Some other minor drawing adjustments.

app/views/gantts/show.html.erb

@@ -42,8 +42,8 @@
 
   subject_width = 330
   header_heigth = 18
+  line_height = 18
 
-  headers_height = header_heigth
   show_years = true
   show_weeks = false
   show_days  = false
@@ -55,7 +55,7 @@
     show_weeks = true
     if @gantt.zoom > 2
       show_days = true
-      headers_height = (2.75 * header_heigth).to_i
+      headers_height = (3 * header_heigth).to_i
       if @gantt.zoom > 3
         show_day_numbers = true
         headers_height = (3.25 * header_heigth).to_i
@@ -69,8 +69,9 @@
                 :zoom => zoom,
                 :g_width => g_width,
                 :subject_width => subject_width)
-  g_height = [(18 * (@gantt.number_of_rows + 6)) + 0, 208 ].max
-  t_height = g_height + headers_height
+  g_height = [(line_height * (@gantt.number_of_rows + 6)) + 0, 208 ].max
+  t_height = g_height + headers_height;
+  s_height = 24;
 %>
 
 <% if @gantt.truncated %>
@@ -83,7 +84,7 @@
   <%
     style  = ""
     style += "position:relative;"
-    style += "height: #{t_height + 24}px;"
+    style += "height: #{t_height + s_height}px;"
     style += "width: #{subject_width + 1}px;"
   %>
   <%= content_tag(:div, :style => style) do %>
@@ -111,7 +112,7 @@
 </td>
 
 <td>
-<div style="position:relative;height:<%= t_height + 24 %>px;overflow:auto;">
+<div id="gantt_lines" style="position:relative;height:<%= t_height + s_height %>px;overflow:auto;">
 <%
   style  = ""
   style += "width: #{g_width - 1}px;"
@@ -328,4 +329,4 @@
 <% end %>
 
 <% html_title(l(:label_gantt)) -%>
-<%= javascript_tag("window.redrawGanttArrows()") -%>
+<%= javascript_tag("window.redrawGanttArrows()") -%>

assets/javascripts/compile_coffee.bat

@@ -0,0 +1,19 @@
+@echo off
+set script=raphael.arrow
+
+cmd /c "coffee -v"
+echo.
+if not (%errorlevel%) == (0) (
+  cls
+  color 0e
+  echo. &echo. &echo.
+  echo ====================================================================
+  echo   This script requires installation of the CoffeeScript compiler.
+  echo   Refer to coffeescript.org for details.
+  echo ====================================================================
+  echo. &echo. &echo.
+) else (
+  echo Watching %script%.coffee for changes...
+  coffee -l -w -c %script%
+)
+pause

assets/javascripts/raphael.arrow.coffee

@@ -11,22 +11,30 @@ Raphael.fn.ganttArrow = (coords, relationType = "follows") ->
     "duplicated": "- "
     "blocked": "-"
     "relates": "."
-
+
+  # Shorthand functions for formatting SVG commands
+  cmd = (cmd, a...) ->  cmd.concat(" ", a.join(" "), " ")
+  M = (x, y) -> cmd("M", x, y)
+  m = (x, y) -> cmd("m", x, y)
+  L1 = (x1, y1) -> cmd("L", x1, y1)
+  l2 = (x1, y1, x2, y2) -> cmd("l", x1, y1, x2, y2)
+
   line = (x1, y1, x2, y2) ->
-    ["M", x1, y1, "L", x2, y2]
+    M(x1, y1) + L1(x2, y2)
 
   triangle = (cx, cy, r) ->
-    r *= 1.75
-    "M".concat(cx, ",", cy, "m0-", r * .58, "l", r * .5, ",", r * .87, "-", r, ",0z")
+    r *= 1.5
+    "".concat(M(cx,cy), m(0,-1*r*.58), l2(r*.5, r*.87, -r, 0), " z")
 
   [x1, y1, x6, y6] = coords
+  x1 += 3
 
   arrow = @set()
 
-  deltaX = 6
+  deltaX = 7
   deltaY = 8
 
-  [x2, y2] = [x1 + deltaX, y1]
+  [x2, y2] = [x1 + deltaX - 3, y1]
   [x5, y5] = [x6 - deltaX, y6]
 
   if y1 < y6
@@ -38,7 +46,7 @@ Raphael.fn.ganttArrow = (coords, relationType = "follows") ->
     [x4, y4] = [x3, y5]
   else
     [x4, y4] = [x5, y3]
-  
+
   arrow.push @path(line(x1, y1, x2, y2))
   arrow.push @path(line(x2, y2, x3, y3))
   arrow.push @path(line(x3, y3, x4, y4))
@@ -47,32 +55,36 @@ Raphael.fn.ganttArrow = (coords, relationType = "follows") ->
   arrowhead = arrow.push(@path(triangle(x6 + deltaX - 5, y6 + 1, 5)).rotate(90))
   arrow.toFront()
   arrow.attr({fill: "#444", stroke: "#222", "stroke-dasharray": relationDash[relationType]})
-
 ###
 Draws connection arrows over the gantt chart
 ###
 window.redrawGanttArrows = () ->
   paper = Raphael("gantt_lines", "100%", "100%") # check out 'gantt_lines' div, margin-right: -2048px FTW!
   paper.clear
   window.paper = paper
+  paper.canvas.style.position = "absolute"
+  paper.canvas.style.zIndex = "50"
 
   # Relation attributes
   relationAttrs = ["follows", "blocked", "duplicated", "relates"]
 
   # Calculates arrow coordinates
   calculateAnchors = (from, to) ->
-    [fromOffsetX, fromOffsetY] = from.positionedOffset()
-    [toOffsetX, toOffsetY]     = to.positionedOffset()
-    if to.hasClassName('parent')
+    to = $('#'+to.id)
+    [fromOffsetX, fromOffsetY] = [from.position().left, from.position().top]
+    [toOffsetX, toOffsetY]     = [to.position().left, to.position().top]
+    if to.hasClass('parent')
       typeOffsetX = 10
     else
       typeOffsetX = 6
-    [fromOffsetX + from.getWidth() - 1, fromOffsetY + from.getHeight()/2, toOffsetX - typeOffsetX, toOffsetY + to.getHeight()/2]
+    anchors = [fromOffsetX + from.width() - 1, fromOffsetY + from.height()/2, toOffsetX - typeOffsetX, toOffsetY + to.height()/2]
+    anchors
 
   # Draw arrows for all tasks, which have dependencies
-  $$('div.task_todo').each (element) ->
+  $('div.task_todo').each (element) ->
+    element = this
     for relationAttribute in relationAttrs
-      if (related = element.readAttribute(relationAttribute))
+      if (related = element.getAttribute(relationAttribute))
         for id in related.split(',')
-          if (item = $(id))
+          if (item = $('#'+id))
             paper.ganttArrow calculateAnchors(item, element), relationAttribute