Skip to content

Commit 9d77931

Browse files
mariohmolmariohmol
committed
2.6.1 #317 setEventClickCollapse / vEventClickCollapse
1 parent 72b5463 commit 9d77931

File tree

13 files changed

+148
-103
lines changed

13 files changed

+148
-103
lines changed

‎Documentation.md‎

Lines changed: 27 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -299,9 +299,10 @@ The following options take a single numeric parameter; a value of 1 will enable
299299
|_setShowEndWeekDate():_|Controls whether the major heading in "Day" view displays the week end-date in the appropriate format (see [below](#user-content-display-date-formats)), defaults to 1 (show date)|
300300
|_setShowWeekends():_|Controls whether shows the weekend days in the Day view Format, defaults to 1 (show weekends)|
301301
|_setShowDeps():_ |Controls display of dependancy lines, defaults to 1 (show dependencies)|
302-
|_setEvents():_ |Controls events when a task is click in table data. You have to pass an object with the column and function. ex.: ` { taskname: console.log, res: console.log }`|
303-
|_setEventClickRow():_ |Controls events when a task row is cliked. Pass a function to execute ex.: `function(e){console.log(e)}`|
304-
|_setEventsChange():_ |Controls events when a task row is cliked. Pass a function to execute ex.: `{ taskname: function(task, event, cell, column){ console.log(task, event, cell, column); } }`|
302+
|_setEvents():_ |Controls events when a task is click in table data. You have to pass an object with the column and function. ex.: ` vEvents: { taskname: console.log, res: console.log }`|
303+
|_setEventClickRow():_ |Controls events when a task row is clicked. Pass a function to execute ex.: `vEventClickRow: function(e){console.log(e)}`|
304+
|setEventClickCollapse():_ |Controls events when a group task is collapsed (open or close events). Pass a function to execute ex.: `vEventClickCollapse: function(e){console.log(e)}`|
305+
|_setEventsChange():_ |Controls events when a task row is cliked. Pass a function to execute ex.: `vEventsChange: { taskname: function(task, event, cell, column){ console.log(task, event, cell, column); } }`|
305306
|_setAdditionalHeaders:_ |Set object with headers values for additional columns . ex : `{ category: { title: 'Category' }` }|
306307
|_setColumnOrder:_ |Set order of the columns that will be displayed, the default value is : `[ 'vShowRes','vShowDur','vShowComp','vShowStartDate','vShowEndDate','vShowPlanStartDate','vShowPlanEndDate','vShowCost','vAdditionalHeaders','vShowAddEntries']` }|
307308
|_setResources():_ |Set the list of possible resources, must be an array of objects, ex: `[{ id: 1, name: 'Mario' } , { id: 2, name: 'Henrique' }]`|
@@ -485,20 +486,30 @@ g.setOptions({
485486
vUseSingleCell: 10000, // Set the threshold at which we will only use one cell per table row (0 disables). Helps with rendering performance for large charts.
486487
vFormatArr: ['Day', 'Week', 'Month', 'Quarter'], // Even with setUseSingleCell using Hour format on such a large chart can cause issues in some browsers
487488
vScrollTo: new Date(),
489+
490+
// EVENTS
491+
492+
// OnChangee
493+
vEventsChange: {
494+
taskname: console.log,
495+
res: console.log,
496+
},
497+
// EventsClickCell
488498
vEvents: {
489-
taskname: console.log,
490-
res: console.log,
491-
dur: console.log,
492-
comp: console.log,
493-
start: console.log,
494-
end: console.log,
495-
planstart: console.log,
496-
planend: console.log,
497-
cost: console.log,
498-
beforeDraw: ()=>console.log('before draw listener'),
499-
afterDraw: ()=>console.log('before after listener')
500-
},
501-
vEventClickRow: console.log
499+
taskname: console.log,
500+
res: console.log,
501+
dur: console.log,
502+
comp: console.log,
503+
start: console.log,
504+
end: console.log,
505+
planstart: console.log,
506+
planend: console.log,
507+
cost: console.log,
508+
beforeDraw: ()=>console.log('before draw listener'),
509+
afterDraw: ()=>console.log('before after listener')
510+
},
511+
vEventClickRow: console.log,
512+
vEventClickCollapse: console.log
502513
});
503514
504515
// Load from a Json url

