/* Copyright (c) 2009, Shlomy Gantz BlueBrick Inc. All rights reserved. * * Redistribution and use in source and binary forms, with or without * modification, are permitted provided that the following conditions are met: * * Redistributions of source code must retain the above copyright * notice, this list of conditions and the following disclaimer. * * Redistributions in binary form must reproduce the above copyright * notice, this list of conditions and the following disclaimer in the * documentation and/or other materials provided with the distribution. * * Neither the name of Shlomy Gantz or BlueBrick Inc. nor the * names of its contributors may be used to endorse or promote products * derived from this software without specific prior written permission. * * THIS SOFTWARE IS PROVIDED BY SHLOMY GANTZ/BLUEBRICK INC. ''AS IS'' AND ANY * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED * WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE * DISCLAIMED. IN NO EVENT SHALL SHLOMY GANTZ/BLUEBRICK INC. BE LIABLE FOR ANY * DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES * (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; * LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND * ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS * SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. * * * LDR Modified to replace hard coded values by i18[key] */ /** * JSGantt component is a UI control that displays gantt charts based by using CSS and HTML * @module jsgantt * @title JSGantt */ var JSGantt; if (!JSGantt) JSGantt = {}; var vTimeout = 0; var vBenchTime = new Date().getTime(); /** * Creates a task (one row) in gantt object * @class TaskItem * @namespace JSGantt * @constructor * @for JSGantt * @param pID {Number} Task unique numeric ID * @param pName {String} Task Name * @param pStart {Date} Task start date/time (not required for pGroup=1 ) * @param pEnd {Date} Task end date/time, you can set the end time to 12:00 to indicate half-day (not required for pGroup=1 ) * @param pColor {String} Task bar RGB value * @param pLink {String} Task URL, clicking on the task will redirect to this url. Leave empty if you do not with the Task also serve as a link * @param pMile {Boolean} Determines whether task is a milestone (1=Yes,0=No) * @param pRes {String} Resource to perform the task * @param pComp {Number} Percent complete (Number between 0 and 100) * @param pGroup {Boolean} * @param pParent {Number} ID of the parent task * @param pOpen {Boolean} * @param pDepend {String} Comma seperated list of IDs this task depends on * @param pCaption {String} Caption to be used instead of default caption (Resource). * note : you should use setCaption("Caption") in order to display the caption * @return void */ JSGantt.TaskItem = function(pID, pName, pStart, pEnd, pColor, pLink, pMile, pRes, pComp, pGroup, pParent, pOpen, pDepend, pCaption) { /** * The name of the attribute. * @property vID * @type String * @default pID * @private */ var vID = pID; /** * @property vName * @type String * @default pName * @private */ var vName = pName; /** * @property vStart * @type Datetime * @default new Date() * @private */ var vStart = new Date(); /** * @property vEnd * @type Datetime * @default new Date() * @private */ var vEnd = new Date(); /** * @property vColor * @type String * @default pColor * @private */ var vColor = pColor; /** * @property vLink * @type String * @default pLink * @private */ var vLink = pLink; /** * @property vMile * @type Boolean * @default pMile * @private */ var vMile = pMile; /** * @property vRes * @type String * @default pRes * @private */ var vRes = pRes; /** * @property vComp * @type Number * @default pComp * @private */ var vComp = pComp; /** * @property vGroup * @type Boolean * @default pGroup * @private */ var vGroup = pGroup; /** * @property vParent * @type Number * @default pParent * @private */ var vParent = pParent; /** * @property vOpen * @type Boolean * @default pOpen * @private */ var vOpen = pOpen; /** * @property vDepend * @type String * @default pDepend * @private */ var vDepend = pDepend; /** * @property vCaption * @type String * @default pCaption * @private */ var vCaption = pCaption; /** * @property vDuration * @type Number * @default '' * @private */ var vDuration = ''; /** * @property vLevel * @type Number * @default 0 * @private */ var vLevel = 0; /** * @property vNumKid * @type Number * @default 0 * @private */ var vNumKid = 0; /** * @property vVisible * @type Boolean * @default 0 * @private */ var vVisible = 1; var x1, y1, x2, y2; if (vGroup != 1) { vStart = JSGantt.parseDateStr(pStart,g.getDateInputFormat()); vEnd = JSGantt.parseDateStr(pEnd,g.getDateInputFormat()); } /** * Returns task ID * @method getID * @return {Number} */ this.getID = function(){ return vID }; /** * Returns task name * @method getName * @return {String} */ this.getName = function(){ return vName }; /** * Returns task start date * @method getStart * @return {Datetime} */ this.getStart = function(){ return vStart}; /** * Returns task end date * @method getEnd * @return {Datetime} */ this.getEnd = function(){ return vEnd }; /** * Returns task bar color (i.e. 00FF00) * @method getColor * @return {String} */ this.getColor = function(){ return vColor}; /** * Returns task URL (i.e. http://www.jsgantt.com) * @method getLink * @return {String} */ this.getLink = function(){ return vLink }; /** * Returns whether task is a milestone (1=Yes,0=No) * @method getMile * @return {Boolean} */ this.getMile = function(){ return vMile }; /** * Returns task dependencies as list of values (i.e. 123,122) * @method getDepend * @return {String} */ this.getDepend = function(){ if(vDepend) return vDepend; else return null }; /** * Returns task caption (if it exists) * @method getCaption * @return {String} */ this.getCaption = function(){ if(vCaption) return vCaption; else return ''; }; /** * Returns task resource name as string * @method getResource * @return {String} */ this.getResource = function(){ if(vRes) return vRes; else return ' '; }; /** * Returns task completion percent as numeric value * @method getCompVal * @return {Boolean} */ this.getCompVal = function(){ if(vComp) return vComp; else return 0; }; /** * Returns task completion percent as formatted string (##%) * @method getCompStr * @return {String} */ this.getCompStr = function(){ if(vComp) return vComp+'%'; else return ''; }; /** * Returns task duration as a fortmatted string based on the current selected format * @method getDuration * @param vFormat {String} selected format (minute,hour,day,week,month) * @return {String} */ this.getDuration = function(vFormat){ if (vMile) vDuration = '-'; else if (vFormat=='hour') { tmpPer = Math.ceil((this.getEnd() - this.getStart()) / ( 60 * 60 * 1000) ); if(tmpPer == 1) vDuration = '1 '+i18n["sHour"]; else vDuration = tmpPer + ' '+i18n["sHours"]; } else if (vFormat=='minute') { tmpPer = Math.ceil((this.getEnd() - this.getStart()) / ( 60 * 1000) ); if(tmpPer == 1) vDuration = '1 '+i18n["sMinute"]; else vDuration = tmpPer + ' '+i18n["sMinutes"]; } else { //if(vFormat == 'day') { tmpPer = Math.ceil((this.getEnd() - this.getStart()) / (24 * 60 * 60 * 1000) + 1); if(tmpPer == 1) vDuration = '1 '+i18n["sDay"]; else vDuration = tmpPer + ' '+i18n["sDays"]; } //else if(vFormat == 'week') { // tmpPer = ((this.getEnd() - this.getStart()) / (24 * 60 * 60 * 1000) + 1)/7; // if(tmpPer == 1) vDuration = '1 Week'; // else vDuration = tmpPer + ' Weeks'; //} //else if(vFormat == 'month') { // tmpPer = ((this.getEnd() - this.getStart()) / (24 * 60 * 60 * 1000) + 1)/30; // if(tmpPer == 1) vDuration = '1 Month'; // else vDuration = tmpPer + ' Months'; //} //else if(vFormat == 'quater') { // tmpPer = ((this.getEnd() - this.getStart()) / (24 * 60 * 60 * 1000) + 1)/120; // if(tmpPer == 1) vDuration = '1 Qtr'; // else vDuration = tmpPer + ' Qtrs'; //} return( vDuration ) }; /** * Returns task parent ID * @method getParent * @return {Number} */ this.getParent = function(){ return vParent }; /** * Returns whether task is a group (1=Yes,0=No) * @method getGroup * @return {Number} */ this.getGroup = function(){ return vGroup }; /** * Returns whether task is open (1=Yes,0=No) * @method getOpen * @return {Boolean} */ this.getOpen = function(){ return vOpen }; /** * Returns task tree level (0,1,2,3...) * @method getLevel * @return {Boolean} */ this.getLevel = function(){ return vLevel }; /** * Returns the number of child tasks * @method getNumKids * @return {Number} */ this.getNumKids = function(){ return vNumKid }; /** * Returns the X position of the left side of the task bar on the graph (right side) * @method getStartX * @return {Number} */ this.getStartX = function(){ return x1 }; /** * Returns the Y position of the top of the task bar on the graph (right side) * @method getStartY * @return {Number} */ this.getStartY = function(){ return y1 }; /** * Returns the X position of the right of the task bar on the graph (right side) * @method getEndX * @return {Int} */ this.getEndX = function(){ return x2 }; /** * Returns the Y position of the bottom of the task bar on the graph (right side) * @method getEndY * @return {Number} */ this.getEndY = function(){ return y2 }; /** * Returns whether task is visible (1=Yes,0=No) * @method getVisible * @return {Boolean} */ this.getVisible = function(){ return vVisible }; /** * Set task dependencies * @method setDepend * @param pDepend {String} A comma delimited list of task IDs the current task depends on. * @return {void} */ this.setDepend = function(pDepend){ vDepend = pDepend;}; /** * Set task start date/time * @method setStart * @param pStart {Datetime} * @return {void} */ this.setStart = function(pStart){ vStart = pStart;}; /** * Set task end date/time * @method setEnd * @param pEnd {Datetime} * @return {void} */ this.setEnd = function(pEnd) { vEnd = pEnd; }; /** * Set task tree level (0,1,2,3...) * @method setLevel * @param pLevel {Number} * @return {void} */ this.setLevel = function(pLevel){ vLevel = pLevel;}; /** * Set Number of children for the task * @method setNumKid * @param pNumKid {Number} * @return {void} */ this.setNumKid = function(pNumKid){ vNumKid = pNumKid;}; /** * Set task completion percentage * @method setCompVal * @param pCompVal {Number} * @return {void} */ this.setCompVal = function(pCompVal){ vComp = pCompVal;}; /** * Set a task bar starting position (left) * @method setStartX * @param pX {Number} * @return {void} */ this.setStartX = function(pX) {x1 = pX; }; /** * Set a task bar starting position (top) * @method setStartY * @param pY {Number} * @return {String} */ this.setStartY = function(pY) {y1 = pY; }; /** * Set a task bar starting position (right) * @method setEndX * @param pX {Number} * @return {String} */ this.setEndX = function(pX) {x2 = pX; }; /** * Set a task bar starting position (bottom) * @method setEndY * @param pY {Number} * @return {String} */ this.setEndY = function(pY) {y2 = pY; }; /** * Set task open/closed * @method setOpen * @param pOpen {Boolean} * @return {void} */ this.setOpen = function(pOpen) {vOpen = pOpen; }; /** * Set task visibility * @method setVisible * @param pVisible {Boolean} * @return {void} */ this.setVisible = function(pVisible) {vVisible = pVisible; }; }; /** * Creates the gant chart. for example:
var g = new JSGantt.GanttChart('g',document.getElementById('GanttChartDIV'), 'day');
var g = new JSGantt.GanttChart( - assign the gantt chart to a javascript variable called 'g' 'g' - the name of the variable that was just assigned (will be used later so that gantt object can reference itself) document.getElementById('GanttChartDIV') - reference to the DIV that will hold the gantt chart 'day' - default format will be by day * * @class GanttChart * @param pGanttVar {String} the name of the gantt chart variable * @param pDiv {String} reference to the DIV that will hold the gantt chart * @param pFormat {String} default format (minute,hour,day,week,month,quarter) * @return void */ JSGantt.GanttChart = function(pGanttVar, pDiv, pFormat) { /** * The name of the gantt chart variable * @property vGanttVar * @type String * @default pGanttVar * @private */ var vGanttVar = pGanttVar; /** * The name of the gantt chart DIV * @property vDiv * @type String * @default pDiv * @private */ var vDiv = pDiv; /** * Selected format (minute,hour,day,week,month) * @property vFormat * @type String * @default pFormat * @private */ var vFormat = pFormat; /** * Show resource column * @property vShowRes * @type Number * @default 1 * @private */ var vShowRes = 1; /** * Show duration column * @property vShowDur * @type Number * @default 1 * @private */ var vShowDur = 1; /** * Show percent complete column * @property vShowComp * @type Number * @default 1 * @private */ var vShowComp = 1; /** * Show start date column * @property vShowStartDate * @type Number * @default 1 * @private */ var vShowStartDate = 1; /** * Show end date column * @property vShowEndDate * @type Number * @default 1 * @private */ var vShowEndDate = 1; /** * Date input format * @property vDateInputFormat * @type String * @default "mm/dd/yyyy" * @private */var vDateInputFormat = "mm/dd/yyyy"; /** * Date display format * @property vDateDisplayFormat * @type String * @default "mm/dd/yy" * @private */var vDateDisplayFormat = "mm/dd/yy"; var vNumUnits = 0; var vCaptionType; var vDepId = 1; var vTaskList = new Array(); var vFormatArr = new Array("day","week","month","quarter"); var vQuarterArr = new Array(1,1,1,2,2,2,3,3,3,4,4,4); var vMonthDaysArr = new Array(31,28,31,30,31,30,31,31,30,31,30,31); var vMonthArr = new Array(i18n["January"],i18n["February"],i18n["March"],i18n["April"],i18n["May"],i18n["June"],i18n["July"],i18n["August"],i18n["September"],i18n["October"],i18n["November"],i18n["December"]); /** * Set current display format (minute/hour/day/week/month/quarter) * Only the first 4 arguments are used, for example: *
* g.setFormatArr("day","week","month");
*
* will show 3 formatting options (day/week/month) at the bottom right of the gantt chart
* @method setFormatArr
* @return {void}
*/ this.setFormatArr = function() {
vFormatArr = new Array();
for(var i = 0; i < arguments.length; i++) {vFormatArr[i] = arguments[i];}
if(vFormatArr.length>4){vFormatArr.length=4;}
};
/**
* Show/Hide resource column
* @param pShow {Number} 1=Show,0=Hide
* @method setShowRes
* @return {void}
*/ this.setShowRes = function(pShow) { vShowRes = pShow; };
/**
* Show/Hide duration column
* @param pShow {Number} 1=Show,0=Hide
* @method setShowDur
* @return {void}
*/ this.setShowDur = function(pShow) { vShowDur = pShow; };
/**
* Show/Hide completed column
* @param pShow {Number} 1=Show,0=Hide
* @method setShowComp
* @return {void}
*/ this.setShowComp = function(pShow) { vShowComp = pShow; };
/**
* Show/Hide start date column
* @param pShow {Number} 1=Show,0=Hide
* @method setShowStartDate
* @return {void}
*/ this.setShowStartDate = function(pShow) { vShowStartDate = pShow; };
/**
* Show/Hide end date column
* @param pShow {Number} 1=Show,0=Hide
* @method setShowEndDate
* @return {void}
*/ this.setShowEndDate = function(pShow) { vShowEndDate = pShow; };
/**
* Overall date input format
* @param pShow {String} (mm/dd/yyyy,dd/mm/yyyy,yyyy-mm-dd)
* @method setDateInputFormat
* @return {void}
*/ this.setDateInputFormat = function(pShow) { vDateInputFormat = pShow; };
/**
* Overall date display format
* @param pShow {String} (mm/dd/yyyy,dd/mm/yyyy,yyyy-mm-dd)
* @method setDateDisplayFormat
* @return {void}
*/ this.setDateDisplayFormat = function(pShow) { vDateDisplayFormat = pShow; };
/**
* Set gantt caption
* @param pType {String}
Caption-Displays a custom caption set in TaskItem
Resource-Displays task resource
Duration-Displays task duration
Complete-Displays task percent complete
';
if(vShowRes !=1) vNameWidth+=vStatusWidth;
if(vShowDur !=1) vNameWidth+=vStatusWidth;
if(vShowComp!=1) vNameWidth+=vStatusWidth;
if(vShowStartDate!=1) vNameWidth+=vStatusWidth;
if(vShowEndDate!=1) vNameWidth+=vStatusWidth;
// DRAW the Left-side of the chart (names, resources, comp%)
vLeftTable =
'
| ';
vMainTable += vLeftTable;
// Draw the Chart Rows
vRightTable =
'' +
' ' +
'
|