Skip to content

Commit

Permalink
Added new "combined group" task item type functionality
Browse files Browse the repository at this point in the history
  • Loading branch information
jsGanttImproved committed Apr 21, 2014
1 parent ea9890e commit 45797b9
Show file tree
Hide file tree
Showing 4 changed files with 195 additions and 168 deletions.
100 changes: 47 additions & 53 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,13 +63,17 @@
overflow:hidden; }
.nav li { float:left; }
.nav a { display:block; padding-right: 20px;color: #656565;}
a.footnote:link {text-decoration:none;color: red;}
a.footnote:visited {text-decoration:none;color: red;}
a.footnote:hover {text-decoration:underline;color: red;}
a.footnote:active {text-decoration:underline;color: red;}
-->
</style>
</head>
<body>

<div style="position:absolute; z-index: 5; top:0; left:0; width: 100%;">
<div class="header">jsGanttImproved - 1.2</div>
<div class="header">jsGanttImproved - 1.3</div>
<div class="nav">
<ul>
<li><a href="#tBugs">Bugs/Issues</a></li>
Expand Down Expand Up @@ -112,15 +116,15 @@
g.AddTaskItem(new JSGantt.TaskItem(3, 'Code Javascript', '', '', 'ggroupblack', '', 0, 'Brian', 0, 1, 0, 1));
g.AddTaskItem(new JSGantt.TaskItem(31, 'Define Variables', '2014-02-25','2014-03-17', 'gtaskpurple', '', 0, 'Brian', 30, 0, 3, 1, '', 'Caption 1'));
g.AddTaskItem(new JSGantt.TaskItem(32, 'Calculate Chart Size', '2014-03-15','2014-03-24', 'gtaskgreen', '', 0, 'Shlomy', 40, 0, 3, 1));
g.AddTaskItem(new JSGantt.TaskItem(33, 'Draw Taks Items', '', '', 'ggroupblack', '', 0, 'Someone', 40, 1, 3, 1));
g.AddTaskItem(new JSGantt.TaskItem(332, 'Task Label Table', '2014-03-06','2014-03-11', 'gtaskblue', '', 0, 'Brian', 60, 0, 33, 1));
g.AddTaskItem(new JSGantt.TaskItem(333, 'Task Scrolling Grid', '2014-03-09','2014-03-20', 'gtaskblue', '', 0, 'Brian', 60, 0, 33, 1));
g.AddTaskItem(new JSGantt.TaskItem(33, 'Draw Task Items', '', '', 'ggroupblack', '', 0, 'Someone', 40, 2, 3, 1));
g.AddTaskItem(new JSGantt.TaskItem(332, 'Task Label Table', '2014-03-06','2014-03-09', 'gtaskblue', '', 0, 'Brian', 60, 0, 33, 1));
g.AddTaskItem(new JSGantt.TaskItem(333, 'Task Scrolling Grid', '2014-03-11','2014-03-20', 'gtaskblue', '', 0, 'Brian', 0, 0, 33, 1, '332'));
g.AddTaskItem(new JSGantt.TaskItem(34, 'Draw Task Bars', '', '', 'ggroupblack', '', 0, 'Anybody', 60, 1, 3, 0));
g.AddTaskItem(new JSGantt.TaskItem(341, 'Loop each Task', '2014-03-26','2014-04-11', 'gtaskred', '', 0, 'Brian', 60, 0, 34, 1));
g.AddTaskItem(new JSGantt.TaskItem(342, 'Calculate Start/Stop', '2014-04-12','2014-05-18', 'gtaskpink', '', 0, 'Brian', 60, 0, 34, 1));
g.AddTaskItem(new JSGantt.TaskItem(343, 'Draw Task Div', '2014-05-13','2014-05-17', 'gtaskred', '', 0, 'Brian', 60, 0, 34, 1));
g.AddTaskItem(new JSGantt.TaskItem(344, 'Draw Completion Div', '2014-05-17','2014-06-04', 'gtaskred', '', 0, 'Brian', 60, 0, 34, 1, "342,343"));
g.AddTaskItem(new JSGantt.TaskItem(35, 'Make Updates', '2014-07-17','2015-09-04', 'gtaskpurple', '', 0, 'Brian', 30, 0, 3, 1));
g.AddTaskItem(new JSGantt.TaskItem(35, 'Make Updates', '2014-07-17','2015-09-04', 'gtaskpurple', '', 0, 'Brian', 30, 0, 3, 1, '333'));

g.Draw();
} else {
Expand Down Expand Up @@ -160,6 +164,19 @@ <h3>Current Issues:</h3>

</ol><br/>
<h3>Changes/fixes in jsGanttImproved:</h3>
<h4>v1.3:</h4>
<ul>
<li>Code refactored to:
<ul>
<li>Move the last non-structural style information from javascript to css file</li>
<li>Tooltip DIV slightly restructured to allow styling rather than relying on line breaks for layout</li>
<li>Create the chart using createElement() and appendChild() rather than innerHTML to enable...</li>
</ul></li>
<li>New "Combined Group" element created. Combined groups show all child task information on one row.</li>
</ul>
<blockquote><p>
Please see the differences for the CSS file in code revision <a href="https://code.google.com/p/jsgantt-improved/source/diff?spec=svn21&old=18&r=21&format=side&path=%2Ftrunk%2Fjsgantt.css">r21</a> for details of CSS structural changes.
</p></blockquote>
<h4>v1.2:</h4>
<ul>
<li>Multiple gantt charts per page are now supported</li>
Expand All @@ -169,32 +186,7 @@ <h4>v1.2:</h4>
</p><p>
All chart element ids are now prefixed with the id of the master DIV containing the chart. As a result the default stylesheet has been updated to no longer uses any element ids to apply styles.
</p><p>
The following classes have been renamed:
<pre>
.column -> .gcontainercol
.scroll -> .glistgrid
.scroll2 -> .gchartgrid
.scroll3 -> .glistlbl
.scroll4 -> .gchartlbl
</pre>
</p><p>
Rules using the following ids have been converted to use these classes:
<pre>
#JSGanttToolTip -> .JSGanttToolTip
#JSGanttToolTipcont -> .JSGanttToolTipcont
#chartTable -> .gcharttable
#container -> .gchartcontainer
#footer -> .ggridfooter
#footer2 -> .glabelfooter
#leftside -> .glistgrid (rules combined with old .scroll class)
#leftsideh -> .glistlbl (rules combined with old .scroll3 class)
#rightside -> .gchartgrid (rules combined with old .scroll2 class)
#rightsideh -> .gchartlbl (rules combined with old .scroll4 class)
#taskTable -> .gtasktable
#taskTableh -> .gtasktableh
</pre>
</p><p>
Dependency lines have been altered to use a 1px border rather than background color and the default styles have been updated to reflect this. Two new classes have been defined, .glineh and .glinev for horizontal and vertical lines respectively (1x1 pixel lines are considered to be vertical).
Please see the notes for code revision <a href="http://code.google.com/p/jsgantt-improved/source/detail?r=18">r18</a> for details of CSS structural changes.
</p></blockquote>
<h4>v1.1:</h4>
<ul>
Expand Down Expand Up @@ -325,13 +317,15 @@ <h2 class="roundedCornerfg" id="tUsage">Usage</h2>
<dt>pMile</dt><dd>(optional) indicates whether this is a milestone task - Numeric; 1 = milestone, 0 = not milestone</dd>
<dt>pRes</dt><dd>(optional) resource name</dd>
<dt>pComp</dt><dd>(required) completion percent, numeric</dd>
<dt>pGroup</dt><dd>(optional) indicates whether this is a group task(parent) - Numeric; 1 = group task, 0 = not group task</dd>
<dt>pGroup</dt><dd>(optional) indicates whether this is a group task (parent) - Numeric; 0 = normal task, 1 = standard group task, 2 = combined group task<a href='#combinedtasks' class="footnote">*</a></dd>
<dt>pParent</dt><dd>(required) identifies a parent pID, this causes this task to be a child of identified task. Numeric, top level tasks should have pParent set to 0</dd>
<dt>pOpen</dt><dd>(required) indicates whether a group task is open when chart is first drawn. Value must be set for all items but is only used by group tasks. Numeric, 1 = open, 0 = closed</dd>
<dt>pOpen</dt><dd>(required) indicates whether a standard group task is open when chart is first drawn. Value must be set for all items but is only used by standard group tasks. Numeric, 1 = open, 0 = closed</dd>
<dt>pDepend</dt><dd>(optional) comma separated list of id&#39;s this task is dependent on. A line will be drawn from each listed task to this item<br />Each id can optionally be followed by a dependency type suffix. Valid values are:<blockquote>'FS' - Finish to Start (default if suffix is omitted)<br />'SF' - Start to Finish<br />'SS' - Start to Start<br />'FF' - Finish to Finish</blockquote>If present the suffix must be added directly to the id e.g. '123SS'</dd>
<dt>pCaption</dt><dd>(optional) caption that will be added after task bar if CaptionType set to "Caption"</dd>
<dt>pNotes</dt><dd>(optional) Detailed task information that will be displayed in tool tip for this task</dd>
</dl>
<p id='combinedtasks'><span style="color: red;">*</span> Combined group tasks show all sub-tasks on one row. The information displayed in the task list and row caption are taken from the parent task. Tool tips are generated individually for each sub-task from its own information. Milestones are not valid as sub-tasks of a combined group task and will not be displayed. No bounds checking of start and end dates of sub-tasks is performed therefore it is possible for these task bars to overlap. Dependencies can be set to and from sub-tasks only.
</p>
</li>
<li>using parseXML() with an external XML file
<pre class="style1">
Expand Down Expand Up @@ -501,26 +495,26 @@ <h3 id="tOptionsExamples">Example Options</h3>
g.setShowEndWeekDate(0);
g.setUseSingleCell(1);

g.AddTaskItem(new JSGantt.TaskItem(1, 'Define Chart API', '', '', 'ggroupblack', '', 0, 'Brian', 0, 1, 0, 1, '', '', 'Some Notes text' ));
g.AddTaskItem(new JSGantt.TaskItem(11, 'Chart Object', '2014-02-20','2014-02-20', 'gmilestone', '', 1, 'Shlomy', 100, 0, 1, 1));
g.AddTaskItem(new JSGantt.TaskItem(12, 'Task Objects', '', '', 'ggroupblack', '', 0, 'Shlomy', 40, 1, 1, 1));
g.AddTaskItem(new JSGantt.TaskItem(121, 'Constructor Proc', '2014-02-21','2014-03-09', 'gtaskblue', '', 0, 'Brian T.', 60, 0, 12, 1));
g.AddTaskItem(new JSGantt.TaskItem(122, 'Task Variables', '2014-03-06','2014-03-11', 'gtaskred', '', 0, 'Brian', 60, 0, 12, 1, 121));
g.AddTaskItem(new JSGantt.TaskItem(123, 'Task by Minute/Hour', '2014-03-09','2014-03-14 12:00', 'gtaskyellow', '', 0, 'Ilan', 60, 0, 12, 1, ''));
g.AddTaskItem(new JSGantt.TaskItem(124, 'Task Functions', '2014-03-09','2014-03-29', 'gtaskred', '', 0, 'Anyone', 60, 0, 12, 1, '123SS', 'This is a caption', null));
g.AddTaskItem(new JSGantt.TaskItem(2, 'Create HTML Shell', '2014-03-24','2014-03-24', 'gtaskyellow', '', 0, 'Brian', 20, 0, 0, 1, 122));
g.AddTaskItem(new JSGantt.TaskItem(3, 'Code Javascript', '', '', 'ggroupblack', '', 0, 'Brian', 0, 1, 0, 1));
g.AddTaskItem(new JSGantt.TaskItem(31, 'Define Variables', '2014-02-25','2014-03-17', 'gtaskpurple', '', 0, 'Brian', 30, 0, 3, 1, '', 'Caption 1'));
g.AddTaskItem(new JSGantt.TaskItem(32, 'Calculate Chart Size', '2014-03-15','2014-03-24', 'gtaskgreen', '', 0, 'Shlomy', 40, 0, 3, 1));
g.AddTaskItem(new JSGantt.TaskItem(33, 'Draw Taks Items', '', '', 'ggroupblack', '', 0, 'Someone', 40, 1, 3, 1));
g.AddTaskItem(new JSGantt.TaskItem(332, 'Task Label Table', '2014-03-06','2014-03-11', 'gtaskblue', '', 0, 'Brian', 60, 0, 33, 1));
g.AddTaskItem(new JSGantt.TaskItem(333, 'Task Scrolling Grid', '2014-03-09','2014-03-20', 'gtaskblue', '', 0, 'Brian', 60, 0, 33, 1));
g.AddTaskItem(new JSGantt.TaskItem(34, 'Draw Task Bars', '', '', 'ggroupblack', '', 0, 'Anybody', 60, 1, 3, 0));
g.AddTaskItem(new JSGantt.TaskItem(341, 'Loop each Task', '2014-03-26','2014-04-11', 'gtaskred', '', 0, 'Brian', 60, 0, 34, 1));
g.AddTaskItem(new JSGantt.TaskItem(342, 'Calculate Start/Stop', '2014-04-12','2014-05-18', 'gtaskpink', '', 0, 'Brian', 60, 0, 34, 1));
g.AddTaskItem(new JSGantt.TaskItem(343, 'Draw Task Div', '2014-05-13','2014-05-17', 'gtaskred', '', 0, 'Brian', 60, 0, 34, 1));
g.AddTaskItem(new JSGantt.TaskItem(344, 'Draw Completion Div', '2014-05-17','2014-06-04', 'gtaskred', '', 0, 'Brian', 60, 0, 34, 1, "342,343"));
g.AddTaskItem(new JSGantt.TaskItem(35, 'Make Updates', '2014-07-17','2015-09-04', 'gtaskpurple', '', 0, 'Brian', 30, 0, 3, 1));
g.AddTaskItem(new JSGantt.TaskItem(1, 'Define Chart API', '', '', 'ggroupblack', '', 0, 'Brian', 0, 1, 0, 1, '', '', 'Some Notes text' ));
g.AddTaskItem(new JSGantt.TaskItem(11, 'Chart Object', '2014-02-20','2014-02-20', 'gmilestone', '', 1, 'Shlomy', 100, 0, 1, 1));
g.AddTaskItem(new JSGantt.TaskItem(12, 'Task Objects', '', '', 'ggroupblack', '', 0, 'Shlomy', 40, 1, 1, 1));
g.AddTaskItem(new JSGantt.TaskItem(121, 'Constructor Proc', '2014-02-21','2014-03-09', 'gtaskblue', '', 0, 'Brian T.', 60, 0, 12, 1));
g.AddTaskItem(new JSGantt.TaskItem(122, 'Task Variables', '2014-03-06','2014-03-11', 'gtaskred', '', 0, 'Brian', 60, 0, 12, 1, 121));
g.AddTaskItem(new JSGantt.TaskItem(123, 'Task by Minute/Hour', '2014-03-09','2014-03-14 12:00', 'gtaskyellow', '', 0, 'Ilan', 60, 0, 12, 1, ''));
g.AddTaskItem(new JSGantt.TaskItem(124, 'Task Functions', '2014-03-09','2014-03-29', 'gtaskred', '', 0, 'Anyone', 60, 0, 12, 1, '123SS', 'This is a caption', null));
g.AddTaskItem(new JSGantt.TaskItem(2, 'Create HTML Shell', '2014-03-24','2014-03-24', 'gtaskyellow', '', 0, 'Brian', 20, 0, 0, 1, 122));
g.AddTaskItem(new JSGantt.TaskItem(3, 'Code Javascript', '', '', 'ggroupblack', '', 0, 'Brian', 0, 1, 0, 1));
g.AddTaskItem(new JSGantt.TaskItem(31, 'Define Variables', '2014-02-25','2014-03-17', 'gtaskpurple', '', 0, 'Brian', 30, 0, 3, 1, '', 'Caption 1'));
g.AddTaskItem(new JSGantt.TaskItem(32, 'Calculate Chart Size', '2014-03-15','2014-03-24', 'gtaskgreen', '', 0, 'Shlomy', 40, 0, 3, 1));
g.AddTaskItem(new JSGantt.TaskItem(33, 'Draw Task Items', '', '', 'ggroupblack', '', 0, 'Someone', 40, 2, 3, 1));
g.AddTaskItem(new JSGantt.TaskItem(332, 'Task Label Table', '2014-03-06','2014-03-09', 'gtaskblue', '', 0, 'Brian', 60, 0, 33, 1));
g.AddTaskItem(new JSGantt.TaskItem(333, 'Task Scrolling Grid', '2014-03-11','2014-03-20', 'gtaskblue', '', 0, 'Brian', 0, 0, 33, 1, '332'));
g.AddTaskItem(new JSGantt.TaskItem(34, 'Draw Task Bars', '', '', 'ggroupblack', '', 0, 'Anybody', 60, 1, 3, 0));
g.AddTaskItem(new JSGantt.TaskItem(341, 'Loop each Task', '2014-03-26','2014-04-11', 'gtaskred', '', 0, 'Brian', 60, 0, 34, 1));
g.AddTaskItem(new JSGantt.TaskItem(342, 'Calculate Start/Stop', '2014-04-12','2014-05-18', 'gtaskpink', '', 0, 'Brian', 60, 0, 34, 1));
g.AddTaskItem(new JSGantt.TaskItem(343, 'Draw Task Div', '2014-05-13','2014-05-17', 'gtaskred', '', 0, 'Brian', 60, 0, 34, 1));
g.AddTaskItem(new JSGantt.TaskItem(344, 'Draw Completion Div', '2014-05-17','2014-06-04', 'gtaskred', '', 0, 'Brian', 60, 0, 34, 1, "342,343"));
g.AddTaskItem(new JSGantt.TaskItem(35, 'Make Updates', '2014-07-17','2015-09-04', 'gtaskpurple', '', 0, 'Brian', 30, 0, 3, 1, '333'));

g.Draw();
}
Expand Down
2 changes: 1 addition & 1 deletion jsgantt.css
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
/* Sample CSS for jsGanttImproved v1.2.2 */
/* Sample CSS for jsGanttImproved v1.3 */
body { font-family:tahoma, arial, verdana, Sans-serif; font-size:10px; color: #656565; }

.gantt table { border-collapse: collapse; }
Expand Down
Loading

0 comments on commit 45797b9

Please sign in to comment.