‎dist/jsgantt.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ div.gantt {
6565
}
6666

6767
td.gtaskcell {
68-
text-align: left
68+
text-align: left;
6969
}
7070

7171
td.gspanning {

‎dist/jsgantt.js‎

Lines changed: 60 additions & 47 deletions
Large diffs are not rendered by default.

‎docs/index.js‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,7 @@ function start(e) {
7575
vTotalHeight,
7676
vMinDate,
7777
vMaxDate,
78+
// EVENTs
7879
vEvents: {
7980
taskname: console.log,
8081
res: console.log,
@@ -104,13 +105,16 @@ function start(e) {
104105
planend: editValue,
105106
cost: editValue
106107
},
108+
vEventClickRow: console.log,
109+
vEventClickCollapse: console.log,
110+
107111
vResources: [
108112
{ id: 0, name: 'Anybody' },
109113
{ id: 1, name: 'Mario' },
110114
{ id: 2, name: 'Henrique' },
111115
{ id: 3, name: 'Pedro' }
112116
],
113-
vEventClickRow: console.log,
117+
114118
vShowTaskInfoLink, // Show link in tool tip (0/1)
115119
vShowEndWeekDate, // Show/Hide the date for the last day of the week in header for daily view (1/0)
116120
vShowWeekends, // Show weekends days in the vFormat day

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "jsgantt-improved",
3-
"version": "2.6.0",
3+
"version": "2.6.1",
44
"description": "jsgantt-improved",
55
"main": "dist/index.js",
66
"scripts": {

‎src/draw.ts‎

Lines changed: 34 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@ export const GanttChart = function (pDiv, pFormat) {
5858
this.vShowTaskInfoEndDate = 1;
5959
this.vShowTaskInfoNotes = 1;
6060
this.vShowTaskInfoLink = 0;
61-
this.vEventClickRow = 1;
61+
6262
this.vShowDeps = 1;
6363
this.vTotalHeight = undefined;
6464
this.vWorkingDays = {
@@ -70,6 +70,9 @@ export const GanttChart = function (pDiv, pFormat) {
7070
5: true,
7171
6: true
7272
};
73+
74+
this.vEventClickCollapse = null;
75+
this.vEventClickRow = null;
7376
this.vEvents = {
7477
taskname: null,
7578
res: null,
@@ -238,10 +241,16 @@ export const GanttChart = function (pDiv, pFormat) {
238241

239242
const task = this.vTaskList[i];
240243
const vEventClickRow = this.vEventClickRow;
244+
const vEventClickCollapse = this.vEventClickCollapse;
241245
addListener('click', function (e) {
242-
if (e.target.classList.contains('gfoldercollapse') === false &&
243-
vEventClickRow && typeof vEventClickRow === "function") {
244-
vEventClickRow(task);
246+
if (e.target.classList.contains('gfoldercollapse') === false) {
247+
if (vEventClickRow && typeof vEventClickRow === "function") {
248+
vEventClickRow(task);
249+
}
250+
} else {
251+
if (vEventClickCollapse && typeof vEventClickCollapse === "function") {
252+
vEventClickCollapse(task);
253+
}
245254
}
246255
}, vTmpRow);
247256

@@ -374,12 +383,12 @@ export const GanttChart = function (pDiv, pFormat) {
374383
}
375384
}
376385

377-
vTmpRow = newNode(vTmpTBody, 'tr', null, 'footerdays');
386+
vTmpRow = newNode(vTmpTBody, 'tr', null, 'footerdays');
378387

379388
// Minor Date header and Cell Rows
380389
vTmpDate.setFullYear(vMinDate.getFullYear(), vMinDate.getMonth(), vMinDate.getDate()); // , vMinDate.getHours()
381390
if (this.vFormat == 'hour') vTmpDate.setHours(vMinDate.getHours());
382-
let vNumCols = 0;
391+
let vNumCols: number = 0;
383392

384393
while (vTmpDate.getTime() <= vMaxDate.getTime()) {
385394
let vMinorHeaderCellClass = 'gminorheading';
@@ -402,7 +411,6 @@ export const GanttChart = function (pDiv, pFormat) {
402411
vTmpDate.setDate(vTmpDate.getDate() + 1);
403412
}
404413
else if (this.vFormat == 'week') {
405-
console.log(vTmpDate <= vMaxDate, vTmpDate , vMaxDate,'------' )
406414
if (vTmpDate <= vMaxDate) {
407415
const vTmpCell = newNode(vTmpRow, 'td', null, vMinorHeaderCellClass);
408416
newNode(vTmpCell, 'div', null, null, formatDateStr(vTmpDate, this.vWeekMinorDateDisplayFormat, this.vLangs[this.vLang]), vColWidth);
@@ -465,7 +473,7 @@ export const GanttChart = function (pDiv, pFormat) {
465473

466474
vTmpDiv = newNode(vRightHeader, 'div', null, 'glabelfooter');
467475

468-
return { gChartLbl, vTaskLeftPx, vSingleCell, vDateRow, vRightHeader }
476+
return { gChartLbl, vTaskLeftPx, vSingleCell, vDateRow, vRightHeader, vNumCols }
469477
}
470478

471479
/**
@@ -492,7 +500,7 @@ export const GanttChart = function (pDiv, pFormat) {
492500
let bd;
493501
if (this.vDebug) {
494502
bd = new Date();
495-
console.log('before tasks loop', bd);
503+
console.info('before tasks loop', bd);
496504
}
497505
for (i = 0; i < this.vTaskList.length; i++) {
498506
let curTaskStart = this.vTaskList[i].getStart() ? this.vTaskList[i].getStart() : this.vTaskList[i].getPlanStart();
@@ -516,7 +524,7 @@ export const GanttChart = function (pDiv, pFormat) {
516524
const vID = this.vTaskList[i].getID();
517525
let vComb = (this.vTaskList[i].getParItem() && this.vTaskList[i].getParItem().getGroup() == 2);
518526
let vCellFormat = '';
519-
527+
let vTmpDiv = null;
520528
let vTmpItem = this.vTaskList[i];
521529
let vCaptClass = null;
522530
// set cell width only for first row because of table-layout:fixed
@@ -525,8 +533,9 @@ export const GanttChart = function (pDiv, pFormat) {
525533
let vTmpRow = newNode(vTmpTBody, 'tr', this.vDivId + 'childrow_' + vID, 'gmileitem gmile' + this.vFormat, null, null, null, ((this.vTaskList[i].getVisible() == 0) ? 'none' : null));
526534
this.vTaskList[i].setChildRow(vTmpRow);
527535
addThisRowListeners(this, this.vTaskList[i].getListChildRow(), vTmpRow);
528-
const vTmpCell = newNode(vTmpRow, 'td', null, 'gtaskcell', null, taskCellWidth);
529-
let vTmpDiv = newNode(vTmpCell, 'div', null, 'gtaskcelldiv', '\u00A0\u00A0');
536+
const vTmpCell = newNode(vTmpRow, 'td', null, 'gtaskcell s4443', null, null, null, null, vNumCols);
537+
console.log('T ----->', vNumCols)
538+
vTmpDiv = newNode(vTmpCell, 'div', null, 'gtaskcelldiv', '\u00A0\u00A0');
530539
vTmpDiv = newNode(vTmpDiv, 'div', this.vDivId + 'bardiv_' + vID, 'gtaskbarcontainer', null, 12, vTaskLeftPx + vTaskRightPx - 6);
531540

532541
this.vTaskList[i].setBarDiv(vTmpDiv);
@@ -564,8 +573,9 @@ export const GanttChart = function (pDiv, pFormat) {
564573
const vTmpRow = newNode(vTmpTBody, 'tr', this.vDivId + 'childrow_' + vID, ((this.vTaskList[i].getGroup() == 2) ? 'glineitem gitem' : 'ggroupitem ggroup') + this.vFormat, null, null, null, ((this.vTaskList[i].getVisible() == 0) ? 'none' : null));
565574
this.vTaskList[i].setChildRow(vTmpRow);
566575
addThisRowListeners(this, this.vTaskList[i].getListChildRow(), vTmpRow);
567-
const vTmpCell = newNode(vTmpRow, 'td', null, 'gtaskcell', null, taskCellWidth);
568-
let vTmpDiv = newNode(vTmpCell, 'div', null, 'gtaskcelldiv', '\u00A0\u00A0');
576+
console.log('F ----->', vNumCols)
577+
const vTmpCell = newNode(vTmpRow, 'td', null, 'gtaskcell', null, null, null, null, vNumCols);
578+
vTmpDiv = newNode(vTmpCell, 'div', null, 'gtaskcelldiv', '\u00A0\u00A0');
569579
this.vTaskList[i].setCellDiv(vTmpDiv);
570580
if (this.vTaskList[i].getGroup() == 1) {
571581
vTmpDiv = newNode(vTmpDiv, 'div', this.vDivId + 'bardiv_' + vID, 'gtaskbarcontainer', null, vTaskWidth, vTaskLeftPx);
@@ -597,7 +607,7 @@ export const GanttChart = function (pDiv, pFormat) {
597607
/**
598608
* DRAW THE BOXES FOR GANTT
599609
*/
600-
let vTmpDivCell, vTmpDiv, vTmpRow;
610+
let vTmpDivCell, vTmpRow;
601611
if (vComb) {
602612
vTmpDivCell = vTmpDiv = this.vTaskList[i].getParItem().getCellDiv();
603613
}
@@ -606,7 +616,7 @@ export const GanttChart = function (pDiv, pFormat) {
606616
vTmpRow = newNode(vTmpTBody, 'tr', this.vDivId + 'childrow_' + vID, 'glineitem gitem' + this.vFormat, null, null, null, ((this.vTaskList[i].getVisible() == 0) ? 'none' : null));
607617
this.vTaskList[i].setChildRow(vTmpRow);
608618
addThisRowListeners(this, this.vTaskList[i].getListChildRow(), vTmpRow);
609-
const vTmpCell = newNode(vTmpRow, 'td', null, 'gtaskcell', null, taskCellWidth);
619+
const vTmpCell = newNode(vTmpRow, 'td', null, 'gtaskcell', null, taskCellWidth, null, null, vNumCols);
610620
vTmpDivCell = vTmpDiv = newNode(vTmpCell, 'div', null, 'gtaskcelldiv', '\u00A0\u00A0');
611621
}
612622

@@ -681,10 +691,10 @@ export const GanttChart = function (pDiv, pFormat) {
681691
}
682692
}
683693
// if (!vSingleCell) {
684-
vTmpTBody.appendChild(vDateRow.cloneNode(true));
694+
vTmpTBody.appendChild(vDateRow.cloneNode(true));
685695
// }
686696
// else if (this.vFormat == 'day') {
687-
// vTmpTBody.appendChild(document.createElement('tr'));
697+
// vTmpTBody.appendChild(document.createElement('tr'));
688698
// }
689699
return { vRightTable }
690700
}
@@ -708,12 +718,11 @@ export const GanttChart = function (pDiv, pFormat) {
708718
// let vID = 0;
709719
let vMaxDate = new Date();
710720
let vMinDate = new Date();
711-
let vNumCols: number = 0;
712721
let vColWidth = 0;
713722
let bd;
714723
if (this.vDebug) {
715724
bd = new Date();
716-
console.log('before draw', bd);
725+
console.info('before draw', bd);
717726
}
718727

719728
if (this.vTaskList.length === 0) {
@@ -757,7 +766,7 @@ export const GanttChart = function (pDiv, pFormat) {
757766
* CHART HEAD
758767
*/
759768
const { gChartLbl, vTaskLeftPx, vSingleCell, vRightHeader,
760-
vDateRow } = this.drawChartHead(vMinDate, vMaxDate, vColWidth, vNumRows);
769+
vDateRow, vNumCols } = this.drawChartHead(vMinDate, vMaxDate, vColWidth, vNumRows);
761770

762771

763772
/**
@@ -768,7 +777,7 @@ export const GanttChart = function (pDiv, pFormat) {
768777

769778
if (this.vDebug) {
770779
const ad = new Date();
771-
console.log('after tasks loop', ad, (ad.getTime() - bd.getTime()));
780+
console.info('after tasks loop', ad, (ad.getTime() - bd.getTime()));
772781
}
773782

774783

@@ -838,7 +847,7 @@ export const GanttChart = function (pDiv, pFormat) {
838847
let bdd;
839848
if (this.vDebug) {
840849
bdd = new Date();
841-
console.log('before DrawDependencies', bdd);
850+
console.info('before DrawDependencies', bdd);
842851
}
843852
if (this.vEvents && typeof this.vEvents.beforeLineDraw === 'function') {
844853
this.vEvents.beforeLineDraw();
@@ -850,7 +859,7 @@ export const GanttChart = function (pDiv, pFormat) {
850859
}
851860
if (this.vDebug) {
852861
const ad = new Date();
853-
console.log('after DrawDependencies', ad, (ad.getTime() - bdd.getTime()));
862+
console.info('after DrawDependencies', ad, (ad.getTime() - bdd.getTime()));
854863
}
855864

856865
this.drawComplete(vMinDate, vColWidth, bd);
@@ -860,7 +869,7 @@ export const GanttChart = function (pDiv, pFormat) {
860869
this.drawComplete = function (vMinDate, vColWidth, bd) {
861870
if (this.vDebug) {
862871
const ad = new Date();
863-
console.log('after draw', ad, (ad.getTime() - bd.getTime()));
872+
console.info('after draw', ad, (ad.getTime() - bd.getTime()));
864873
}
865874

866875
updateGridHeaderWidth(this);

‎src/draw_dependencies.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,7 @@ export const DrawDependencies = function (vDebug = false) {
6262
if (vTask >= 0 && vList[vTask].getGroup() != 2) {
6363
if (vList[vTask].getVisible() == 1) {
6464
if (vDebug) {
65-
console.log(`init drawDependency `, vList[vTask].getID(), new Date());
65+
console.info(`init drawDependency `, vList[vTask].getID(), new Date());
6666
}
6767
var cssClass = 'gDepId' + vList[vTask].getID() +
6868
' ' + 'gDepNextId' + vList[i].getID();

‎src/events.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -34,12 +34,12 @@ export const folder = function (pID, ganttObj) {
3434
let bd;
3535
if (this.vDebug) {
3636
bd = new Date();
37-
console.log('after drawDependency', bd);
37+
console.info('after drawDependency', bd);
3838
}
3939
ganttObj.DrawDependencies(this.vDebug);
4040
if (this.vDebug) {
4141
const ad = new Date();
42-
console.log('after drawDependency', ad, (ad.getTime() - bd.getTime()));
42+
console.info('after drawDependency', ad, (ad.getTime() - bd.getTime()));
4343
}
4444
};
4545

‎src/jsgantt.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ div.gantt {
6565
}
6666

6767
td.gtaskcell {
68-
text-align: left
68+
text-align: left;
6969
}
7070

7171
td.gspanning {

‎src/json.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,12 +11,12 @@ export const parseJSON = async function (pFile, pGanttVar, vDebug = false, redra
1111
let bd;
1212
if (vDebug) {
1313
bd = new Date();
14-
console.log('before jsonparse', bd);
14+
console.info('before jsonparse', bd);
1515
}
1616
addJSONTask(pGanttVar, jsonObj);
1717
if (this.vDebug) {
1818
const ad = new Date();
19-
console.log('after addJSONTask', ad, (ad.getTime() - bd.getTime()));
19+
console.info('after addJSONTask', ad, (ad.getTime() - bd.getTime()));
2020
}
2121
if(redrawAfter){
2222
pGanttVar.Draw();

0 commit comments

Comments
 (0)