forked from Silvacom/colResize
-
Notifications
You must be signed in to change notification settings - Fork 0
/
dataTables.colResize.js
846 lines (737 loc) · 35.8 KB
/
dataTables.colResize.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
/*! ColResize 0.0.10
*/
/**
* @summary ColResize
* @description Provide the ability to resize columns in a DataTable
* @version 0.0.10
* @file dataTables.colResize.js
* @author Silvacom Ltd.
*
* For details please refer to: http://www.datatables.net
*
* Special thank to everyone who has contributed to this plug in
* - dykstrad
* - tdillan (for 0.0.3 and 0.0.5 bug fixes)
* - kylealonius (for 0.0.8 bug fix)
* - the86freak (for 0.0.9 bug fix)
*/
(function (window, document, undefined) {
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* DataTables plug-in API functions test
*
* This are required by ColResize in order to perform the tasks required, and also keep this
* code portable, to be used for other column resize projects with DataTables, if needed.
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
var factory = function ($, DataTable) {
"use strict";
/**
* Plug-in for DataTables which will resize the columns depending on the handle clicked
* @method $.fn.dataTableExt.oApi.fnColResize
* @param object oSettings DataTables settings object - automatically added by DataTables!
* @param int iCol Take the column to be resized
* @returns void
*/
$.fn.dataTableExt.oApi.fnColResize = function (oSettings, iCol) {
var v110 = $.fn.dataTable.Api ? true : false;
/*
* Update DataTables' event handlers
*/
/* Fire an event so other plug-ins can update */
$(oSettings.oInstance).trigger('column-resize', [ oSettings, {
"iCol": iCol
} ]);
};
/**
* ColResize provides column resize control for DataTables
* @class ColResize
* @constructor
* @param {object} dt DataTables settings object
* @param {object} opts ColResize options
*/
var ColResize = function (dt, opts) {
var oDTSettings;
if ($.fn.dataTable.Api) {
oDTSettings = new $.fn.dataTable.Api(dt).settings()[0];
}
// 1.9 compatibility
else if (dt.fnSettings) {
// DataTables object, convert to the settings object
oDTSettings = dt.fnSettings();
}
else if (typeof dt === 'string') {
// jQuery selector
if ($.fn.dataTable.fnIsDataTable($(dt)[0])) {
oDTSettings = $(dt).eq(0).dataTable().fnSettings();
}
}
else if (dt.nodeName && dt.nodeName.toLowerCase() === 'table') {
// Table node
if ($.fn.dataTable.fnIsDataTable(dt.nodeName)) {
oDTSettings = $(dt.nodeName).dataTable().fnSettings();
}
}
else if (dt instanceof jQuery) {
// jQuery object
if ($.fn.dataTable.fnIsDataTable(dt[0])) {
oDTSettings = dt.eq(0).dataTable().fnSettings();
}
}
else {
// DataTables settings object
oDTSettings = dt;
}
// Convert from camelCase to Hungarian, just as DataTables does
if ($.fn.dataTable.camelToHungarian) {
$.fn.dataTable.camelToHungarian(ColResize.defaults, opts || {});
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* Public class variables
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/**
* @namespace Settings object which contains customizable information for ColResize instance
*/
this.s = {
/**
* DataTables settings object
* @property dt
* @type Object
* @default null
*/
"dt": null,
/**
* Initialisation object used for this instance
* @property init
* @type object
* @default {}
*/
"init": $.extend(true, {}, ColResize.defaults, opts),
/**
* @namespace Information used for the mouse drag
*/
"mouse": {
"startX": -1,
"startY": -1,
"targetIndex": -1,
"targetColumn": -1,
"neighbourIndex": -1,
"neighbourColumn": -1
},
/**
* Status variable keeping track of mouse down status
* @property isMousedown
* @type boolean
* @default false
*/
"isMousedown": false
};
/**
* @namespace Common and useful DOM elements for the class instance
*/
this.dom = {
/**
* Resizing element (the one the mouse is resizing)
* @property resize
* @type element
* @default null
*/
"resizeCol": null,
/**
* Resizing element neighbour (the column next to the one the mouse is resizing)
* This is for fixed table resizing.
* @property resize
* @type element
* @default null
*/
"resizeColNeighbour": null,
/**
* Array of events to be restored, used for overriding existing events from other plugins for a time.
* @property restoreEvents
* @type array
* @default []
*/
"restoreEvents": []
};
/* Constructor logic */
this.s.dt = oDTSettings.oInstance.fnSettings();
this.s.dt._colResize = this;
this._fnConstruct();
/* Add destroy callback */
oDTSettings.oApi._fnCallbackReg(oDTSettings, 'aoDestroyCallback', $.proxy(this._fnDestroy, this), 'ColResize');
return this;
};
ColResize.prototype = {
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* Public methods
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/**
* Reset the column widths to the original widths that was detected on
* start up.
* @return {this} Returns `this` for chaining.
*
* @example
* // DataTables initialisation with ColResize
* var table = $('#example').dataTable( {
* "sDom": 'Zlfrtip'
* } );
*
* // Add click event to a button to reset the ordering
* $('#resetOrdering').click( function (e) {
* e.preventDefault();
* $.fn.dataTable.ColResize( table ).fnReset();
* } );
*/
"fnReset": function () {
var a = [];
for (var i = 0, iLen = this.s.dt.aoColumns.length; i < iLen; i++) {
this.s.dt.aoColumns[i].width = this.s.dt.aoColumns[i]._ColResize_iOrigWidth;
}
this.s.dt.adjust().draw();
return this;
},
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* Private methods (they are of course public in JS, but recommended as private)
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/**
* Constructor logic
* @method _fnConstruct
* @returns void
* @private
*/
"_fnConstruct": function () {
var that = this;
var iLen = that.s.dt.aoColumns.length;
var i;
that._fnSetupMouseListeners();
/* Add event handlers for the resize handles */
for (i = 0; i < iLen; i++) {
/* Mark the original column width for later reference */
this.s.dt.aoColumns[i]._ColResize_iOrigWidth = this.s.dt.aoColumns[i].width;
}
this._fnSetColumnIndexes();
/* State saving */
this.s.dt.oApi._fnCallbackReg( this.s.dt, 'aoStateSaveParams', function (oS, oData) {
that._fnStateSave.call(that, oData);
}, "ColResize_State" );
// State loading
this._fnStateLoad();
},
/**
* @method _fnStateSave
* @param object oState DataTables state
* @private
*/
"_fnStateSave": function (oState) {
this.s.dt.aoColumns.forEach(function(col, index) {
oState.columns[index].width = col.sWidthOrig;
});
},
/**
* If state has been loaded, apply the saved widths to the columns
* @method _fnStateLoad
* @private
*/
"_fnStateLoad": function() {
var that = this,
loadedState = this.s.dt.oLoadedState;
if (loadedState && loadedState.columns) {
var colStates = loadedState.columns,
currCols = this.s.dt.aoColumns;
// Only apply the saved widths if the number of columns is the same.
// Otherwise, we don't know if we're applying the width to the correct column.
if (colStates.length > 0 && colStates.length === currCols.length) {
colStates.forEach(function(state, index) {
var col = that.s.dt.aoColumns[index];
if (state.width) {
col.sWidthOrig = col.sWidth = state.width;
}
});
}
}
},
/**
* Remove events of type from obj add it to restoreEvents array to be restored at a later time
* @param until string flag when to restore the event
* @param obj Object to remove events from
* @param type type of event to remove
* @param namespace namespace of the event being removed
*/
"_fnDelayEvents": function (until, obj, type, namespace) {
var that = this;
//Get the events for the object
var events = $._data($(obj).get(0), 'events');
$.each(events, function (i, o) {
//If the event type matches
if (i == type) {
//Loop through the possible many events with that type
$.each(o, function (k, v) {
//Somehow it is possible for the event to be undefined make sure it is defined first
if (v) {
if (namespace) {
//Add the event to the array of events to be restored later
that.dom.restoreEvents.push({"until": until, "obj": obj, "type": v.type, "namespace": v.namespace, "handler": v.handler});
//If the namespace matches
if (v.namespace == namespace) {
//Turn off/unbind the event
$(obj).off(type + "." + namespace);
}
} else {
//Add the event to the array of events to be restored later
that.dom.restoreEvents.push({"until": until, "obj": obj, "type": v.type, "namespace": null, "handler": v.handler});
//Turn off/unbind the event
$(obj).off(type);
}
}
});
}
});
},
/**
* Loop through restoreEvents array and restore the events on the elements provided
*/
"_fnRestoreEvents": function (until) {
var that = this;
//Loop through the events to be restored
var i;
for (i = that.dom.restoreEvents.length; i--;) {
if (that.dom.restoreEvents[i].until == undefined || that.dom.restoreEvents[i].until == null || that.dom.restoreEvents[i].until == until) {
if (that.dom.restoreEvents[i].namespace) {
//Turn on the event for the object provided
$(that.dom.restoreEvents[i].obj).off(that.dom.restoreEvents[i].type + "." + that.dom.restoreEvents[i].namespace).on(that.dom.restoreEvents[i].type + "." + that.dom.restoreEvents[i].namespace, that.dom.restoreEvents[i].handler);
that.dom.restoreEvents.splice(i, 1);
} else {
//Turn on the event for the object provided
$(that.dom.restoreEvents[i].obj).off(that.dom.restoreEvents[i].type).on(that.dom.restoreEvents[i].type, that.dom.restoreEvents[i].handler);
that.dom.restoreEvents.splice(i, 1);
}
}
}
},
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* Mouse drop and drag
*/
"_fnSetupMouseListeners":function() {
var that = this;
$(that.s.dt.nTableWrapper).off("mouseenter.ColResize").on("mouseenter.ColResize","th",function(e) {
e.preventDefault();
that._fnMouseEnter.call(that, e, this);
});
$(that.s.dt.nTableWrapper).off("mouseleave.ColResize").on("mouseleave.ColResize","th",function(e) {
e.preventDefault();
that._fnMouseLeave.call(that, e, this);
});
},
/**
* Add mouse listeners to the resize handle on TH element
* @method _fnMouseListener
* @param i Column index
* @param nTh TH resize handle element clicked on
* @returns void
* @private
*/
"_fnMouseListener": function (i, nTh) {
var that = this;
$(nTh).off('mouseenter.ColResize').on('mouseenter.ColResize', function (e) {
e.preventDefault();
that._fnMouseEnter.call(that, e, nTh);
});
$(nTh).off('mouseleave.ColResize').on('mouseleave.ColResize', function (e) {
e.preventDefault();
that._fnMouseLeave.call(that, e, nTh);
});
},
/**
*
* @param e Mouse event
* @param nTh TH element that the mouse is over
*/
"_fnMouseEnter": function (e, nTh) {
var that = this;
if(!that.s.isMousedown) {
//Once the mouse has entered the cell add mouse move event to see if the mouse is over resize handle
$(nTh).off('mousemove.ColResizeHandle').on('mousemove.ColResizeHandle', function (e) {
e.preventDefault();
that._fnResizeHandleCheck.call(that, e, nTh);
});
}
},
/**
* Clear mouse events when the mouse has left the th
* @param e Mouse event
* @param nTh TH element that the mouse has just left
*/
"_fnMouseLeave": function (e, nTh) {
//Once the mouse has left the TH make suure to remove the mouse move listener
$(nTh).off('mousemove.ColResizeHandle');
},
/**
* Mouse down on a TH element in the table header
* @method _fnMouseDown
* @param event e Mouse event
* @param element nTh TH element to be resized
* @returns void
* @private
*/
"_fnMouseDown": function (e, nTh) {
var that = this;
that.s.isMousedown = true;
/* Store information about the mouse position */
var target = $(e.target).closest('th, td');
var offset = target.offset();
/* Store information about the mouse position for resize calculations in mouse move function */
this.s.mouse.startX = e.pageX;
this.s.mouse.startY = e.pageY;
//Store the indexes of the columns the mouse is down on
var idx = that.dom.resizeCol[0].cellIndex;
// the last column has no 'right-side' neighbour
// with fixed this can make the table smaller
if (that.dom.resizeColNeighbour[0] === undefined){
var idxNeighbour = 0;
} else {
var idxNeighbour = that.dom.resizeColNeighbour[0].cellIndex;
}
if (idx === undefined) {
return;
}
this.s.mouse.targetIndex = idx;
this.s.mouse.targetColumn = this.s.dt.aoColumns[ idx ];
this.s.mouse.neighbourIndex = idxNeighbour;
this.s.mouse.neighbourColumn = this.s.dt.aoColumns[ idxNeighbour ];
/* Add event handlers to the document */
$(document)
.off('mousemove.ColResize').on('mousemove.ColResize', function (e) {
that._fnMouseMove.call(that, e);
})
.off('mouseup.ColResize').on('mouseup.ColResize', function (e) {
that._fnMouseUp.call(that, e);
});
},
/**
* Deal with a mouse move event while dragging to resize a column
* @method _fnMouseMove
* @param e Mouse event
* @returns void
* @private
*/
"_fnMouseMove": function (e) {
var that = this;
var offset = $(that.s.mouse.targetColumn.nTh).offset();
var relativeX = (e.pageX - offset.left);
var distFromLeft = relativeX;
var distFromRight = $(that.s.mouse.targetColumn.nTh).outerWidth() - relativeX - 1;
//Change in mouse x position
var dx = e.pageX - that.s.mouse.startX;
//Get the minimum width of the column (default minimum 10px)
var minColumnWidth = Math.max(parseInt($(that.s.mouse.targetColumn.nTh).css('min-width')), 10);
//Store the previous width of the column
var prevWidth = $(that.s.mouse.targetColumn.nTh).width();
//As long as the cursor is past the handle, resize the columns
if ((dx > 0 && distFromRight <= 0) || (dx < 0 && distFromRight >= 0)) {
if (!that.s.init.tableWidthFixed) {
//As long as the width is larger than the minimum
var newColWidth = Math.max(minColumnWidth, prevWidth + dx);
//Get the width difference (take into account the columns minimum width)
var widthDiff = newColWidth - prevWidth;
var colResizeIdx = parseInt(that.dom.resizeCol.attr("data-column-index"));
//Set datatable column widths
that.s.mouse.targetColumn.sWidthOrig = that.s.mouse.targetColumn.sWidth = that.s.mouse.targetColumn.width = newColWidth + "px";
var domCols = $(that.s.dt.nTableWrapper).find("th[data-column-index='"+colResizeIdx+"']");
//For each table expand the width by the same amount as the column
//This accounts for other datatable plugins like FixedColumns
domCols.parents("table").each(function() {
if(!$(this).parent().hasClass("DTFC_LeftBodyLiner")) {
var newWidth = $(this).width() + widthDiff;
$(this).width(newWidth);
} else {
var newWidth =$(that.s.dt.nTableWrapper).find(".DTFC_LeftHeadWrapper").children("table").width();
$(this).parents(".DTFC_LeftWrapper").width(newWidth);
$(this).parent().width(newWidth+15);
$(this).width(newWidth);
}
});
//Apply the new width to the columns after the table has been resized
domCols.width(that.s.mouse.targetColumn.width);
} else {
//A neighbour column must exist in order to resize a column in a table with a fixed width
if (that.s.mouse.neighbourColumn) {
//Get the minimum width of the neighbor column (default minimum 10px)
var minColumnNeighbourWidth = Math.max(parseInt($(that.s.mouse.neighbourColumn.nTh).css('min-width')), 10);
//Store the previous width of the neighbour column
var prevNeighbourWidth = $(that.s.mouse.neighbourColumn.nTh).width();
//As long as the width is larger than the minimum
var newColWidth = Math.max(minColumnWidth, prevWidth + dx);
var newColNeighbourWidth = Math.max(minColumnNeighbourWidth, prevNeighbourWidth - dx);
//Get the width difference (take into account the columns minimum width)
var widthDiff = newColWidth - prevWidth;
var widthDiffNeighbour = newColNeighbourWidth - prevNeighbourWidth;
//Get the column index for the column being changed
var colResizeIdx = parseInt(that.dom.resizeCol.attr("data-column-index"));
var neighbourColResizeIdx = parseInt(that.dom.resizeColNeighbour.attr("data-column-index"));
//Set datatable column widths
that.s.mouse.neighbourColumn.sWidthOrig = that.s.mouse.neighbourColumn.sWidth = that.s.mouse.neighbourColumn.width = newColNeighbourWidth + "px";
that.s.mouse.targetColumn.sWidthOrig = that.s.mouse.targetColumn.sWidth = that.s.mouse.targetColumn.width = newColWidth + "px";
//Get list of columns based on column index in all affected tables tables. This accounts for other plugins like FixedColumns
var domNeighbourCols = $(that.s.dt.nTableWrapper).find("th[data-column-index='" + neighbourColResizeIdx + "']");
var domCols = $(that.s.dt.nTableWrapper).find("th[data-column-index='" + colResizeIdx + "']");
//If dx if positive (the width is getting larger) shrink the neighbour columns first
if(dx>0) {
domNeighbourCols.width(that.s.mouse.neighbourColumn.width);
domCols.width(that.s.mouse.targetColumn.width);
} else {
//Apply the new width to the columns then to the neighbour columns
domCols.width(that.s.mouse.targetColumn.width);
domNeighbourCols.width(that.s.mouse.neighbourColumn.width);
}
}
}
}
that.s.mouse.startX = e.pageX;
},
/**
* Check to see if the mouse is over the resize handle area
* @param e
* @param nTh
*/
"_fnResizeHandleCheck": function (e, nTh) {
var that = this;
var offset = $(nTh).offset();
var relativeX = (e.pageX - offset.left);
var relativeY = (e.pageY - offset.top);
var distFromLeft = relativeX;
var distFromRight = $(nTh).outerWidth() - relativeX - 1;
var handleBuffer = this.s.init.handleWidth / 2;
var leftHandleOn = distFromLeft < handleBuffer;
var rightHandleOn = distFromRight < handleBuffer;
//If this is the first table cell
if ($(nTh).prev("th").length == 0) {
if(this.s.init.rtl)
rightHandleOn = false;
else
leftHandleOn = false;
}
//If this is the last cell and the table is fixed width don't let them expand the last cell directly
if ($(nTh).next("th").length == 0 && this.s.init.tableWidthFixed) {
if(this.s.init.rtl)
leftHandleOn = false;
else
rightHandleOn = false;
}
var resizeAvailable = leftHandleOn||rightHandleOn;
//If table is in right to left mode flip which TH is being resized
if (that.s.init.rtl) {
//Handle is to the left
if (leftHandleOn) {
that.dom.resizeCol = $(nTh);
that.dom.resizeColNeighbour = $(nTh).next();
} else if (rightHandleOn) {
that.dom.resizeCol = $(nTh).prev();
that.dom.resizeColNeighbour = $(nTh);
}
} else {
//Handle is to the right
if (rightHandleOn) {
that.dom.resizeCol = $(nTh);
that.dom.resizeColNeighbour = $(nTh).next();
} else if (leftHandleOn) {
that.dom.resizeCol = $(nTh).prev();
that.dom.resizeColNeighbour = $(nTh);
}
}
//If table width is fixed make sure both columns are resizable else just check the one.
if(this.s.init.tableWidthFixed)
resizeAvailable &= this.s.init.exclude.indexOf(parseInt($(that.dom.resizeCol).attr("data-column-index"))) == -1 && this.s.init.exclude.indexOf(parseInt($(that.dom.resizeColNeighbour).attr("data-column-index"))) == -1;
else
resizeAvailable &= this.s.init.exclude.indexOf(parseInt($(that.dom.resizeCol).attr("data-column-index"))) == -1;
$(nTh).off('mousedown.ColResize');
if (resizeAvailable) {
$(nTh).css("cursor", "ew-resize");
//Delay other mousedown events from the Reorder plugin
that._fnDelayEvents(null, nTh, "mousedown", "ColReorder");
that._fnDelayEvents("click", nTh, "click", "DT");
$(nTh).off('mousedown.ColResize').on('mousedown.ColResize', function (e) {
e.preventDefault();
that._fnMouseDown.call(that, e, nTh);
})
.off('click.ColResize').on('click.ColResize', function (e) {
that._fnClick.call(that, e);
});
} else {
$(nTh).css("cursor", "pointer");
$(nTh).off('mousedown.ColResize click.ColResize');
//Restore any events that were removed
that._fnRestoreEvents();
//This is to restore column sorting on click functionality
if (!that.s.isMousedown)
//Restore click event if mouse is not down
this._fnRestoreEvents("click");
}
},
"_fnClick": function (e) {
var that = this;
that.s.isMousedown = false;
e.stopImmediatePropagation();
},
/**
* Finish off the mouse drag
* @method _fnMouseUp
* @param e Mouse event
* @returns void
* @private
*/
"_fnMouseUp": function (e) {
var that = this;
that.s.isMousedown = false;
//Fix width of column to be the size the dom is limited to (for when user sets min-width on a column)
that.s.mouse.targetColumn.width = that.dom.resizeCol.width();
$(document).off('mousemove.ColResize mouseup.ColResize');
this.s.dt.oInstance.fnAdjustColumnSizing();
//Table width fix, prevents extra gaps between tables
var LeftWrapper = $(that.s.dt.nTableWrapper).find(".DTFC_LeftWrapper");
var DTFC_LeftWidth = LeftWrapper.width();
LeftWrapper.children(".DTFC_LeftHeadWrapper").children("table").width(DTFC_LeftWidth);
if (that.s.init.resizeCallback) {
that.s.init.resizeCallback.call(that, that.s.mouse.targetColumn);
}
},
/**
* Clean up ColResize memory references and event handlers
* @method _fnDestroy
* @returns void
* @private
*/
"_fnDestroy": function () {
var i, iLen;
for (i = 0, iLen = this.s.dt.aoDrawCallback.length; i < iLen; i++) {
if (this.s.dt.aoDrawCallback[i].sName === 'ColResize_Pre') {
this.s.dt.aoDrawCallback.splice(i, 1);
break;
}
}
$(this.s.dt.nTHead).find('*').off('.ColResize');
$.each(this.s.dt.aoColumns, function (i, column) {
$(column.nTh).removeAttr('data-column-index');
});
this.s.dt._colResize = null;
this.s = null;
},
/**
* Add a data attribute to the column headers, so we know the index of
* the row to be reordered. This allows fast detection of the index, and
* for this plug-in to work with FixedHeader which clones the nodes.
* @private
*/
"_fnSetColumnIndexes": function () {
$.each(this.s.dt.aoColumns, function (i, column) {
$(column.nTh).attr('data-column-index', i);
});
}
};
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* Static parameters
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/**
* ColResize default settings for initialisation
* @namespace
* @static
*/
ColResize.defaults = {
/**
* Callback function that is fired when columns are resized
* @type function():void
* @default null
* @static
*/
"resizeCallback": null,
/**
* Exclude array for columns that are not resizable
* @property exclude
* @type array of indexes that are excluded from resizing
* @default []
*/
"exclude": [],
/**
* Check to see if user is using a fixed table width or dynamic
* if true:
* -Columns will resize themselves and their neighbour
* -If neighbour is excluded resize will not occur
* if false:
* -Columns will resize themselves and increase or decrease the width of the table accordingly
*/
"tableWidthFixed": true,
/**
* Width of the resize handle in pixels
* @property handleWidth
* @type int (pixels)
* @default 10
*/
"handleWidth": 10,
/**
* Right to left support, when true flips which column they are resizing on mouse down
* @property rtl
* @type bool
* @default false
*/
"rtl": false
};
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* Constants
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/**
* ColResize version
* @constant version
* @type String
* @default As code
*/
ColResize.version = "0.0.10";
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* DataTables interfaces
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
// Expose
$.fn.dataTable.ColResize = ColResize;
$.fn.DataTable.ColResize = ColResize;
// Register a new feature with DataTables
if (typeof $.fn.dataTable == "function" &&
typeof $.fn.dataTableExt.fnVersionCheck == "function" &&
$.fn.dataTableExt.fnVersionCheck('1.9.3')) {
$.fn.dataTableExt.aoFeatures.push({
"fnInit": function (settings) {
var table = settings.oInstance;
if (!settings._colResize) {
var dtInit = settings.oInit;
var opts = dtInit.colResize || dtInit.oColResize || {};
new ColResize(settings, opts);
}
else {
table.oApi._fnLog(settings, 1, "ColResize attempted to initialise twice. Ignoring second");
}
return null;
/* No node for DataTables to insert */
},
"cFeature": "Z",
"sFeature": "ColResize"
});
} else {
alert("Warning: ColResize requires DataTables 1.9.3 or greater - www.datatables.net/download");
}
// API augmentation
if ($.fn.dataTable.Api) {
$.fn.dataTable.Api.register('colResize.reset()', function () {
return this.iterator('table', function (ctx) {
ctx._colResize.fnReset();
});
});
}
return ColResize;
}; // /factory
// Define as an AMD module if possible
if ( typeof define === 'function' && define.amd ) {
define( ['jquery', 'datatables'], factory );
}
else if ( typeof exports === 'object' ) {
// Node/CommonJS
factory( require('jquery'), require('datatables') );
}
else if (jQuery && !jQuery.fn.dataTable.ColResize) {
// Otherwise simply initialise as normal, stopping multiple evaluation
factory(jQuery, jQuery.fn.dataTable);
}
})(window, document);