lddatetimepicker 0.0.2 → 0.0.5
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.
- package/CHANGELOG.md +23 -0
- package/README.md +9 -0
- package/index.js +132 -85
- package/index.min.js +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,28 @@
|
|
|
1
1
|
# Change Logs
|
|
2
2
|
|
|
3
|
+
## v0.0.5
|
|
4
|
+
|
|
5
|
+
- support `change` event when value changed.
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
## v0.0.4
|
|
9
|
+
|
|
10
|
+
- update widget based on initial value of host if available
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
## v0.0.3
|
|
14
|
+
|
|
15
|
+
- add `isOn` API for checking if dialog is active or not
|
|
16
|
+
- handle key event only if dialog is on
|
|
17
|
+
- separate toggling code into standalone `toggle` api
|
|
18
|
+
- show local timezone offset in host
|
|
19
|
+
- update ui also when hour / minute change
|
|
20
|
+
- fix bug: hour / minute don't work
|
|
21
|
+
- support enter / escape to close
|
|
22
|
+
- let dialog be mutual exclusive
|
|
23
|
+
- fix bug: incorrect position when scrolling if scroll element is outside the absolute / relative positioned element.
|
|
24
|
+
|
|
25
|
+
|
|
3
26
|
## v0.0.2
|
|
4
27
|
|
|
5
28
|
- tweak layout
|
package/README.md
CHANGED
|
@@ -31,6 +31,15 @@ Constructor options:
|
|
|
31
31
|
- `time`: default true. hide and disable time picker if false.
|
|
32
32
|
|
|
33
33
|
|
|
34
|
+
## API
|
|
35
|
+
|
|
36
|
+
- `isOn()`: return true if lddatetimepicker dialog is on, otherwise return false
|
|
37
|
+
- `fire(n, ...args)`
|
|
38
|
+
- `on(n, cb)`
|
|
39
|
+
- `update()`
|
|
40
|
+
- `value()`
|
|
41
|
+
|
|
42
|
+
|
|
34
43
|
## License
|
|
35
44
|
|
|
36
45
|
MIT
|
package/index.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
var html, lddatetimepicker;
|
|
3
3
|
html = '<div class="lddtp">\n <div class="lddtp-h">\n <div class="lddtp-a" data-action="-"></div>\n <div class="lddtp-f"><select class="lddtp-month-sel"></select></div>\n <div class="lddtp-f"><input class="lddtp-year-sel" type="number"/></div>\n <div class="lddtp-a" data-action="+"></div>\n </div>\n <div class="lddtp-ds">\n </div>\n <div class="lddtp-t">\n <div class="lddtp-f"><select class="lddtp-hour-sel"></select></div>\n <div><b>:</b></div>\n <div class="lddtp-f"><select class="lddtp-minute-sel"></select></div>\n </div>\n</div>';
|
|
4
4
|
lddatetimepicker = function(opt){
|
|
5
|
-
var div, r, ref$, x$, _handler, this$ = this;
|
|
5
|
+
var div, r, ref$, x$, _handler, e, this$ = this;
|
|
6
6
|
opt == null && (opt = {});
|
|
7
7
|
this.opt = opt;
|
|
8
8
|
this._enabled = {
|
|
@@ -10,9 +10,40 @@
|
|
|
10
10
|
};
|
|
11
11
|
this.evthdr = {};
|
|
12
12
|
this.hdr = {
|
|
13
|
-
mouseup: function(){
|
|
13
|
+
mouseup: function(evt){
|
|
14
|
+
if (evt.target === this$.host) {
|
|
15
|
+
return;
|
|
16
|
+
}
|
|
14
17
|
this$.root.classList.toggle('active', false);
|
|
15
|
-
|
|
18
|
+
document.removeEventListener('mouseup', this$.hdr.mouseup);
|
|
19
|
+
return document.removeEventListener('keydown', this$.hdr.keydown);
|
|
20
|
+
},
|
|
21
|
+
keydown: function(evt){
|
|
22
|
+
var c;
|
|
23
|
+
if (!this$.isOn()) {
|
|
24
|
+
return;
|
|
25
|
+
}
|
|
26
|
+
c = evt.keyCode;
|
|
27
|
+
if (!(c === 13 || c === 27 || c === 37 || c === 38 || c === 39 || c === 40)) {
|
|
28
|
+
return;
|
|
29
|
+
}
|
|
30
|
+
if (!this$.sel) {
|
|
31
|
+
return;
|
|
32
|
+
}
|
|
33
|
+
if (c === 13 || c === 27) {
|
|
34
|
+
return this$.toggle(false);
|
|
35
|
+
}
|
|
36
|
+
evt.stopPropagation();
|
|
37
|
+
evt.preventDefault();
|
|
38
|
+
this$.sel = c === 37
|
|
39
|
+
? this$.sel.subtract(1, 'day')
|
|
40
|
+
: c === 39
|
|
41
|
+
? this$.sel.add(1, 'day')
|
|
42
|
+
: c === 38
|
|
43
|
+
? this$.sel.subtract(7, 'day')
|
|
44
|
+
: c === 40 ? this$.sel.add(7, 'day') : void 8;
|
|
45
|
+
this$.cur = this$.sel;
|
|
46
|
+
return this$.update();
|
|
16
47
|
}
|
|
17
48
|
};
|
|
18
49
|
div = document.createElement('div');
|
|
@@ -22,56 +53,7 @@
|
|
|
22
53
|
: opt.host;
|
|
23
54
|
this.host.parentNode.insertBefore(div, opt.host.nextSibling);
|
|
24
55
|
this.host.addEventListener('mouseup', function(evt){
|
|
25
|
-
|
|
26
|
-
evt.stopPropagation();
|
|
27
|
-
if (this$.root.classList.contains('active')) {
|
|
28
|
-
this$.root.classList.remove('active');
|
|
29
|
-
document.removeEventListener('mouseup', this$.hdr.mouseup);
|
|
30
|
-
return;
|
|
31
|
-
}
|
|
32
|
-
document.addEventListener('mouseup', this$.hdr.mouseup);
|
|
33
|
-
this$.root.classList.toggle('active', true);
|
|
34
|
-
c = this$.root;
|
|
35
|
-
h = this$.host;
|
|
36
|
-
n = h.parentNode;
|
|
37
|
-
hb = h.getBoundingClientRect();
|
|
38
|
-
cb = c.getBoundingClientRect();
|
|
39
|
-
ref$ = [0, 0], x = ref$[0], y = ref$[1];
|
|
40
|
-
ref$ = [null, null], nscroll = ref$[0], nstack = ref$[1];
|
|
41
|
-
while (n && n.getAttribute) {
|
|
42
|
-
s = getComputedStyle(n);
|
|
43
|
-
if (n.nodeName === 'BODY' || ['overflow', 'overflow-y', 'overflow-x'].filter(fn$).length) {
|
|
44
|
-
if (!nscroll) {
|
|
45
|
-
nscroll = n;
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
if (n.nodeName === 'BODY' || s.position !== 'static') {
|
|
49
|
-
if (!nstack) {
|
|
50
|
-
nstack = n;
|
|
51
|
-
}
|
|
52
|
-
}
|
|
53
|
-
if (nscroll && nstack) {
|
|
54
|
-
break;
|
|
55
|
-
}
|
|
56
|
-
n = n.parentNode;
|
|
57
|
-
}
|
|
58
|
-
stackb = nstack.getBoundingClientRect();
|
|
59
|
-
scrollb = nscroll.getBoundingClientRect();
|
|
60
|
-
if (hb.y + hb.height + cb.height > scrollb.y + scrollb.height) {
|
|
61
|
-
y = hb.y - stackb.y - cb.height + nscroll.scrollTop - 2;
|
|
62
|
-
} else {
|
|
63
|
-
y = hb.y - stackb.y + hb.height + nscroll.scrollTop + 2;
|
|
64
|
-
}
|
|
65
|
-
if (hb.x + cb.width > scrollb.x + scrollb.width) {
|
|
66
|
-
x = hb.x - stackb.x + hb.width - cb.width + nscroll.scrollLeft;
|
|
67
|
-
} else {
|
|
68
|
-
x = hb.x - stackb.x + nscroll.scrollLeft;
|
|
69
|
-
}
|
|
70
|
-
c.style.transform = "translate(" + x + "px, " + y + "px)";
|
|
71
|
-
return ref$ = c.style, ref$.top = 0, ref$.left = 0, ref$;
|
|
72
|
-
function fn$(it){
|
|
73
|
-
return s[it] !== 'visible';
|
|
74
|
-
}
|
|
56
|
+
return this$.toggle();
|
|
75
57
|
});
|
|
76
58
|
} else {
|
|
77
59
|
document.body.appendChild(div);
|
|
@@ -105,10 +87,6 @@
|
|
|
105
87
|
ref$ = [0, 1, 2].map(function(){
|
|
106
88
|
return dayjs();
|
|
107
89
|
}), this.cur = ref$[0], this.today = ref$[1], this.sel = ref$[2];
|
|
108
|
-
this.time = {
|
|
109
|
-
hour: 0,
|
|
110
|
-
minute: 0
|
|
111
|
-
};
|
|
112
90
|
this.n.sel.month.innerHTML = this.months.map(function(m){
|
|
113
91
|
return "<option value=\"" + m + "\">" + m + "</option>";
|
|
114
92
|
}).join('');
|
|
@@ -122,30 +100,11 @@
|
|
|
122
100
|
this.n.sel.minute.innerHTML = [0, 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].map(function(m){
|
|
123
101
|
return "<option value=\"" + m + "\">" + ('' + m).padStart(2, "0") + "</option>";
|
|
124
102
|
}).join('');
|
|
125
|
-
document.body.addEventListener('keydown', function(evt){
|
|
126
|
-
var c;
|
|
127
|
-
c = evt.keyCode;
|
|
128
|
-
if (!(c === 37 || c === 38 || c === 39 || c === 40)) {
|
|
129
|
-
return;
|
|
130
|
-
}
|
|
131
|
-
if (!this$.sel) {
|
|
132
|
-
return;
|
|
133
|
-
}
|
|
134
|
-
this$.sel = c === 37
|
|
135
|
-
? this$.sel.subtract(1, 'day')
|
|
136
|
-
: c === 39
|
|
137
|
-
? this$.sel.add(1, 'day')
|
|
138
|
-
: c === 38
|
|
139
|
-
? this$.sel.subtract(7, 'day')
|
|
140
|
-
: c === 40 ? this$.sel.add(7, 'day') : void 8;
|
|
141
|
-
this$.cur = this$.sel;
|
|
142
|
-
return this$.update();
|
|
143
|
-
});
|
|
144
103
|
this.root.addEventListener('click', function(evt){
|
|
145
104
|
var n;
|
|
146
105
|
n = evt.target;
|
|
147
106
|
if (n.classList.contains('lddtp-d')) {
|
|
148
|
-
this$.sel = dayjs(new Date(n.date.year, n.date.month, n.date.date));
|
|
107
|
+
this$.sel = dayjs(new Date(n.date.year, n.date.month, n.date.date, this$.sel.hour(), this$.sel.minute()));
|
|
149
108
|
return this$.update(this$.cur);
|
|
150
109
|
} else if (n.getAttribute('data-action') === '-') {
|
|
151
110
|
this$.cur = this$.cur.subtract(1, "month");
|
|
@@ -156,10 +115,12 @@
|
|
|
156
115
|
}
|
|
157
116
|
});
|
|
158
117
|
this.n.sel.minute.addEventListener('change', function(evt){
|
|
159
|
-
|
|
118
|
+
this$.sel = this$.sel.minute(evt.target.value);
|
|
119
|
+
return this$.update();
|
|
160
120
|
});
|
|
161
121
|
this.n.sel.hour.addEventListener('change', function(evt){
|
|
162
|
-
|
|
122
|
+
this$.sel = this$.sel.hour(evt.target.value);
|
|
123
|
+
return this$.update();
|
|
163
124
|
});
|
|
164
125
|
this.n.sel.year.addEventListener('change', function(evt){
|
|
165
126
|
this$.cur = dayjs(new Date(this$.n.sel.year.value, this$.months.indexOf(this$.n.sel.month.value), 1));
|
|
@@ -173,7 +134,7 @@
|
|
|
173
134
|
_handler = debounce(function(){
|
|
174
135
|
var ret, e;
|
|
175
136
|
try {
|
|
176
|
-
ret = dayjs(this$.host.value).
|
|
137
|
+
ret = dayjs(this$.host.value).format('YYYY-MM-DDTHH:mm:ssZ');
|
|
177
138
|
this$.host.value = ret;
|
|
178
139
|
return this$.value(this$.host.value);
|
|
179
140
|
} catch (e$) {
|
|
@@ -184,7 +145,12 @@
|
|
|
184
145
|
this.host.addEventListener('input', _handler);
|
|
185
146
|
}
|
|
186
147
|
if (this.host && this.host.value) {
|
|
187
|
-
|
|
148
|
+
try {
|
|
149
|
+
this.host.value = dayjs(this.host.value).format('YYYY-MM-DDTHH:mm:ssZ');
|
|
150
|
+
this.value(this.host.value);
|
|
151
|
+
} catch (e$) {
|
|
152
|
+
e = e$;
|
|
153
|
+
}
|
|
188
154
|
} else {
|
|
189
155
|
this.update();
|
|
190
156
|
}
|
|
@@ -213,8 +179,82 @@
|
|
|
213
179
|
}
|
|
214
180
|
return results$;
|
|
215
181
|
},
|
|
182
|
+
isOn: function(){
|
|
183
|
+
return this.root.classList.contains('active');
|
|
184
|
+
},
|
|
185
|
+
toggle: function(v){
|
|
186
|
+
var c, h, n, hb, cb, ref$, x, y, nscroll, nstack, countScroll, s, stackb, scrollb, scroll;
|
|
187
|
+
if (arguments.length === 0) {
|
|
188
|
+
v = !this.root.classList.contains('active');
|
|
189
|
+
}
|
|
190
|
+
if (!v) {
|
|
191
|
+
this.root.classList.toggle('active', false);
|
|
192
|
+
document.removeEventListener('mouseup', this.hdr.mouseup);
|
|
193
|
+
document.removeEventListener('keydown', this.hdr.keydown);
|
|
194
|
+
return;
|
|
195
|
+
}
|
|
196
|
+
if (!this.isOn()) {
|
|
197
|
+
document.addEventListener('mouseup', this.hdr.mouseup);
|
|
198
|
+
document.addEventListener('keydown', this.hdr.keydown);
|
|
199
|
+
}
|
|
200
|
+
this.root.classList.toggle('active', true);
|
|
201
|
+
c = this.root;
|
|
202
|
+
h = this.host;
|
|
203
|
+
n = h.parentNode;
|
|
204
|
+
hb = h.getBoundingClientRect();
|
|
205
|
+
cb = c.getBoundingClientRect();
|
|
206
|
+
ref$ = [0, 0], x = ref$[0], y = ref$[1];
|
|
207
|
+
ref$ = [null, null], nscroll = ref$[0], nstack = ref$[1];
|
|
208
|
+
countScroll = true;
|
|
209
|
+
while (n && n.getAttribute) {
|
|
210
|
+
s = getComputedStyle(n);
|
|
211
|
+
if (n.nodeName === 'BODY' || ['overflow', 'overflow-y', 'overflow-x'].filter(fn$).length) {
|
|
212
|
+
if (!nscroll) {
|
|
213
|
+
nscroll = n;
|
|
214
|
+
}
|
|
215
|
+
}
|
|
216
|
+
if (n.nodeName === 'BODY' || s.position !== 'static') {
|
|
217
|
+
if (!nstack) {
|
|
218
|
+
nstack = n;
|
|
219
|
+
if (!nscroll) {
|
|
220
|
+
countScroll = false;
|
|
221
|
+
}
|
|
222
|
+
}
|
|
223
|
+
}
|
|
224
|
+
if (nscroll && nstack) {
|
|
225
|
+
break;
|
|
226
|
+
}
|
|
227
|
+
n = n.parentNode;
|
|
228
|
+
}
|
|
229
|
+
stackb = nstack.getBoundingClientRect();
|
|
230
|
+
scrollb = nscroll.getBoundingClientRect();
|
|
231
|
+
scroll = countScroll
|
|
232
|
+
? {
|
|
233
|
+
left: nscroll.scrollLeft,
|
|
234
|
+
top: nscroll.scrollTop
|
|
235
|
+
}
|
|
236
|
+
: {
|
|
237
|
+
left: 0,
|
|
238
|
+
top: 0
|
|
239
|
+
};
|
|
240
|
+
if (hb.y + hb.height + cb.height > scrollb.y + scrollb.height) {
|
|
241
|
+
y = hb.y - stackb.y - cb.height + scroll.top - 2;
|
|
242
|
+
} else {
|
|
243
|
+
y = hb.y - stackb.y + hb.height + scroll.top + 2;
|
|
244
|
+
}
|
|
245
|
+
if (hb.x + cb.width > scrollb.x + scrollb.width) {
|
|
246
|
+
x = hb.x - stackb.x + hb.width - cb.width + scroll.left;
|
|
247
|
+
} else {
|
|
248
|
+
x = hb.x - stackb.x + scroll.left;
|
|
249
|
+
}
|
|
250
|
+
c.style.transform = "translate(" + x + "px, " + y + "px)";
|
|
251
|
+
return ref$ = c.style, ref$.top = 0, ref$.left = 0, ref$;
|
|
252
|
+
function fn$(it){
|
|
253
|
+
return s[it] !== 'visible';
|
|
254
|
+
}
|
|
255
|
+
},
|
|
216
256
|
update: function(now){
|
|
217
|
-
var ref$, y, m, start, ny, nm, nd, ty, tm, td, sy, sm, sd;
|
|
257
|
+
var ref$, y, m, start, ny, nm, nd, ty, tm, td, sy, sm, sd, ov, nv;
|
|
218
258
|
now = now || this.cur;
|
|
219
259
|
ref$ = [now.year(), now.month()], y = ref$[0], m = ref$[1];
|
|
220
260
|
now = dayjs(new Date(now.year(), now.month(), 1));
|
|
@@ -226,6 +266,8 @@
|
|
|
226
266
|
: [this.sel.year(), this.sel.month(), this.sel.date()], sy = ref$[0], sm = ref$[1], sd = ref$[2];
|
|
227
267
|
this.n.sel.month.value = this.months[nm];
|
|
228
268
|
this.n.sel.year.value = ny;
|
|
269
|
+
this.n.sel.minute.value = this.sel.minute();
|
|
270
|
+
this.n.sel.hour.value = this.sel.hour();
|
|
229
271
|
this.n.dc.map(function(n, i){
|
|
230
272
|
var d, ref$, dy, dm, dd;
|
|
231
273
|
d = start.add(i, 'day');
|
|
@@ -241,15 +283,20 @@
|
|
|
241
283
|
return n.classList.toggle('selected', sy === dy && sm === dm && sd === dd);
|
|
242
284
|
});
|
|
243
285
|
if (this.host) {
|
|
244
|
-
|
|
286
|
+
ov = this.host.value;
|
|
287
|
+
nv = this.value();
|
|
288
|
+
this.host.value = nv;
|
|
289
|
+
if (ov !== nv) {
|
|
290
|
+
return this.fire('change', nv);
|
|
291
|
+
}
|
|
245
292
|
}
|
|
246
293
|
},
|
|
247
294
|
value: function(v){
|
|
248
295
|
var ret;
|
|
249
296
|
if (!arguments.length) {
|
|
250
297
|
if (this._enabled.time) {
|
|
251
|
-
ret = dayjs(new Date(this.sel.year(), this.sel.month(), this.sel.date(), this.
|
|
252
|
-
return ret.
|
|
298
|
+
ret = dayjs(new Date(this.sel.year(), this.sel.month(), this.sel.date(), this.sel.hour(), this.sel.minute()));
|
|
299
|
+
return ret.format('YYYY-MM-DDTHH:mm:ssZ');
|
|
253
300
|
} else {
|
|
254
301
|
return dayjs(new Date(this.sel.year(), this.sel.month(), this.sel.date())).format('YYYY-MM-DD');
|
|
255
302
|
}
|
package/index.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(){var t;(t=function(t){var e,
|
|
1
|
+
!function(){var t;(t=function(t){var e,s=this;if(this.opt=t=null==t?{}:t,this._enabled={time:!(null!=t.time)||t.time},this.evthdr={},this.hdr={mouseup:function(t){if(t.target!==s.host)return s.root.classList.toggle("active",!1),document.removeEventListener("mouseup",s.hdr.mouseup),document.removeEventListener("keydown",s.hdr.keydown)},keydown:function(t){var e;if(s.isOn()&&(13===(e=t.keyCode)||27===e||37===e||38===e||39===e||40===e)&&s.sel)return 13===e||27===e?s.toggle(!1):(t.stopPropagation(),t.preventDefault(),s.sel=37===e?s.sel.subtract(1,"day"):39===e?s.sel.add(1,"day"):38===e?s.sel.subtract(7,"day"):40===e?s.sel.add(7,"day"):void 0,s.cur=s.sel,s.update())}},e=document.createElement("div"),t.host?(this.host="string"==typeof t.host?document.querySelector(t.host):t.host,this.host.parentNode.insertBefore(e,t.host.nextSibling),this.host.addEventListener("mouseup",function(t){return s.toggle()})):document.body.appendChild(e),e.innerHTML='<div class="lddtp">\n <div class="lddtp-h">\n <div class="lddtp-a" data-action="-"></div>\n <div class="lddtp-f"><select class="lddtp-month-sel"></select></div>\n <div class="lddtp-f"><input class="lddtp-year-sel" type="number"/></div>\n <div class="lddtp-a" data-action="+"></div>\n </div>\n <div class="lddtp-ds">\n </div>\n <div class="lddtp-t">\n <div class="lddtp-f"><select class="lddtp-hour-sel"></select></div>\n <div><b>:</b></div>\n <div class="lddtp-f"><select class="lddtp-minute-sel"></select></div>\n </div>\n</div>',this.root=t=e.querySelector(".lddtp"),this.root.addEventListener("mouseup",function(t){return t.stopPropagation()}),this.n={ds:t.querySelector(".lddtp-ds"),t:t.querySelector(".lddtp-t"),sel:{year:t.querySelector(".lddtp-year-sel"),month:t.querySelector(".lddtp-month-sel"),hour:t.querySelector(".lddtp-hour-sel"),minute:t.querySelector(".lddtp-minute-sel")}},this.n.t.style.display=this._enabled.time?"":"none",this.months=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],this.wdays=["SUN","MON","TUE","WED","THR","FRI","SAT"],this.n.ds.innerHTML=[0,1,2,3,4,5,6].map(function(t){return'<div class="lddtp-w">'+s.wdays[t]+"</div>"}).join("")+[0,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].map(function(t){return'<div class="lddtp-d"></div>'}).join(""),(e=this.n).dh=Array.from(t.querySelectorAll(".lddtp-w")),e.dc=Array.from(t.querySelectorAll(".lddtp-d")),e=[0,1,2].map(function(){return dayjs()}),this.cur=e[0],this.today=e[1],this.sel=e[2],this.n.sel.month.innerHTML=this.months.map(function(t){return'<option value="'+t+'">'+t+"</option>"}).join(""),(t=this.n.sel.year).setAttribute("min",1900),t.setAttribute("max",2300),t.setAttribute("value",this.today.year()),this.n.sel.hour.innerHTML=[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23].map(function(t){return'<option value="'+t+'">'+(""+t).padStart(2,"0")+"</option>"}).join(""),this.n.sel.minute.innerHTML=[0,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].map(function(t){return'<option value="'+t+'">'+(""+t).padStart(2,"0")+"</option>"}).join(""),this.root.addEventListener("click",function(t){t=t.target;return t.classList.contains("lddtp-d")?(s.sel=dayjs(new Date(t.date.year,t.date.month,t.date.date,s.sel.hour(),s.sel.minute())),s.update(s.cur)):"-"===t.getAttribute("data-action")?(s.cur=s.cur.subtract(1,"month"),s.update(s.cur)):"+"===t.getAttribute("data-action")?(s.cur=s.cur.add(1,"month"),s.update(s.cur)):void 0}),this.n.sel.minute.addEventListener("change",function(t){return s.sel=s.sel.minute(t.target.value),s.update()}),this.n.sel.hour.addEventListener("change",function(t){return s.sel=s.sel.hour(t.target.value),s.update()}),this.n.sel.year.addEventListener("change",function(t){return s.cur=dayjs(new Date(s.n.sel.year.value,s.months.indexOf(s.n.sel.month.value),1)),s.update(s.cur)}),this.n.sel.month.addEventListener("change",function(t){return s.cur=dayjs(new Date(s.n.sel.year.value,s.months.indexOf(s.n.sel.month.value),1)),s.update(s.cur)}),this.host&&(e=debounce(function(){var t;try{return t=dayjs(s.host.value).format("YYYY-MM-DDTHH:mm:ssZ"),s.host.value=t,s.value(s.host.value)}catch(t){return t}}),this.host.addEventListener("change",e),this.host.addEventListener("input",e)),this.host&&this.host.value)try{this.host.value=dayjs(this.host.value).format("YYYY-MM-DDTHH:mm:ssZ"),this.value(this.host.value)}catch(t){0}else this.update();return this}).prototype=function(t,e){var s,n={}.hasOwnProperty;for(s in e)n.call(e,s)&&(t[s]=e[s]);return t}(Object.create(Object.prototype),{on:function(t,s){var n=this;return(Array.isArray(t)?t:[t]).map(function(t){var e;return((e=n.evthdr)[t]||(e[t]=[])).push(s)})},fire:function(t){for(var e,s,n,i,o=[],r=[],d=1,a=arguments.length;d<a;++d)r.push(arguments[d]);for(e=r,d=0,n=(s=this.evthdr[t]||[]).length;d<n;++d)i=s[d],o.push(i.apply(this,e));return o},isOn:function(){return this.root.classList.contains("active")},toggle:function(t){var e,s,n,i,o,r,d,a,l,u,h,c,p,v;if(!(t=0===arguments.length?!this.root.classList.contains("active"):t))return this.root.classList.toggle("active",!1),document.removeEventListener("mouseup",this.hdr.mouseup),void document.removeEventListener("keydown",this.hdr.keydown);for(this.isOn()||(document.addEventListener("mouseup",this.hdr.mouseup),document.addEventListener("keydown",this.hdr.keydown)),this.root.classList.toggle("active",!0),e=this.root,s=(n=this.host).parentNode,n=n.getBoundingClientRect(),i=e.getBoundingClientRect(),r=(o=[0,0])[0],d=o[1],a=(o=[null,null])[0],l=o[1],u=!0;s&&s.getAttribute&&(h=getComputedStyle(s),"BODY"!==s.nodeName&&!["overflow","overflow-y","overflow-x"].filter(m).length||(a=a||s),"BODY"!==s.nodeName&&"static"===h.position||l||(l=s,a||(u=!1)),!a||!l);)s=s.parentNode;return c=l.getBoundingClientRect(),p=a.getBoundingClientRect(),v=u?{left:a.scrollLeft,top:a.scrollTop}:{left:0,top:0},d=n.y+n.height+i.height>p.y+p.height?n.y-c.y-i.height+v.top-2:n.y-c.y+n.height+v.top+2,r=n.x+i.width>p.x+p.width?n.x-c.x+n.width-i.width+v.left:n.x-c.x+v.left,e.style.transform="translate("+r+"px, "+d+"px)",(o=e.style).top=0,o.left=0,o;function m(t){return"visible"!==h[t]}},update:function(t){s=[(t=t||this.cur).year(),t.month()];var o,e,r,d,a,l,u,h,s,n,c=s[1];if(t=dayjs(new Date(t.year(),t.month(),1)),o=t.subtract(t.day(),"day"),t=(s=[t.year(),t.month(),t.date()])[0],e=s[1],s=[this.today.year(),this.today.month(),this.today.date()],r=s[0],d=s[1],a=s[2],s=this.sel?[this.sel.year(),this.sel.month(),this.sel.date()]:[null,null,null],l=s[0],u=s[1],h=s[2],this.n.sel.month.value=this.months[e],this.n.sel.year.value=t,this.n.sel.minute.value=this.sel.minute(),this.n.sel.hour.value=this.sel.hour(),this.n.dc.map(function(t,e){var e=o.add(e,"day"),s=[e.year(),e.month(),e.date()],n=s[0],i=s[1],s=s[2];return t.date={year:n,month:i,date:s},t.innerText=e.date(),t.classList.toggle("dim",e.month()!==c),t.classList.toggle("today",r===n&&d===i&&a===s),t.classList.toggle("selected",l===n&&u===i&&h===s)}),this.host&&(s=this.host.value,n=this.value(),s!==(this.host.value=n)))return this.fire("change",n)},value:function(t){return arguments.length?(this.sel=dayjs(t),this.cur=dayjs(t),this.update()):this._enabled.time?dayjs(new Date(this.sel.year(),this.sel.month(),this.sel.date(),this.sel.hour(),this.sel.minute())).format("YYYY-MM-DDTHH:mm:ssZ"):dayjs(new Date(this.sel.year(),this.sel.month(),this.sel.date())).format("YYYY-MM-DD")}}),"undefined"!=typeof module&&null!==module?module.exports=t:"undefined"!=typeof window&&null!==window&&(window.lddatetimepicker=t)}.call(this);
|
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"lddatetimepicker","version":"0.0.
|
|
1
|
+
{"name":"lddatetimepicker","version":"0.0.5","description":"vanilla date/time picker","browser":"index.min.js","main":"index.js","scripts":{"start":"npx server -r web -o true"},"homepage":"https://github.com/loadingio/lddatetimepicker","repository":{"type":"git","url":"https://github.com/loadingio/lddatetimepicker"},"keywords":["date","time","datetime","datepicker","datetimepicker"],"author":"zbryikt","license":"MIT","devDependencies":{"@loadingio/bootstrap.ext":"^0.0.6","@loadingio/debounce.js":"^1.0.1","@zbryikt/template":"^2.3.34","bootstrap":"^4.6.1","dayjs":"^1.11.0","fedep":"^1.1.7","ldcover":"^3.0.1","ldview":"^1.1.1","livescript":"^1.6.0","proxise":"^1.0.1","stylus":"^0.57.0","uglify-js":"^3.15.3","uglifycss":"^0.0.29"},"frontendDependencies":{"root":"web/static/assets/lib","modules":["@loadingio/bootstrap.ext","@loadingio/debounce.js","@loadingio/ldquery","dayjs","bootstrap","ldcover","ldview","proxise"]},"dependencies":{"@loadingio/ldquery":"^3.0.3"}}
|