Skip to content

Commit

Permalink
Merge pull request #138 from jsGanttImproved/develop
Browse files Browse the repository at this point in the history
Add Column in Object and Fix for IE
  • Loading branch information
mariohmol authored Jan 10, 2019
2 parents c86d893 + c06b6a9 commit 7d56488
Show file tree
Hide file tree
Showing 14 changed files with 433 additions and 217 deletions.
24 changes: 12 additions & 12 deletions Documentation.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,9 +32,9 @@ Method definition: **GanttChart(_pDiv_, _pFormat_)**
| _pFormat:_ | (required) used to indicate whether chart should be drawn in "hour", "day", "week", "month", or "quarter" format |
## Customize the look and feel using configuration methods ##
see [Configuration Options](Documentation#user-content-options) below
see [Configuration Options](#user-content-options) below
## Add Tasks ##
## <a href="user-content-a-using-addtaskitem"></a> Add Tasks ##
### a) Using Method() ###
Expand Down Expand Up @@ -131,7 +131,7 @@ The structure of the JSON file:
```
### c) using parseXML() with an external XML file ###
### <a name="user-content-b-using-parsexml-with-an-external-xml-file"> </a> c) using parseXML() with an external XML file ###
```javascript
JSGantt.parseXML("project.xml",g);
```
Expand Down Expand Up @@ -170,9 +170,9 @@ The structure of the native XML file:
</project>
```
Field definitions are as described for the parameters to [TaskItem](Documentation#user-content-a-using-addtaskitem) above. The pClass element is optional in XML files and will default to "ggroupblack" for group tasks, "gtaskblue" for normal tasks and "gmilestone" for milestones. The pGantt element is not required for XML import.
Field definitions are as described for the parameters to [TaskItem](#user-content-a-using-addtaskitem) above. The pClass element is optional in XML files and will default to "ggroupblack" for group tasks, "gtaskblue" for normal tasks and "gmilestone" for milestones. The pGantt element is not required for XML import.
JSGannt Improved will also test the provided XML file to see if it appears to be in Microsoft Project XML format. If so an attempt will be made to load up the project. This feature is experimental, the import is best effort and not guaranteed. Once loaded the project as interpreted by JSGantt Improved can be extracted using the [XML Export methods](Documentation#user-content-xml-export) provided.
JSGannt Improved will also test the provided XML file to see if it appears to be in Microsoft Project XML format. If so an attempt will be made to load up the project. This feature is experimental, the import is best effort and not guaranteed. Once loaded the project as interpreted by JSGantt Improved can be extracted using the [XML Export methods](#user-content-xml-export) provided.
### c) using parseXMLString() with XML held in a javascript string object ###
Expand All @@ -189,10 +189,10 @@ Method definition:
|_pGanttObj:_|(required) a GanttChart object returned by a call to JSGantt.GanttChart()|
The XML provided will be parsed in exactly the same way as the contents of an external XML file and hence must match the format as described for [parseXML](Documentation#user-content-b-using-parsexml-with-an-external-xml-file) above
The XML provided will be parsed in exactly the same way as the contents of an external XML file and hence must match the format as described for [parseXML](#user-content-b-using-parsexml-with-an-external-xml-file) above
### XML Export ###
### <a name="user-content-xml-export"></a> XML Export ###
The following methods can be used to extract details of tasks in the project in XML format
Expand Down Expand Up @@ -273,7 +273,7 @@ The following options take a single numeric parameter; a value of 1 will enable
|_setShowTaskInfoEndDate():_|Controls whether the Task End Date information is displayed in the task tool tip, defaults to 1 (show information)|
|_setShowTaskInfoLink():_|Controls whether the More Information link is displayed in the task tool tip, defaults to 0 (do NOT show link)|
|_setShowTaskInfoNotes():_|Controls whether the Additional Notes data is displayed in the task tool tip, defaults to 1 (show notes)|
|_setShowEndWeekDate():_|Controls whether the major heading in "Day" view displays the week end-date in the appropriate format (see [below](Documentation#user-content-display-date-formats)), defaults to 1 (show date)|
|_setShowEndWeekDate():_|Controls whether the major heading in "Day" view displays the week end-date in the appropriate format (see [below](#user-content-display-date-formats)), defaults to 1 (show date)|
|_setShowDeps():_ |Controls display of dependancy lines, defaults to 1 (show dependencies)|
|_setEvents():_ |Controls events when a task is click in table data. You have to pass an object with the column and function. ex.: ` { taskname: console.log, res: console.log }`|
|_setEventClickRow():_ |Controls events when a task row is cliked. Pass a function to exercute ex.: `function(e){console.log(e)}`|
Expand All @@ -295,7 +295,7 @@ The following options enable functionality using a set of specific key values
|_setDateInputFormat():_|Defines the input format used for dates in task creation, accepts a single parameter. Valid parameter values are "yyyy-mm-dd", "dd/mm/yyyy", "mm/dd/yyyy". Defaults to "yyyy-mm-dd"|
|_setScrollTo():_ |Sets the date the Gantt Chart will be scrolled to, specified in the date input format set by setDateInputFormat() above. Also accepts the special value "today". Defaults to minimum display date|
|_setUseSingleCell():_|Sets the threshold total number of cells at which the task list will use a single table cell for each row rather than one cell per period. Useful to improve performance on large charts. Numeric, a value of 0 disables this functionality (always use multiple cells), defaults to 25000|
|_setLang():_ |Sets translation to use when drawing the chart. Defaults to "en" as this is the only language provided in the base installation (see [Internationalisation](Documentation#user-content-internationalisation) below for details on how to add more translations.)|
|_setLang():_ |Sets translation to use when drawing the chart. Defaults to "en" as this is the only language provided in the base installation (see [Internationalisation](#user-content-internationalisation) below for details on how to add more translations.)|
## Layout ##
Most of the look and feel of the Gantt Chart can be controlled using CSS however, as the length of a task bar is determined by column width, the following methods take a single numeric parameter that defines the appropriate column width in pixels.
Expand All @@ -311,7 +311,7 @@ Note that the task bar sizing code assumes the use of collapsed table borders 1p
|_setRowHeight():_|Height of Gantt Chart rows in pixels. Used to route dependency lines near end points. Defaults to 20.|
|_setMinGpLen():_ |Group tasks have their task bars embellished with end points, this value specifies the width of one of these end points in pixels. A short task bar's length will be rounded up to display either a single or both endpoints correctly. Defaults to 8.|
## Display Date Formats ##
## <a name="user-content-display-date-formats"></a> Display Date Formats ##
Date display formats can be individually controlled. The methods used to set these display formats each take a single format string parameter. The format string can be made up of the following components (case sensitive)
| Component | Description |
Expand Down Expand Up @@ -342,7 +342,7 @@ Date display formats can be individually controlled. The methods used to set the
separated by one of the following characters: **"/\-.,'`<space`>:**
Any text between separators that does not match one of the components above will be checked using a case insensitive match for a valid internationalised string (see [Internationalisation](Documentation#user-content-internationalisation) below). If the value is still not found the text will be output unchanged.
Any text between separators that does not match one of the components above will be checked using a case insensitive match for a valid internationalised string (see [Internationalisation](#user-content-internationalisation) below). If the value is still not found the text will be output unchanged.
The available date display methods are
Expand All @@ -361,7 +361,7 @@ The available date display methods are
|_setMonthMinorDateDisplayFormat():_|Date format used for Gantt Chart minor date headings displayed in "Month" format. Defaults to 'mon'.|
|_setQuarterMinorDateDisplayFormat():_|Date format used for Gantt Chart minor date headings displayed in "Year" format. Defaults to 'qq'.|
## Internationalisation ##
## <a name="user-content-internationalisation"></a> Internationalisation ##
jsGanttImproved only provides English text however all hard coded strings can be replaced by calling the addLang() method available on the GanttChart object returned by a call to JSGantt.GanttChart()
The addLang() method takes two parameters. The first is a string identifier for the language, the second is a javascript object containing all the replacement text pairs, the default English settings are:
Expand Down
2 changes: 1 addition & 1 deletion docs/fixes/data.json
Original file line number Diff line number Diff line change
Expand Up @@ -260,7 +260,7 @@
"pLink": "",
"pMile": 0,
"pRes": "Anybody",
"pComp": 60,
"pComp": 67,
"pGroup": 1,
"pParent": 3,
"pOpen": 0,
Expand Down
15 changes: 14 additions & 1 deletion docs/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,7 @@
<div class="row">
<div class="col-lg-6 text-center">
<h1 class="display-1 product-name" id="home-title">jsGanttImproved</h1>
<h2 class="display-2" id="home-subtitle">latest v2.0.8</h2>
<h2 class="display-2" id="home-subtitle">latest v2.0.10</h2>
<a class="btn btn-danger my-2 my-sm-0 mx-1" href="https://api.github.com/repos/jsGanttImproved/jsgantt-improved/zipball">Download</a>
<a class="btn btn-primary my-2 my-sm-0 mx-1" href="https://github.com/jsGanttImproved/jsgantt-improved" target="_blank">View
on GitHub</a>
Expand Down Expand Up @@ -231,6 +231,19 @@ <h2>Current Known Issues:</h3>
<h2>Changelog:</h3>
<p>Check the full list of changes on <a href="https://github.com/jsGanttImproved/jsgantt-improved/releases">GitHub
releases page</a>.</p>
<h3>2.1.2:</h3>
<ul>
<li>Fix for adding custom columns in object</li>
<li>IE compatible with dependencies highlight</li>
</ul>
<h3>2.1.1:</h3>
<ul>
<li>New way for rendering gantt where it works better scroll</li>
</ul>
<h3>2.0.10:</h3>
<ul>
<li>Use complete value from task group from data instead of calculated</li>
</ul>
<h3>v2.0.9:</h3>
<ul>
<li>Editing data in gantt table</li>
Expand Down
17 changes: 17 additions & 0 deletions docs/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -103,6 +103,23 @@ function start(e) {
});
//DELAY FROM INPUT

// Teste manual add task
// g.AddTaskItemObject({
// pID: 100,
// pName: "Task 1",
// pStart: "2018-09-05",
// pEnd: "2018-09-11",
// pLink: "",
// pClass: "gtaskgreen",
// pMile: 0,
// pComp: 100,
// pGroup: 0,
// pParent: 0,
// pOpen: 1,
// pNotes: "",
// category: 'test'
// });

if (vDebug) {
bd = new Date();
console.log('before reloading', bd);
Expand Down
171 changes: 104 additions & 67 deletions docs/jsgantt.css
Original file line number Diff line number Diff line change
Expand Up @@ -397,69 +397,6 @@ span.gfoldercollapse {
margin-top: 4px;
}

/* Printer friendly styles - we could use these all the time but they are not as pretty! */

/* note that "@media print" is not supported in IE6 or 7. Fully patched IE8 should be OK */

@media print {
.ggroupblack {
height: 0px;
border-top: 7px solid;
border-color: #000000;
}
.gtaskblue {
height: 0px;
border-top: 13px solid;
border-color: rgb(58, 132, 195);
}
.gtaskred {
height: 0px;
border-top: 13px solid;
border-color: rgb(196, 58, 58);
}
.gtaskgreen {
height: 0px;
border-top: 13px solid;
border-color: rgb(80, 193, 58);
}
.gtaskyellow {
height: 0px;
border-top: 13px solid;
border-color: rgb(247, 228, 56);
}
.gtaskpurple {
height: 0px;
border-top: 13px solid;
border-color: rgb(193, 58, 193);
}
.gtaskpink {
height: 0px;
border-top: 13px solid;
border-color: rgb(249, 177, 245);
}
.gtaskbluecomplete,
.gtaskredcomplete,
.gtaskgreencomplete,
.gtaskyellowcomplete,
.gtaskpurplecomplete,
.gtaskpinkcomplete {
height: 0px;
filter: alpha(opacity=40);
opacity: 0.4;
margin-top: -9px;
border-top: 5px solid;
border-color: #000000;
}
.ggroupblackcomplete {
height: 0px;
filter: alpha(opacity=80);
opacity: 0.8;
margin-top: -5px;
border-top: 3px solid;
border-color: #777777;
}
}

/* END Task bar styles */

.glinev {
Expand Down Expand Up @@ -636,7 +573,8 @@ div.gtaskbarcontainer {
padding-top: 0px;
background-color: #ffffff;
position: relative;
overflow: auto;
/* overflow: auto; */
overflow: unset;
min-height: 0%;
}

Expand All @@ -647,7 +585,7 @@ div.gtaskbarcontainer {
padding-top: 0px;
background-color: #ffffff;
position: relative;
overflow: hidden;
overflow: unset;
}

/* Old Internet Explorer version hacks */
Expand Down Expand Up @@ -777,7 +715,7 @@ td.gspanning div {
.gchartgrid {
overflow: unset !important;
}
.glistgrid{
.glistgrid {
float: none !important;
}
}
Expand All @@ -798,4 +736,103 @@ td.gspanning div {
.ggroupquarter td,
.gmilequarter td,
.gitemquarter td { background-size: 19px 1px; background-image: linear-gradient(to left, #efefef, transparent 1px, transparent 18px); width: 100%; height: 19px; }
*/
*/

.gmain {
width: 50%;
display: inline-block;
height: 100%;
}

.gmainright {
overflow-x: scroll;
overflow-y: hidden;
top: 0;
}

.gmainleft {
overflow-x: scroll;
}

.gtasktableh tr,
.gcharttable tr,
.gtasktable tr {
height: 22px !important;
}

.gtasktable {
margin-bottom: 14px;
}

/* Printer friendly styles - we could use these all the time but they are not as pretty! */

/* note that "@media print" is not supported in IE6 or 7. Fully patched IE8 should be OK */

@media print {
.ggroupblack {
height: 0px;
border-top: 7px solid;
border-color: #000000;
}
.gtaskblue {
height: 0px;
border-top: 13px solid;
border-color: rgb(58, 132, 195);
}
.gtaskred {
height: 0px;
border-top: 13px solid;
border-color: rgb(196, 58, 58);
}
.gtaskgreen {
height: 0px;
border-top: 13px solid;
border-color: rgb(80, 193, 58);
}
.gtaskyellow {
height: 0px;
border-top: 13px solid;
border-color: rgb(247, 228, 56);
}
.gtaskpurple {
height: 0px;
border-top: 13px solid;
border-color: rgb(193, 58, 193);
}
.gtaskpink {
height: 0px;
border-top: 13px solid;
border-color: rgb(249, 177, 245);
}
.gtaskbluecomplete,
.gtaskredcomplete,
.gtaskgreencomplete,
.gtaskyellowcomplete,
.gtaskpurplecomplete,
.gtaskpinkcomplete {
height: 0px;
filter: alpha(opacity=40);
opacity: 0.4;
margin-top: -9px;
border-top: 5px solid;
border-color: #000000;
}
.ggroupblackcomplete {
height: 0px;
filter: alpha(opacity=80);
opacity: 0.8;
margin-top: -5px;
border-top: 3px solid;
border-color: #777777;
}
.gmainright,
.gmainleft {
overflow: hidden;
width: auto;
}
table { page-break-after:auto }
tr { page-break-inside:avoid; page-break-after:auto }
td { page-break-inside:avoid; page-break-after:auto }
thead { display:table-header-group }
tfoot { display:table-footer-group }
}
Loading

0 comments on commit 7d56488

Please sign in to comment.