lddatetimepicker 0.0.1

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 ADDED
@@ -0,0 +1,5 @@
1
+ # Change Logs
2
+
3
+ ## v0.0.1
4
+
5
+ - init release
package/README.md ADDED
@@ -0,0 +1,36 @@
1
+ # lddatetimepicker
2
+
3
+ Vanilla Date/Time picker.
4
+
5
+
6
+ ## Usage
7
+
8
+ install via npm, along with required libraries:
9
+
10
+ npm install --save lddatetimepicker @loadingio/debounce.js dayjs
11
+
12
+
13
+ include required js / css:
14
+
15
+ <link rel="stylesheet" type="text/css" href="dist/index.min.css">
16
+ <script type="text/javascript" src="path-to/debounce.js"></script>
17
+ <script type="text/javascript" src="path-to-day.js"></script>
18
+ <script type="text/javascript" src="dist/index.min.js"></script>
19
+
20
+
21
+ initialize:
22
+
23
+ lddtp = new lddatetimepicker({host: "input"})
24
+ lddtp.value("2021/01/23"); // set value
25
+ lddtp.value(); // get value
26
+
27
+
28
+ Constructor options:
29
+
30
+ - `host`: host element ( should be an input element, if provided )
31
+ - `time`: default true. hide and disable time picker if false.
32
+
33
+
34
+ ## License
35
+
36
+ MIT
package/index.css ADDED
@@ -0,0 +1,91 @@
1
+ .lddtp-h {
2
+ display: grid;
3
+ grid-template-columns: 1fr 2.5fr 2.5fr 1fr;
4
+ }
5
+ .lddtp-h div {
6
+ border-radius: 0.25em;
7
+ display: flex;
8
+ align-items: center;
9
+ justify-content: center;
10
+ margin: 1px;
11
+ }
12
+ .lddtp-h .info {
13
+ flex: 1 0 auto;
14
+ text-align: center;
15
+ }
16
+ .lddtp {
17
+ position: absolute;
18
+ z-index: 100;
19
+ width: 300px;
20
+ border: 1px solid #d6d7d8;
21
+ border-radius: 0.25em;
22
+ background: #fff;
23
+ box-shadow: 0 3px 5px rgba(0,0,0,0.1);
24
+ cursor: pointer;
25
+ display: none;
26
+ }
27
+ .lddtp div {
28
+ user-select: none;
29
+ }
30
+ .lddtp.active {
31
+ display: block;
32
+ }
33
+ .lddtp-ds {
34
+ height: 250px;
35
+ display: grid;
36
+ grid-template: .8fr repeat(6,1fr) / repeat(7,1fr);
37
+ border-bottom: 1px solid #e7e8e9;
38
+ border-top: 1px solid #e7e8e9;
39
+ }
40
+ .lddtp-ds div {
41
+ margin: 1px;
42
+ overflow: hidden;
43
+ display: flex;
44
+ position: relative;
45
+ align-items: center;
46
+ justify-content: center;
47
+ }
48
+ .lddtp-ds .dim {
49
+ color: #ccc;
50
+ background: #f7f8f9;
51
+ }
52
+ .lddtp-ds .today:before {
53
+ display: block;
54
+ content: " ";
55
+ border-radius: 50%;
56
+ width: 6px;
57
+ height: 6px;
58
+ position: absolute;
59
+ top: 4px;
60
+ left: 4px;
61
+ background: #0f0;
62
+ }
63
+ .lddtp-w {
64
+ font-size: 0.8em;
65
+ font-weight: 700;
66
+ }
67
+ .lddtp-d.selected {
68
+ background: #00f;
69
+ color: #fff;
70
+ border-radius: 0.25em;
71
+ font-weight: 700;
72
+ }
73
+ .lddtp-t {
74
+ display: grid;
75
+ grid-template-columns: 1fr 5px 1fr;
76
+ }
77
+ .lddtp-t div {
78
+ height: 2.5em;
79
+ display: flex;
80
+ align-items: center;
81
+ }
82
+ .lddtp-t .lddtp-f input,
83
+ .lddtp-h .lddtp-f input,
84
+ .lddtp-t .lddtp-f select,
85
+ .lddtp-h .lddtp-f select {
86
+ height: 100%;
87
+ width: 100%;
88
+ border: 0;
89
+ outline: 0;
90
+ text-align: center;
91
+ }
package/index.js ADDED
@@ -0,0 +1,272 @@
1
+ (function(){
2
+ var html, lddatetimepicker;
3
+ html = '<div class="lddtp">\n <div class="lddtp-h">\n <div data-action="-">&#x25c0;</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 data-action="+">&#x25ba;</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
+ lddatetimepicker = function(opt){
5
+ var div, r, ref$, x$, _handler, this$ = this;
6
+ opt == null && (opt = {});
7
+ this.opt = opt;
8
+ this._enabled = {
9
+ time: !(opt.time != null) || opt.time
10
+ };
11
+ this.evthdr = {};
12
+ this.hdr = {
13
+ mouseup: function(){
14
+ this$.root.classList.toggle('active', false);
15
+ return document.removeEventListener('mouseup', this$.hdr.mouseup);
16
+ }
17
+ };
18
+ div = document.createElement('div');
19
+ if (opt.host) {
20
+ this.host = typeof opt.host === 'string'
21
+ ? document.querySelector(opt.host)
22
+ : opt.host;
23
+ this.host.parentNode.insertBefore(div, opt.host.nextSibling);
24
+ this.host.addEventListener('mouseup', function(evt){
25
+ var c, h, n, hb, cb, ref$, x, y, nscroll, nstack, s, stackb, scrollb;
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
+ }
75
+ });
76
+ } else {
77
+ document.body.appendChild(div);
78
+ }
79
+ div.innerHTML = html;
80
+ this.root = r = div.querySelector('.lddtp');
81
+ this.root.addEventListener('mouseup', function(evt){
82
+ return evt.stopPropagation();
83
+ });
84
+ this.n = {
85
+ ds: r.querySelector('.lddtp-ds'),
86
+ t: r.querySelector('.lddtp-t'),
87
+ sel: {
88
+ year: r.querySelector('.lddtp-year-sel'),
89
+ month: r.querySelector('.lddtp-month-sel'),
90
+ hour: r.querySelector('.lddtp-hour-sel'),
91
+ minute: r.querySelector('.lddtp-minute-sel')
92
+ }
93
+ };
94
+ this.n.t.style.display = this._enabled.time ? 'block' : 'none';
95
+ this.months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
96
+ this.wdays = ['SUN', 'MON', 'TUE', 'WED', 'THR', 'FRI', 'SAT'];
97
+ this.n.ds.innerHTML = [0, 1, 2, 3, 4, 5, 6].map(function(w){
98
+ return "<div class=\"lddtp-w\">" + this$.wdays[w] + "</div>";
99
+ }).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(d){
100
+ return "<div class=\"lddtp-d\"></div>";
101
+ }).join('');
102
+ ref$ = this.n;
103
+ ref$.dh = Array.from(r.querySelectorAll('.lddtp-w'));
104
+ ref$.dc = Array.from(r.querySelectorAll('.lddtp-d'));
105
+ ref$ = [0, 1, 2].map(function(){
106
+ return dayjs();
107
+ }), this.cur = ref$[0], this.today = ref$[1], this.sel = ref$[2];
108
+ this.time = {
109
+ hour: 0,
110
+ minute: 0
111
+ };
112
+ this.n.sel.month.innerHTML = this.months.map(function(m){
113
+ return "<option value=\"" + m + "\">" + m + "</option>";
114
+ }).join('');
115
+ x$ = this.n.sel.year;
116
+ x$.setAttribute('min', 1900);
117
+ x$.setAttribute('max', 2300);
118
+ x$.setAttribute('value', this.today.year());
119
+ 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(h){
120
+ return "<option value=\"" + h + "\">" + ('' + h).padStart(2, "0") + "</option>";
121
+ }).join('');
122
+ 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
+ return "<option value=\"" + m + "\">" + ('' + m).padStart(2, "0") + "</option>";
124
+ }).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
+ this.root.addEventListener('click', function(evt){
145
+ var n;
146
+ n = evt.target;
147
+ if (n.classList.contains('lddtp-d')) {
148
+ this$.sel = dayjs(new Date(n.date.year, n.date.month, n.date.date));
149
+ return this$.update(this$.cur);
150
+ } else if (n.getAttribute('data-action') === '-') {
151
+ this$.cur = this$.cur.subtract(1, "month");
152
+ return this$.update(this$.cur);
153
+ } else if (n.getAttribute('data-action') === '+') {
154
+ this$.cur = this$.cur.add(1, "month");
155
+ return this$.update(this$.cur);
156
+ }
157
+ });
158
+ this.n.sel.minute.addEventListener('change', function(evt){
159
+ return this$.time.minute = evt.target.value;
160
+ });
161
+ this.n.sel.hour.addEventListener('change', function(evt){
162
+ return this$.time.hour = evt.target.value;
163
+ });
164
+ this.n.sel.year.addEventListener('change', function(evt){
165
+ this$.cur = dayjs(new Date(this$.n.sel.year.value, this$.months.indexOf(this$.n.sel.month.value), 1));
166
+ return this$.update(this$.cur);
167
+ });
168
+ this.n.sel.month.addEventListener('change', function(evt){
169
+ this$.cur = dayjs(new Date(this$.n.sel.year.value, this$.months.indexOf(this$.n.sel.month.value), 1));
170
+ return this$.update(this$.cur);
171
+ });
172
+ if (this.host) {
173
+ _handler = debounce(function(){
174
+ var ret, e;
175
+ try {
176
+ ret = dayjs(this$.host.value).toISOString();
177
+ this$.host.value = ret;
178
+ return this$.value(this$.host.value);
179
+ } catch (e$) {
180
+ return e = e$;
181
+ }
182
+ });
183
+ this.host.addEventListener('change', _handler);
184
+ this.host.addEventListener('input', _handler);
185
+ }
186
+ if (this.host && this.host.value) {
187
+ this.value(this.host.value);
188
+ } else {
189
+ this.update();
190
+ }
191
+ return this;
192
+ };
193
+ lddatetimepicker.prototype = import$(Object.create(Object.prototype), {
194
+ on: function(n, cb){
195
+ var this$ = this;
196
+ return (Array.isArray(n)
197
+ ? n
198
+ : [n]).map(function(n){
199
+ var ref$;
200
+ return ((ref$ = this$.evthdr)[n] || (ref$[n] = [])).push(cb);
201
+ });
202
+ },
203
+ fire: function(n){
204
+ var v, res$, i$, to$, ref$, len$, cb, results$ = [];
205
+ res$ = [];
206
+ for (i$ = 1, to$ = arguments.length; i$ < to$; ++i$) {
207
+ res$.push(arguments[i$]);
208
+ }
209
+ v = res$;
210
+ for (i$ = 0, len$ = (ref$ = this.evthdr[n] || []).length; i$ < len$; ++i$) {
211
+ cb = ref$[i$];
212
+ results$.push(cb.apply(this, v));
213
+ }
214
+ return results$;
215
+ },
216
+ update: function(now){
217
+ var ref$, y, m, start, ny, nm, nd, ty, tm, td, sy, sm, sd;
218
+ now = now || this.cur;
219
+ ref$ = [now.year(), now.month()], y = ref$[0], m = ref$[1];
220
+ now = dayjs(new Date(now.year(), now.month(), 1));
221
+ start = now.subtract(now.day(), 'day');
222
+ ref$ = [now.year(), now.month(), now.date()], ny = ref$[0], nm = ref$[1], nd = ref$[2];
223
+ ref$ = [this.today.year(), this.today.month(), this.today.date()], ty = ref$[0], tm = ref$[1], td = ref$[2];
224
+ ref$ = !this.sel
225
+ ? [null, null, null]
226
+ : [this.sel.year(), this.sel.month(), this.sel.date()], sy = ref$[0], sm = ref$[1], sd = ref$[2];
227
+ this.n.sel.month.value = this.months[nm];
228
+ this.n.sel.year.value = ny;
229
+ this.n.dc.map(function(n, i){
230
+ var d, ref$, dy, dm, dd;
231
+ d = start.add(i, 'day');
232
+ ref$ = [d.year(), d.month(), d.date()], dy = ref$[0], dm = ref$[1], dd = ref$[2];
233
+ n.date = {
234
+ year: dy,
235
+ month: dm,
236
+ date: dd
237
+ };
238
+ n.innerText = d.date();
239
+ n.classList.toggle('dim', d.month() !== m);
240
+ n.classList.toggle('today', ty === dy && tm === dm && td === dd);
241
+ return n.classList.toggle('selected', sy === dy && sm === dm && sd === dd);
242
+ });
243
+ if (this.host) {
244
+ return this.host.value = this.value();
245
+ }
246
+ },
247
+ value: function(v){
248
+ var ret;
249
+ if (!arguments.length) {
250
+ if (this._enabled.time) {
251
+ ret = dayjs(new Date(this.sel.year(), this.sel.month(), this.sel.date(), this.time.hour, this.time.minute));
252
+ return ret.toISOString();
253
+ } else {
254
+ return dayjs(new Date(this.sel.year(), this.sel.month(), this.sel.date())).format('YYYY-MM-DD');
255
+ }
256
+ }
257
+ this.sel = dayjs(v);
258
+ this.cur = dayjs(v);
259
+ return this.update();
260
+ }
261
+ });
262
+ if (typeof module != 'undefined' && module !== null) {
263
+ module.exports = lddatetimepicker;
264
+ } else if (typeof window != 'undefined' && window !== null) {
265
+ window.lddatetimepicker = lddatetimepicker;
266
+ }
267
+ function import$(obj, src){
268
+ var own = {}.hasOwnProperty;
269
+ for (var key in src) if (own.call(src, key)) obj[key] = src[key];
270
+ return obj;
271
+ }
272
+ }).call(this);
package/index.min.css ADDED
@@ -0,0 +1 @@
1
+ .lddtp-h{display:grid;grid-template-columns:1fr 2.5fr 2.5fr 1fr}.lddtp-h div{border-radius:.25em;display:flex;align-items:center;justify-content:center;margin:1px}.lddtp-h .info{flex:1 0 auto;text-align:center}.lddtp{position:absolute;z-index:100;width:300px;border:1px solid #d6d7d8;border-radius:.25em;background:#fff;box-shadow:0 3px 5px rgba(0,0,0,0.1);cursor:pointer;display:none}.lddtp div{user-select:none}.lddtp.active{display:block}.lddtp-ds{height:250px;display:grid;grid-template:.8fr repeat(6,1fr) / repeat(7,1fr);border-bottom:1px solid #e7e8e9;border-top:1px solid #e7e8e9}.lddtp-ds div{margin:1px;overflow:hidden;display:flex;position:relative;align-items:center;justify-content:center}.lddtp-ds .dim{color:#ccc;background:#f7f8f9}.lddtp-ds .today:before{display:block;content:" ";border-radius:50%;width:6px;height:6px;position:absolute;top:4px;left:4px;background:#0f0}.lddtp-w{font-size:.8em;font-weight:700}.lddtp-d.selected{background:#00f;color:#fff;border-radius:.25em;font-weight:700}.lddtp-t{display:grid;grid-template-columns:1fr 5px 1fr}.lddtp-t div{height:2.5em;display:flex;align-items:center}.lddtp-t .lddtp-f input,.lddtp-h .lddtp-f input,.lddtp-t .lddtp-f select,.lddtp-h .lddtp-f select{height:100%;width:100%;border:0;outline:0;text-align:center}
package/index.min.js ADDED
@@ -0,0 +1 @@
1
+ !function(){var t;(t=function(t){var e,p=this;return this.opt=t=null==t?{}:t,this._enabled={time:!(null!=t.time)||t.time},this.evthdr={},this.hdr={mouseup:function(){return p.root.classList.toggle("active",!1),document.removeEventListener("mouseup",p.hdr.mouseup)}},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){var e,n,s,i,o,r,d,a,l,u,h;if(t.stopPropagation(),p.root.classList.contains("active"))return p.root.classList.remove("active"),void document.removeEventListener("mouseup",p.hdr.mouseup);for(document.addEventListener("mouseup",p.hdr.mouseup),p.root.classList.toggle("active",!0),t=p.root,e=(n=p.host).parentNode,n=n.getBoundingClientRect(),s=t.getBoundingClientRect(),o=(i=[0,0])[0],r=i[1],d=(i=[null,null])[0],a=i[1];e&&e.getAttribute&&(l=getComputedStyle(e),"BODY"!==e.nodeName&&!["overflow","overflow-y","overflow-x"].filter(c).length||(d=d||e),"BODY"!==e.nodeName&&"static"===l.position||(a=a||e),!d||!a);)e=e.parentNode;return u=a.getBoundingClientRect(),h=d.getBoundingClientRect(),r=n.y+n.height+s.height>h.y+h.height?n.y-u.y-s.height+d.scrollTop-2:n.y-u.y+n.height+d.scrollTop+2,o=n.x+s.width>h.x+h.width?n.x-u.x+n.width-s.width+d.scrollLeft:n.x-u.x+d.scrollLeft,t.style.transform="translate("+o+"px, "+r+"px)",(i=t.style).top=0,i.left=0,i;function c(t){return"visible"!==l[t]}})):document.body.appendChild(e),e.innerHTML='<div class="lddtp">\n <div class="lddtp-h">\n <div data-action="-">&#x25c0;</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 data-action="+">&#x25ba;</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?"block":"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">'+p.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.time={hour:0,minute:0},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(""),document.body.addEventListener("keydown",function(t){t=t.keyCode;if((37===t||38===t||39===t||40===t)&&p.sel)return p.sel=37===t?p.sel.subtract(1,"day"):39===t?p.sel.add(1,"day"):38===t?p.sel.subtract(7,"day"):40===t?p.sel.add(7,"day"):void 0,p.cur=p.sel,p.update()}),this.root.addEventListener("click",function(t){t=t.target;return t.classList.contains("lddtp-d")?(p.sel=dayjs(new Date(t.date.year,t.date.month,t.date.date)),p.update(p.cur)):"-"===t.getAttribute("data-action")?(p.cur=p.cur.subtract(1,"month"),p.update(p.cur)):"+"===t.getAttribute("data-action")?(p.cur=p.cur.add(1,"month"),p.update(p.cur)):void 0}),this.n.sel.minute.addEventListener("change",function(t){return p.time.minute=t.target.value}),this.n.sel.hour.addEventListener("change",function(t){return p.time.hour=t.target.value}),this.n.sel.year.addEventListener("change",function(t){return p.cur=dayjs(new Date(p.n.sel.year.value,p.months.indexOf(p.n.sel.month.value),1)),p.update(p.cur)}),this.n.sel.month.addEventListener("change",function(t){return p.cur=dayjs(new Date(p.n.sel.year.value,p.months.indexOf(p.n.sel.month.value),1)),p.update(p.cur)}),this.host&&(e=debounce(function(){var t;try{return t=dayjs(p.host.value).toISOString(),p.host.value=t,p.value(p.host.value)}catch(t){return t}}),this.host.addEventListener("change",e),this.host.addEventListener("input",e)),this.host&&this.host.value?this.value(this.host.value):this.update(),this}).prototype=function(t,e){var n,s={}.hasOwnProperty;for(n in e)s.call(e,n)&&(t[n]=e[n]);return t}(Object.create(Object.prototype),{on:function(t,n){var s=this;return(Array.isArray(t)?t:[t]).map(function(t){var e;return((e=s.evthdr)[t]||(e[t]=[])).push(n)})},fire:function(t){for(var e,n,s,i,o=[],r=[],d=1,a=arguments.length;d<a;++d)r.push(arguments[d]);for(e=r,d=0,s=(n=this.evthdr[t]||[]).length;d<s;++d)i=n[d],o.push(i.apply(this,e));return o},update:function(t){e=[(t=t||this.cur).year(),t.month()];var e,o,n,r,d,a,l,u,h,c=e[1];if(t=dayjs(new Date(t.year(),t.month(),1)),o=t.subtract(t.day(),"day"),t=(e=[t.year(),t.month(),t.date()])[0],n=e[1],e=[this.today.year(),this.today.month(),this.today.date()],r=e[0],d=e[1],a=e[2],e=this.sel?[this.sel.year(),this.sel.month(),this.sel.date()]:[null,null,null],l=e[0],u=e[1],h=e[2],this.n.sel.month.value=this.months[n],this.n.sel.year.value=t,this.n.dc.map(function(t,e){var e=o.add(e,"day"),n=[e.year(),e.month(),e.date()],s=n[0],i=n[1],n=n[2];return t.date={year:s,month:i,date:n},t.innerText=e.date(),t.classList.toggle("dim",e.month()!==c),t.classList.toggle("today",r===s&&d===i&&a===n),t.classList.toggle("selected",l===s&&u===i&&h===n)}),this.host)return this.host.value=this.value()},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.time.hour,this.time.minute)).toISOString():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 ADDED
@@ -0,0 +1 @@
1
+ {"name":"lddatetimepicker","version":"0.0.1","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"}}