Allow collapse/expand in gantt chart (#6417).

Patch by Yuichi HARADA.


git-svn-id: http://svn.redmine.org/redmine/trunk@17925 e93f8b46-1217-0410-a6f0-8f06a7374b81

2 files changed, 63 insertions, 3 deletions

diff --git a/public/javascripts/gantt.js b/public/javascripts/gantt.js
index 2e71178b0..0241e6f3e 100644
--- a/public/javascripts/gantt.js
+++ b/public/javascripts/gantt.js
@@ -17,6 +17,7 @@ function setDrawArea() {
 function getRelationsArray() {
   var arr = new Array();
   $.each($('div.task_todo[data-rels]'), function(index_div, element) {
+    if(!$(element).is(':visible')) return true;
     var element_id = $(element).attr("id");
     if (element_id != null) {
       var issue_id = element_id.replace("task-todo-issue-", "");
@@ -106,6 +107,7 @@ function getProgressLinesArray() {
   var today_left = $('#today_line').position().left;
   arr.push({left: today_left, top: 0});
   $.each($('div.issue-subject, div.version-name'), function(index, element) {
+    if(!$(element).is(':visible')) return true;
     var t = $(element).position().top - draw_top ;
     var h = ($(element).height() / 9);
     var element_top_upper  = t - h;
@@ -169,7 +171,7 @@ function drawGanttHandler() {
     draw_gantt = Raphael(folder);
   setDrawArea();
   if ($("#draw_progress_line").prop('checked'))
-    drawGanttProgressLines();
+    try{drawGanttProgressLines();}catch(e){}
   if ($("#draw_relations").prop('checked'))
     drawRelations();
 }
@@ -195,3 +197,59 @@ function resizableSubjectColumn(){
     $('td.gantt_subjects_column').resizable('enable');
   };
 }
+
+ganttEntryClick = function(e){
+  var subject = $(e.target.parentElement);
+  var subject_left = parseInt(subject.css('left'));
+  var target_shown = null;
+  var target_top = 0;
+  var total_height = 0;
+  var out_of_hierarchy = false;
+  var iconChange = null;
+  if(subject.hasClass('open'))
+    iconChange = function(element){
+      $(element).removeClass('open');
+    };
+  else
+    iconChange = function(element){
+      $(element).addClass('open');
+    };
+  iconChange(subject);
+  subject.nextAll('div').each(function(_, element){
+    var el = $(element);
+    var json = el.data('collapse-expand');
+    if(out_of_hierarchy || parseInt(el.css('left')) <= subject_left){
+      out_of_hierarchy = true;
+      if(target_shown == null) return false;
+
+      var new_top_val = parseInt(el.css('top')) + total_height * (target_shown ? -1 : 1);
+      el.css('top', new_top_val);
+      $('#gantt_area form > div[data-collapse-expand="' + json.obj_id + '"]').each(function(_, task){
+        $(task).css('top', new_top_val);
+      });
+      return true;
+    }
+
+    var is_shown = el.is(':visible');
+    if(target_shown == null){
+      target_shown = is_shown;
+      target_top = parseInt(el.css('top'));
+      total_height = 0;
+    }
+    if(is_shown == target_shown){
+      $('#gantt_area form > div[data-collapse-expand="' + json.obj_id + '"]').each(function(_, task){
+        var el_task = $(task);
+        if(!is_shown)
+          el_task.css('top', target_top + total_height);
+        if(!el_task.hasClass('tooltip'))
+          el_task.toggle(!is_shown);
+      });
+      if(!is_shown)
+        el.css('top', target_top + total_height);
+      iconChange(el);
+      el.toggle(!is_shown);
+      total_height += parseInt(json.top_increment);
+    }
+  });
+  drawGanttHandler();
+};
diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css
index 3febc999a..7dde12007 100644
--- a/public/stylesheets/application.css
+++ b/public/stylesheets/application.css
@@ -291,8 +291,10 @@ tr.entry td.age { text-align: right; }
 tr.entry.file td.filename a { margin-left: 16px; }
 tr.entry.file td.filename_no_report a { margin-left: 16px; }
 
-tr span.expander {background: url(../images/arrow_right.png) no-repeat 2px 50%; padding-left: 8px; margin-left: 0; cursor: pointer;}
-tr.open span.expander {background-image: url(../images/arrow_down.png);}
+tr span.expander, .gantt_subjects div > span.expander {background: url(../images/arrow_right.png) no-repeat 2px 50%; padding-left: 8px; margin-left: 0; cursor: pointer;}
+tr.open span.expander, .gantt_subjects div.open > span.expander {background-image: url(../images/arrow_down.png);}
+.gantt_subjects div > span.expander {padding-left: 12px;}
+.gantt_subjects div > span .icon-gravatar {float: none;}
 
 tr.changeset { height: 20px }
 tr.changeset ul, ol { margin-top: 0px; margin-bottom: 0px; }