Redmine

          html_class << ' version-closed' unless version.open?

          if version.start_date && version.due_date && version.completed_pourcent

            progress_date = calc_progress_date(version.start_date,

                                               version.due_date, version.completed_pourcent)

            html_class << ' behind-start-date' if progress_date < self.date_from

            html_class << ' over-end-date' if progress_date > self.date_to

          end

          html_subject(options, subject, :css => "version-name",

                       :id => "version-#{version.id}")

            html_task(options, coords, :css => "version task",

                      :label => label, :markers => true, :version => version)

          css_classes << ' issue-closed' if issue.closed?

          if issue.start_date && issue.due_before && issue.done_ratio

            progress_date = calc_progress_date(issue.start_date,

                                               issue.due_before, issue.done_ratio)

            css_classes << ' behind-start-date' if progress_date < self.date_from

            css_classes << ' over-end-date' if progress_date > self.date_to

          end

                       :title => issue.subject, :id => "issue-#{issue.id}") + "\n"

            progress_date = calc_progress_date(start_date, end_date, progress)

      def calc_progress_date(start_date, end_date, progress)

        start_date + (end_date - start_date + 1) * (progress / 100.0)

      end

        output = view.content_tag(:div, subject,

                                  :title => options[:title],

                                  :id => options[:id])

          html_id = "task-todo-issue-#{options[:issue].id}" if options[:issue]

          html_id = "task-todo-version-#{options[:version].id}" if options[:version]

                                     :class => "#{options[:css]} task_todo",

                                     :id => html_id)

            html_id = "task-done-issue-#{options[:issue].id}" if options[:issue]

            html_id = "task-done-version-#{options[:version].id}" if options[:version]

                                       :class => "#{options[:css]} task_done",

                                       :id => html_id)

<fieldset id="filters" class="collapsible">

  <legend onclick="toggleFieldset(this);"><%= l(:label_display) %></legend>

  <div>

    <label>

      <%= check_box_tag "draw_progress_line", 0, params[:draw_progress_line] %>

      <%= l(:label_gantt_progress_line) %>

    </label>

  </div>

</fieldset>

  label_gantt_progress_line: Progress line

  label_gantt_progress_line: イナズマ線

<% content_for :header_tags do %>

  <%= javascript_include_tag 'raphael' %>

  <%= javascript_include_tag 'gantt' %>

<% end %>

<%= javascript_tag do %>

  $(document).ready(drawGanttHandler);

  $(window).resize(drawGanttHandler);

  $(function() {

    $("#draw_progress_line").change(drawGanttHandler);

  });

<% end %>

<div style="position:relative;height:<%= t_height + 24 %>px;overflow:auto;" id="gantt_area">

  <%= content_tag(:div, '&nbsp;'.html_safe, :style => style, :id => 'today_line') %>

<%

  style  = ""

  style += "position: absolute;"

  style += "height: #{g_height}px;"

  style += "top: #{headers_height + 1}px;"

  style += "left: 0px;"

  style += "width: #{g_width - 1}px;"

%>

<%= content_tag(:div, '', :style => style, :id => "gantt_draw_area") %>

var draw_gantt = null;

var draw_top;

var draw_right;

var draw_left;

function setDrawArea() {

  draw_top   = $("#gantt_draw_area").position().top;

  draw_right = $("#gantt_draw_area").width();

  draw_left  = $("#gantt_area").scrollLeft();

}

function getProgressLinesArray() {

  var arr = new Array();

  var today_left = $('#today_line').position().left;

  arr.push({left: today_left, top: 0});

  $.each($('div.issue-subject, div.version-name'), function(index, element) {

    var t = $(element).position().top - draw_top ;

    var h = ($(element).height() / 9);

    var element_top_upper  = t - h;

    var element_top_center = t + (h * 3);

    var element_top_lower  = t + (h * 8);

    var issue_closed   = $(element).children('span').hasClass('issue-closed');

    var version_closed = $(element).children('span').hasClass('version-closed');

    if (issue_closed || version_closed) {

      arr.push({left: today_left, top: element_top_center});

    } else {

      var issue_done = $("#task-done-" + $(element).attr("id"));

      var is_behind_start = $(element).children('span').hasClass('behind-start-date');

      var is_over_end     = $(element).children('span').hasClass('over-end-date');

      if (is_over_end) {

        arr.push({left: draw_right, top: element_top_upper, is_right_edge: true});

        arr.push({left: draw_right, top: element_top_lower, is_right_edge: true, none_stroke: true});

      } else if (issue_done.size() > 0) {

        var done_left = issue_done.first().position().left +

                           issue_done.first().width();

        arr.push({left: done_left, top: element_top_center});

      } else if (is_behind_start) {

        arr.push({left: 0 , top: element_top_upper, is_left_edge: true});

        arr.push({left: 0 , top: element_top_lower, is_left_edge: true, none_stroke: true});

      } else {

        var todo_left = today_left;

        var issue_todo = $("#task-todo-" + $(element).attr("id"));

        if (issue_todo.size() > 0){

          todo_left = issue_todo.first().position().left;

        }

        arr.push({left: Math.min(today_left, todo_left), top: element_top_center});

      }

    }

  });

  return arr;

}

function drawGanttProgressLines() {

  var arr = getProgressLinesArray();

  var i;

  for(i = 1 ; i < arr.length ; i++) {

    if (!("none_stroke" in arr[i]) &&

        (!("is_right_edge" in arr[i - 1] && "is_right_edge" in arr[i]) &&

         !("is_left_edge"  in arr[i - 1] && "is_left_edge"  in arr[i]))

        ) {

      var x1 = (arr[i - 1].left == 0) ? 0 : arr[i - 1].left + draw_left;

      var x2 = (arr[i].left == 0)     ? 0 : arr[i].left     + draw_left;

      draw_gantt.path(["M", x1, arr[i - 1].top,

                       "L", x2, arr[i].top])

                   .attr({stroke: "#ff0000", "stroke-width": 2});

    }

  }

}

function drawGanttHandler() {

  var folder = document.getElementById('gantt_draw_area');

  if(draw_gantt != null)

    draw_gantt.clear();

  else

    draw_gantt = Raphael(folder);

  setDrawArea();

  if ($("#draw_progress_line").attr('checked'))

    drawGanttProgressLines();

}