diff --git a/index.html b/index.html index 34cb4d2..3261b02 100644 --- a/index.html +++ b/index.html @@ -42,7 +42,7 @@ }, { start: '2018-10-03', - end: '2018-10-06', + duration: '1m 4d', name: 'Write new content', id: "Task 1", progress: 5, diff --git a/src/date_utils.js b/src/date_utils.js index 3782cea..43aaf5f 100644 --- a/src/date_utils.js +++ b/src/date_utils.js @@ -7,6 +7,28 @@ const SECOND = 'second'; const MILLISECOND = 'millisecond'; export default { + parse_duration(duration) { + const regex = /([0-9])+(y|m|d|h|min|s|ms)/gm; + const matches = regex.exec(duration); + + if (matches !== null) { + if (matches[2] === "y") { + return { duration: parseInt(matches[1]), scale: `year` }; + } else if (matches[2] === "m") { + return { duration: parseInt(matches[1]), scale: `month` }; + } else if (matches[2] === "d") { + return { duration: parseInt(matches[1]), scale: `day` }; + } else if (matches[2] === "h") { + return { duration: parseInt(matches[1]), scale: `hour` }; + } else if (matches[2] === "min") { + return { duration: parseInt(matches[1]), scale: `minute` }; + } else if (matches[2] === "s") { + return { duration: parseInt(matches[1]), scale: `second` }; + } else if (matches[2] === "ms") { + return { duration: parseInt(matches[1]), scale: `millisecond` }; + } + } + }, parse(date, date_separator = '-', time_separator = /[.:]/) { if (date instanceof Date) { return date; diff --git a/src/index.js b/src/index.js index 5039c7c..758e413 100644 --- a/src/index.js +++ b/src/index.js @@ -42,7 +42,7 @@ export default class Gantt { } else { throw new TypeError( 'Frappé Gantt only supports usage of a string CSS selector,' + - " HTML DOM element or SVG DOM element for the 'element' parameter" + " HTML DOM element or SVG DOM element for the 'element' parameter" ); } @@ -96,6 +96,15 @@ export default class Gantt { this.tasks = tasks.map((task, i) => { // convert to Date objects task._start = date_utils.parse(task.start); + if (task.end === undefined && task.duration !== undefined) { + task.end = task._start; + let durations = task.duration.split(" "); + + durations.forEach(tmpDuration => { + let { duration, scale } = date_utils.parse_duration(tmpDuration); + task.end = date_utils.add(task.end, duration, scale); + }) + } task._end = date_utils.parse(task.end); // make task invalid if duration too large @@ -307,7 +316,7 @@ export default class Gantt { this.options.header_height + this.options.padding + (this.options.bar_height + this.options.padding) * - this.tasks.length; + this.tasks.length; createSVG('rect', { x: 0, @@ -455,7 +464,7 @@ export default class Gantt { const width = this.options.column_width; const height = (this.options.bar_height + this.options.padding) * - this.tasks.length + + this.tasks.length + this.options.header_height + this.options.padding / 2; @@ -557,10 +566,10 @@ export default class Gantt { date.getDate() !== last_date.getDate() ? date.getMonth() !== last_date.getMonth() ? date_utils.format( - date, - 'D MMM', - this.options.language - ) + date, + 'D MMM', + this.options.language + ) : date_utils.format(date, 'D', this.options.language) : '', Day_upper: @@ -674,7 +683,7 @@ export default class Gantt { const scroll_pos = (hours_before_first_task / this.options.step) * - this.options.column_width - + this.options.column_width - this.options.column_width; parent_element.scrollLeft = scroll_pos;