From 9e64337ea80538748819ec3584a5447451615c03 Mon Sep 17 00:00:00 2001 From: Safwan Samsudeen Date: Wed, 11 Sep 2024 20:19:18 +0530 Subject: [PATCH] chore: format, license, bump version --- license.txt | 2 +- package.json | 2 +- src/bar.js | 29 ++++++------ src/date_utils.js | 2 +- src/index.js | 109 ++++++++++++++++++++++++++-------------------- 5 files changed, 79 insertions(+), 65 deletions(-) diff --git a/license.txt b/license.txt index dfb970c..5eacdc3 100644 --- a/license.txt +++ b/license.txt @@ -1,6 +1,6 @@ The MIT License (MIT) -Copyright (c) 2016 Frappe Technologies Pvt. Ltd. +Copyright (c) 2024 Frappe Technologies Pvt. Ltd. Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: diff --git a/package.json b/package.json index 2d2227f..45faccf 100755 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "frappe-gantt", - "version": "0.7", + "version": "0.8", "description": "A simple, modern, interactive gantt library for the web", "main": "src/index.js", "type": "module", diff --git a/src/bar.js b/src/bar.js index 73f9932..afa469b 100644 --- a/src/bar.js +++ b/src/bar.js @@ -31,8 +31,8 @@ export default class Bar { this.width = this.gantt.options.column_width * this.duration; this.progress_width = this.gantt.options.column_width * - this.duration * - (this.task.progress / 100) || 0; + this.duration * + (this.task.progress / 100) || 0; this.group = createSVG('g', { class: 'bar-wrapper' + @@ -72,8 +72,8 @@ export default class Bar { this.compute_expected_progress(); this.expected_progress_width = this.gantt.options.column_width * - this.duration * - (this.expected_progress / 100) || 0; + this.duration * + (this.expected_progress / 100) || 0; } draw() { @@ -102,7 +102,7 @@ export default class Bar { class: 'bar' + (/^((?!chrome|android).)*safari/i.test(navigator.userAgent) && - !this.task.important + !this.task.important ? ' safari' : ''), append_to: this.bar_group, @@ -287,12 +287,12 @@ export default class Bar { this.group, 'mouseenter', (e) => - (timeout = setTimeout(() => { - this.show_popup(e.offsetX || e.layerX); - document.getElementById( - `${task_id}-highlight`, - ).style.display = 'block'; - }, 200)), + (timeout = setTimeout(() => { + this.show_popup(e.offsetX || e.layerX); + document.getElementById( + `${task_id}-highlight`, + ).style.display = 'block'; + }, 200)), ); $.on(this.group, 'mouseleave', () => { @@ -567,8 +567,8 @@ export default class Bar { this.$expected_bar_progress.setAttribute( 'width', this.gantt.options.column_width * - this.duration * - (this.expected_progress / 100) || 0, + this.duration * + (this.expected_progress / 100) || 0, ); } @@ -634,8 +634,7 @@ export default class Bar { .querySelector('.handle.right') .setAttribute('x', bar.getEndX() + 4); const handle = this.group.querySelector('.handle.progress'); - handle && - handle.setAttribute('cx', this.$bar_progress.getEndX()); + handle && handle.setAttribute('cx', this.$bar_progress.getEndX()); } update_arrow_position() { diff --git a/src/date_utils.js b/src/date_utils.js index 40b9bd7..716d2ae 100644 --- a/src/date_utils.js +++ b/src/date_utils.js @@ -25,7 +25,7 @@ export default { parse_duration(duration) { const regex = /([0-9]+)(y|m|d|h|min|s|ms)/gm; const matches = regex.exec(duration); - console.log(matches) + console.log(matches); if (matches !== null) { if (matches[2] === 'y') { return { duration: parseInt(matches[1]), scale: `year` }; diff --git a/src/index.js b/src/index.js index 7146111..9d8ddaf 100644 --- a/src/index.js +++ b/src/index.js @@ -77,7 +77,7 @@ export default class Gantt { } else { throw new TypeError( 'Frappe 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", ); } @@ -143,7 +143,7 @@ export default class Gantt { if (diff < 0) { throw Error( "start of task can't be after end of task: in task #, " + - (i + 1), + (i + 1), ); } // make task invalid if duration too large @@ -358,7 +358,7 @@ export default class Gantt { this.map_arrows_on_bars(); this.set_width(); this.set_scroll_position(this.options.scroll_to); - this.update_button_position() + this.update_button_position(); } setup_layers() { @@ -390,7 +390,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, @@ -494,15 +494,20 @@ export default class Gantt { $today_button.textContent = 'Today'; $today_button.onclick = this.scroll_today.bind(this); $side_header.appendChild($today_button); - this.$today_button = $today_button + this.$today_button = $today_button; } - this.$header.appendChild($side_header); - this.$side_header = $side_header + this.$side_header = $side_header; - window.addEventListener('scroll', this.update_button_position.bind(this)); - window.addEventListener('resize', this.update_button_position.bind(this)); + window.addEventListener( + 'scroll', + this.update_button_position.bind(this), + ); + window.addEventListener( + 'resize', + this.update_button_position.bind(this), + ); } update_button_position() { @@ -511,8 +516,11 @@ export default class Gantt { const { left, y } = this.$header.getBoundingClientRect(); // Check if the button is scrolled out of the container vertically - console.log('heyy') - if (buttonRect.top < containerRect.top || buttonRect.bottom > containerRect.bottom) { + console.log('heyy'); + if ( + buttonRect.top < containerRect.top || + buttonRect.bottom > containerRect.bottom + ) { this.$side_header.style.position = 'absolute'; this.$side_header.style.top = `${containerRect.scrollTop + buttonRect.top}px`; } else { @@ -530,7 +538,7 @@ export default class Gantt { width - this.$side_header.clientWidth + 'px'; - + // Update the left value on page resize this.$today_button.style.left = `${containerRect.left + 20}px`; } @@ -643,7 +651,7 @@ export default class Gantt { x + (date_utils.diff(today, this.gantt_start, 'hour') / this.options.step) * - this.options.column_width, + this.options.column_width, date: today, }; } @@ -672,7 +680,7 @@ export default class Gantt { } make_grid_highlights() { - if (this.options.highlight_weekend) this.highlightWeekends() + if (this.options.highlight_weekend) this.highlightWeekends(); // highlight today's | week's | month's | year's if ( this.view_is(VIEW_MODE.DAY) || @@ -681,16 +689,28 @@ export default class Gantt { this.view_is(VIEW_MODE.YEAR) ) { // Used as we must find the _end_ of session if view is not Day - const { x: left, date } = this.computeGridHighlightDimensions(this.options.view_mode) - if (!this.dates.find(d => d.getTime() == date.getTime())) return; + const { x: left, date } = this.computeGridHighlightDimensions( + this.options.view_mode, + ); + if (!this.dates.find((d) => d.getTime() == date.getTime())) return; const top = this.options.header_height + this.options.padding / 2; - const height = (this.options.bar_height + this.options.padding) * this.tasks.length; - this.$current_highlight = this.create_el({ top, left, height, classes: 'current-highlight', append_to: this.$container }) - let $today = document.getElementById(date_utils.format(date).replaceAll(' ', '_')) + const height = + (this.options.bar_height + this.options.padding) * + this.tasks.length; + this.$current_highlight = this.create_el({ + top, + left, + height, + classes: 'current-highlight', + append_to: this.$container, + }); + let $today = document.getElementById( + date_utils.format(date).replaceAll(' ', '_'), + ); if ($today) { - $today.classList.add('current-date-highlight') - $today.style.top = +$today.style.top.slice(0, -2) - 4 + 'px' - $today.style.left = +$today.style.left.slice(0, -2) - 8 + 'px' + $today.classList.add('current-date-highlight'); + $today.style.top = +$today.style.top.slice(0, -2) - 4 + 'px'; + $today.style.left = +$today.style.left.slice(0, -2) - 8 + 'px'; } } } @@ -788,10 +808,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: @@ -813,7 +833,7 @@ export default class Gantt { }; let column_width = this.view_is(VIEW_MODE.MONTH) ? (date_utils.get_days_in_month(date) * this.options.column_width) / - 30 + 30 : this.options.column_width; const base_pos = { x: last_date_info @@ -845,17 +865,17 @@ export default class Gantt { base_pos_x: base_pos.x, upper_text: this.options.lower_text ? this.options.upper_text( - date, - this.options.view_mode, - date_text[`${this.options.view_mode}_upper`], - ) + date, + this.options.view_mode, + date_text[`${this.options.view_mode}_upper`], + ) : date_text[`${this.options.view_mode}_upper`], lower_text: this.options.lower_text ? this.options.lower_text( - date, - this.options.view_mode, - date_text[`${this.options.view_mode}_lower`], - ) + date, + this.options.view_mode, + 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_y: base_pos.upper_y, @@ -931,7 +951,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.scrollTo({ left: scroll_pos, behavior: 'smooth' }); } @@ -941,15 +961,10 @@ export default class Gantt { } bind_grid_click() { - $.on( - this.$svg, - 'click', - '.grid-row, .grid-header', - () => { - this.unselect_all(); - this.hide_popup(); - }, - ); + $.on(this.$svg, 'click', '.grid-row, .grid-header', () => { + this.unselect_all(); + this.hide_popup(); + }); } bind_bar_events() { @@ -983,8 +998,8 @@ export default class Gantt { is_dragging = true; } - bar_wrapper.classList.add("active"); - if (this.popup) this.popup.parent.classList.add('hidden') + bar_wrapper.classList.add('active'); + if (this.popup) this.popup.parent.classList.add('hidden'); if (this.popup) this.popup.parent.classList.add('hidden');