jingrow/gantt
1
0
Fork 0
Code Pull Requests Activity

chore: format

Browse Source
This commit is contained in:
Safwan Samsudeen 2024-04-30 17:51:02 +05:30
parent 5e18b534bf
commit 9cd3633dd7
2 changed files with 54 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
src/bar.js
View File

@ -31,8 +31,8 @@ export default class Bar {
this.width = this.gantt.options.column_width * this.duration; this.width = this.gantt.options.column_width * this.duration;
this.progress_width = this.progress_width =
this.gantt.options.column_width * this.gantt.options.column_width *
this.duration * this.duration *
(this.task.progress / 100) || 0; (this.task.progress / 100) || 0;
this.group = createSVG('g', { this.group = createSVG('g', {
class: class:
'bar-wrapper' + 'bar-wrapper' +
@ -72,8 +72,8 @@ export default class Bar {
this.compute_expected_progress(); this.compute_expected_progress();
this.expected_progress_width = this.expected_progress_width =
this.gantt.options.column_width * this.gantt.options.column_width *
this.duration * this.duration *
(this.expected_progress / 100) || 0; (this.expected_progress / 100) || 0;
} }
draw() { draw() {
@ -92,7 +92,6 @@ export default class Bar {
} }
draw_bar() { draw_bar() {
this.$bar = createSVG('rect', { this.$bar = createSVG('rect', {
x: this.x, x: this.x,
y: this.y, y: this.y,
@ -100,7 +99,12 @@ export default class Bar {
height: this.height, height: this.height,
rx: this.corner_radius, rx: this.corner_radius,
ry: this.corner_radius, ry: this.corner_radius,
class: 'bar' + (/^((?!chrome|android).)*safari/i.test(navigator.userAgent) && !this.task.important ? ' safari' : ''), class:
'bar' +
(/^((?!chrome|android).)*safari/i.test(navigator.userAgent) &&
!this.task.important
? ' safari'
: ''),
append_to: this.bar_group, append_to: this.bar_group,
}); });
@ -249,14 +253,12 @@ export default class Bar {
class: 'handle left', class: 'handle left',
append_to: this.handle_group, append_to: this.handle_group,
}); });
} }
if (!this.gantt.options.progress_readonly) { if (!this.gantt.options.progress_readonly) {
const bar_progress = this.$bar_progress; const bar_progress = this.$bar_progress;
this.$handle_progress = createSVG('circle', { this.$handle_progress = createSVG('circle', {
cx: bar_progress.getEndX(), cx: bar_progress.getEndX(),
cy: bar_progress.getY() + cy: bar_progress.getY() + bar_progress.getHeight() / 2,
bar_progress.getHeight() / 2,
r: 5, r: 5,
class: 'handle progress', class: 'handle progress',
append_to: this.handle_group, append_to: this.handle_group,
@ -285,12 +287,12 @@ export default class Bar {
this.group, this.group,
'mouseenter', 'mouseenter',
(e) => (e) =>
(timeout = setTimeout(() => { (timeout = setTimeout(() => {
this.show_popup(e.offsetX || e.layerX); this.show_popup(e.offsetX || e.layerX);
document.getElementById( document.getElementById(
`${task_id}-highlight`, `${task_id}-highlight`,
).style.display = 'block'; ).style.display = 'block';
}, 200)), }, 200)),
); );
$.on(this.group, 'mouseleave', () => { $.on(this.group, 'mouseleave', () => {
@ -300,7 +302,7 @@ export default class Bar {
'none'; 'none';
}); });
$.on(this.group, "click", () => { $.on(this.group, 'click', () => {
this.gantt.trigger_event('click', [this.task]); this.gantt.trigger_event('click', [this.task]);
}); });
@ -309,8 +311,9 @@ export default class Bar {
// just finished a move action, wait for a few seconds // just finished a move action, wait for a few seconds
return; return;
} }
this.group.classList.remove('active') this.group.classList.remove('active');
if (this.gantt.popup) this.gantt.popup.parent.classList.remove('hidden'); if (this.gantt.popup)
this.gantt.popup.parent.classList.remove('hidden');
this.gantt.trigger_event('double_click', [this.task]); this.gantt.trigger_event('double_click', [this.task]);
}); });
@ -449,12 +452,14 @@ export default class Bar {
x_in_units * this.gantt.options.step, x_in_units * this.gantt.options.step,
'hour', 'hour',
); );
const start_offset = this.gantt.gantt_start.getTimezoneOffset() - new_start_date.getTimezoneOffset(); const start_offset =
this.gantt.gantt_start.getTimezoneOffset() -
new_start_date.getTimezoneOffset();
if (start_offset) { if (start_offset) {
new_start_date = date_utils.add( new_start_date = date_utils.add(
new_start_date, new_start_date,
start_offset, start_offset,
'minute' 'minute',
); );
} }
@ -562,8 +567,8 @@ export default class Bar {
this.$expected_bar_progress.setAttribute( this.$expected_bar_progress.setAttribute(
'width', 'width',
this.gantt.options.column_width * this.gantt.options.column_width *
this.duration * this.duration *
(this.expected_progress / 100) || 0, (this.expected_progress / 100) || 0,
); );
} }

50
src/index.js
View File

@ -78,7 +78,7 @@ export default class Gantt {
} else { } else {
throw new TypeError( throw new TypeError(
'Frappé Gantt only supports usage of a string CSS selector,' + '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",
); );
} }
@ -144,7 +144,7 @@ export default class Gantt {
if (diff < 0) { if (diff < 0) {
throw Error( throw Error(
"start of task can't be after end of task: in task #, " + "start of task can't be after end of task: in task #, " +
(i + 1), (i + 1),
); );
} }
// make task invalid if duration too large // make task invalid if duration too large
@ -390,7 +390,7 @@ export default class Gantt {
this.options.header_height + this.options.header_height +
this.options.padding + this.options.padding +
(this.options.bar_height + this.options.padding) * (this.options.bar_height + this.options.padding) *
this.tasks.length; this.tasks.length;
createSVG('rect', { createSVG('rect', {
x: 0, x: 0,
@ -621,7 +621,7 @@ export default class Gantt {
x + x +
(date_utils.diff(today, this.gantt_start, 'hour') / (date_utils.diff(today, this.gantt_start, 'hour') /
this.options.step) * this.options.step) *
this.options.column_width, this.options.column_width,
date: today, date: today,
}; };
} }
@ -776,10 +776,10 @@ export default class Gantt {
date.getDate() !== last_date.getDate() date.getDate() !== last_date.getDate()
? date.getMonth() !== last_date.getMonth() ? date.getMonth() !== last_date.getMonth()
? date_utils.format( ? date_utils.format(
date, date,
'D MMM', 'D MMM',
this.options.language, this.options.language,
) )
: date_utils.format(date, 'D', this.options.language) : date_utils.format(date, 'D', this.options.language)
: '', : '',
Day_upper: Day_upper:
@ -801,7 +801,7 @@ export default class Gantt {
}; };
let column_width = this.view_is(VIEW_MODE.MONTH) let column_width = this.view_is(VIEW_MODE.MONTH)
? (date_utils.get_days_in_month(date) * this.options.column_width) / ? (date_utils.get_days_in_month(date) * this.options.column_width) /
30 30
: this.options.column_width; : this.options.column_width;
const base_pos = { const base_pos = {
x: last_date_info x: last_date_info
@ -833,17 +833,17 @@ export default class Gantt {
base_pos_x: base_pos.x, base_pos_x: base_pos.x,
upper_text: this.options.lower_text upper_text: this.options.lower_text
? this.options.upper_text( ? this.options.upper_text(
date, date,
this.options.view_mode, this.options.view_mode,
date_text[`${this.options.view_mode}_upper`], date_text[`${this.options.view_mode}_upper`],
) )
: date_text[`${this.options.view_mode}_upper`], : date_text[`${this.options.view_mode}_upper`],
lower_text: this.options.lower_text lower_text: this.options.lower_text
? this.options.lower_text( ? this.options.lower_text(
date, date,
this.options.view_mode, this.options.view_mode,
date_text[`${this.options.view_mode}_lower`], date_text[`${this.options.view_mode}_lower`],
) )
: date_text[`${this.options.view_mode}_lower`], : 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`],
upper_y: base_pos.upper_y, upper_y: base_pos.upper_y,
@ -919,7 +919,7 @@ export default class Gantt {
const scroll_pos = const scroll_pos =
(hours_before_first_task / this.options.step) * (hours_before_first_task / this.options.step) *
this.options.column_width - this.options.column_width -
this.options.column_width; this.options.column_width;
parent_element.scrollTo({ left: scroll_pos, behavior: 'smooth' }); parent_element.scrollTo({ left: scroll_pos, behavior: 'smooth' });
} }
@ -955,9 +955,9 @@ export default class Gantt {
return is_dragging || is_resizing_left || is_resizing_right; return is_dragging || is_resizing_left || is_resizing_right;
} }
this.$svg.onclick = e => { this.$svg.onclick = (e) => {
if (e.target.classList.contains('grid-row')) this.unselect_all() if (e.target.classList.contains('grid-row')) this.unselect_all();
} };
$.on(this.$svg, 'mousedown', '.bar-wrapper, .handle', (e, element) => { $.on(this.$svg, 'mousedown', '.bar-wrapper, .handle', (e, element) => {
const bar_wrapper = $.closest('.bar-wrapper', element); const bar_wrapper = $.closest('.bar-wrapper', element);
@ -1064,7 +1064,7 @@ export default class Gantt {
$.on(this.$svg, 'mousemove', (e) => { $.on(this.$svg, 'mousemove', (e) => {
if (!action_in_progress()) return; if (!action_in_progress()) return;
console.log(e) console.log(e);
const dx = (e.offsetX || e.layerX) - x_on_start; const dx = (e.offsetX || e.layerX) - x_on_start;
bars.forEach((bar) => { bars.forEach((bar) => {
@ -1088,7 +1088,11 @@ export default class Gantt {
width: $bar.owidth + $bar.finaldx, width: $bar.owidth + $bar.finaldx,
}); });
} }
} else if (is_dragging && !this.options.readonly && !this.options.dates_readonly) { } else if (
is_dragging &&
!this.options.readonly &&
!this.options.dates_readonly
) {
bar.update_bar_position({ x: $bar.ox + $bar.finaldx }); bar.update_bar_position({ x: $bar.ox + $bar.finaldx });
} }
}); });