datatables.net-datetime 1.0.1 → 1.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (94) hide show
  1. package/css/{dateTime.scss → dataTables.dateTime.scss} +15 -0
  2. package/dist/dataTables.dateTime.css +218 -0
  3. package/{js/dateTime.js → dist/dataTables.dateTime.js} +191 -51
  4. package/dist/dataTables.dateTime.min.css +1 -0
  5. package/dist/dataTables.dateTime.min.js +43 -0
  6. package/docs/api/DateTime.use().xml +32 -0
  7. package/docs/api/destroy().xml +28 -0
  8. package/docs/api/errorMsg().xml +52 -0
  9. package/docs/api/hide().xml +36 -0
  10. package/docs/api/max().xml +35 -0
  11. package/docs/api/min().xml +35 -0
  12. package/docs/api/owns().xml +30 -0
  13. package/docs/api/val().xml +44 -0
  14. package/docs/option/buttons.clear.xml +27 -0
  15. package/docs/option/buttons.today.xml +29 -0
  16. package/docs/option/buttons.xml +28 -0
  17. package/docs/option/disableDays.xml +45 -0
  18. package/docs/option/firstDay.xml +34 -0
  19. package/docs/option/format.xml +31 -0
  20. package/docs/option/hoursAvailable.xml +36 -0
  21. package/docs/option/i18n.amPm.xml +32 -0
  22. package/docs/option/i18n.clear.xml +28 -0
  23. package/docs/option/i18n.hours.xml +33 -0
  24. package/docs/option/i18n.minutes.xml +33 -0
  25. package/docs/option/i18n.months.xml +32 -0
  26. package/docs/option/i18n.next.xml +32 -0
  27. package/docs/option/i18n.previous.xml +32 -0
  28. package/docs/option/i18n.seconds.xml +33 -0
  29. package/docs/option/i18n.today.xml +28 -0
  30. package/docs/option/i18n.unknown.xml +32 -0
  31. package/docs/option/i18n.weekdays.xml +32 -0
  32. package/docs/option/i18n.xml +37 -0
  33. package/docs/option/locale.xml +31 -0
  34. package/docs/option/maxDate.xml +51 -0
  35. package/docs/option/minDate.xml +52 -0
  36. package/docs/option/minutesAvailable.xml +36 -0
  37. package/docs/option/onChange.xml +38 -0
  38. package/docs/option/secondsAvailable.xml +36 -0
  39. package/docs/option/showWeekNumber.xml +30 -0
  40. package/docs/option/yearRange.xml +35 -0
  41. package/examples/index.xml +12 -0
  42. package/examples/initialisation/buttons.xml +38 -0
  43. package/examples/initialisation/datetime.xml +30 -0
  44. package/examples/initialisation/dayjs.xml +34 -0
  45. package/examples/initialisation/hidden.xml +28 -0
  46. package/examples/initialisation/i18n.xml +37 -0
  47. package/examples/initialisation/index.xml +12 -0
  48. package/examples/initialisation/jquery.xml +28 -0
  49. package/examples/initialisation/luxon.xml +29 -0
  50. package/examples/initialisation/moment.xml +29 -0
  51. package/examples/initialisation/simple.xml +30 -0
  52. package/examples/integration/datatables.xml +74 -0
  53. package/examples/integration/form.xml +65 -0
  54. package/gulpfile.js +3 -3
  55. package/js/{dateTime.d.ts → dataTables.dateTime.d.ts} +0 -1
  56. package/{dist/dateTime.js → js/dataTables.dateTime.js} +191 -51
  57. package/license.txt +9 -0
  58. package/make.sh +50 -0
  59. package/nuget.nuspec +20 -0
  60. package/package.json +6 -4
  61. package/readme.md +3 -1
  62. package/test/api/dateTime.destroy().js +49 -0
  63. package/test/api/dateTime.errorMsg().js +52 -0
  64. package/test/api/dateTime.hide().js +49 -0
  65. package/test/api/dateTime.max().js +86 -0
  66. package/test/api/dateTime.min().js +85 -0
  67. package/test/api/dateTime.owns().js +53 -0
  68. package/test/api/dateTime.val().js +70 -0
  69. package/test/options/dateTime.YearRange.js +51 -0
  70. package/test/options/dateTime.disableDays.js +46 -0
  71. package/test/options/dateTime.firstDay.js +33 -0
  72. package/test/options/dateTime.format.js +85 -0
  73. package/test/options/dateTime.i18n.amPm.js +35 -0
  74. package/test/options/dateTime.i18n.hours.js +33 -0
  75. package/test/options/dateTime.i18n.minutes.js +33 -0
  76. package/test/options/dateTime.i18n.months.js +33 -0
  77. package/test/options/dateTime.i18n.next.js +31 -0
  78. package/test/options/dateTime.i18n.previous.js +31 -0
  79. package/test/options/dateTime.i18n.seconds.js +33 -0
  80. package/test/options/dateTime.i18n.unknown.js +33 -0
  81. package/test/options/dateTime.i18n.weekdays.js +30 -0
  82. package/test/options/dateTime.init.js +54 -0
  83. package/test/options/dateTime.maxDate.js +66 -0
  84. package/test/options/dateTime.minDate.js +66 -0
  85. package/test/options/dateTime.onChange.js +130 -0
  86. package/test/options/dateTime.showWeekNumber.js +36 -0
  87. package/dist/dateTime.css +0 -168
  88. package/examples/basic.html +0 -26
  89. package/examples/datetime.html +0 -29
  90. package/examples/dayjs.html +0 -32
  91. package/examples/hidden.html +0 -26
  92. package/examples/jquery.html +0 -26
  93. package/examples/moment.html +0 -29
  94. package/examples/right.html +0 -39
