jingrow/gantt
1
0
Fork 0
Code Pull Requests Activity

chore: replace var with let, improve demo, build

Browse Source
This commit is contained in:
Safwan Samsudeen 2024-04-14 17:59:53 +05:30
parent c13c9c08ec
commit 94d2cf5772
6 changed files with 57 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

78
dist/frappe-gantt.js vendored
View File

@ -39,25 +39,23 @@ var Gantt = (function () {
if (typeof date === "string") { if (typeof date === "string") {
let date_parts, time_parts; let date_parts, time_parts;
const parts = date.split(" "); const parts = date.split(" ");
date_parts = parts[0] date_parts = parts[0]
.split(date_separator) .split(date_separator)
.map((val) => parseInt(val, 10)); .map((val) => parseInt(val, 10));
time_parts = parts[1] && parts[1].split(time_separator); time_parts = parts[1] && parts[1].split(time_separator);
// month is 0 indexed // month is 0 indexed
date_parts[1] = date_parts[1] - 1; date_parts[1] = date_parts[1] ? date_parts[1] - 1 : 0;
let vals = date_parts; let vals = date_parts;
if (time_parts && time_parts.length) { if (time_parts && time_parts.length) {
if (time_parts.length == 4) { if (time_parts.length === 4) {
time_parts[3] = "0." + time_parts[3]; time_parts[3] = "0." + time_parts[3];
time_parts[3] = parseFloat(time_parts[3]) * 1000; time_parts[3] = parseFloat(time_parts[3]) * 1000;
} }
vals = vals.concat(time_parts); vals = vals.concat(time_parts);
} }
return new Date(...vals); return new Date(...vals);
} }
}, },
@ -113,13 +111,13 @@ var Gantt = (function () {
.sort((a, b) => b.length - a.length) // big string first .sort((a, b) => b.length - a.length) // big string first
.forEach((key) => { .forEach((key) => {
if (str.includes(key)) { if (str.includes(key)) {
str = str.replace(key, `$${formatted_values.length}`); str = str.replaceAll(key, `$${formatted_values.length}`);
formatted_values.push(format_map[key]); formatted_values.push(format_map[key]);
} }
}); });
formatted_values.forEach((value, i) => { formatted_values.forEach((value, i) => {
str = str.replace(`$${i}`, value); str = str.replaceAll(`$${i}`, value);
}); });
return str; return str;
@ -232,7 +230,7 @@ var Gantt = (function () {
// Feb // Feb
const year = date.getFullYear(); const year = date.getFullYear();
if ((year % 4 == 0 && year % 100 != 0) || year % 400 == 0) { if ((year % 4 === 0 && year % 100 != 0) || year % 400 === 0) {
return 29; return 29;
} }
return 28; return 28;
@ -645,15 +643,25 @@ var Gantt = (function () {
} }
setup_click_event() { setup_click_event() {
let in_action = false;
$.on(this.group, "mouseover", (e) => this.gantt.trigger_event("hover", [this.task, e.screenX, e.screenY, e]));
$.on(this.group, "focus " + this.gantt.options.popup_trigger, (e) => { $.on(this.group, "focus " + this.gantt.options.popup_trigger, (e) => {
this.gantt.trigger_event("click", [this.task]);
if (this.action_completed) { if (this.action_completed) {
// just finished a move action, wait for a few seconds // just finished a move action, wait for a few seconds
return; return;
} }
if (in_action) {
this.gantt.hide_popup();
this.group.classList.remove("active");
} else {
this.show_popup(); this.show_popup();
this.gantt.unselect_all(); this.gantt.unselect_all();
this.group.classList.add("active"); this.group.classList.add("active");
}
in_action = !in_action;
}); });
$.on(this.group, "dblclick", (e) => { $.on(this.group, "dblclick", (e) => {
@ -662,7 +670,7 @@ var Gantt = (function () {
return; return;
} }
this.gantt.trigger_event("click", [this.task]); this.gantt.trigger_event("double_click", [this.task]);
}); });
} }
@ -1292,7 +1300,7 @@ var Gantt = (function () {
if (task.dependencies) { if (task.dependencies) {
deps = task.dependencies deps = task.dependencies
.split(",") .split(",")
.map((d) => d.trim()) .map((d) => d.trim().replaceAll(' ', '_'))
.filter((d) => d); .filter((d) => d);
} }
task.dependencies = deps; task.dependencies = deps;
@ -1302,7 +1310,7 @@ var Gantt = (function () {
if (!task.id) { if (!task.id) {
task.id = generate_id(task); task.id = generate_id(task);
} else if (typeof task.id === 'string') { } else if (typeof task.id === 'string') {
task.id = task.id.replace(' ', '_'); task.id = task.id.replaceAll(' ', '_');
} else { } else {
task.id = `${task.id}`; task.id = `${task.id}`;
} }
@ -1395,8 +1403,7 @@ var Gantt = (function () {
const [padding_start, padding_end] = this.options.view_mode_padding[ const [padding_start, padding_end] = this.options.view_mode_padding[
viewKey viewKey
].map(date_utils.parse_duration); ].map(date_utils.parse_duration);
gantt_start = date_utils.add(
this.gantt_start = date_utils.add(
gantt_start, gantt_start,
-padding_start.duration, -padding_start.duration,
padding_start.scale, padding_start.scale,
@ -1412,15 +1419,8 @@ var Gantt = (function () {
} else { } else {
format_string = "YYYY-MM-DD HH"; format_string = "YYYY-MM-DD HH";
} }
this.gantt_start = date_utils.parse(date_utils.format(gantt_start, format_string));
this.gantt_start = new Date(
date_utils.format(
date_utils.add(gantt_start, -padding_end.duration, padding_end.scale),
format_string
)
);
this.gantt_start.setHours(0, 0, 0, 0); this.gantt_start.setHours(0, 0, 0, 0);
this.gantt_end = date_utils.add( this.gantt_end = date_utils.add(
gantt_end, gantt_end,
padding_end.duration, padding_end.duration,
@ -1594,8 +1594,9 @@ var Gantt = (function () {
} }
highlightWeekends() { highlightWeekends() {
if (!this.view_is('Day') && !this.view_is('Half Day')) return
for (let d = new Date(this.gantt_start); d <= this.gantt_end; d.setDate(d.getDate() + 1)) { for (let d = new Date(this.gantt_start); d <= this.gantt_end; d.setDate(d.getDate() + 1)) {
if (d.getDay() == 0 || d.getDay() == 6) { if (d.getDay() === 0 || d.getDay() === 6) {
const x = (date_utils.diff(d, this.gantt_start, 'hour') / const x = (date_utils.diff(d, this.gantt_start, 'hour') /
this.options.step) * this.options.step) *
this.options.column_width; this.options.column_width;
@ -1606,7 +1607,7 @@ var Gantt = (function () {
createSVG('rect', { createSVG('rect', {
x, x,
y: 0, y: 0,
width: this.options.column_width, width: (this.view_is('Day') ? 1 : 2) * this.options.column_width,
height, height,
class: 'holiday-highlight', class: 'holiday-highlight',
append_to: this.layers.grid, append_to: this.layers.grid,
@ -1725,16 +1726,15 @@ var Gantt = (function () {
let last_date = null; let last_date = null;
const dates = this.dates.map((date, i) => { const dates = this.dates.map((date, i) => {
const d = this.get_date_info(date, last_date, i); const d = this.get_date_info(date, last_date, i);
last_date = date; last_date = d;
return d; return d;
}); });
return dates; return dates;
} }
get_date_info(date, last_date, i) { get_date_info(date, last_date_info, i) {
if (!last_date) { let last_date = last_date_info ? last_date_info.date : date_utils.add(date, 1, "day");
last_date = date_utils.add(date, 1, "day");
}
const date_text = { const date_text = {
Hour_lower: date_utils.format(date, "HH", this.options.language), Hour_lower: date_utils.format(date, "HH", this.options.language),
"Quarter Day_lower": date_utils.format(date, "HH", this.options.language), "Quarter Day_lower": date_utils.format(date, "HH", this.options.language),
@ -1780,9 +1780,11 @@ var Gantt = (function () {
? date_utils.format(date, "YYYY", this.options.language) ? date_utils.format(date, "YYYY", this.options.language)
: "", : "",
}; };
let column_width = this.view_is(VIEW_MODE.MONTH) ? (date_utils.get_days_in_month(date) * this.options.column_width) / 30 : this.options.column_width;
const base_pos = { const base_pos = {
x: i * this.options.column_width, x: last_date_info
? last_date_info.base_pos_x + last_date_info.column_width
: 0,
lower_y: this.options.header_height, lower_y: this.options.header_height,
upper_y: this.options.header_height - 25, upper_y: this.options.header_height - 25,
}; };
@ -1798,13 +1800,16 @@ var Gantt = (function () {
Day_upper: (this.options.column_width * 30) / 2, Day_upper: (this.options.column_width * 30) / 2,
Week_lower: 0, Week_lower: 0,
Week_upper: (this.options.column_width * 4) / 2, Week_upper: (this.options.column_width * 4) / 2,
Month_lower: this.options.column_width / 2, Month_lower: column_width / 2,
Month_upper: (this.options.column_width * 12) / 2, Month_upper: (column_width * 12) / 2,
Year_lower: this.options.column_width / 2, Year_lower: this.options.column_width / 2,
Year_upper: (this.options.column_width * 30) / 2, Year_upper: (this.options.column_width * 30) / 2,
}; };
return { return {
date,
column_width,
base_pos_x: base_pos.x,
upper_text: date_text[`${this.options.view_mode}_upper`], upper_text: date_text[`${this.options.view_mode}_upper`],
lower_text: date_text[`${this.options.view_mode}_lower`], lower_text: date_text[`${this.options.view_mode}_lower`],
upper_x: base_pos.x + x_pos[`${this.options.view_mode}_upper`], upper_x: base_pos.x + x_pos[`${this.options.view_mode}_upper`],
@ -2070,8 +2075,13 @@ var Gantt = (function () {
$.on(this.$svg, "mouseup", () => { $.on(this.$svg, "mouseup", () => {
is_resizing = false; is_resizing = false;
if (!($bar_progress && $bar_progress.finaldx)) return; if (!($bar_progress && $bar_progress.finaldx)) return;
$bar_progress.finaldx = 0;
bar.progress_changed(); bar.progress_changed();
bar.set_action_completed(); bar.set_action_completed();
bar = null;
$bar_progress = null;
$bar = null;
}); });
} }
@ -2142,13 +2152,13 @@ var Gantt = (function () {
get_task(id) { get_task(id) {
return this.tasks.find((task) => { return this.tasks.find((task) => {
return task.id == id; return task.id === id;
}); });
} }
get_bar(id) { get_bar(id) {
return this.bars.find((bar) => { return this.bars.find((bar) => {
return bar.task.id == id; return bar.task.id === id;
}); });
} }

2
dist/frappe-gantt.js.map vendored
View File

File diff suppressed because one or more lines are too long

2
dist/frappe-gantt.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/frappe-gantt.min.js.map vendored
View File

File diff suppressed because one or more lines are too long

9
index.html
View File

@ -32,7 +32,7 @@
<div class="gantt-target"></div> <div class="gantt-target"></div>
</div> </div>
<script> <script>
var tasks = [ let tasks = [
{ {
start: '2018-10-01', start: '2018-10-01',
end: '2018-10-08', end: '2018-10-08',
@ -90,7 +90,11 @@
// progress: 0 // progress: 0
// } // }
]; ];
var gantt_chart = new Gantt(".gantt-target", tasks, {
// Uncomment to test fixed header
// tasks = [...tasks, ...Array.from({length: tasks.length * 3}, (_, i) => ({...tasks[i % 3], id: i}))]
let gantt_chart = new Gantt(".gantt-target", tasks, {
on_click: (task) => { on_click: (task) => {
console.log("Double Click", task); console.log("Double Click", task);
}, },
@ -112,6 +116,7 @@
view_mode: "Day", view_mode: "Day",
view_mode_padding: { DAY: "7d" }, view_mode_padding: { DAY: "7d" },
language: "en", language: "en",
// readonly: true
}); });
console.log(gantt_chart); console.log(gantt_chart);
</script> </script>

2
src/bar.js
View File

@ -583,7 +583,7 @@ export default class Bar {
} }
function isFunction(functionToCheck) { function isFunction(functionToCheck) {
var getType = {}; let getType = {};
return ( return (
functionToCheck && functionToCheck &&
getType.toString.call(functionToCheck) === "[object Function]" getType.toString.call(functionToCheck) === "[object Function]"