@@ -20,6 +20,21 @@ div.dt-datetime {
20
20
  padding: 5px 0px 3px;
21
21
  }
22
22
 
23
+ div.dt-datetime-buttons {
24
+ text-align: center;
25
+
26
+ a {
27
+ display: inline-block;
28
+ padding: 0 0.5em 0.5em 0.5em;
29
+ margin: 0;
30
+ font-size: 0.9em;
31
+
32
+ &:hover {
33
+ text-decoration: underline;
34
+ }
35
+ }
36
+ }
37
+
23
38
  table {
24
39
  border-spacing: 0;
25
40
  margin: 12px 0;
@@ -0,0 +1,218 @@
1
+ div.dt-datetime {
2
+ position: absolute;
3
+ background-color: white;
4
+ z-index: 2050;
5
+ border: 1px solid #ccc;
6
+ box-shadow: 0 5px 15px -5px rgba(0, 0, 0, 0.5);
7
+ padding: 0 20px 6px 20px;
8
+ width: 275px;
9
+ }
10
+ div.dt-datetime.inline {
11
+ position: relative;
12
+ box-shadow: none;
13
+ }
14
+ div.dt-datetime div.dt-datetime-title {
15
+ text-align: center;
16
+ padding: 5px 0px 3px;
17
+ }
18
+ div.dt-datetime div.dt-datetime-buttons {
19
+ text-align: center;
20
+ }
21
+ div.dt-datetime div.dt-datetime-buttons a {
22
+ display: inline-block;
23
+ padding: 0 0.5em 0.5em 0.5em;
24
+ margin: 0;
25
+ font-size: 0.9em;
26
+ }
27
+ div.dt-datetime div.dt-datetime-buttons a:hover {
28
+ text-decoration: underline;
29
+ }
30
+ div.dt-datetime table {
31
+ border-spacing: 0;
32
+ margin: 12px 0;
33
+ width: 100%;
34
+ }
35
+ div.dt-datetime table.dt-datetime-table-nospace {
36
+ margin-top: -12px;
37
+ }
38
+ div.dt-datetime table th {
39
+ font-size: 0.8em;
40
+ color: #777;
41
+ font-weight: normal;
42
+ width: 14.285714286%;
43
+ padding: 0 0 4px 0;
44
+ text-align: center;
45
+ }
46
+ div.dt-datetime table td {
47
+ font-size: 0.9em;
48
+ color: #444;
49
+ padding: 0;
50
+ }
51
+ div.dt-datetime table td.selectable {
52
+ text-align: center;
53
+ background: #f5f5f5;
54
+ }
55
+ div.dt-datetime table td.selectable.disabled {
56
+ color: #aaa;
57
+ background: white;
58
+ }
59
+ div.dt-datetime table td.selectable.disabled button:hover {
60
+ color: #aaa;
61
+ background: white;
62
+ }
63
+ div.dt-datetime table td.selectable.now {
64
+ background-color: #ddd;
65
+ }
66
+ div.dt-datetime table td.selectable.now button {
67
+ font-weight: bold;
68
+ }
69
+ div.dt-datetime table td.selectable.selected button {
70
+ background: #4E6CA3;
71
+ color: white;
72
+ border-radius: 2px;
73
+ }
74
+ div.dt-datetime table td.selectable button:hover {
75
+ background: #ff8000;
76
+ color: white;
77
+ border-radius: 2px;
78
+ }
79
+ div.dt-datetime table td.dt-datetime-week {
80
+ font-size: 0.7em;
81
+ }
82
+ div.dt-datetime table button {
83
+ width: 100%;
84
+ box-sizing: border-box;
85
+ border: none;
86
+ background: transparent;
87
+ font-size: inherit;
88
+ color: inherit;
89
+ text-align: center;
90
+ padding: 4px 0;
91
+ cursor: pointer;
92
+ margin: 0;
93
+ }
94
+ div.dt-datetime table button span {
95
+ display: inline-block;
96
+ min-width: 14px;
97
+ text-align: right;
98
+ }
99
+ div.dt-datetime table.weekNumber th {
100
+ width: 12.5%;
101
+ }
102
+ div.dt-datetime div.dt-datetime-calendar table {
103
+ margin-top: 0;
104
+ }
105
+ div.dt-datetime div.dt-datetime-label {
106
+ position: relative;
107
+ display: inline-block;
108
+ height: 30px;
109
+ padding: 5px 6px;
110
+ border: 1px solid transparent;
111
+ box-sizing: border-box;
112
+ cursor: pointer;
113
+ }
114
+ div.dt-datetime div.dt-datetime-label:hover {
115
+ border: 1px solid #ddd;
116
+ border-radius: 2px;
117
+ background-color: #f5f5f5;
118
+ }
119
+ div.dt-datetime div.dt-datetime-label select {
120
+ position: absolute;
121
+ top: 6px;
122
+ left: 0;
123
+ cursor: pointer;
124
+ opacity: 0;
125
+ }
126
+ div.dt-datetime.horizontal {
127
+ width: 550px;
128
+ }
129
+ div.dt-datetime.horizontal div.dt-datetime-date,
130
+ div.dt-datetime.horizontal div.dt-datetime-time {
131
+ width: 48%;
132
+ }
133
+ div.dt-datetime.horizontal div.dt-datetime-time {
134
+ margin-left: 4%;
135
+ }
136
+ div.dt-datetime div.dt-datetime-date {
137
+ position: relative;
138
+ float: left;
139
+ width: 100%;
140
+ }
141
+ div.dt-datetime div.dt-datetime-time {
142
+ position: relative;
143
+ float: left;
144
+ width: 100%;
145
+ text-align: center;
146
+ }
147
+ div.dt-datetime div.dt-datetime-time > span {
148
+ vertical-align: middle;
149
+ }
150
+ div.dt-datetime div.dt-datetime-time th {
151
+ text-align: left;
152
+ }
153
+ div.dt-datetime div.dt-datetime-time div.dt-datetime-timeblock {
154
+ display: inline-block;
155
+ vertical-align: middle;
156
+ }
157
+ div.dt-datetime div.dt-datetime-iconLeft,
158
+ div.dt-datetime div.dt-datetime-iconRight,
159
+ div.dt-datetime div.dt-datetime-iconUp,
160
+ div.dt-datetime div.dt-datetime-iconDown {
161
+ width: 30px;
162
+ height: 30px;
163
+ background-position: center;
164
+ background-repeat: no-repeat;
165
+ opacity: 0.3;
166
+ overflow: hidden;
167
+ box-sizing: border-box;
168
+ }
169
+ div.dt-datetime div.dt-datetime-iconLeft:hover,
170
+ div.dt-datetime div.dt-datetime-iconRight:hover,
171
+ div.dt-datetime div.dt-datetime-iconUp:hover,
172
+ div.dt-datetime div.dt-datetime-iconDown:hover {
173
+ border: 1px solid #ccc;
174
+ border-radius: 2px;
175
+ background-color: #f0f0f0;
176
+ opacity: 0.6;
177
+ }
178
+ div.dt-datetime div.dt-datetime-iconLeft button,
179
+ div.dt-datetime div.dt-datetime-iconRight button,
180
+ div.dt-datetime div.dt-datetime-iconUp button,
181
+ div.dt-datetime div.dt-datetime-iconDown button {
182
+ border: none;
183
+ background: transparent;
184
+ text-indent: 30px;
185
+ height: 100%;
186
+ width: 100%;
187
+ cursor: pointer;
188
+ }
189
+ div.dt-datetime div.dt-datetime-iconLeft {
190
+ position: absolute;
191
+ top: 5px;
192
+ left: 5px;
193
+ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAUklEQVR42u3VMQoAIBADQf8Pgj+OD9hG2CtONJB2ymQkKe0HbwAP0xucDiQWARITIDEBEnMgMQ8S8+AqBIl6kKgHiXqQqAeJepBo/z38J/U0uAHlaBkBl9I4GwAAAABJRU5ErkJggg==");
194
+ }
195
+ div.dt-datetime div.dt-datetime-iconRight {
196
+ position: absolute;
197
+ top: 5px;
198
+ right: 5px;
199
+ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAU0lEQVR42u3VOwoAMAgE0dwfAnNjU26bYkBCFGwfiL9VVWoO+BJ4Gf3gtsEKKoFBNTCoCAYVwaAiGNQGMUHMkjGbgjk2mIONuXo0nC8XnCf1JXgArVIZAQh5TKYAAAAASUVORK5CYII=");
200
+ }
201
+ div.dt-datetime div.dt-datetime-iconUp {
202
+ height: 20px;
203
+ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAALCAMAAABf9c24AAAAFVBMVEX///99fX1+fn57e3t6enoAAAAAAAC73bqPAAAABnRSTlMAYmJkZt92bnysAAAAL0lEQVR4AWOgJmBhxCvLyopHnpmVjY2VCadeoCxIHrcsWJ4RlyxCHlMWCTBRJxwAjrIBDMWSiM0AAAAASUVORK5CYII=");
204
+ }
205
+ div.dt-datetime div.dt-datetime-iconDown {
206
+ height: 20px;
207
+ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAALCAMAAABf9c24AAAAFVBMVEX///99fX1+fn57e3t6enoAAAAAAAC73bqPAAAABnRSTlMAYmJkZt92bnysAAAAMElEQVR4AWOgDmBiRQIsmPKMrGxQgJDFlEfIYpoPk8Utz8qM232MYFfhkQfKUg8AANefAQxecJ58AAAAAElFTkSuQmCC");
208
+ }
209
+
210
+ div.dt-datetime-error {
211
+ clear: both;
212
+ padding: 0 1em;
213
+ max-width: 240px;
214
+ font-size: 11px;
215
+ line-height: 1.25em;
216
+ text-align: center;
217
+ color: #b11f1f;
218
+ }
@@ -1,12 +1,12 @@
1
- /*! DateTime picker for DataTables.net v1.0.1
1
+ /*! DateTime picker for DataTables.net v1.1.2
2
2
  *
3
- * ©2020 SpryMedia Ltd, all rights reserved.
3
+ * © SpryMedia Ltd, all rights reserved.
4
4
  * License: MIT datatables.net/license/mit
5
5
  */
6
6
 
7
7
  /**
8
8
  * @summary DateTime picker for DataTables.net
9
- * @version 1.0.1
9
+ * @version 1.1.2
10
10
  * @file dataTables.dateTime.js
11
11
  * @author SpryMedia Ltd
12
12
  * @contact www.datatables.net/contact
@@ -35,17 +35,16 @@
35
35
  }(function( $, window, document, undefined ) {
36
36
  'use strict';
37
37
 
38
- // Support libraries which support a Moment like API
39
- var dateLib = window.moment
40
- ? window.moment
41
- : window.dayjs
42
- ? window.dayjs
43
- : null;
38
+ // Supported formatting and parsing libraries:
39
+ // * Moment
40
+ // * Luxon
41
+ // * DayJS
42
+ var dateLib;
44
43
 
45
44
  /*
46
45
  * This file provides a DateTime GUI picker (calendar and time input). Only the
47
46
  * format YYYY-MM-DD is supported without additional software, but the end user
48
- * experience can be greatly enhanced by including the momentjs or dayjs library
47
+ * experience can be greatly enhanced by including the momentjs, dayjs or luxon library
49
48
  * which provide date / time parsing and formatting options.
50
49
  *
51
50
  * This functionality is required because the HTML5 date and datetime input
@@ -59,13 +58,25 @@ var dateLib = window.moment
59
58
  * options based on the `DateTime.defaults` object.
60
59
  */
61
60
  var DateTime = function ( input, opts ) {
61
+ // Attempt to auto detect the formatting library (if there is one). Having it in
62
+ // the constructor allows load order independence.
63
+ if (typeof dateLib === 'undefined') {
64
+ dateLib = window.moment
65
+ ? window.moment
66
+ : window.dayjs
67
+ ? window.dayjs
68
+ : window.luxon
69
+ ? window.luxon
70
+ : null;
71
+ }
72
+
62
73
  this.c = $.extend( true, {}, DateTime.defaults, opts );
63
74
  var classPrefix = this.c.classPrefix;
64
75
  var i18n = this.c.i18n;
65
76
 
66
- // Only IS8601 dates are supported without moment pr dayjs
77
+ // Only IS8601 dates are supported without moment, dayjs or luxon
67
78
  if ( ! dateLib && this.c.format !== 'YYYY-MM-DD' ) {
68
- throw "DateTime: Without momentjs or dayjs only the format 'YYYY-MM-DD' can be used";
79
+ throw "DateTime: Without momentjs, dayjs or luxon only the format 'YYYY-MM-DD' can be used";
69
80
  }
70
81
 
71
82
  // Min and max need to be `Date` objects in the config
@@ -91,10 +102,10 @@ var DateTime = function ( input, opts ) {
91
102
  '<div class="'+classPrefix+'-date">'+
92
103
  '<div class="'+classPrefix+'-title">'+
93
104
  '<div class="'+classPrefix+'-iconLeft">'+
94
- '<button>'+i18n.previous+'</button>'+
105
+ '<button type="button" title="'+i18n.previous+'">'+i18n.previous+'</button>'+
95
106
  '</div>'+
96
107
  '<div class="'+classPrefix+'-iconRight">'+
97
- '<button>'+i18n.next+'</button>'+
108
+ '<button type="button" title="'+i18n.next+'">'+i18n.next+'</button>'+
98
109
  '</div>'+
99
110
  '<div class="'+classPrefix+'-label">'+
100
111
  '<span></span>'+
@@ -105,6 +116,10 @@ var DateTime = function ( input, opts ) {
105
116
  '<select class="'+classPrefix+'-year"></select>'+
106
117
  '</div>'+
107
118
  '</div>'+
119
+ '<div class="'+classPrefix+'-buttons">'+
120
+ '<a class="'+classPrefix+'-clear">'+i18n.clear+'</a>'+
121
+ '<a class="'+classPrefix+'-today">'+i18n.today+'</a>'+
122
+ '</div>'+
108
123
  '<div class="'+classPrefix+'-calendar"></div>'+
109
124
  '</div>'+
110
125
  '<div class="'+classPrefix+'-time">'+
@@ -123,6 +138,9 @@ var DateTime = function ( input, opts ) {
123
138
  calendar: structure.find( '.'+classPrefix+'-calendar' ),
124
139
  time: structure.find( '.'+classPrefix+'-time' ),
125
140
  error: structure.find( '.'+classPrefix+'-error' ),
141
+ buttons: structure.find( '.'+classPrefix+'-buttons' ),
142
+ clear: structure.find( '.'+classPrefix+'-clear' ),
143
+ today: structure.find( '.'+classPrefix+'-today' ),
126
144
  input: $(input)
127
145
  };
128
146
 
@@ -158,6 +176,7 @@ var DateTime = function ( input, opts ) {
158
176
 
159
177
  this.dom.date
160
178
  .append( this.dom.title )
179
+ .append( this.dom.buttons )
161
180
  .append( this.dom.calendar );
162
181
 
163
182
  this._constructor();
@@ -174,7 +193,9 @@ $.extend( DateTime.prototype, {
174
193
  destroy: function () {
175
194
  this._hide(true);
176
195
  this.dom.container.off().empty();
177
- this.dom.input.off('.datetime');
196
+ this.dom.input
197
+ .removeAttr('autocomplete')
198
+ .off('.datetime');
178
199
  },
179
200
 
180
201
  errorMsg: function ( msg ) {
@@ -250,8 +271,13 @@ $.extend( DateTime.prototype, {
250
271
  this.s.d = new Date();
251
272
  }
252
273
  else if ( typeof set === 'string' ) {
253
- if ( dateLib ) {
254
- // Use moment or dayjs if possible (even for ISO8601 strings, since it
274
+ // luxon uses different method names so need to be able to call them
275
+ if(dateLib && dateLib == window.luxon) {
276
+ var luxDT = dateLib.DateTime.fromFormat(set, this.c.format)
277
+ this.s.d = luxDT.isValid ? luxDT.toJSDate() : null;
278
+ }
279
+ else if ( dateLib ) {
280
+ // Use moment, dayjs or luxon if possible (even for ISO8601 strings, since it
255
281
  // will correctly handle 0000-00-00 and the like)
256
282
  var m = dateLib.utc( set, this.c.format, this.c.locale, this.c.strict );
257
283
  this.s.d = m.isValid() ? m.toDate() : null;
@@ -276,12 +302,10 @@ $.extend( DateTime.prototype, {
276
302
  }
277
303
  }
278
304
 
279
- // We need a date to be able to display the calendar at all
280
- if ( ! this.s.d ) {
281
- this.s.d = this._dateToUtc( new Date() );
282
- }
283
-
284
- this.s.display = new Date( this.s.d.toString() );
305
+ // Need something to display
306
+ this.s.display = this.s.d
307
+ ? new Date( this.s.d.toString() )
308
+ : new Date();
285
309
 
286
310
  // Set the day of the month to be 1 so changing between months doesn't
287
311
  // run into issues when going from day 31 to 28 (for example)
@@ -308,8 +332,15 @@ $.extend( DateTime.prototype, {
308
332
  _constructor: function () {
309
333
  var that = this;
310
334
  var classPrefix = this.c.classPrefix;
335
+ var last = this.dom.input.val();
336
+
311
337
  var onChange = function () {
312
- that.c.onChange.call( that, that.dom.input.val(), that.s.d, that.dom.input );
338
+ var curr = that.dom.input.val();
339
+
340
+ if (curr !== last) {
341
+ that.c.onChange.call( that, curr, that.s.d, that.dom.input );
342
+ last = curr;
343
+ }
313
344
  };
314
345
 
315
346
  if ( ! this.s.parts.date ) {
@@ -325,10 +356,23 @@ $.extend( DateTime.prototype, {
325
356
  this.dom.time.children('span').eq(1).remove();
326
357
  }
327
358
 
359
+ if ( ! this.c.buttons.clear ) {
360
+ this.dom.clear.css( 'display', 'none' );
361
+ }
362
+
363
+ if ( ! this.c.buttons.today ) {
364
+ this.dom.today.css( 'display', 'none' );
365
+ }
366
+
328
367
  // Render the options
329
368
  this._optionsTitle();
330
369
 
331
- window.allan = this;
370
+ $(document).on('i18n.dt', function (e, settings) {
371
+ if (settings.oLanguage.datetime) {
372
+ $.extend(true, that.c.i18n, settings.oLanguage.datetime);
373
+ that._optionsTitle();
374
+ }
375
+ });
332
376
 
333
377
  // When attached to a hidden input, we always show the input picker, and
334
378
  // do so inline
@@ -340,6 +384,11 @@ $.extend( DateTime.prototype, {
340
384
  this._show();
341
385
  }
342
386
 
387
+ // Set the initial value
388
+ if (last) {
389
+ this.val( last, false );
390
+ }
391
+
343
392
  // Trigger the display of the widget when clicking or focusing on the
344
393
  // input element
345
394
  this.dom.input
@@ -437,6 +486,28 @@ $.extend( DateTime.prototype, {
437
486
 
438
487
  e.stopPropagation();
439
488
 
489
+ if ( nodeName === 'a' ) {
490
+ e.preventDefault();
491
+
492
+ if ($(target).hasClass(classPrefix+'-clear')) {
493
+ // Clear the value and don't change the display
494
+ that.s.d = null;
495
+ that.dom.input.val('');
496
+ that._writeOutput();
497
+ that._setCalander();
498
+ that._setTime();
499
+
500
+ onChange();
501
+ }
502
+ else if ($(target).hasClass(classPrefix+'-today')) {
503
+ // Don't change the value, but jump to the month
504
+ // containing today
505
+ that.s.display = new Date();
506
+
507
+ that._setTitle();
508
+ that._setCalander();
509
+ }
510
+ }
440
511
  if ( nodeName === 'button' ) {
441
512
  var button = $(target);
442
513
  var parent = button.parent();
@@ -466,6 +537,8 @@ $.extend( DateTime.prototype, {
466
537
  var val = button.data('value');
467
538
  var unit = button.data('unit');
468
539
 
540
+ d = that._needValue();
541
+
469
542
  if ( unit === 'minutes' ) {
470
543
  if ( parent.hasClass('disabled') && parent.hasClass('range') ) {
471
544
  that.s.minutesRange = val;
@@ -519,9 +592,7 @@ $.extend( DateTime.prototype, {
519
592
  }
520
593
  else {
521
594
  // Calendar click
522
- if ( ! d ) {
523
- d = that._dateToUtc( new Date() );
524
- }
595
+ d = that._needValue();
525
596
 
526
597
  // Can't be certain that the current day will exist in
527
598
  // the new month, and likewise don't know that the
@@ -576,7 +647,10 @@ $.extend( DateTime.prototype, {
576
647
  */
577
648
  _compareDates: function( a, b ) {
578
649
  // Can't use toDateString as that converts to local time
579
- return this._dateToUtcString(a) === this._dateToUtcString(b);
650
+ // luxon uses different method names so need to be able to call them
651
+ return dateLib && dateLib == window.luxon
652
+ ? dateLib.DateTime.fromJSDate(a).toISODate() === dateLib.DateTime.fromJSDate(b).toISODate()
653
+ : this._dateToUtcString(a) === this._dateToUtcString(b);
580
654
  },
581
655
 
582
656
  /**
@@ -639,9 +713,12 @@ $.extend( DateTime.prototype, {
639
713
  * @return {string} ISO formatted date
640
714
  */
641
715
  _dateToUtcString: function ( d ) {
642
- return d.getUTCFullYear()+'-'+
643
- this._pad(d.getUTCMonth()+1)+'-'+
644
- this._pad(d.getUTCDate());
716
+ // luxon uses different method names so need to be able to call them
717
+ return dateLib && dateLib == window.luxon
718
+ ? dateLib.DateTime.fromJSDate(d).toISODate()
719
+ : d.getUTCFullYear()+'-'+
720
+ this._pad(d.getUTCMonth()+1)+'-'+
721
+ this._pad(d.getUTCDate());
645
722
  },
646
723
 
647
724
  /**
@@ -663,6 +740,7 @@ $.extend( DateTime.prototype, {
663
740
  $('div.dataTables_scrollBody').off( 'scroll.'+namespace );
664
741
  $('div.DTE_Body_Content').off( 'scroll.'+namespace );
665
742
  $('body').off( 'click.'+namespace );
743
+ $(this.dom.input[0].offsetParent).off('.'+namespace);
666
744
  },
667
745
 
668
746
  /**
@@ -896,6 +974,20 @@ $.extend( DateTime.prototype, {
896
974
  return '<td class="'+this.c.classPrefix+'-week">' + weekNum + '</td>';
897
975
  },
898
976
 
977
+ /**
978
+ * Check if the instance has a date object value - it might be null.
979
+ * If is doesn't set one to now.
980
+ * @returns A Date object
981
+ * @private
982
+ */
983
+ _needValue: function () {
984
+ if ( ! this.s.d ) {
985
+ this.s.d = this._dateToUtc( new Date() );
986
+ }
987
+
988
+ return this.s.d;
989
+ },
990
+
899
991
  /**
900
992
  * Create option elements from a range in an array
901
993
  *
@@ -1224,7 +1316,19 @@ $.extend( DateTime.prototype, {
1224
1316
  _setTime: function () {
1225
1317
  var that = this;
1226
1318
  var d = this.s.d;
1227
- var hours = d ? d.getUTCHours() : 0;
1319
+
1320
+ // luxon uses different method names so need to be able to call them. This happens a few time later in this method too
1321
+ var luxDT = null
1322
+ if (dateLib && dateLib == window.luxon) {
1323
+ luxDT = dateLib.DateTime.fromJSDate(d);
1324
+ }
1325
+
1326
+ var hours = luxDT != null
1327
+ ? luxDT.hour
1328
+ : d
1329
+ ? d.getUTCHours()
1330
+ : 0;
1331
+
1228
1332
  var allowed = function ( prop ) { // Backwards compt with `Increment` option
1229
1333
  return that.c[prop+'Available'] ?
1230
1334
  that.c[prop+'Available'] :
@@ -1232,8 +1336,27 @@ $.extend( DateTime.prototype, {
1232
1336
  }
1233
1337
 
1234
1338
  this._optionsTime( 'hours', this.s.parts.hours12 ? 12 : 24, hours, this.c.hoursAvailable )
1235
- this._optionsTime( 'minutes', 60, d ? d.getUTCMinutes() : 0, allowed('minutes'), this.s.minutesRange );
1236
- this._optionsTime( 'seconds', 60, d ? d.getSeconds() : 0, allowed('seconds'), this.s.secondsRange );
1339
+ this._optionsTime(
1340
+ 'minutes',
1341
+ 60,
1342
+ luxDT != null
1343
+ ? luxDT.minute
1344
+ : d
1345
+ ? d.getUTCMinutes()
1346
+ : 0, allowed('minutes'),
1347
+ this.s.minutesRange
1348
+ );
1349
+ this._optionsTime(
1350
+ 'seconds',
1351
+ 60,
1352
+ luxDT != null
1353
+ ? luxDT.second
1354
+ : d
1355
+ ? d.getSeconds()
1356
+ : 0,
1357
+ allowed('seconds'),
1358
+ this.s.secondsRange
1359
+ );
1237
1360
  },
1238
1361
 
1239
1362
  /**
@@ -1250,22 +1373,22 @@ $.extend( DateTime.prototype, {
1250
1373
 
1251
1374
  // Need to reposition on scroll
1252
1375
  $(window).on( 'scroll.'+namespace+' resize.'+namespace, function () {
1253
- that._hide();
1376
+ that._position();
1254
1377
  } );
1255
1378
 
1256
1379
  $('div.DTE_Body_Content').on( 'scroll.'+namespace, function () {
1257
- that._hide();
1380
+ that._position();
1258
1381
  } );
1259
1382
 
1260
1383
  $('div.dataTables_scrollBody').on( 'scroll.'+namespace, function () {
1261
- that._hide();
1384
+ that._position();
1262
1385
  } );
1263
1386
 
1264
1387
  var offsetParent = this.dom.input[0].offsetParent;
1265
1388
 
1266
1389
  if ( offsetParent !== document.body ) {
1267
1390
  $(offsetParent).on( 'scroll.'+namespace, function () {
1268
- that._hide();
1391
+ that._position();
1269
1392
  } );
1270
1393
  }
1271
1394
 
@@ -1303,18 +1426,24 @@ $.extend( DateTime.prototype, {
1303
1426
  */
1304
1427
  _writeOutput: function ( focus ) {
1305
1428
  var date = this.s.d;
1429
+ var out = '';
1306
1430
 
1307
- // Use moment or dayjs if possible - otherwise it must be ISO8601 (or the
1431
+ // Use moment, dayjs or luxon if possible - otherwise it must be ISO8601 (or the
1308
1432
  // constructor would have thrown an error)
1309
- var out = dateLib ?
1310
- dateLib.utc( date, undefined, this.c.locale, this.c.strict ).format( this.c.format ) :
1311
- date.getUTCFullYear() +'-'+
1312
- this._pad(date.getUTCMonth() + 1) +'-'+
1313
- this._pad(date.getUTCDate());
1314
-
1315
- this.dom.input
1316
- .val( out )
1317
- .trigger('change', {write: date});
1433
+ // luxon uses different method names so need to be able to call them.
1434
+ if (date) {
1435
+ out = dateLib && dateLib == window.luxon
1436
+ ? dateLib.DateTime.fromJSDate(this.s.d).toFormat(this.c.format)
1437
+ : dateLib ?
1438
+ dateLib.utc( date, undefined, this.c.locale, this.c.strict ).format( this.c.format ) :
1439
+ date.getUTCFullYear() +'-'+
1440
+ this._pad(date.getUTCMonth() + 1) +'-'+
1441
+ this._pad(date.getUTCDate());
1442
+ }
1443
+
1444
+ this.dom.input
1445
+ .val( out )
1446
+ .trigger('change', {write: date});
1318
1447
 
1319
1448
  if ( this.dom.input.attr('type') === 'hidden' ) {
1320
1449
  this.val(out, false);
@@ -1349,6 +1478,11 @@ DateTime._instance = 0;
1349
1478
  DateTime.defaults = {
1350
1479
  attachTo: 'body',
1351
1480
 
1481
+ buttons: {
1482
+ clear: false,
1483
+ today: false
1484
+ },
1485
+
1352
1486
  // Not documented - could be an internal property
1353
1487
  classPrefix: 'dt-datetime',
1354
1488
 
@@ -1363,6 +1497,7 @@ DateTime.defaults = {
1363
1497
  hoursAvailable: null,
1364
1498
 
1365
1499
  i18n: {
1500
+ clear: 'Clear',
1366
1501
  previous: 'Previous',
1367
1502
  next: 'Next',
1368
1503
  months: [ 'January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December' ],
@@ -1371,7 +1506,8 @@ DateTime.defaults = {
1371
1506
  hours: 'Hour',
1372
1507
  minutes: 'Minute',
1373
1508
  seconds: 'Second',
1374
- unknown: '-'
1509
+ unknown: '-',
1510
+ today: 'Today'
1375
1511
  },
1376
1512
 
1377
1513
  maxDate: null,
@@ -1399,7 +1535,7 @@ DateTime.defaults = {
1399
1535
  yearRange: 25
1400
1536
  };
1401
1537
 
1402
- DateTime.version = '1.0.1';
1538
+ DateTime.version = '1.1.2';
1403
1539
 
1404
1540
  // Global export - if no conflicts
1405
1541
  if (! window.DateTime) {
@@ -1417,6 +1553,10 @@ $.fn.dtDateTime = function (options) {
1417
1553
  if ($.fn.dataTable) {
1418
1554
  $.fn.dataTable.DateTime = DateTime;
1419
1555
  $.fn.DataTable.DateTime = DateTime;
1556
+
1557
+ if ($.fn.dataTable.Editor) {
1558
+ $.fn.dataTable.Editor.DateTime = DateTime;
1559
+ }
1420
1560
  }
1421
1561
 
1422
1562
  return DateTime;