Description:
problem manage
Commit status:
[Not Reviewed]
References:
Diff options:
Comments:
0 Commit comments
0 Inline Comments
Unresolved TODOs:
There are no unresolved TODOs
Author
-
r881:6b08387e69df - - 9 files changed: 1000 inserted, 26 deleted
| This diff has been collapsed as it changes many lines, (510 lines changed) Show them Hide them | |||||
| @@ -0,0 +1,510 | |||||
|
|
|
1 | + .visually-hidden, .tempus-dominus-widget [data-action]::after { | ||
|
|
|
2 | + position: absolute !important; | ||
|
|
|
3 | + width: 1px !important; | ||
|
|
|
4 | + height: 1px !important; | ||
|
|
|
5 | + padding: 0 !important; | ||
|
|
|
6 | + margin: -1px !important; | ||
|
|
|
7 | + overflow: hidden !important; | ||
|
|
|
8 | + clip: rect(0, 0, 0, 0) !important; | ||
|
|
|
9 | + white-space: nowrap !important; | ||
|
|
|
10 | + border: 0 !important; | ||
|
|
|
11 | + } | ||
|
|
|
12 | + | ||
|
|
|
13 | + .tempus-dominus-widget { | ||
|
|
|
14 | + list-style: none; | ||
|
|
|
15 | + padding: 4px; | ||
|
|
|
16 | + width: 19rem; | ||
|
|
|
17 | + border-radius: 4px; | ||
|
|
|
18 | + display: none; | ||
|
|
|
19 | + z-index: 9999; | ||
|
|
|
20 | + box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); | ||
|
|
|
21 | + } | ||
|
|
|
22 | + .tempus-dominus-widget.calendarWeeks { | ||
|
|
|
23 | + width: 21rem; | ||
|
|
|
24 | + } | ||
|
|
|
25 | + .tempus-dominus-widget.calendarWeeks .date-container-days { | ||
|
|
|
26 | + grid-auto-columns: 12.5%; | ||
|
|
|
27 | + grid-template-areas: "a a a a a a a a"; | ||
|
|
|
28 | + } | ||
|
|
|
29 | + .tempus-dominus-widget [data-action] { | ||
|
|
|
30 | + cursor: pointer; | ||
|
|
|
31 | + } | ||
|
|
|
32 | + .tempus-dominus-widget [data-action]::after { | ||
|
|
|
33 | + content: attr(title); | ||
|
|
|
34 | + } | ||
|
|
|
35 | + .tempus-dominus-widget [data-action].disabled, .tempus-dominus-widget [data-action].disabled:hover { | ||
|
|
|
36 | + background: none; | ||
|
|
|
37 | + cursor: not-allowed; | ||
|
|
|
38 | + } | ||
|
|
|
39 | + .tempus-dominus-widget .arrow { | ||
|
|
|
40 | + display: none; | ||
|
|
|
41 | + } | ||
|
|
|
42 | + .tempus-dominus-widget.show { | ||
|
|
|
43 | + display: block; | ||
|
|
|
44 | + } | ||
|
|
|
45 | + .tempus-dominus-widget .td-collapse:not(.show) { | ||
|
|
|
46 | + display: none; | ||
|
|
|
47 | + } | ||
|
|
|
48 | + .tempus-dominus-widget .td-collapsing { | ||
|
|
|
49 | + height: 0; | ||
|
|
|
50 | + overflow: hidden; | ||
|
|
|
51 | + transition: height 0.35s ease; | ||
|
|
|
52 | + } | ||
|
|
|
53 | + @media (min-width: 576px) { | ||
|
|
|
54 | + .tempus-dominus-widget.timepicker-sbs { | ||
|
|
|
55 | + width: 38em; | ||
|
|
|
56 | + } | ||
|
|
|
57 | + } | ||
|
|
|
58 | + @media (min-width: 768px) { | ||
|
|
|
59 | + .tempus-dominus-widget.timepicker-sbs { | ||
|
|
|
60 | + width: 38em; | ||
|
|
|
61 | + } | ||
|
|
|
62 | + } | ||
|
|
|
63 | + @media (min-width: 992px) { | ||
|
|
|
64 | + .tempus-dominus-widget.timepicker-sbs { | ||
|
|
|
65 | + width: 38em; | ||
|
|
|
66 | + } | ||
|
|
|
67 | + } | ||
|
|
|
68 | + .tempus-dominus-widget.timepicker-sbs .td-row { | ||
|
|
|
69 | + display: flex; | ||
|
|
|
70 | + } | ||
|
|
|
71 | + .tempus-dominus-widget.timepicker-sbs .td-row .td-half { | ||
|
|
|
72 | + flex: 0 0 auto; | ||
|
|
|
73 | + width: 50%; | ||
|
|
|
74 | + } | ||
|
|
|
75 | + .tempus-dominus-widget div[data-action]:active { | ||
|
|
|
76 | + box-shadow: none; | ||
|
|
|
77 | + } | ||
|
|
|
78 | + .tempus-dominus-widget .timepicker-hour, | ||
|
|
|
79 | + .tempus-dominus-widget .timepicker-minute, | ||
|
|
|
80 | + .tempus-dominus-widget .timepicker-second { | ||
|
|
|
81 | + width: 54px; | ||
|
|
|
82 | + font-weight: bold; | ||
|
|
|
83 | + font-size: 1.2em; | ||
|
|
|
84 | + margin: 0; | ||
|
|
|
85 | + } | ||
|
|
|
86 | + .tempus-dominus-widget button[data-action] { | ||
|
|
|
87 | + padding: 6px; | ||
|
|
|
88 | + } | ||
|
|
|
89 | + .tempus-dominus-widget .toggleMeridiem { | ||
|
|
|
90 | + text-align: center; | ||
|
|
|
91 | + height: 38px; | ||
|
|
|
92 | + } | ||
|
|
|
93 | + .tempus-dominus-widget .calendar-header { | ||
|
|
|
94 | + display: grid; | ||
|
|
|
95 | + grid-template-areas: "a a a"; | ||
|
|
|
96 | + margin-bottom: 10px; | ||
|
|
|
97 | + font-weight: bold; | ||
|
|
|
98 | + } | ||
|
|
|
99 | + .tempus-dominus-widget .calendar-header .next { | ||
|
|
|
100 | + text-align: right; | ||
|
|
|
101 | + padding-right: 10px; | ||
|
|
|
102 | + } | ||
|
|
|
103 | + .tempus-dominus-widget .calendar-header .previous { | ||
|
|
|
104 | + text-align: left; | ||
|
|
|
105 | + padding-left: 10px; | ||
|
|
|
106 | + } | ||
|
|
|
107 | + .tempus-dominus-widget .calendar-header .picker-switch { | ||
|
|
|
108 | + text-align: center; | ||
|
|
|
109 | + } | ||
|
|
|
110 | + .tempus-dominus-widget .toolbar { | ||
|
|
|
111 | + display: grid; | ||
|
|
|
112 | + grid-auto-flow: column; | ||
|
|
|
113 | + grid-auto-rows: 40px; | ||
|
|
|
114 | + } | ||
|
|
|
115 | + .tempus-dominus-widget .toolbar div { | ||
|
|
|
116 | + border-radius: 999px; | ||
|
|
|
117 | + align-items: center; | ||
|
|
|
118 | + justify-content: center; | ||
|
|
|
119 | + box-sizing: border-box; | ||
|
|
|
120 | + display: flex; | ||
|
|
|
121 | + } | ||
|
|
|
122 | + .tempus-dominus-widget .date-container-days { | ||
|
|
|
123 | + display: grid; | ||
|
|
|
124 | + grid-template-areas: "a a a a a a a"; | ||
|
|
|
125 | + grid-auto-rows: 40px; | ||
|
|
|
126 | + grid-auto-columns: 14.2857142857%; | ||
|
|
|
127 | + } | ||
|
|
|
128 | + .tempus-dominus-widget .date-container-days .dow { | ||
|
|
|
129 | + align-items: center; | ||
|
|
|
130 | + justify-content: center; | ||
|
|
|
131 | + text-align: center; | ||
|
|
|
132 | + } | ||
|
|
|
133 | + .tempus-dominus-widget .date-container-days .cw { | ||
|
|
|
134 | + width: 90%; | ||
|
|
|
135 | + height: 90%; | ||
|
|
|
136 | + align-items: center; | ||
|
|
|
137 | + justify-content: center; | ||
|
|
|
138 | + display: flex; | ||
|
|
|
139 | + font-size: 0.8em; | ||
|
|
|
140 | + line-height: 20px; | ||
|
|
|
141 | + cursor: default; | ||
|
|
|
142 | + } | ||
|
|
|
143 | + .tempus-dominus-widget .date-container-decades, | ||
|
|
|
144 | + .tempus-dominus-widget .date-container-years, | ||
|
|
|
145 | + .tempus-dominus-widget .date-container-months { | ||
|
|
|
146 | + display: grid; | ||
|
|
|
147 | + grid-template-areas: "a a a"; | ||
|
|
|
148 | + grid-auto-rows: calc((19rem - 8px) / 7); | ||
|
|
|
149 | + } | ||
|
|
|
150 | + .tempus-dominus-widget .time-container-hour, | ||
|
|
|
151 | + .tempus-dominus-widget .time-container-minute, | ||
|
|
|
152 | + .tempus-dominus-widget .time-container-second { | ||
|
|
|
153 | + display: grid; | ||
|
|
|
154 | + grid-template-areas: "a a a a"; | ||
|
|
|
155 | + grid-auto-rows: calc((19rem - 8px) / 7); | ||
|
|
|
156 | + } | ||
|
|
|
157 | + .tempus-dominus-widget .time-container-clock { | ||
|
|
|
158 | + display: grid; | ||
|
|
|
159 | + grid-auto-rows: calc((19rem - 8px) / 7); | ||
|
|
|
160 | + } | ||
|
|
|
161 | + .tempus-dominus-widget .time-container-clock .no-highlight { | ||
|
|
|
162 | + width: 90%; | ||
|
|
|
163 | + height: 90%; | ||
|
|
|
164 | + align-items: center; | ||
|
|
|
165 | + justify-content: center; | ||
|
|
|
166 | + display: flex; | ||
|
|
|
167 | + } | ||
|
|
|
168 | + .tempus-dominus-widget .date-container-decades div:not(.no-highlight), | ||
|
|
|
169 | + .tempus-dominus-widget .date-container-years div:not(.no-highlight), | ||
|
|
|
170 | + .tempus-dominus-widget .date-container-months div:not(.no-highlight), | ||
|
|
|
171 | + .tempus-dominus-widget .date-container-days div:not(.no-highlight), | ||
|
|
|
172 | + .tempus-dominus-widget .time-container-clock div:not(.no-highlight), | ||
|
|
|
173 | + .tempus-dominus-widget .time-container-hour div:not(.no-highlight), | ||
|
|
|
174 | + .tempus-dominus-widget .time-container-minute div:not(.no-highlight), | ||
|
|
|
175 | + .tempus-dominus-widget .time-container-second div:not(.no-highlight) { | ||
|
|
|
176 | + width: 90%; | ||
|
|
|
177 | + height: 90%; | ||
|
|
|
178 | + border-radius: 999px; | ||
|
|
|
179 | + align-items: center; | ||
|
|
|
180 | + justify-content: center; | ||
|
|
|
181 | + box-sizing: border-box; | ||
|
|
|
182 | + display: flex; | ||
|
|
|
183 | + } | ||
|
|
|
184 | + .tempus-dominus-widget .date-container-decades div:not(.no-highlight).disabled, .tempus-dominus-widget .date-container-decades div:not(.no-highlight).disabled:hover, | ||
|
|
|
185 | + .tempus-dominus-widget .date-container-years div:not(.no-highlight).disabled, | ||
|
|
|
186 | + .tempus-dominus-widget .date-container-years div:not(.no-highlight).disabled:hover, | ||
|
|
|
187 | + .tempus-dominus-widget .date-container-months div:not(.no-highlight).disabled, | ||
|
|
|
188 | + .tempus-dominus-widget .date-container-months div:not(.no-highlight).disabled:hover, | ||
|
|
|
189 | + .tempus-dominus-widget .date-container-days div:not(.no-highlight).disabled, | ||
|
|
|
190 | + .tempus-dominus-widget .date-container-days div:not(.no-highlight).disabled:hover, | ||
|
|
|
191 | + .tempus-dominus-widget .time-container-clock div:not(.no-highlight).disabled, | ||
|
|
|
192 | + .tempus-dominus-widget .time-container-clock div:not(.no-highlight).disabled:hover, | ||
|
|
|
193 | + .tempus-dominus-widget .time-container-hour div:not(.no-highlight).disabled, | ||
|
|
|
194 | + .tempus-dominus-widget .time-container-hour div:not(.no-highlight).disabled:hover, | ||
|
|
|
195 | + .tempus-dominus-widget .time-container-minute div:not(.no-highlight).disabled, | ||
|
|
|
196 | + .tempus-dominus-widget .time-container-minute div:not(.no-highlight).disabled:hover, | ||
|
|
|
197 | + .tempus-dominus-widget .time-container-second div:not(.no-highlight).disabled, | ||
|
|
|
198 | + .tempus-dominus-widget .time-container-second div:not(.no-highlight).disabled:hover { | ||
|
|
|
199 | + background: none; | ||
|
|
|
200 | + cursor: not-allowed; | ||
|
|
|
201 | + } | ||
|
|
|
202 | + .tempus-dominus-widget .date-container-decades div:not(.no-highlight).today, | ||
|
|
|
203 | + .tempus-dominus-widget .date-container-years div:not(.no-highlight).today, | ||
|
|
|
204 | + .tempus-dominus-widget .date-container-months div:not(.no-highlight).today, | ||
|
|
|
205 | + .tempus-dominus-widget .date-container-days div:not(.no-highlight).today, | ||
|
|
|
206 | + .tempus-dominus-widget .time-container-clock div:not(.no-highlight).today, | ||
|
|
|
207 | + .tempus-dominus-widget .time-container-hour div:not(.no-highlight).today, | ||
|
|
|
208 | + .tempus-dominus-widget .time-container-minute div:not(.no-highlight).today, | ||
|
|
|
209 | + .tempus-dominus-widget .time-container-second div:not(.no-highlight).today { | ||
|
|
|
210 | + position: relative; | ||
|
|
|
211 | + } | ||
|
|
|
212 | + .tempus-dominus-widget .date-container-decades div:not(.no-highlight).today:before, | ||
|
|
|
213 | + .tempus-dominus-widget .date-container-years div:not(.no-highlight).today:before, | ||
|
|
|
214 | + .tempus-dominus-widget .date-container-months div:not(.no-highlight).today:before, | ||
|
|
|
215 | + .tempus-dominus-widget .date-container-days div:not(.no-highlight).today:before, | ||
|
|
|
216 | + .tempus-dominus-widget .time-container-clock div:not(.no-highlight).today:before, | ||
|
|
|
217 | + .tempus-dominus-widget .time-container-hour div:not(.no-highlight).today:before, | ||
|
|
|
218 | + .tempus-dominus-widget .time-container-minute div:not(.no-highlight).today:before, | ||
|
|
|
219 | + .tempus-dominus-widget .time-container-second div:not(.no-highlight).today:before { | ||
|
|
|
220 | + content: ""; | ||
|
|
|
221 | + display: inline-block; | ||
|
|
|
222 | + border: solid transparent; | ||
|
|
|
223 | + border-width: 0 0 7px 7px; | ||
|
|
|
224 | + position: absolute; | ||
|
|
|
225 | + bottom: 6px; | ||
|
|
|
226 | + right: 6px; | ||
|
|
|
227 | + } | ||
|
|
|
228 | + .tempus-dominus-widget .time-container { | ||
|
|
|
229 | + margin-bottom: 0.5rem; | ||
|
|
|
230 | + } | ||
|
|
|
231 | + .tempus-dominus-widget button { | ||
|
|
|
232 | + display: inline-block; | ||
|
|
|
233 | + font-weight: 400; | ||
|
|
|
234 | + line-height: 1.5; | ||
|
|
|
235 | + text-align: center; | ||
|
|
|
236 | + text-decoration: none; | ||
|
|
|
237 | + vertical-align: middle; | ||
|
|
|
238 | + cursor: pointer; | ||
|
|
|
239 | + -webkit-user-select: none; | ||
|
|
|
240 | + -moz-user-select: none; | ||
|
|
|
241 | + user-select: none; | ||
|
|
|
242 | + padding: 0.375rem 0.75rem; | ||
|
|
|
243 | + font-size: 1rem; | ||
|
|
|
244 | + border-radius: 0.25rem; | ||
|
|
|
245 | + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; | ||
|
|
|
246 | + } | ||
|
|
|
247 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td.day, | ||
|
|
|
248 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td.hour, | ||
|
|
|
249 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td.minute, | ||
|
|
|
250 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td.second, | ||
|
|
|
251 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=incrementHours], | ||
|
|
|
252 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=incrementMinutes], | ||
|
|
|
253 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=incrementSeconds], | ||
|
|
|
254 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=decrementHours], | ||
|
|
|
255 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=decrementMinutes], | ||
|
|
|
256 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=decrementSeconds], | ||
|
|
|
257 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=showHours], | ||
|
|
|
258 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=showMinutes], | ||
|
|
|
259 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=showSeconds], | ||
|
|
|
260 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=togglePeriod] { | ||
|
|
|
261 | + pointer-events: none; | ||
|
|
|
262 | + cursor: default; | ||
|
|
|
263 | + } | ||
|
|
|
264 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td.day:hover, | ||
|
|
|
265 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td.hour:hover, | ||
|
|
|
266 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td.minute:hover, | ||
|
|
|
267 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td.second:hover, | ||
|
|
|
268 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=incrementHours]:hover, | ||
|
|
|
269 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=incrementMinutes]:hover, | ||
|
|
|
270 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=incrementSeconds]:hover, | ||
|
|
|
271 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=decrementHours]:hover, | ||
|
|
|
272 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=decrementMinutes]:hover, | ||
|
|
|
273 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=decrementSeconds]:hover, | ||
|
|
|
274 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=showHours]:hover, | ||
|
|
|
275 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=showMinutes]:hover, | ||
|
|
|
276 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=showSeconds]:hover, | ||
|
|
|
277 | + .tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=togglePeriod]:hover { | ||
|
|
|
278 | + background: none; | ||
|
|
|
279 | + } | ||
|
|
|
280 | + .tempus-dominus-widget.light { | ||
|
|
|
281 | + color: #000; | ||
|
|
|
282 | + background-color: #fff; | ||
|
|
|
283 | + } | ||
|
|
|
284 | + .tempus-dominus-widget.light [data-action].disabled, .tempus-dominus-widget.light [data-action].disabled:hover { | ||
|
|
|
285 | + color: #6c757d; | ||
|
|
|
286 | + } | ||
|
|
|
287 | + .tempus-dominus-widget.light .toolbar div:hover { | ||
|
|
|
288 | + background: #e9ecef; | ||
|
|
|
289 | + } | ||
|
|
|
290 | + .tempus-dominus-widget.light .date-container-days .dow { | ||
|
|
|
291 | + color: rgba(0, 0, 0, 0.5); | ||
|
|
|
292 | + } | ||
|
|
|
293 | + .tempus-dominus-widget.light .date-container-days .cw { | ||
|
|
|
294 | + color: rgba(0, 0, 0, 0.38); | ||
|
|
|
295 | + } | ||
|
|
|
296 | + .tempus-dominus-widget.light .date-container-decades div:not(.no-highlight):hover, | ||
|
|
|
297 | + .tempus-dominus-widget.light .date-container-years div:not(.no-highlight):hover, | ||
|
|
|
298 | + .tempus-dominus-widget.light .date-container-months div:not(.no-highlight):hover, | ||
|
|
|
299 | + .tempus-dominus-widget.light .date-container-days div:not(.no-highlight):hover, | ||
|
|
|
300 | + .tempus-dominus-widget.light .time-container-clock div:not(.no-highlight):hover, | ||
|
|
|
301 | + .tempus-dominus-widget.light .time-container-hour div:not(.no-highlight):hover, | ||
|
|
|
302 | + .tempus-dominus-widget.light .time-container-minute div:not(.no-highlight):hover, | ||
|
|
|
303 | + .tempus-dominus-widget.light .time-container-second div:not(.no-highlight):hover { | ||
|
|
|
304 | + background: #e9ecef; | ||
|
|
|
305 | + } | ||
|
|
|
306 | + .tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).active, | ||
|
|
|
307 | + .tempus-dominus-widget.light .date-container-years div:not(.no-highlight).active, | ||
|
|
|
308 | + .tempus-dominus-widget.light .date-container-months div:not(.no-highlight).active, | ||
|
|
|
309 | + .tempus-dominus-widget.light .date-container-days div:not(.no-highlight).active, | ||
|
|
|
310 | + .tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).active, | ||
|
|
|
311 | + .tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).active, | ||
|
|
|
312 | + .tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).active, | ||
|
|
|
313 | + .tempus-dominus-widget.light .time-container-second div:not(.no-highlight).active { | ||
|
|
|
314 | + background-color: #0d6efd; | ||
|
|
|
315 | + color: #fff; | ||
|
|
|
316 | + text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); | ||
|
|
|
317 | + } | ||
|
|
|
318 | + .tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).active.old, .tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).active.new, | ||
|
|
|
319 | + .tempus-dominus-widget.light .date-container-years div:not(.no-highlight).active.old, | ||
|
|
|
320 | + .tempus-dominus-widget.light .date-container-years div:not(.no-highlight).active.new, | ||
|
|
|
321 | + .tempus-dominus-widget.light .date-container-months div:not(.no-highlight).active.old, | ||
|
|
|
322 | + .tempus-dominus-widget.light .date-container-months div:not(.no-highlight).active.new, | ||
|
|
|
323 | + .tempus-dominus-widget.light .date-container-days div:not(.no-highlight).active.old, | ||
|
|
|
324 | + .tempus-dominus-widget.light .date-container-days div:not(.no-highlight).active.new, | ||
|
|
|
325 | + .tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).active.old, | ||
|
|
|
326 | + .tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).active.new, | ||
|
|
|
327 | + .tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).active.old, | ||
|
|
|
328 | + .tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).active.new, | ||
|
|
|
329 | + .tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).active.old, | ||
|
|
|
330 | + .tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).active.new, | ||
|
|
|
331 | + .tempus-dominus-widget.light .time-container-second div:not(.no-highlight).active.old, | ||
|
|
|
332 | + .tempus-dominus-widget.light .time-container-second div:not(.no-highlight).active.new { | ||
|
|
|
333 | + color: #fff; | ||
|
|
|
334 | + } | ||
|
|
|
335 | + .tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).active.today:before, | ||
|
|
|
336 | + .tempus-dominus-widget.light .date-container-years div:not(.no-highlight).active.today:before, | ||
|
|
|
337 | + .tempus-dominus-widget.light .date-container-months div:not(.no-highlight).active.today:before, | ||
|
|
|
338 | + .tempus-dominus-widget.light .date-container-days div:not(.no-highlight).active.today:before, | ||
|
|
|
339 | + .tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).active.today:before, | ||
|
|
|
340 | + .tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).active.today:before, | ||
|
|
|
341 | + .tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).active.today:before, | ||
|
|
|
342 | + .tempus-dominus-widget.light .time-container-second div:not(.no-highlight).active.today:before { | ||
|
|
|
343 | + border-bottom-color: #fff; | ||
|
|
|
344 | + } | ||
|
|
|
345 | + .tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).old, .tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).new, | ||
|
|
|
346 | + .tempus-dominus-widget.light .date-container-years div:not(.no-highlight).old, | ||
|
|
|
347 | + .tempus-dominus-widget.light .date-container-years div:not(.no-highlight).new, | ||
|
|
|
348 | + .tempus-dominus-widget.light .date-container-months div:not(.no-highlight).old, | ||
|
|
|
349 | + .tempus-dominus-widget.light .date-container-months div:not(.no-highlight).new, | ||
|
|
|
350 | + .tempus-dominus-widget.light .date-container-days div:not(.no-highlight).old, | ||
|
|
|
351 | + .tempus-dominus-widget.light .date-container-days div:not(.no-highlight).new, | ||
|
|
|
352 | + .tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).old, | ||
|
|
|
353 | + .tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).new, | ||
|
|
|
354 | + .tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).old, | ||
|
|
|
355 | + .tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).new, | ||
|
|
|
356 | + .tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).old, | ||
|
|
|
357 | + .tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).new, | ||
|
|
|
358 | + .tempus-dominus-widget.light .time-container-second div:not(.no-highlight).old, | ||
|
|
|
359 | + .tempus-dominus-widget.light .time-container-second div:not(.no-highlight).new { | ||
|
|
|
360 | + color: rgba(0, 0, 0, 0.38); | ||
|
|
|
361 | + } | ||
|
|
|
362 | + .tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).disabled, .tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).disabled:hover, | ||
|
|
|
363 | + .tempus-dominus-widget.light .date-container-years div:not(.no-highlight).disabled, | ||
|
|
|
364 | + .tempus-dominus-widget.light .date-container-years div:not(.no-highlight).disabled:hover, | ||
|
|
|
365 | + .tempus-dominus-widget.light .date-container-months div:not(.no-highlight).disabled, | ||
|
|
|
366 | + .tempus-dominus-widget.light .date-container-months div:not(.no-highlight).disabled:hover, | ||
|
|
|
367 | + .tempus-dominus-widget.light .date-container-days div:not(.no-highlight).disabled, | ||
|
|
|
368 | + .tempus-dominus-widget.light .date-container-days div:not(.no-highlight).disabled:hover, | ||
|
|
|
369 | + .tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).disabled, | ||
|
|
|
370 | + .tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).disabled:hover, | ||
|
|
|
371 | + .tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).disabled, | ||
|
|
|
372 | + .tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).disabled:hover, | ||
|
|
|
373 | + .tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).disabled, | ||
|
|
|
374 | + .tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).disabled:hover, | ||
|
|
|
375 | + .tempus-dominus-widget.light .time-container-second div:not(.no-highlight).disabled, | ||
|
|
|
376 | + .tempus-dominus-widget.light .time-container-second div:not(.no-highlight).disabled:hover { | ||
|
|
|
377 | + color: #6c757d; | ||
|
|
|
378 | + } | ||
|
|
|
379 | + .tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).today:before, | ||
|
|
|
380 | + .tempus-dominus-widget.light .date-container-years div:not(.no-highlight).today:before, | ||
|
|
|
381 | + .tempus-dominus-widget.light .date-container-months div:not(.no-highlight).today:before, | ||
|
|
|
382 | + .tempus-dominus-widget.light .date-container-days div:not(.no-highlight).today:before, | ||
|
|
|
383 | + .tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).today:before, | ||
|
|
|
384 | + .tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).today:before, | ||
|
|
|
385 | + .tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).today:before, | ||
|
|
|
386 | + .tempus-dominus-widget.light .time-container-second div:not(.no-highlight).today:before { | ||
|
|
|
387 | + border-bottom-color: #0d6efd; | ||
|
|
|
388 | + border-top-color: rgba(0, 0, 0, 0.2); | ||
|
|
|
389 | + } | ||
|
|
|
390 | + .tempus-dominus-widget.light button { | ||
|
|
|
391 | + color: #fff; | ||
|
|
|
392 | + background-color: #0d6efd; | ||
|
|
|
393 | + border-color: #0d6efd; | ||
|
|
|
394 | + } | ||
|
|
|
395 | + .tempus-dominus-widget.dark { | ||
|
|
|
396 | + color: #e3e3e3; | ||
|
|
|
397 | + background-color: #1b1b1b; | ||
|
|
|
398 | + } | ||
|
|
|
399 | + .tempus-dominus-widget.dark [data-action].disabled, .tempus-dominus-widget.dark [data-action].disabled:hover { | ||
|
|
|
400 | + color: #6c757d; | ||
|
|
|
401 | + } | ||
|
|
|
402 | + .tempus-dominus-widget.dark .toolbar div:hover { | ||
|
|
|
403 | + background: rgb(35, 38, 39); | ||
|
|
|
404 | + } | ||
|
|
|
405 | + .tempus-dominus-widget.dark .date-container-days .dow { | ||
|
|
|
406 | + color: rgba(232, 230, 227, 0.5); | ||
|
|
|
407 | + } | ||
|
|
|
408 | + .tempus-dominus-widget.dark .date-container-days .cw { | ||
|
|
|
409 | + color: rgba(232, 230, 227, 0.38); | ||
|
|
|
410 | + } | ||
|
|
|
411 | + .tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight):hover, | ||
|
|
|
412 | + .tempus-dominus-widget.dark .date-container-years div:not(.no-highlight):hover, | ||
|
|
|
413 | + .tempus-dominus-widget.dark .date-container-months div:not(.no-highlight):hover, | ||
|
|
|
414 | + .tempus-dominus-widget.dark .date-container-days div:not(.no-highlight):hover, | ||
|
|
|
415 | + .tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight):hover, | ||
|
|
|
416 | + .tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight):hover, | ||
|
|
|
417 | + .tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight):hover, | ||
|
|
|
418 | + .tempus-dominus-widget.dark .time-container-second div:not(.no-highlight):hover { | ||
|
|
|
419 | + background: rgb(35, 38, 39); | ||
|
|
|
420 | + } | ||
|
|
|
421 | + .tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).active, | ||
|
|
|
422 | + .tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).active, | ||
|
|
|
423 | + .tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).active, | ||
|
|
|
424 | + .tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).active, | ||
|
|
|
425 | + .tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).active, | ||
|
|
|
426 | + .tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).active, | ||
|
|
|
427 | + .tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).active, | ||
|
|
|
428 | + .tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).active { | ||
|
|
|
429 | + background-color: #4db2ff; | ||
|
|
|
430 | + color: #fff; | ||
|
|
|
431 | + text-shadow: 0 -1px 0 rgba(232, 230, 227, 0.25); | ||
|
|
|
432 | + } | ||
|
|
|
433 | + .tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).active.old, .tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).active.new, | ||
|
|
|
434 | + .tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).active.old, | ||
|
|
|
435 | + .tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).active.new, | ||
|
|
|
436 | + .tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).active.old, | ||
|
|
|
437 | + .tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).active.new, | ||
|
|
|
438 | + .tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).active.old, | ||
|
|
|
439 | + .tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).active.new, | ||
|
|
|
440 | + .tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).active.old, | ||
|
|
|
441 | + .tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).active.new, | ||
|
|
|
442 | + .tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).active.old, | ||
|
|
|
443 | + .tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).active.new, | ||
|
|
|
444 | + .tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).active.old, | ||
|
|
|
445 | + .tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).active.new, | ||
|
|
|
446 | + .tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).active.old, | ||
|
|
|
447 | + .tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).active.new { | ||
|
|
|
448 | + color: #fff; | ||
|
|
|
449 | + } | ||
|
|
|
450 | + .tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).active.today:before, | ||
|
|
|
451 | + .tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).active.today:before, | ||
|
|
|
452 | + .tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).active.today:before, | ||
|
|
|
453 | + .tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).active.today:before, | ||
|
|
|
454 | + .tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).active.today:before, | ||
|
|
|
455 | + .tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).active.today:before, | ||
|
|
|
456 | + .tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).active.today:before, | ||
|
|
|
457 | + .tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).active.today:before { | ||
|
|
|
458 | + border-bottom-color: #1b1b1b; | ||
|
|
|
459 | + } | ||
|
|
|
460 | + .tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).old, .tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).new, | ||
|
|
|
461 | + .tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).old, | ||
|
|
|
462 | + .tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).new, | ||
|
|
|
463 | + .tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).old, | ||
|
|
|
464 | + .tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).new, | ||
|
|
|
465 | + .tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).old, | ||
|
|
|
466 | + .tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).new, | ||
|
|
|
467 | + .tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).old, | ||
|
|
|
468 | + .tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).new, | ||
|
|
|
469 | + .tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).old, | ||
|
|
|
470 | + .tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).new, | ||
|
|
|
471 | + .tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).old, | ||
|
|
|
472 | + .tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).new, | ||
|
|
|
473 | + .tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).old, | ||
|
|
|
474 | + .tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).new { | ||
|
|
|
475 | + color: rgba(232, 230, 227, 0.38); | ||
|
|
|
476 | + } | ||
|
|
|
477 | + .tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).disabled, .tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).disabled:hover, | ||
|
|
|
478 | + .tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).disabled, | ||
|
|
|
479 | + .tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).disabled:hover, | ||
|
|
|
480 | + .tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).disabled, | ||
|
|
|
481 | + .tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).disabled:hover, | ||
|
|
|
482 | + .tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).disabled, | ||
|
|
|
483 | + .tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).disabled:hover, | ||
|
|
|
484 | + .tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).disabled, | ||
|
|
|
485 | + .tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).disabled:hover, | ||
|
|
|
486 | + .tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).disabled, | ||
|
|
|
487 | + .tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).disabled:hover, | ||
|
|
|
488 | + .tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).disabled, | ||
|
|
|
489 | + .tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).disabled:hover, | ||
|
|
|
490 | + .tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).disabled, | ||
|
|
|
491 | + .tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).disabled:hover { | ||
|
|
|
492 | + color: #6c757d; | ||
|
|
|
493 | + } | ||
|
|
|
494 | + .tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).today:before, | ||
|
|
|
495 | + .tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).today:before, | ||
|
|
|
496 | + .tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).today:before, | ||
|
|
|
497 | + .tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).today:before, | ||
|
|
|
498 | + .tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).today:before, | ||
|
|
|
499 | + .tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).today:before, | ||
|
|
|
500 | + .tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).today:before, | ||
|
|
|
501 | + .tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).today:before { | ||
|
|
|
502 | + border-bottom-color: #4db2ff; | ||
|
|
|
503 | + border-top-color: rgba(232, 230, 227, 0.2); | ||
|
|
|
504 | + } | ||
|
|
|
505 | + .tempus-dominus-widget.dark button { | ||
|
|
|
506 | + color: #fff; | ||
|
|
|
507 | + background-color: #4db2ff; | ||
|
|
|
508 | + border-color: #4db2ff; | ||
|
|
|
509 | + } | ||
|
|
|
510 | + /*# sourceMappingURL=tempus-dominus.css.map */ No newline at end of file | ||
| @@ -0,0 +1,368 | |||||
|
|
|
1 | + var e;(function(e){e.seconds="seconds";e.minutes="minutes";e.hours="hours";e.date="date";e.month="month";e.year="year"})(e||(e={}));const t={month:"2-digit",day:"2-digit",year:"numeric",hour:"2-digit",minute:"2-digit",second:"2-digit",hour12:true};const s={hour:"2-digit",hour12:false};const getFormatByUnit=e=>{switch(e){case"date":return{dateStyle:"short"};case"month":return{month:"numeric",year:"numeric"};case"year":return{year:"numeric"}}};class DateTime extends Date{constructor(){super(...arguments);this.locale="default";this.nonLeapLadder=[0,31,59,90,120,151,181,212,243,273,304,334];this.leapLadder=[0,31,60,91,121,152,182,213,244,274,305,335]} | ||
|
|
|
2 | + /** | ||
|
|
|
3 | + * Chainable way to set the {@link locale} | ||
|
|
|
4 | + * @param value | ||
|
|
|
5 | + */setLocale(e){this.locale=e;return this} | ||
|
|
|
6 | + /** | ||
|
|
|
7 | + * Converts a plain JS date object to a DateTime object. | ||
|
|
|
8 | + * Doing this allows access to format, etc. | ||
|
|
|
9 | + * @param date | ||
|
|
|
10 | + * @param locale | ||
|
|
|
11 | + */static convert(e,t="default"){if(!e)throw new Error("A date is required");return new DateTime(e.getFullYear(),e.getMonth(),e.getDate(),e.getHours(),e.getMinutes(),e.getSeconds(),e.getMilliseconds()).setLocale(t)} | ||
|
|
|
12 | + /** | ||
|
|
|
13 | + * Attempts to create a DateTime from a string. A customDateFormat is required for non US dates. | ||
|
|
|
14 | + * @param input | ||
|
|
|
15 | + * @param localization | ||
|
|
|
16 | + */static fromString(e,t){return new DateTime(e)}get clone(){return new DateTime(this.year,this.month,this.date,this.hours,this.minutes,this.seconds,this.getMilliseconds()).setLocale(this.locale)} | ||
|
|
|
17 | + /** | ||
|
|
|
18 | + * Sets the current date to the start of the {@link unit} provided | ||
|
|
|
19 | + * Example: Consider a date of "April 30, 2021, 11:45:32.984 AM" => new DateTime(2021, 3, 30, 11, 45, 32, 984).startOf('month') | ||
|
|
|
20 | + * would return April 1, 2021, 12:00:00.000 AM (midnight) | ||
|
|
|
21 | + * @param unit | ||
|
|
|
22 | + * @param startOfTheWeek Allows for the changing the start of the week. | ||
|
|
|
23 | + */startOf(t,s=0){if(void 0===this[t])throw new Error(`Unit '${t}' is not valid`);switch(t){case"seconds":this.setMilliseconds(0);break;case"minutes":this.setSeconds(0,0);break;case"hours":this.setMinutes(0,0,0);break;case"date":this.setHours(0,0,0,0);break;case"weekDay":this.startOf(e.date);if(this.weekDay===s)break;let t=this.weekDay;0!==s&&0===this.weekDay&&(t=8-s);this.manipulate(s-t,e.date);break;case"month":this.startOf(e.date);this.setDate(1);break;case"year":this.startOf(e.date);this.setMonth(0,1);break}return this} | ||
|
|
|
24 | + /** | ||
|
|
|
25 | + * Sets the current date to the end of the {@link unit} provided | ||
|
|
|
26 | + * Example: Consider a date of "April 30, 2021, 11:45:32.984 AM" => new DateTime(2021, 3, 30, 11, 45, 32, 984).endOf('month') | ||
|
|
|
27 | + * would return April 30, 2021, 11:59:59.999 PM | ||
|
|
|
28 | + * @param unit | ||
|
|
|
29 | + * @param startOfTheWeek | ||
|
|
|
30 | + */endOf(t,s=0){if(void 0===this[t])throw new Error(`Unit '${t}' is not valid`);switch(t){case"seconds":this.setMilliseconds(999);break;case"minutes":this.setSeconds(59,999);break;case"hours":this.setMinutes(59,59,999);break;case"date":this.setHours(23,59,59,999);break;case"weekDay":this.endOf(e.date);this.manipulate(6+s-this.weekDay,e.date);break;case"month":this.endOf(e.date);this.manipulate(1,e.month);this.setDate(0);break;case"year":this.endOf(e.date);this.manipulate(1,e.year);this.setDate(0);break}return this} | ||
|
|
|
31 | + /** | ||
|
|
|
32 | + * Change a {@link unit} value. Value can be positive or negative | ||
|
|
|
33 | + * Example: Consider a date of "April 30, 2021, 11:45:32.984 AM" => new DateTime(2021, 3, 30, 11, 45, 32, 984).manipulate(1, 'month') | ||
|
|
|
34 | + * would return May 30, 2021, 11:45:32.984 AM | ||
|
|
|
35 | + * @param value A positive or negative number | ||
|
|
|
36 | + * @param unit | ||
|
|
|
37 | + */manipulate(e,t){if(void 0===this[t])throw new Error(`Unit '${t}' is not valid`);this[t]+=e;return this} | ||
|
|
|
38 | + /** | ||
|
|
|
39 | + * Returns a string format. | ||
|
|
|
40 | + * See https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat | ||
|
|
|
41 | + * for valid templates and locale objects | ||
|
|
|
42 | + * @param template An object. Uses browser defaults otherwise. | ||
|
|
|
43 | + * @param locale Can be a string or an array of strings. Uses browser defaults otherwise. | ||
|
|
|
44 | + */format(e,t=this.locale){return new Intl.DateTimeFormat(t,e).format(this)} | ||
|
|
|
45 | + /** | ||
|
|
|
46 | + * Return true if {@link compare} is before this date | ||
|
|
|
47 | + * @param compare The Date/DateTime to compare | ||
|
|
|
48 | + * @param unit If provided, uses {@link startOf} for | ||
|
|
|
49 | + * comparision. | ||
|
|
|
50 | + */isBefore(e,t){if(!t)return this.valueOf()<e.valueOf();if(void 0===this[t])throw new Error(`Unit '${t}' is not valid`);return this.clone.startOf(t).valueOf()<e.clone.startOf(t).valueOf()} | ||
|
|
|
51 | + /** | ||
|
|
|
52 | + * Return true if {@link compare} is after this date | ||
|
|
|
53 | + * @param compare The Date/DateTime to compare | ||
|
|
|
54 | + * @param unit If provided, uses {@link startOf} for | ||
|
|
|
55 | + * comparision. | ||
|
|
|
56 | + */isAfter(e,t){if(!t)return this.valueOf()>e.valueOf();if(void 0===this[t])throw new Error(`Unit '${t}' is not valid`);return this.clone.startOf(t).valueOf()>e.clone.startOf(t).valueOf()} | ||
|
|
|
57 | + /** | ||
|
|
|
58 | + * Return true if {@link compare} is same this date | ||
|
|
|
59 | + * @param compare The Date/DateTime to compare | ||
|
|
|
60 | + * @param unit If provided, uses {@link startOf} for | ||
|
|
|
61 | + * comparision. | ||
|
|
|
62 | + */isSame(e,t){if(!t)return this.valueOf()===e.valueOf();if(void 0===this[t])throw new Error(`Unit '${t}' is not valid`);e=DateTime.convert(e);return this.clone.startOf(t).valueOf()===e.startOf(t).valueOf()} | ||
|
|
|
63 | + /** | ||
|
|
|
64 | + * Check if this is between two other DateTimes, optionally looking at unit scale. The match is exclusive. | ||
|
|
|
65 | + * @param left | ||
|
|
|
66 | + * @param right | ||
|
|
|
67 | + * @param unit. | ||
|
|
|
68 | + * @param inclusivity. A [ indicates inclusion of a value. A ( indicates exclusion. | ||
|
|
|
69 | + * If the inclusivity parameter is used, both indicators must be passed. | ||
|
|
|
70 | + */isBetween(e,t,s,i="()"){if(s&&void 0===this[s])throw new Error(`Unit '${s}' is not valid`);const a="("===i[0];const o=")"===i[1];return(a?this.isAfter(e,s):!this.isBefore(e,s))&&(o?this.isBefore(t,s):!this.isAfter(t,s))||(a?this.isBefore(e,s):!this.isAfter(e,s))&&(o?this.isAfter(t,s):!this.isBefore(t,s))} | ||
|
|
|
71 | + /** | ||
|
|
|
72 | + * Returns flattened object of the date. Does not include literals | ||
|
|
|
73 | + * @param locale | ||
|
|
|
74 | + * @param template | ||
|
|
|
75 | + */parts(e=this.locale,t={dateStyle:"full",timeStyle:"long"}){const s={};new Intl.DateTimeFormat(e,t).formatToParts(this).filter((e=>"literal"!==e.type)).forEach((e=>s[e.type]=e.value));return s}get seconds(){return this.getSeconds()}set seconds(e){this.setSeconds(e)}get secondsFormatted(){return this.parts(void 0,t).second}get minutes(){return this.getMinutes()}set minutes(e){this.setMinutes(e)}get minutesFormatted(){return this.parts(void 0,t).minute}get hours(){return this.getHours()}set hours(e){this.setHours(e)}get hoursFormatted(){return this.parts(void 0,s).hour}get twelveHoursFormatted(){return this.parts(void 0,t).hour} | ||
|
|
|
76 | + /** | ||
|
|
|
77 | + * Get the meridiem of the date. E.g. AM or PM. | ||
|
|
|
78 | + * If the {@link locale} provides a "dayPeriod" then this will be returned, | ||
|
|
|
79 | + * otherwise it will return AM or PM. | ||
|
|
|
80 | + * @param locale | ||
|
|
|
81 | + */meridiem(e=this.locale){return new Intl.DateTimeFormat(e,{hour:"numeric",hour12:true}).formatToParts(this).find((e=>"dayPeriod"===e.type))?.value}get date(){return this.getDate()}set date(e){this.setDate(e)}get dateFormatted(){return this.parts(void 0,t).day}get weekDay(){return this.getDay()}get month(){return this.getMonth()}set month(e){const t=new Date(this.year,e+1);t.setDate(0);const s=t.getDate();this.date>s&&(this.date=s);this.setMonth(e)}get monthFormatted(){return this.parts(void 0,t).month}get year(){return this.getFullYear()}set year(e){this.setFullYear(e)}get week(){const e=this.computeOrdinal(),t=this.getUTCDay();let s=Math.floor((e-t+10)/7);s<1?s=this.weeksInWeekYear(this.year-1):s>this.weeksInWeekYear(this.year)&&(s=1);return s}weeksInWeekYear(e){const t=(e+Math.floor(e/4)-Math.floor(e/100)+Math.floor(e/400))%7,s=e-1,i=(s+Math.floor(s/4)-Math.floor(s/100)+Math.floor(s/400))%7;return 4===t||3===i?53:52}get isLeapYear(){return this.year%4===0&&(this.year%100!==0||this.year%400===0)}computeOrdinal(){return this.date+(this.isLeapYear?this.leapLadder:this.nonLeapLadder)[this.month]}}class TdError extends Error{}class ErrorMessages{constructor(){this.base="TD:";this.failedToSetInvalidDate="Failed to set invalid date";this.failedToParseInput="Failed parse input field"} | ||
|
|
|
82 | + /** | ||
|
|
|
83 | + * Throws an error indicating that a key in the options object is invalid. | ||
|
|
|
84 | + * @param optionName | ||
|
|
|
85 | + */ | ||
|
|
|
86 | + unexpectedOption(e){const t=new TdError(`${this.base} Unexpected option: ${e} does not match a known option.`);t.code=1;throw t} | ||
|
|
|
87 | + /** | ||
|
|
|
88 | + * Throws an error indicating that one more keys in the options object is invalid. | ||
|
|
|
89 | + * @param optionName | ||
|
|
|
90 | + */unexpectedOptions(e){const t=new TdError(`${this.base}: ${e.join(", ")}`);t.code=1;throw t} | ||
|
|
|
91 | + /** | ||
|
|
|
92 | + * Throws an error when an option is provide an unsupported value. | ||
|
|
|
93 | + * For example a value of 'cheese' for toolbarPlacement which only supports | ||
|
|
|
94 | + * 'top', 'bottom', 'default'. | ||
|
|
|
95 | + * @param optionName | ||
|
|
|
96 | + * @param badValue | ||
|
|
|
97 | + * @param validOptions | ||
|
|
|
98 | + */unexpectedOptionValue(e,t,s){const i=new TdError(`${this.base} Unexpected option value: ${e} does not accept a value of "${t}". Valid values are: ${s.join(", ")}`);i.code=2;throw i} | ||
|
|
|
99 | + /** | ||
|
|
|
100 | + * Throws an error when an option value is the wrong type. | ||
|
|
|
101 | + * For example a string value was provided to multipleDates which only | ||
|
|
|
102 | + * supports true or false. | ||
|
|
|
103 | + * @param optionName | ||
|
|
|
104 | + * @param badType | ||
|
|
|
105 | + * @param expectedType | ||
|
|
|
106 | + */typeMismatch(e,t,s){const i=new TdError(`${this.base} Mismatch types: ${e} has a type of ${t} instead of the required ${s}`);i.code=3;throw i} | ||
|
|
|
107 | + /** | ||
|
|
|
108 | + * Throws an error when an option value is outside of the expected range. | ||
|
|
|
109 | + * For example restrictions.daysOfWeekDisabled excepts a value between 0 and 6. | ||
|
|
|
110 | + * @param optionName | ||
|
|
|
111 | + * @param lower | ||
|
|
|
112 | + * @param upper | ||
|
|
|
113 | + */numbersOutOfRange(e,t,s){const i=new TdError(`${this.base} ${e} expected an array of number between ${t} and ${s}.`);i.code=4;throw i} | ||
|
|
|
114 | + /** | ||
|
|
|
115 | + * Throws an error when a value for a date options couldn't be parsed. Either | ||
|
|
|
116 | + * the option was an invalid string or an invalid Date object. | ||
|
|
|
117 | + * @param optionName | ||
|
|
|
118 | + * @param date | ||
|
|
|
119 | + * @param soft If true, logs a warning instead of an error. | ||
|
|
|
120 | + */failedToParseDate(e,t,s=false){const i=new TdError(`${this.base} Could not correctly parse "${t}" to a date for ${e}.`);i.code=5;if(!s)throw i;console.warn(i)}mustProvideElement(){const e=new TdError(`${this.base} No element was provided.`);e.code=6;throw e}subscribeMismatch(){const e=new TdError(`${this.base} The subscribed events does not match the number of callbacks`);e.code=7;throw e}conflictingConfiguration(e){const t=new TdError(`${this.base} A configuration value conflicts with another rule. ${e}`);t.code=8;throw t}customDateFormatError(e){const t=new TdError(`${this.base} customDateFormat: ${e}`);t.code=9;throw t}dateString(){console.warn(`${this.base} Using a string for date options is not recommended unless you specify an ISO string or use the customDateFormat plugin.`)}throwError(e){const t=new TdError(`${this.base} ${e}`);t.code=9;throw t}}const i="tempus-dominus",a="td";class Events{constructor(){this.key=`.${a}`;this.change=`change${this.key}`;this.update=`update${this.key}`;this.error=`error${this.key}`;this.show=`show${this.key}`;this.hide=`hide${this.key}`;this.blur=`blur${this.key}`;this.focus=`focus${this.key}`;this.keyup=`keyup${this.key}`;this.keydown=`keydown${this.key}`}}class Css{constructor(){this.widget=`${i}-widget`;this.calendarHeader="calendar-header";this.switch="picker-switch";this.toolbar="toolbar";this.noHighlight="no-highlight";this.sideBySide="timepicker-sbs";this.previous="previous";this.next="next";this.disabled="disabled";this.old="old";this.new="new";this.active="active";this.dateContainer="date-container";this.decadesContainer=`${this.dateContainer}-decades`;this.decade="decade";this.yearsContainer=`${this.dateContainer}-years`;this.year="year";this.monthsContainer=`${this.dateContainer}-months`;this.month="month";this.daysContainer=`${this.dateContainer}-days`;this.day="day";this.calendarWeeks="cw";this.dayOfTheWeek="dow";this.today="today";this.weekend="weekend";this.timeContainer="time-container";this.separator="separator";this.clockContainer=`${this.timeContainer}-clock`;this.hourContainer=`${this.timeContainer}-hour`;this.minuteContainer=`${this.timeContainer}-minute`;this.secondContainer=`${this.timeContainer}-second`;this.hour="hour";this.minute="minute";this.second="second";this.toggleMeridiem="toggleMeridiem";this.show="show";this.collapsing="td-collapsing";this.collapse="td-collapse";this.inline="inline";this.lightTheme="light";this.darkTheme="dark";this.isDarkPreferredQuery="(prefers-color-scheme: dark)"}}class Namespace{}Namespace.NAME=i;Namespace.dataKey=a;Namespace.events=new Events;Namespace.css=new Css;Namespace.errorMessages=new ErrorMessages;class ServiceLocator{constructor(){this.cache=new Map}locate(e){const t=this.cache.get(e);if(t)return t;const s=new e;this.cache.set(e,s);return s}}const setupServiceLocator=()=>{o=new ServiceLocator};let o;const n=[{name:"calendar",className:Namespace.css.daysContainer,unit:e.month,step:1},{name:"months",className:Namespace.css.monthsContainer,unit:e.year,step:1},{name:"years",className:Namespace.css.yearsContainer,unit:e.year,step:10},{name:"decades",className:Namespace.css.decadesContainer,unit:e.year,step:100}];class OptionsStore{constructor(){this.viewDate=new DateTime;this._currentCalendarViewMode=0;this.minimumCalendarViewMode=0;this.currentView="calendar"}get currentCalendarViewMode(){return this._currentCalendarViewMode}set currentCalendarViewMode(e){this._currentCalendarViewMode=e;this.currentView=n[e].name}refreshCurrentView(){this.currentView=n[this.currentCalendarViewMode].name}}class Validation{constructor(){this.optionsStore=o.locate(OptionsStore)} | ||
|
|
|
121 | + /** | ||
|
|
|
122 | + * Checks to see if the target date is valid based on the rules provided in the options. | ||
|
|
|
123 | + * Granularity can be provided to check portions of the date instead of the whole. | ||
|
|
|
124 | + * @param targetDate | ||
|
|
|
125 | + * @param granularity | ||
|
|
|
126 | + */isValid(t,s){if(this.optionsStore.options.restrictions.disabledDates.length>0&&this._isInDisabledDates(t))return false;if(this.optionsStore.options.restrictions.enabledDates.length>0&&!this._isInEnabledDates(t))return false;if(s!==e.month&&s!==e.year&&this.optionsStore.options.restrictions.daysOfWeekDisabled?.length>0&&-1!==this.optionsStore.options.restrictions.daysOfWeekDisabled.indexOf(t.weekDay))return false;if(this.optionsStore.options.restrictions.minDate&&t.isBefore(this.optionsStore.options.restrictions.minDate,s))return false;if(this.optionsStore.options.restrictions.maxDate&&t.isAfter(this.optionsStore.options.restrictions.maxDate,s))return false;if(s===e.hours||s===e.minutes||s===e.seconds){if(this.optionsStore.options.restrictions.disabledHours.length>0&&this._isInDisabledHours(t))return false;if(this.optionsStore.options.restrictions.enabledHours.length>0&&!this._isInEnabledHours(t))return false;if(this.optionsStore.options.restrictions.disabledTimeIntervals.length>0)for(let e of this.optionsStore.options.restrictions.disabledTimeIntervals)if(t.isBetween(e.from,e.to))return false}return true} | ||
|
|
|
127 | + /** | ||
|
|
|
128 | + * Checks to see if the disabledDates option is in use and returns true (meaning invalid) | ||
|
|
|
129 | + * if the `testDate` is with in the array. Granularity is by date. | ||
|
|
|
130 | + * @param testDate | ||
|
|
|
131 | + * @private | ||
|
|
|
132 | + */_isInDisabledDates(t){if(!this.optionsStore.options.restrictions.disabledDates||0===this.optionsStore.options.restrictions.disabledDates.length)return false;const s=t.format(getFormatByUnit(e.date));return this.optionsStore.options.restrictions.disabledDates.map((t=>t.format(getFormatByUnit(e.date)))).find((e=>e===s))} | ||
|
|
|
133 | + /** | ||
|
|
|
134 | + * Checks to see if the enabledDates option is in use and returns true (meaning valid) | ||
|
|
|
135 | + * if the `testDate` is with in the array. Granularity is by date. | ||
|
|
|
136 | + * @param testDate | ||
|
|
|
137 | + * @private | ||
|
|
|
138 | + */_isInEnabledDates(t){if(!this.optionsStore.options.restrictions.enabledDates||0===this.optionsStore.options.restrictions.enabledDates.length)return true;const s=t.format(getFormatByUnit(e.date));return this.optionsStore.options.restrictions.enabledDates.map((t=>t.format(getFormatByUnit(e.date)))).find((e=>e===s))} | ||
|
|
|
139 | + /** | ||
|
|
|
140 | + * Checks to see if the disabledHours option is in use and returns true (meaning invalid) | ||
|
|
|
141 | + * if the `testDate` is with in the array. Granularity is by hours. | ||
|
|
|
142 | + * @param testDate | ||
|
|
|
143 | + * @private | ||
|
|
|
144 | + */_isInDisabledHours(e){if(!this.optionsStore.options.restrictions.disabledHours||0===this.optionsStore.options.restrictions.disabledHours.length)return false;const t=e.hours;return this.optionsStore.options.restrictions.disabledHours.find((e=>e===t))} | ||
|
|
|
145 | + /** | ||
|
|
|
146 | + * Checks to see if the enabledHours option is in use and returns true (meaning valid) | ||
|
|
|
147 | + * if the `testDate` is with in the array. Granularity is by hours. | ||
|
|
|
148 | + * @param testDate | ||
|
|
|
149 | + * @private | ||
|
|
|
150 | + */_isInEnabledHours(e){if(!this.optionsStore.options.restrictions.enabledHours||0===this.optionsStore.options.restrictions.enabledHours.length)return true;const t=e.hours;return this.optionsStore.options.restrictions.enabledHours.find((e=>e===t))}}class EventEmitter{constructor(){this.subscribers=[]}subscribe(e){this.subscribers.push(e);return this.unsubscribe.bind(this,this.subscribers.length-1)}unsubscribe(e){this.subscribers.splice(e,1)}emit(e){this.subscribers.forEach((t=>{t(e)}))}destroy(){this.subscribers=null;this.subscribers=[]}}class EventEmitters{constructor(){this.triggerEvent=new EventEmitter;this.viewUpdate=new EventEmitter;this.updateDisplay=new EventEmitter;this.action=new EventEmitter}destroy(){this.triggerEvent.destroy();this.viewUpdate.destroy();this.updateDisplay.destroy();this.action.destroy()}}const r={restrictions:{minDate:void 0,maxDate:void 0,disabledDates:[],enabledDates:[],daysOfWeekDisabled:[],disabledTimeIntervals:[],disabledHours:[],enabledHours:[]},display:{icons:{type:"icons",time:"fa-solid fa-clock",date:"fa-solid fa-calendar",up:"fa-solid fa-arrow-up",down:"fa-solid fa-arrow-down",previous:"fa-solid fa-chevron-left",next:"fa-solid fa-chevron-right",today:"fa-solid fa-calendar-check",clear:"fa-solid fa-trash",close:"fa-solid fa-xmark"},sideBySide:false,calendarWeeks:false,viewMode:"calendar",toolbarPlacement:"bottom",keepOpen:false,buttons:{today:false,clear:false,close:false},components:{calendar:true,date:true,month:true,year:true,decades:true,clock:true,hours:true,minutes:true,seconds:false,useTwentyfourHour:void 0},inline:false,theme:"auto"},stepping:1,useCurrent:true,defaultDate:void 0,localization:{today:"Go to today",clear:"Clear selection",close:"Close the picker",selectMonth:"Select Month",previousMonth:"Previous Month",nextMonth:"Next Month",selectYear:"Select Year",previousYear:"Previous Year",nextYear:"Next Year",selectDecade:"Select Decade",previousDecade:"Previous Decade",nextDecade:"Next Decade",previousCentury:"Previous Century",nextCentury:"Next Century",pickHour:"Pick Hour",incrementHour:"Increment Hour",decrementHour:"Decrement Hour",pickMinute:"Pick Minute",incrementMinute:"Increment Minute",decrementMinute:"Decrement Minute",pickSecond:"Pick Second",incrementSecond:"Increment Second",decrementSecond:"Decrement Second",toggleMeridiem:"Toggle Meridiem",selectTime:"Select Time",selectDate:"Select Date",dayViewHeaderFormat:{month:"long",year:"2-digit"},locale:"default",startOfTheWeek:0,dateFormats:{LTS:"h:mm:ss T",LT:"h:mm T",L:"MM/dd/yyyy",LL:"MMMM d, yyyy",LLL:"MMMM d, yyyy h:mm T",LLLL:"dddd, MMMM d, yyyy h:mm T"},ordinal:e=>e,format:"L LT"},keepInvalid:false,debug:false,allowInputToggle:false,viewDate:new DateTime,multipleDates:false,multipleDatesSeparator:"; ",promptTimeOnDateChange:false,promptTimeOnDateChangeTransitionDelay:200,meta:{},container:void 0};class OptionConverter{static deepCopy(e){const t={};Object.keys(e).forEach((s=>{const i=e[s];t[s]=i;"object"!==typeof i||i instanceof HTMLElement||i instanceof Element||i instanceof Date||Array.isArray(i)||(t[s]=OptionConverter.deepCopy(i))}));return t} | ||
|
|
|
151 | + /** | ||
|
|
|
152 | + * Finds value out of an object based on a string, period delimited, path | ||
|
|
|
153 | + * @param paths | ||
|
|
|
154 | + * @param obj | ||
|
|
|
155 | + */static objectPath(e,t){"."===e.charAt(0)&&(e=e.slice(1));return e?e.split(".").reduce(((e,t)=>OptionConverter.isValue(e)||OptionConverter.isValue(e[t])?e[t]:void 0),t):t} | ||
|
|
|
156 | + /** | ||
|
|
|
157 | + * The spread operator caused sub keys to be missing after merging. | ||
|
|
|
158 | + * This is to fix that issue by using spread on the child objects first. | ||
|
|
|
159 | + * Also handles complex options like disabledDates | ||
|
|
|
160 | + * @param provided An option from new providedOptions | ||
|
|
|
161 | + * @param copyTo Destination object. This was added to prevent reference copies | ||
|
|
|
162 | + * @param path | ||
|
|
|
163 | + * @param localization | ||
|
|
|
164 | + */static spread(e,t,s="",i){const a=OptionConverter.objectPath(s,r);const o=Object.keys(e).filter((e=>!Object.keys(a).includes(e)));if(o.length>0){const e=OptionConverter.getFlattenDefaultOptions();const t=o.map((t=>{let i=`"${s}.${t}" in not a known option.`;let a=e.find((e=>e.includes(t)));a&&(i+=` Did you mean "${a}"?`);return i}));Namespace.errorMessages.unexpectedOptions(t)}Object.keys(e).filter((e=>"__proto__"!==e&&"constructor"!==e)).forEach((o=>{s+=`.${o}`;"."===s.charAt(0)&&(s=s.slice(1));const n=a[o];let r=typeof e[o];let c=typeof n;let d=e[o];if(void 0!==d&&null!==d){"object"!==typeof n||Array.isArray(e[o])||n instanceof Date||OptionConverter.ignoreProperties.includes(o)?t[o]=OptionConverter.processKey(o,d,r,c,s,i):OptionConverter.spread(e[o],t[o],s,i);s=s.substring(0,s.lastIndexOf(`.${o}`))}else{t[o]=d;s=s.substring(0,s.lastIndexOf(`.${o}`))}}))}static processKey(e,t,s,i,a,o){switch(e){case"defaultDate":{const e=this.dateConversion(t,"defaultDate",o);if(void 0!==e){e.setLocale(o.locale);return e}Namespace.errorMessages.typeMismatch("defaultDate",s,"DateTime or Date");break}case"viewDate":{const e=this.dateConversion(t,"viewDate",o);if(void 0!==e){e.setLocale(o.locale);return e}Namespace.errorMessages.typeMismatch("viewDate",s,"DateTime or Date");break}case"minDate":{if(void 0===t)return t;const e=this.dateConversion(t,"restrictions.minDate",o);if(void 0!==e){e.setLocale(o.locale);return e}Namespace.errorMessages.typeMismatch("restrictions.minDate",s,"DateTime or Date");break}case"maxDate":{if(void 0===t)return t;const e=this.dateConversion(t,"restrictions.maxDate",o);if(void 0!==e){e.setLocale(o.locale);return e}Namespace.errorMessages.typeMismatch("restrictions.maxDate",s,"DateTime or Date");break}case"disabledHours":if(void 0===t)return[];this._typeCheckNumberArray("restrictions.disabledHours",t,s);t.filter((e=>e<0||e>24)).length>0&&Namespace.errorMessages.numbersOutOfRange("restrictions.disabledHours",0,23);return t;case"enabledHours":if(void 0===t)return[];this._typeCheckNumberArray("restrictions.enabledHours",t,s);t.filter((e=>e<0||e>24)).length>0&&Namespace.errorMessages.numbersOutOfRange("restrictions.enabledHours",0,23);return t;case"daysOfWeekDisabled":if(void 0===t)return[];this._typeCheckNumberArray("restrictions.daysOfWeekDisabled",t,s);t.filter((e=>e<0||e>6)).length>0&&Namespace.errorMessages.numbersOutOfRange("restrictions.daysOfWeekDisabled",0,6);return t;case"enabledDates":if(void 0===t)return[];this._typeCheckDateArray("restrictions.enabledDates",t,s,o);return t;case"disabledDates":if(void 0===t)return[];this._typeCheckDateArray("restrictions.disabledDates",t,s,o);return t;case"disabledTimeIntervals":if(void 0===t)return[];Array.isArray(t)||Namespace.errorMessages.typeMismatch(e,s,"array of { from: DateTime|Date, to: DateTime|Date }");const n=t;for(let t=0;t<n.length;t++)Object.keys(n[t]).forEach((s=>{const i=`${e}[${t}].${s}`;let a=n[t][s];const r=this.dateConversion(a,i,o);r||Namespace.errorMessages.typeMismatch(i,typeof a,"DateTime or Date");r.setLocale(o.locale);n[t][s]=r}));return n;case"toolbarPlacement":case"type":case"viewMode":case"theme":const r={toolbarPlacement:["top","bottom","default"],type:["icons","sprites"],viewMode:["clock","calendar","months","years","decades"],theme:["light","dark","auto"]};const c=r[e];c.includes(t)||Namespace.errorMessages.unexpectedOptionValue(a.substring(1),t,c);return t;case"meta":case"dayViewHeaderFormat":return t;case"container":t&&!(t instanceof HTMLElement||t instanceof Element||t?.appendChild)&&Namespace.errorMessages.typeMismatch(a.substring(1),typeof t,"HTMLElement");return t;case"useTwentyfourHour":if(void 0===t||"boolean"===s)return t;Namespace.errorMessages.typeMismatch(a,s,i);break;default:switch(i){case"boolean":return"true"===t||true===t;case"number":return+t;case"string":return t.toString();case"object":return{};case"function":return t;default:Namespace.errorMessages.typeMismatch(a,s,i)}}}static _mergeOptions(e,t){const s=OptionConverter.deepCopy(t);const i="default"!==t.localization?.locale?t.localization:e?.localization||r.localization;OptionConverter.spread(e,s,"",i);return s}static _dataToOptions(e,t){const s=JSON.parse(JSON.stringify(e.dataset));s?.tdTargetInput&&delete s.tdTargetInput;s?.tdTargetToggle&&delete s.tdTargetToggle;if(!s||0===Object.keys(s).length||s.constructor!==DOMStringMap)return t;let i={};const objectToNormalized=e=>{const t={};Object.keys(e).forEach((e=>{t[e.toLowerCase()]=e}));return t};const rabbitHole=(e,t,s,i)=>{const a=objectToNormalized(s);const o=a[e[t].toLowerCase()];const n={};if(void 0===o)return n;if(s[o].constructor===Object){t++;n[o]=rabbitHole(e,t,s[o],i)}else n[o]=i;return n};const a=objectToNormalized(t);Object.keys(s).filter((e=>e.startsWith(Namespace.dataKey))).map((e=>e.substring(2))).forEach((e=>{let o=a[e.toLowerCase()];if(e.includes("_")){const n=e.split("_");o=a[n[0].toLowerCase()];void 0!==o&&t[o].constructor===Object&&(i[o]=rabbitHole(n,1,t[o],s[`td${e}`]))}else void 0!==o&&(i[o]=s[`td${e}`])}));return this._mergeOptions(i,t)} | ||
|
|
|
165 | + /** | ||
|
|
|
166 | + * Attempts to prove `d` is a DateTime or Date or can be converted into one. | ||
|
|
|
167 | + * @param d If a string will attempt creating a date from it. | ||
|
|
|
168 | + * @param localization object containing locale and format settings. Only used with the custom formats | ||
|
|
|
169 | + * @private | ||
|
|
|
170 | + */static _dateTypeCheck(e,t){if(e.constructor.name===DateTime.name)return e;if(e.constructor.name===Date.name)return DateTime.convert(e);if("string"===typeof e){const s=DateTime.fromString(e,t);return"null"===JSON.stringify(s)?null:s}return null} | ||
|
|
|
171 | + /** | ||
|
|
|
172 | + * Type checks that `value` is an array of Date or DateTime | ||
|
|
|
173 | + * @param optionName Provides text to error messages e.g. disabledDates | ||
|
|
|
174 | + * @param value Option value | ||
|
|
|
175 | + * @param providedType Used to provide text to error messages | ||
|
|
|
176 | + * @param localization | ||
|
|
|
177 | + */static _typeCheckDateArray(e,t,s,i){Array.isArray(t)||Namespace.errorMessages.typeMismatch(e,s,"array of DateTime or Date");for(let s=0;s<t.length;s++){let a=t[s];const o=this.dateConversion(a,e,i);o||Namespace.errorMessages.typeMismatch(e,typeof a,"DateTime or Date");o.setLocale(i?.locale??"default");t[s]=o}} | ||
|
|
|
178 | + /** | ||
|
|
|
179 | + * Type checks that `value` is an array of numbers | ||
|
|
|
180 | + * @param optionName Provides text to error messages e.g. disabledDates | ||
|
|
|
181 | + * @param value Option value | ||
|
|
|
182 | + * @param providedType Used to provide text to error messages | ||
|
|
|
183 | + */static _typeCheckNumberArray(e,t,s){Array.isArray(t)&&!t.find((e=>"number"!==typeof e))||Namespace.errorMessages.typeMismatch(e,s,"array of numbers")} | ||
|
|
|
184 | + /** | ||
|
|
|
185 | + * Attempts to convert `d` to a DateTime object | ||
|
|
|
186 | + * @param d value to convert | ||
|
|
|
187 | + * @param optionName Provides text to error messages e.g. disabledDates | ||
|
|
|
188 | + * @param localization object containing locale and format settings. Only used with the custom formats | ||
|
|
|
189 | + */static dateConversion(e,t,s){"string"===typeof e&&"input"!==t&&Namespace.errorMessages.dateString();const i=this._dateTypeCheck(e,s);i||Namespace.errorMessages.failedToParseDate(t,e,"input"===t);return i}static getFlattenDefaultOptions(){if(this._flattenDefaults)return this._flattenDefaults;const deepKeys=(e,t=[])=>Array.isArray(e)?[]:Object(e)===e?Object.entries(e).flatMap((([e,s])=>deepKeys(s,[...t,e]))):t.join(".");this._flattenDefaults=deepKeys(r);return this._flattenDefaults} | ||
|
|
|
190 | + /** | ||
|
|
|
191 | + * Some options conflict like min/max date. Verify that these kinds of options | ||
|
|
|
192 | + * are set correctly. | ||
|
|
|
193 | + * @param config | ||
|
|
|
194 | + */static _validateConflicts(e){!e.display.sideBySide||e.display.components.clock&&(e.display.components.hours||e.display.components.minutes||e.display.components.seconds)||Namespace.errorMessages.conflictingConfiguration("Cannot use side by side mode without the clock components");if(e.restrictions.minDate&&e.restrictions.maxDate){e.restrictions.minDate.isAfter(e.restrictions.maxDate)&&Namespace.errorMessages.conflictingConfiguration("minDate is after maxDate");e.restrictions.maxDate.isBefore(e.restrictions.minDate)&&Namespace.errorMessages.conflictingConfiguration("maxDate is before minDate")}}}OptionConverter.ignoreProperties=["meta","dayViewHeaderFormat","container","dateForms","ordinal"];OptionConverter.isValue=e=>null!=e;class Dates{constructor(){this._dates=[];this.optionsStore=o.locate(OptionsStore);this.validation=o.locate(Validation);this._eventEmitters=o.locate(EventEmitters)}get picked(){return this._dates}get lastPicked(){return this._dates[this.lastPickedIndex]}get lastPickedIndex(){return 0===this._dates.length?0:this._dates.length-1} | ||
|
|
|
195 | + /** | ||
|
|
|
196 | + * Formats a DateTime object to a string. Used when setting the input value. | ||
|
|
|
197 | + * @param date | ||
|
|
|
198 | + */formatInput(e){const t=this.optionsStore.options.display.components;return e?e.format({year:t.calendar&&t.year?"numeric":void 0,month:t.calendar&&t.month?"2-digit":void 0,day:t.calendar&&t.date?"2-digit":void 0,hour:t.clock&&t.hours?t.useTwentyfourHour?"2-digit":"numeric":void 0,minute:t.clock&&t.minutes?"2-digit":void 0,second:t.clock&&t.seconds?"2-digit":void 0,hour12:!t.useTwentyfourHour}):""}parseInput(e){return OptionConverter.dateConversion(e,"input",this.optionsStore.options.localization)} | ||
|
|
|
199 | + /** | ||
|
|
|
200 | + * Tries to convert the provided value to a DateTime object. | ||
|
|
|
201 | + * If value is null|undefined then clear the value of the provided index (or 0). | ||
|
|
|
202 | + * @param value Value to convert or null|undefined | ||
|
|
|
203 | + * @param index When using multidates this is the index in the array | ||
|
|
|
204 | + */setFromInput(e,t){if(!e){this.setValue(void 0,t);return}const s=this.parseInput(e);if(s){s.setLocale(this.optionsStore.options.localization.locale);this.setValue(s,t)}} | ||
|
|
|
205 | + /** | ||
|
|
|
206 | + * Adds a new DateTime to selected dates array | ||
|
|
|
207 | + * @param date | ||
|
|
|
208 | + */add(e){this._dates.push(e)} | ||
|
|
|
209 | + /** | ||
|
|
|
210 | + * Returns true if the `targetDate` is part of the selected dates array. | ||
|
|
|
211 | + * If `unit` is provided then a granularity to that unit will be used. | ||
|
|
|
212 | + * @param targetDate | ||
|
|
|
213 | + * @param unit | ||
|
|
|
214 | + */isPicked(e,t){if(!t)return void 0!==this._dates.find((t=>t===e));const s=getFormatByUnit(t);let i=e.format(s);return void 0!==this._dates.map((e=>e.format(s))).find((e=>e===i))} | ||
|
|
|
215 | + /** | ||
|
|
|
216 | + * Returns the index at which `targetDate` is in the array. | ||
|
|
|
217 | + * This is used for updating or removing a date when multi-date is used | ||
|
|
|
218 | + * If `unit` is provided then a granularity to that unit will be used. | ||
|
|
|
219 | + * @param targetDate | ||
|
|
|
220 | + * @param unit | ||
|
|
|
221 | + */pickedIndex(e,t){if(!t)return this._dates.indexOf(e);const s=getFormatByUnit(t);let i=e.format(s);return this._dates.map((e=>e.format(s))).indexOf(i)}clear(){this.optionsStore.unset=true;this._eventEmitters.triggerEvent.emit({type:Namespace.events.change,date:void 0,oldDate:this.lastPicked,isClear:true,isValid:true});this._dates=[]} | ||
|
|
|
222 | + /** | ||
|
|
|
223 | + * Find the "book end" years given a `year` and a `factor` | ||
|
|
|
224 | + * @param factor e.g. 100 for decades | ||
|
|
|
225 | + * @param year e.g. 2021 | ||
|
|
|
226 | + */static getStartEndYear(e,t){const s=e/10,i=Math.floor(t/e)*e,a=i+9*s,o=Math.floor(t/s)*s;return[i,a,o]} | ||
|
|
|
227 | + /** | ||
|
|
|
228 | + * Attempts to either clear or set the `target` date at `index`. | ||
|
|
|
229 | + * If the `target` is null then the date will be cleared. | ||
|
|
|
230 | + * If multi-date is being used then it will be removed from the array. | ||
|
|
|
231 | + * If `target` is valid and multi-date is used then if `index` is | ||
|
|
|
232 | + * provided the date at that index will be replaced, otherwise it is appended. | ||
|
|
|
233 | + * @param target | ||
|
|
|
234 | + * @param index | ||
|
|
|
235 | + */setValue(e,t){const s="undefined"===typeof t,i=!e&&s;let a=this.optionsStore.unset?null:this._dates[t];!a&&!this.optionsStore.unset&&s&&i&&(a=this.lastPicked);const updateInput=()=>{if(!this.optionsStore.input)return;let t=this.formatInput(e);this.optionsStore.options.multipleDates&&(t=this._dates.map((e=>this.formatInput(e))).join(this.optionsStore.options.multipleDatesSeparator));this.optionsStore.input.value!=t&&(this.optionsStore.input.value=t)};if(e&&a?.isSame(e))updateInput();else if(e){t=t||0;e=e.clone;if(1!==this.optionsStore.options.stepping){e.minutes=Math.round(e.minutes/this.optionsStore.options.stepping)*this.optionsStore.options.stepping;e.seconds=0}if(this.validation.isValid(e)){this._dates[t]=e;this.optionsStore.viewDate=e.clone;updateInput();this.optionsStore.unset=false;this._eventEmitters.updateDisplay.emit("all");this._eventEmitters.triggerEvent.emit({type:Namespace.events.change,date:e,oldDate:a,isClear:i,isValid:true})}else{if(this.optionsStore.options.keepInvalid){this._dates[t]=e;this.optionsStore.viewDate=e.clone;updateInput();this._eventEmitters.triggerEvent.emit({type:Namespace.events.change,date:e,oldDate:a,isClear:i,isValid:false})}this._eventEmitters.triggerEvent.emit({type:Namespace.events.error,reason:Namespace.errorMessages.failedToSetInvalidDate,date:e,oldDate:a})}}else{if(!this.optionsStore.options.multipleDates||1===this._dates.length||i){this.optionsStore.unset=true;this._dates=[]}else this._dates.splice(t,1);updateInput();this._eventEmitters.triggerEvent.emit({type:Namespace.events.change,date:void 0,oldDate:a,isClear:i,isValid:true});this._eventEmitters.updateDisplay.emit("all")}}}var c;(function(e){e.next="next";e.previous="previous";e.changeCalendarView="changeCalendarView";e.selectMonth="selectMonth";e.selectYear="selectYear";e.selectDecade="selectDecade";e.selectDay="selectDay";e.selectHour="selectHour";e.selectMinute="selectMinute";e.selectSecond="selectSecond";e.incrementHours="incrementHours";e.incrementMinutes="incrementMinutes";e.incrementSeconds="incrementSeconds";e.decrementHours="decrementHours";e.decrementMinutes="decrementMinutes";e.decrementSeconds="decrementSeconds";e.toggleMeridiem="toggleMeridiem";e.togglePicker="togglePicker";e.showClock="showClock";e.showHours="showHours";e.showMinutes="showMinutes";e.showSeconds="showSeconds";e.clear="clear";e.close="close";e.today="today"})(c||(c={}));var d=c;class DateDisplay{constructor(){this.optionsStore=o.locate(OptionsStore);this.dates=o.locate(Dates);this.validation=o.locate(Validation)}getPicker(){const e=document.createElement("div");e.classList.add(Namespace.css.daysContainer);e.append(...this._daysOfTheWeek());if(this.optionsStore.options.display.calendarWeeks){const t=document.createElement("div");t.classList.add(Namespace.css.calendarWeeks,Namespace.css.noHighlight);e.appendChild(t)}for(let t=0;t<42;t++){if(0!==t&&t%7===0&&this.optionsStore.options.display.calendarWeeks){const t=document.createElement("div");t.classList.add(Namespace.css.calendarWeeks,Namespace.css.noHighlight);e.appendChild(t)}const s=document.createElement("div");s.setAttribute("data-action",d.selectDay);e.appendChild(s)}return e}_update(t,s){const i=t.getElementsByClassName(Namespace.css.daysContainer)[0];if("calendar"===this.optionsStore.currentView){const[t,s,a]=i.parentElement.getElementsByClassName(Namespace.css.calendarHeader)[0].getElementsByTagName("div");s.setAttribute(Namespace.css.daysContainer,this.optionsStore.viewDate.format(this.optionsStore.options.localization.dayViewHeaderFormat));this.optionsStore.options.display.components.month?s.classList.remove(Namespace.css.disabled):s.classList.add(Namespace.css.disabled);this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(-1,e.month),e.month)?t.classList.remove(Namespace.css.disabled):t.classList.add(Namespace.css.disabled);this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(1,e.month),e.month)?a.classList.remove(Namespace.css.disabled):a.classList.add(Namespace.css.disabled)}let a=this.optionsStore.viewDate.clone.startOf(e.month).startOf("weekDay",this.optionsStore.options.localization.startOfTheWeek).manipulate(12,e.hours);i.querySelectorAll(`[data-action="${d.selectDay}"], .${Namespace.css.calendarWeeks}`).forEach((t=>{if(this.optionsStore.options.display.calendarWeeks&&t.classList.contains(Namespace.css.calendarWeeks)){if("#"===t.innerText)return;t.innerText=`${a.week}`;return}let i=[];i.push(Namespace.css.day);a.isBefore(this.optionsStore.viewDate,e.month)&&i.push(Namespace.css.old);a.isAfter(this.optionsStore.viewDate,e.month)&&i.push(Namespace.css.new);!this.optionsStore.unset&&this.dates.isPicked(a,e.date)&&i.push(Namespace.css.active);this.validation.isValid(a,e.date)||i.push(Namespace.css.disabled);a.isSame(new DateTime,e.date)&&i.push(Namespace.css.today);0!==a.weekDay&&6!==a.weekDay||i.push(Namespace.css.weekend);s(e.date,a,i,t);t.classList.remove(...t.classList);t.classList.add(...i);t.setAttribute("data-value",`${a.year}-${a.monthFormatted}-${a.dateFormatted}`);t.setAttribute("data-day",`${a.date}`);t.innerText=a.format({day:"numeric"});a.manipulate(1,e.date)}))}_daysOfTheWeek(){let t=this.optionsStore.viewDate.clone.startOf("weekDay",this.optionsStore.options.localization.startOfTheWeek).startOf(e.date);const s=[];document.createElement("div");if(this.optionsStore.options.display.calendarWeeks){const e=document.createElement("div");e.classList.add(Namespace.css.calendarWeeks,Namespace.css.noHighlight);e.innerText="#";s.push(e)}for(let i=0;i<7;i++){const i=document.createElement("div");i.classList.add(Namespace.css.dayOfTheWeek,Namespace.css.noHighlight);i.innerText=t.format({weekday:"short"});t.manipulate(1,e.date);s.push(i)}return s}}class MonthDisplay{constructor(){this.optionsStore=o.locate(OptionsStore);this.dates=o.locate(Dates);this.validation=o.locate(Validation)}getPicker(){const e=document.createElement("div");e.classList.add(Namespace.css.monthsContainer);for(let t=0;t<12;t++){const t=document.createElement("div");t.setAttribute("data-action",d.selectMonth);e.appendChild(t)}return e}_update(t,s){const i=t.getElementsByClassName(Namespace.css.monthsContainer)[0];if("months"===this.optionsStore.currentView){const[t,s,a]=i.parentElement.getElementsByClassName(Namespace.css.calendarHeader)[0].getElementsByTagName("div");s.setAttribute(Namespace.css.monthsContainer,this.optionsStore.viewDate.format({year:"numeric"}));this.optionsStore.options.display.components.year?s.classList.remove(Namespace.css.disabled):s.classList.add(Namespace.css.disabled);this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(-1,e.year),e.year)?t.classList.remove(Namespace.css.disabled):t.classList.add(Namespace.css.disabled);this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(1,e.year),e.year)?a.classList.remove(Namespace.css.disabled):a.classList.add(Namespace.css.disabled)}let a=this.optionsStore.viewDate.clone.startOf(e.year);i.querySelectorAll(`[data-action="${d.selectMonth}"]`).forEach(((t,i)=>{let o=[];o.push(Namespace.css.month);!this.optionsStore.unset&&this.dates.isPicked(a,e.month)&&o.push(Namespace.css.active);this.validation.isValid(a,e.month)||o.push(Namespace.css.disabled);s(e.month,a,o,t);t.classList.remove(...t.classList);t.classList.add(...o);t.setAttribute("data-value",`${i}`);t.innerText=`${a.format({month:"short"})}`;a.manipulate(1,e.month)}))}}class YearDisplay{constructor(){this.optionsStore=o.locate(OptionsStore);this.dates=o.locate(Dates);this.validation=o.locate(Validation)}getPicker(){const e=document.createElement("div");e.classList.add(Namespace.css.yearsContainer);for(let t=0;t<12;t++){const t=document.createElement("div");t.setAttribute("data-action",d.selectYear);e.appendChild(t)}return e}_update(t,s){this._startYear=this.optionsStore.viewDate.clone.manipulate(-1,e.year);this._endYear=this.optionsStore.viewDate.clone.manipulate(10,e.year);const i=t.getElementsByClassName(Namespace.css.yearsContainer)[0];if("years"===this.optionsStore.currentView){const[t,s,a]=i.parentElement.getElementsByClassName(Namespace.css.calendarHeader)[0].getElementsByTagName("div");s.setAttribute(Namespace.css.yearsContainer,`${this._startYear.format({year:"numeric"})}-${this._endYear.format({year:"numeric"})}`);this.optionsStore.options.display.components.decades?s.classList.remove(Namespace.css.disabled):s.classList.add(Namespace.css.disabled);this.validation.isValid(this._startYear,e.year)?t.classList.remove(Namespace.css.disabled):t.classList.add(Namespace.css.disabled);this.validation.isValid(this._endYear,e.year)?a.classList.remove(Namespace.css.disabled):a.classList.add(Namespace.css.disabled)}let a=this.optionsStore.viewDate.clone.startOf(e.year).manipulate(-1,e.year);i.querySelectorAll(`[data-action="${d.selectYear}"]`).forEach((t=>{let i=[];i.push(Namespace.css.year);!this.optionsStore.unset&&this.dates.isPicked(a,e.year)&&i.push(Namespace.css.active);this.validation.isValid(a,e.year)||i.push(Namespace.css.disabled);s(e.year,a,i,t);t.classList.remove(...t.classList);t.classList.add(...i);t.setAttribute("data-value",`${a.year}`);t.innerText=a.format({year:"numeric"});a.manipulate(1,e.year)}))}}class DecadeDisplay{constructor(){this.optionsStore=o.locate(OptionsStore);this.dates=o.locate(Dates);this.validation=o.locate(Validation)}getPicker(){const e=document.createElement("div");e.classList.add(Namespace.css.decadesContainer);for(let t=0;t<12;t++){const t=document.createElement("div");t.setAttribute("data-action",d.selectDecade);e.appendChild(t)}return e}_update(t,s){const[i,a]=Dates.getStartEndYear(100,this.optionsStore.viewDate.year);this._startDecade=this.optionsStore.viewDate.clone.startOf(e.year);this._startDecade.year=i;this._endDecade=this.optionsStore.viewDate.clone.startOf(e.year);this._endDecade.year=a;const o=t.getElementsByClassName(Namespace.css.decadesContainer)[0];const[n,r,c]=o.parentElement.getElementsByClassName(Namespace.css.calendarHeader)[0].getElementsByTagName("div");if("decades"===this.optionsStore.currentView){r.setAttribute(Namespace.css.decadesContainer,`${this._startDecade.format({year:"numeric"})}-${this._endDecade.format({year:"numeric"})}`);this.validation.isValid(this._startDecade,e.year)?n.classList.remove(Namespace.css.disabled):n.classList.add(Namespace.css.disabled);this.validation.isValid(this._endDecade,e.year)?c.classList.remove(Namespace.css.disabled):c.classList.add(Namespace.css.disabled)}const l=this.dates.picked.map((e=>e.year));o.querySelectorAll(`[data-action="${d.selectDecade}"]`).forEach(((t,i)=>{if(0===i){t.classList.add(Namespace.css.old);if(this._startDecade.year-10<0){t.textContent=" ";n.classList.add(Namespace.css.disabled);t.classList.add(Namespace.css.disabled);t.setAttribute("data-value","");return}t.innerText=this._startDecade.clone.manipulate(-10,e.year).format({year:"numeric"});t.setAttribute("data-value",`${this._startDecade.year}`);return}let a=[];a.push(Namespace.css.decade);const o=this._startDecade.year;const r=this._startDecade.year+9;!this.optionsStore.unset&&l.filter((e=>e>=o&&e<=r)).length>0&&a.push(Namespace.css.active);s("decade",this._startDecade,a,t);t.classList.remove(...t.classList);t.classList.add(...a);t.setAttribute("data-value",`${this._startDecade.year}`);t.innerText=`${this._startDecade.format({year:"numeric"})}`;this._startDecade.manipulate(10,e.year)}))}}class TimeDisplay{constructor(){this._gridColumns="";this.optionsStore=o.locate(OptionsStore);this.dates=o.locate(Dates);this.validation=o.locate(Validation)}getPicker(e){const t=document.createElement("div");t.classList.add(Namespace.css.clockContainer);t.append(...this._grid(e));return t}_update(t){const s=t.getElementsByClassName(Namespace.css.clockContainer)[0];const i=(this.dates.lastPicked||this.optionsStore.viewDate).clone;s.querySelectorAll(".disabled").forEach((e=>e.classList.remove(Namespace.css.disabled)));if(this.optionsStore.options.display.components.hours){this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(1,e.hours),e.hours)||s.querySelector(`[data-action=${d.incrementHours}]`).classList.add(Namespace.css.disabled);this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(-1,e.hours),e.hours)||s.querySelector(`[data-action=${d.decrementHours}]`).classList.add(Namespace.css.disabled);s.querySelector(`[data-time-component=${e.hours}]`).innerText=this.optionsStore.options.display.components.useTwentyfourHour?i.hoursFormatted:i.twelveHoursFormatted}if(this.optionsStore.options.display.components.minutes){this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(1,e.minutes),e.minutes)||s.querySelector(`[data-action=${d.incrementMinutes}]`).classList.add(Namespace.css.disabled);this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(-1,e.minutes),e.minutes)||s.querySelector(`[data-action=${d.decrementMinutes}]`).classList.add(Namespace.css.disabled);s.querySelector(`[data-time-component=${e.minutes}]`).innerText=i.minutesFormatted}if(this.optionsStore.options.display.components.seconds){this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(1,e.seconds),e.seconds)||s.querySelector(`[data-action=${d.incrementSeconds}]`).classList.add(Namespace.css.disabled);this.validation.isValid(this.optionsStore.viewDate.clone.manipulate(-1,e.seconds),e.seconds)||s.querySelector(`[data-action=${d.decrementSeconds}]`).classList.add(Namespace.css.disabled);s.querySelector(`[data-time-component=${e.seconds}]`).innerText=i.secondsFormatted}if(!this.optionsStore.options.display.components.useTwentyfourHour){const t=s.querySelector(`[data-action=${d.toggleMeridiem}]`);t.innerText=i.meridiem();this.validation.isValid(i.clone.manipulate(i.hours>=12?-12:12,e.hours))?t.classList.remove(Namespace.css.disabled):t.classList.add(Namespace.css.disabled)}s.style.gridTemplateAreas=`"${this._gridColumns}"`}_grid(t){this._gridColumns="";const s=[],i=[],a=[],o=document.createElement("div"),n=t(this.optionsStore.options.display.icons.up),r=t(this.optionsStore.options.display.icons.down);o.classList.add(Namespace.css.separator,Namespace.css.noHighlight);const c=o.cloneNode(true);c.innerHTML=":";const getSeparator=(e=false)=>e?c.cloneNode(true):o.cloneNode(true);if(this.optionsStore.options.display.components.hours){let t=document.createElement("div");t.setAttribute("title",this.optionsStore.options.localization.incrementHour);t.setAttribute("data-action",d.incrementHours);t.appendChild(n.cloneNode(true));s.push(t);t=document.createElement("div");t.setAttribute("title",this.optionsStore.options.localization.pickHour);t.setAttribute("data-action",d.showHours);t.setAttribute("data-time-component",e.hours);i.push(t);t=document.createElement("div");t.setAttribute("title",this.optionsStore.options.localization.decrementHour);t.setAttribute("data-action",d.decrementHours);t.appendChild(r.cloneNode(true));a.push(t);this._gridColumns+="a"}if(this.optionsStore.options.display.components.minutes){this._gridColumns+=" a";if(this.optionsStore.options.display.components.hours){s.push(getSeparator());i.push(getSeparator(true));a.push(getSeparator());this._gridColumns+=" a"}let t=document.createElement("div");t.setAttribute("title",this.optionsStore.options.localization.incrementMinute);t.setAttribute("data-action",d.incrementMinutes);t.appendChild(n.cloneNode(true));s.push(t);t=document.createElement("div");t.setAttribute("title",this.optionsStore.options.localization.pickMinute);t.setAttribute("data-action",d.showMinutes);t.setAttribute("data-time-component",e.minutes);i.push(t);t=document.createElement("div");t.setAttribute("title",this.optionsStore.options.localization.decrementMinute);t.setAttribute("data-action",d.decrementMinutes);t.appendChild(r.cloneNode(true));a.push(t)}if(this.optionsStore.options.display.components.seconds){this._gridColumns+=" a";if(this.optionsStore.options.display.components.minutes){s.push(getSeparator());i.push(getSeparator(true));a.push(getSeparator());this._gridColumns+=" a"}let t=document.createElement("div");t.setAttribute("title",this.optionsStore.options.localization.incrementSecond);t.setAttribute("data-action",d.incrementSeconds);t.appendChild(n.cloneNode(true));s.push(t);t=document.createElement("div");t.setAttribute("title",this.optionsStore.options.localization.pickSecond);t.setAttribute("data-action",d.showSeconds);t.setAttribute("data-time-component",e.seconds);i.push(t);t=document.createElement("div");t.setAttribute("title",this.optionsStore.options.localization.decrementSecond);t.setAttribute("data-action",d.decrementSeconds);t.appendChild(r.cloneNode(true));a.push(t)}if(!this.optionsStore.options.display.components.useTwentyfourHour){this._gridColumns+=" a";let e=getSeparator();s.push(e);let t=document.createElement("button");t.setAttribute("title",this.optionsStore.options.localization.toggleMeridiem);t.setAttribute("data-action",d.toggleMeridiem);t.setAttribute("tabindex","-1");Namespace.css.toggleMeridiem.includes(",")?t.classList.add(...Namespace.css.toggleMeridiem.split(",")):t.classList.add(Namespace.css.toggleMeridiem);e=document.createElement("div");e.classList.add(Namespace.css.noHighlight);e.appendChild(t);i.push(e);e=getSeparator();a.push(e)}this._gridColumns=this._gridColumns.trim();return[...s,...i,...a]}}class HourDisplay{constructor(){this.optionsStore=o.locate(OptionsStore);this.validation=o.locate(Validation)}getPicker(){const e=document.createElement("div");e.classList.add(Namespace.css.hourContainer);for(let t=0;t<(this.optionsStore.options.display.components.useTwentyfourHour?24:12);t++){const t=document.createElement("div");t.setAttribute("data-action",d.selectHour);e.appendChild(t)}return e}_update(t,s){const i=t.getElementsByClassName(Namespace.css.hourContainer)[0];let a=this.optionsStore.viewDate.clone.startOf(e.date);i.querySelectorAll(`[data-action="${d.selectHour}"]`).forEach((t=>{let i=[];i.push(Namespace.css.hour);this.validation.isValid(a,e.hours)||i.push(Namespace.css.disabled);s(e.hours,a,i,t);t.classList.remove(...t.classList);t.classList.add(...i);t.setAttribute("data-value",`${a.hours}`);t.innerText=this.optionsStore.options.display.components.useTwentyfourHour?a.hoursFormatted:a.twelveHoursFormatted;a.manipulate(1,e.hours)}))}}class MinuteDisplay{constructor(){this.optionsStore=o.locate(OptionsStore);this.validation=o.locate(Validation)}getPicker(){const e=document.createElement("div");e.classList.add(Namespace.css.minuteContainer);let t=1===this.optionsStore.options.stepping?5:this.optionsStore.options.stepping;for(let s=0;s<60/t;s++){const t=document.createElement("div");t.setAttribute("data-action",d.selectMinute);e.appendChild(t)}return e}_update(t,s){const i=t.getElementsByClassName(Namespace.css.minuteContainer)[0];let a=this.optionsStore.viewDate.clone.startOf(e.hours);let o=1===this.optionsStore.options.stepping?5:this.optionsStore.options.stepping;i.querySelectorAll(`[data-action="${d.selectMinute}"]`).forEach((t=>{let i=[];i.push(Namespace.css.minute);this.validation.isValid(a,e.minutes)||i.push(Namespace.css.disabled);s(e.minutes,a,i,t);t.classList.remove(...t.classList);t.classList.add(...i);t.setAttribute("data-value",`${a.minutes}`);t.innerText=a.minutesFormatted;a.manipulate(o,e.minutes)}))}}class secondDisplay{constructor(){this.optionsStore=o.locate(OptionsStore);this.validation=o.locate(Validation)}getPicker(){const e=document.createElement("div");e.classList.add(Namespace.css.secondContainer);for(let t=0;t<12;t++){const t=document.createElement("div");t.setAttribute("data-action",d.selectSecond);e.appendChild(t)}return e}_update(t,s){const i=t.getElementsByClassName(Namespace.css.secondContainer)[0];let a=this.optionsStore.viewDate.clone.startOf(e.minutes);i.querySelectorAll(`[data-action="${d.selectSecond}"]`).forEach((t=>{let i=[];i.push(Namespace.css.second);this.validation.isValid(a,e.seconds)||i.push(Namespace.css.disabled);s(e.seconds,a,i,t);t.classList.remove(...t.classList);t.classList.add(...i);t.setAttribute("data-value",`${a.seconds}`);t.innerText=a.secondsFormatted;a.manipulate(5,e.seconds)}))}}class Collapse{ | ||
|
|
|
236 | + /** | ||
|
|
|
237 | + * Flips the show/hide state of `target` | ||
|
|
|
238 | + * @param target html element to affect. | ||
|
|
|
239 | + */ | ||
|
|
|
240 | + static toggle(e){e.classList.contains(Namespace.css.show)?this.hide(e):this.show(e)} | ||
|
|
|
241 | + /** | ||
|
|
|
242 | + * Skips any animation or timeouts and immediately set the element to show. | ||
|
|
|
243 | + * @param target | ||
|
|
|
244 | + */static showImmediately(e){e.classList.remove(Namespace.css.collapsing);e.classList.add(Namespace.css.collapse,Namespace.css.show);e.style.height=""} | ||
|
|
|
245 | + /** | ||
|
|
|
246 | + * If `target` is not already showing, then show after the animation. | ||
|
|
|
247 | + * @param target | ||
|
|
|
248 | + */static show(e){if(e.classList.contains(Namespace.css.collapsing)||e.classList.contains(Namespace.css.show))return;const complete=()=>{Collapse.showImmediately(e)};e.style.height="0";e.classList.remove(Namespace.css.collapse);e.classList.add(Namespace.css.collapsing);setTimeout(complete,this.getTransitionDurationFromElement(e));e.style.height=`${e.scrollHeight}px`} | ||
|
|
|
249 | + /** | ||
|
|
|
250 | + * Skips any animation or timeouts and immediately set the element to hide. | ||
|
|
|
251 | + * @param target | ||
|
|
|
252 | + */static hideImmediately(e){if(e){e.classList.remove(Namespace.css.collapsing,Namespace.css.show);e.classList.add(Namespace.css.collapse)}} | ||
|
|
|
253 | + /** | ||
|
|
|
254 | + * If `target` is not already hidden, then hide after the animation. | ||
|
|
|
255 | + * @param target HTML Element | ||
|
|
|
256 | + */static hide(e){if(e.classList.contains(Namespace.css.collapsing)||!e.classList.contains(Namespace.css.show))return;const complete=()=>{Collapse.hideImmediately(e)};e.style.height=`${e.getBoundingClientRect().height}px`;const reflow=e=>e.offsetHeight;reflow(e);e.classList.remove(Namespace.css.collapse,Namespace.css.show);e.classList.add(Namespace.css.collapsing);e.style.height="";setTimeout(complete,this.getTransitionDurationFromElement(e))}} | ||
|
|
|
257 | + /** | ||
|
|
|
258 | + * Gets the transition duration from the `element` by getting css properties | ||
|
|
|
259 | + * `transition-duration` and `transition-delay` | ||
|
|
|
260 | + * @param element HTML Element | ||
|
|
|
261 | + */Collapse.getTransitionDurationFromElement=e=>{if(!e)return 0;let{transitionDuration:t,transitionDelay:s}=window.getComputedStyle(e);const i=Number.parseFloat(t);const a=Number.parseFloat(s);if(!i&&!a)return 0;t=t.split(",")[0];s=s.split(",")[0];return 1e3*(Number.parseFloat(t)+Number.parseFloat(s))};class Display{constructor(){this._isVisible=false; | ||
|
|
|
262 | + /** | ||
|
|
|
263 | + * A document click event to hide the widget if click is outside | ||
|
|
|
264 | + * @private | ||
|
|
|
265 | + * @param e MouseEvent | ||
|
|
|
266 | + */this._documentClickEvent=e=>{this.optionsStore.options.debug||window.debug||!this._isVisible||e.composedPath().includes(this.widget)||e.composedPath()?.includes(this.optionsStore.element)||this.hide()}; | ||
|
|
|
267 | + /** | ||
|
|
|
268 | + * Click event for any action like selecting a date | ||
|
|
|
269 | + * @param e MouseEvent | ||
|
|
|
270 | + * @private | ||
|
|
|
271 | + */this._actionsClickEvent=e=>{this._eventEmitters.action.emit({e:e})};this.optionsStore=o.locate(OptionsStore);this.validation=o.locate(Validation);this.dates=o.locate(Dates);this.dateDisplay=o.locate(DateDisplay);this.monthDisplay=o.locate(MonthDisplay);this.yearDisplay=o.locate(YearDisplay);this.decadeDisplay=o.locate(DecadeDisplay);this.timeDisplay=o.locate(TimeDisplay);this.hourDisplay=o.locate(HourDisplay);this.minuteDisplay=o.locate(MinuteDisplay);this.secondDisplay=o.locate(secondDisplay);this._eventEmitters=o.locate(EventEmitters);this._widget=void 0;this._eventEmitters.updateDisplay.subscribe((e=>{this._update(e)}))}get widget(){return this._widget}get isVisible(){return this._isVisible} | ||
|
|
|
272 | + /** | ||
|
|
|
273 | + * Updates the table for a particular unit. Used when an option as changed or | ||
|
|
|
274 | + * whenever the class list might need to be refreshed. | ||
|
|
|
275 | + * @param unit | ||
|
|
|
276 | + * @private | ||
|
|
|
277 | + */_update(t){if(this.widget)switch(t){case e.seconds:this.secondDisplay._update(this.widget,this.paint);break;case e.minutes:this.minuteDisplay._update(this.widget,this.paint);break;case e.hours:this.hourDisplay._update(this.widget,this.paint);break;case e.date:this.dateDisplay._update(this.widget,this.paint);break;case e.month:this.monthDisplay._update(this.widget,this.paint);break;case e.year:this.yearDisplay._update(this.widget,this.paint);break;case"clock":if(!this._hasTime)break;this.timeDisplay._update(this.widget);this._update(e.hours);this._update(e.minutes);this._update(e.seconds);break;case"calendar":this._update(e.date);this._update(e.year);this._update(e.month);this.decadeDisplay._update(this.widget,this.paint);this._updateCalendarHeader();break;case"all":this._hasTime&&this._update("clock");this._hasDate&&this._update("calendar")}} | ||
|
|
|
278 | + /** | ||
|
|
|
279 | + * Allows developers to add/remove classes from an element. | ||
|
|
|
280 | + * @param _unit | ||
|
|
|
281 | + * @param _date | ||
|
|
|
282 | + * @param _classes | ||
|
|
|
283 | + * @param _element | ||
|
|
|
284 | + */ | ||
|
|
|
285 | + paint(e,t,s,i){}show(){if(void 0==this.widget){if(0==this.dates.picked.length){if(this.optionsStore.options.useCurrent&&!this.optionsStore.options.defaultDate){const t=(new DateTime).setLocale(this.optionsStore.options.localization.locale);if(!this.optionsStore.options.keepInvalid){let s=0;let i=1;this.optionsStore.options.restrictions.maxDate?.isBefore(t)&&(i=-1);while(!this.validation.isValid(t)){t.manipulate(i,e.date);if(s>31)break;s++}}this.dates.setValue(t)}this.optionsStore.options.defaultDate&&this.dates.setValue(this.optionsStore.options.defaultDate)}this._buildWidget();this._updateTheme();const t=this._hasTime&&!this._hasDate;if(t){this.optionsStore.currentView="clock";this._eventEmitters.action.emit({e:null,action:d.showClock})}this.optionsStore.currentCalendarViewMode||(this.optionsStore.currentCalendarViewMode=this.optionsStore.minimumCalendarViewMode);if(!t&&"clock"!==this.optionsStore.options.display.viewMode){this._hasTime&&(this.optionsStore.options.display.sideBySide?Collapse.show(this.widget.querySelector(`div.${Namespace.css.timeContainer}`)):Collapse.hideImmediately(this.widget.querySelector(`div.${Namespace.css.timeContainer}`)));Collapse.show(this.widget.querySelector(`div.${Namespace.css.dateContainer}`))}this._hasDate&&this._showMode();if(this.optionsStore.options.display.inline)this.optionsStore.element.appendChild(this.widget);else{const e=this.optionsStore.options?.container||document.body;e.appendChild(this.widget);this.createPopup(this.optionsStore.element,this.widget,{modifiers:[{name:"eventListeners",enabled:true}],placement:"rtl"===document.documentElement.dir?"bottom-end":"bottom-start"}).then()}"clock"==this.optionsStore.options.display.viewMode&&this._eventEmitters.action.emit({e:null,action:d.showClock});this.widget.querySelectorAll("[data-action]").forEach((e=>e.addEventListener("click",this._actionsClickEvent)));if(this._hasTime&&this.optionsStore.options.display.sideBySide){this.timeDisplay._update(this.widget);this.widget.getElementsByClassName(Namespace.css.clockContainer)[0].style.display="grid"}}this.widget.classList.add(Namespace.css.show);if(!this.optionsStore.options.display.inline){this.updatePopup();document.addEventListener("click",this._documentClickEvent)}this._eventEmitters.triggerEvent.emit({type:Namespace.events.show});this._isVisible=true}async createPopup(e,t,s){let i;if(window?.Popper)i=window?.Popper?.createPopper;else{const{createPopper:e}=await import("@popperjs/core");i=e}i&&(this._popperInstance=i(e,t,s))}updatePopup(){this._popperInstance?.update()} | ||
|
|
|
286 | + /** | ||
|
|
|
287 | + * Changes the calendar view mode. E.g. month <-> year | ||
|
|
|
288 | + * @param direction -/+ number to move currentViewMode | ||
|
|
|
289 | + * @private | ||
|
|
|
290 | + */_showMode(e){if(!this.widget)return;if(e){const t=Math.max(this.optionsStore.minimumCalendarViewMode,Math.min(3,this.optionsStore.currentCalendarViewMode+e));if(this.optionsStore.currentCalendarViewMode==t)return;this.optionsStore.currentCalendarViewMode=t}this.widget.querySelectorAll(`.${Namespace.css.dateContainer} > div:not(.${Namespace.css.calendarHeader}), .${Namespace.css.timeContainer} > div:not(.${Namespace.css.clockContainer})`).forEach((e=>e.style.display="none"));const t=n[this.optionsStore.currentCalendarViewMode];let s=this.widget.querySelector(`.${t.className}`);switch(t.className){case Namespace.css.decadesContainer:this.decadeDisplay._update(this.widget,this.paint);break;case Namespace.css.yearsContainer:this.yearDisplay._update(this.widget,this.paint);break;case Namespace.css.monthsContainer:this.monthDisplay._update(this.widget,this.paint);break;case Namespace.css.daysContainer:this.dateDisplay._update(this.widget,this.paint);break}s.style.display="grid";this._updateCalendarHeader();this._eventEmitters.viewUpdate.emit()} | ||
|
|
|
291 | + /** | ||
|
|
|
292 | + * Changes the theme. E.g. light, dark or auto | ||
|
|
|
293 | + * @param theme the theme name | ||
|
|
|
294 | + * @private | ||
|
|
|
295 | + */_updateTheme(e){if(this.widget){if(e){if(this.optionsStore.options.display.theme===e)return;this.optionsStore.options.display.theme=e}this.widget.classList.remove("light","dark");this.widget.classList.add(this._getThemeClass());"auto"===this.optionsStore.options.display.theme?window.matchMedia(Namespace.css.isDarkPreferredQuery).addEventListener("change",(()=>this._updateTheme())):window.matchMedia(Namespace.css.isDarkPreferredQuery).removeEventListener("change",(()=>this._updateTheme()))}}_getThemeClass(){const e=this.optionsStore.options.display.theme||"auto";const t=window.matchMedia&&window.matchMedia(Namespace.css.isDarkPreferredQuery).matches;switch(e){case"light":return Namespace.css.lightTheme;case"dark":return Namespace.css.darkTheme;case"auto":return t?Namespace.css.darkTheme:Namespace.css.lightTheme}}_updateCalendarHeader(){const e=[...this.widget.querySelector(`.${Namespace.css.dateContainer} div[style*="display: grid"]`).classList].find((e=>e.startsWith(Namespace.css.dateContainer)));const[t,s,i]=this.widget.getElementsByClassName(Namespace.css.calendarHeader)[0].getElementsByTagName("div");switch(e){case Namespace.css.decadesContainer:t.setAttribute("title",this.optionsStore.options.localization.previousCentury);s.setAttribute("title","");i.setAttribute("title",this.optionsStore.options.localization.nextCentury);break;case Namespace.css.yearsContainer:t.setAttribute("title",this.optionsStore.options.localization.previousDecade);s.setAttribute("title",this.optionsStore.options.localization.selectDecade);i.setAttribute("title",this.optionsStore.options.localization.nextDecade);break;case Namespace.css.monthsContainer:t.setAttribute("title",this.optionsStore.options.localization.previousYear);s.setAttribute("title",this.optionsStore.options.localization.selectYear);i.setAttribute("title",this.optionsStore.options.localization.nextYear);break;case Namespace.css.daysContainer:t.setAttribute("title",this.optionsStore.options.localization.previousMonth);s.setAttribute("title",this.optionsStore.options.localization.selectMonth);i.setAttribute("title",this.optionsStore.options.localization.nextMonth);s.innerText=this.optionsStore.viewDate.format(this.optionsStore.options.localization.dayViewHeaderFormat);break}s.innerText=s.getAttribute(e)}hide(){if(this.widget&&this._isVisible){this.widget.classList.remove(Namespace.css.show);if(this._isVisible){this._eventEmitters.triggerEvent.emit({type:Namespace.events.hide,date:this.optionsStore.unset?null:this.dates.lastPicked?this.dates.lastPicked.clone:void 0});this._isVisible=false}document.removeEventListener("click",this._documentClickEvent)}}toggle(){return this._isVisible?this.hide():this.show()}_dispose(){document.removeEventListener("click",this._documentClickEvent);if(this.widget){this.widget.querySelectorAll("[data-action]").forEach((e=>e.removeEventListener("click",this._actionsClickEvent)));this.widget.parentNode.removeChild(this.widget);this._widget=void 0}}_buildWidget(){const e=document.createElement("div");e.classList.add(Namespace.css.widget);const t=document.createElement("div");t.classList.add(Namespace.css.dateContainer);t.append(this.getHeadTemplate(),this.decadeDisplay.getPicker(),this.yearDisplay.getPicker(),this.monthDisplay.getPicker(),this.dateDisplay.getPicker());const s=document.createElement("div");s.classList.add(Namespace.css.timeContainer);s.appendChild(this.timeDisplay.getPicker(this._iconTag.bind(this)));s.appendChild(this.hourDisplay.getPicker());s.appendChild(this.minuteDisplay.getPicker());s.appendChild(this.secondDisplay.getPicker());const i=document.createElement("div");i.classList.add(Namespace.css.toolbar);i.append(...this.getToolbarElements());this.optionsStore.options.display.inline&&e.classList.add(Namespace.css.inline);this.optionsStore.options.display.calendarWeeks&&e.classList.add("calendarWeeks");if(this.optionsStore.options.display.sideBySide&&this._hasDate&&this._hasTime){e.classList.add(Namespace.css.sideBySide);"top"===this.optionsStore.options.display.toolbarPlacement&&e.appendChild(i);const a=document.createElement("div");a.classList.add("td-row");t.classList.add("td-half");s.classList.add("td-half");a.appendChild(t);a.appendChild(s);e.appendChild(a);"bottom"===this.optionsStore.options.display.toolbarPlacement&&e.appendChild(i);this._widget=e;return}"top"===this.optionsStore.options.display.toolbarPlacement&&e.appendChild(i);if(this._hasDate){if(this._hasTime){t.classList.add(Namespace.css.collapse);"clock"!==this.optionsStore.options.display.viewMode&&t.classList.add(Namespace.css.show)}e.appendChild(t)}if(this._hasTime){if(this._hasDate){s.classList.add(Namespace.css.collapse);"clock"===this.optionsStore.options.display.viewMode&&s.classList.add(Namespace.css.show)}e.appendChild(s)}"bottom"===this.optionsStore.options.display.toolbarPlacement&&e.appendChild(i);const a=document.createElement("div");a.classList.add("arrow");a.setAttribute("data-popper-arrow","");e.appendChild(a);this._widget=e}get _hasTime(){return this.optionsStore.options.display.components.clock&&(this.optionsStore.options.display.components.hours||this.optionsStore.options.display.components.minutes||this.optionsStore.options.display.components.seconds)}get _hasDate(){return this.optionsStore.options.display.components.calendar&&(this.optionsStore.options.display.components.year||this.optionsStore.options.display.components.month||this.optionsStore.options.display.components.date)}getToolbarElements(){const e=[];if(this.optionsStore.options.display.buttons.today){const t=document.createElement("div");t.setAttribute("data-action",d.today);t.setAttribute("title",this.optionsStore.options.localization.today);t.appendChild(this._iconTag(this.optionsStore.options.display.icons.today));e.push(t)}if(!this.optionsStore.options.display.sideBySide&&this._hasDate&&this._hasTime){let t,s;if("clock"===this.optionsStore.options.display.viewMode){t=this.optionsStore.options.localization.selectDate;s=this.optionsStore.options.display.icons.date}else{t=this.optionsStore.options.localization.selectTime;s=this.optionsStore.options.display.icons.time}const i=document.createElement("div");i.setAttribute("data-action",d.togglePicker);i.setAttribute("title",t);i.appendChild(this._iconTag(s));e.push(i)}if(this.optionsStore.options.display.buttons.clear){const t=document.createElement("div");t.setAttribute("data-action",d.clear);t.setAttribute("title",this.optionsStore.options.localization.clear);t.appendChild(this._iconTag(this.optionsStore.options.display.icons.clear));e.push(t)}if(this.optionsStore.options.display.buttons.close){const t=document.createElement("div");t.setAttribute("data-action",d.close);t.setAttribute("title",this.optionsStore.options.localization.close);t.appendChild(this._iconTag(this.optionsStore.options.display.icons.close));e.push(t)}return e}getHeadTemplate(){const e=document.createElement("div");e.classList.add(Namespace.css.calendarHeader);const t=document.createElement("div");t.classList.add(Namespace.css.previous);t.setAttribute("data-action",d.previous);t.appendChild(this._iconTag(this.optionsStore.options.display.icons.previous));const s=document.createElement("div");s.classList.add(Namespace.css.switch);s.setAttribute("data-action",d.changeCalendarView);const i=document.createElement("div");i.classList.add(Namespace.css.next);i.setAttribute("data-action",d.next);i.appendChild(this._iconTag(this.optionsStore.options.display.icons.next));e.append(t,s,i);return e} | ||
|
|
|
296 | + /** | ||
|
|
|
297 | + * Builds an icon tag as either an `<i>` | ||
|
|
|
298 | + * or with icons.type is `sprites` then a svg tag instead | ||
|
|
|
299 | + * @param iconClass | ||
|
|
|
300 | + * @private | ||
|
|
|
301 | + */_iconTag(e){if("sprites"===this.optionsStore.options.display.icons.type){const t=document.createElementNS("http://www.w3.org/2000/svg","svg");const s=document.createElementNS("http://www.w3.org/2000/svg","use");s.setAttribute("xlink:href",e);s.setAttribute("href",e);t.appendChild(s);return t}const t=document.createElement("i");t.classList.add(...e.split(" "));return t}_rebuild(){const e=this._isVisible;e&&this.hide();this._dispose();e&&this.show()}}class Actions{constructor(){this.optionsStore=o.locate(OptionsStore);this.dates=o.locate(Dates);this.validation=o.locate(Validation);this.display=o.locate(Display);this._eventEmitters=o.locate(EventEmitters);this._eventEmitters.action.subscribe((e=>{this.do(e.e,e.action)}))} | ||
|
|
|
302 | + /** | ||
|
|
|
303 | + * Performs the selected `action`. See ActionTypes | ||
|
|
|
304 | + * @param e This is normally a click event | ||
|
|
|
305 | + * @param action If not provided, then look for a [data-action] | ||
|
|
|
306 | + */do(t,s){const i=t?.currentTarget;if(i?.classList?.contains(Namespace.css.disabled))return false;s=s||i?.dataset?.action;const a=(this.dates.lastPicked||this.optionsStore.viewDate).clone;switch(s){case d.next:case d.previous:this.handleNextPrevious(s);break;case d.changeCalendarView:this.display._showMode(1);this.display._updateCalendarHeader();break;case d.selectMonth:case d.selectYear:case d.selectDecade:const o=+i.dataset.value;switch(s){case d.selectMonth:this.optionsStore.viewDate.month=o;break;case d.selectYear:case d.selectDecade:this.optionsStore.viewDate.year=o;break}if(this.optionsStore.currentCalendarViewMode===this.optionsStore.minimumCalendarViewMode){this.dates.setValue(this.optionsStore.viewDate,this.dates.lastPickedIndex);this.optionsStore.options.display.inline||this.display.hide()}else this.display._showMode(-1);break;case d.selectDay:const n=this.optionsStore.viewDate.clone;i.classList.contains(Namespace.css.old)&&n.manipulate(-1,e.month);i.classList.contains(Namespace.css.new)&&n.manipulate(1,e.month);n.date=+i.dataset.day;let r=0;if(this.optionsStore.options.multipleDates){r=this.dates.pickedIndex(n,e.date);-1!==r?this.dates.setValue(null,r):this.dates.setValue(n,this.dates.lastPickedIndex+1)}else this.dates.setValue(n,this.dates.lastPickedIndex);this.display._hasTime||this.optionsStore.options.display.keepOpen||this.optionsStore.options.display.inline||this.optionsStore.options.multipleDates||this.display.hide();break;case d.selectHour:let c=+i.dataset.value;a.hours>=12&&!this.optionsStore.options.display.components.useTwentyfourHour&&(c+=12);a.hours=c;this.dates.setValue(a,this.dates.lastPickedIndex);this.hideOrClock(t);break;case d.selectMinute:a.minutes=+i.dataset.value;this.dates.setValue(a,this.dates.lastPickedIndex);this.hideOrClock(t);break;case d.selectSecond:a.seconds=+i.dataset.value;this.dates.setValue(a,this.dates.lastPickedIndex);this.hideOrClock(t);break;case d.incrementHours:this.manipulateAndSet(a,e.hours);break;case d.incrementMinutes:this.manipulateAndSet(a,e.minutes,this.optionsStore.options.stepping);break;case d.incrementSeconds:this.manipulateAndSet(a,e.seconds);break;case d.decrementHours:this.manipulateAndSet(a,e.hours,-1);break;case d.decrementMinutes:this.manipulateAndSet(a,e.minutes,-1*this.optionsStore.options.stepping);break;case d.decrementSeconds:this.manipulateAndSet(a,e.seconds,-1);break;case d.toggleMeridiem:this.manipulateAndSet(a,e.hours,this.dates.lastPicked.hours>=12?-12:12);break;case d.togglePicker:if(i.getAttribute("title")===this.optionsStore.options.localization.selectDate){i.setAttribute("title",this.optionsStore.options.localization.selectTime);i.innerHTML=this.display._iconTag(this.optionsStore.options.display.icons.time).outerHTML;this.display._updateCalendarHeader();this.optionsStore.refreshCurrentView()}else{i.setAttribute("title",this.optionsStore.options.localization.selectDate);i.innerHTML=this.display._iconTag(this.optionsStore.options.display.icons.date).outerHTML;if(this.display._hasTime){this.handleShowClockContainers(d.showClock);this.display._update("clock")}}this.display.widget.querySelectorAll(`.${Namespace.css.dateContainer}, .${Namespace.css.timeContainer}`).forEach((e=>Collapse.toggle(e)));this._eventEmitters.viewUpdate.emit();break;case d.showClock:case d.showHours:case d.showMinutes:case d.showSeconds:if(!this.optionsStore.options.display.sideBySide&&"clock"!==this.optionsStore.currentView){Collapse.hideImmediately(this.display.widget.querySelector(`div.${Namespace.css.dateContainer}`));Collapse.showImmediately(this.display.widget.querySelector(`div.${Namespace.css.timeContainer}`))}this.handleShowClockContainers(s);break;case d.clear:this.dates.setValue(null);this.display._updateCalendarHeader();break;case d.close:this.display.hide();break;case d.today:const l=(new DateTime).setLocale(this.optionsStore.options.localization.locale);this.optionsStore.viewDate=l;this.validation.isValid(l,e.date)&&this.dates.setValue(l,this.dates.lastPickedIndex);break}}handleShowClockContainers(t){if(!this.display._hasTime){Namespace.errorMessages.throwError("Cannot show clock containers when time is disabled.");return}this.optionsStore.currentView="clock";this.display.widget.querySelectorAll(`.${Namespace.css.timeContainer} > div`).forEach((e=>e.style.display="none"));let s="";switch(t){case d.showClock:s=Namespace.css.clockContainer;this.display._update("clock");break;case d.showHours:s=Namespace.css.hourContainer;this.display._update(e.hours);break;case d.showMinutes:s=Namespace.css.minuteContainer;this.display._update(e.minutes);break;case d.showSeconds:s=Namespace.css.secondContainer;this.display._update(e.seconds);break}this.display.widget.getElementsByClassName(s)[0].style.display="grid"}handleNextPrevious(e){const{unit:t,step:s}=n[this.optionsStore.currentCalendarViewMode];e===d.next?this.optionsStore.viewDate.manipulate(s,t):this.optionsStore.viewDate.manipulate(-1*s,t);this._eventEmitters.viewUpdate.emit();this.display._showMode()} | ||
|
|
|
307 | + /** | ||
|
|
|
308 | + * After setting the value it will either show the clock or hide the widget. | ||
|
|
|
309 | + * @param e | ||
|
|
|
310 | + */hideOrClock(e){!this.optionsStore.options.display.components.useTwentyfourHour||this.optionsStore.options.display.components.minutes||this.optionsStore.options.display.keepOpen||this.optionsStore.options.display.inline?this.do(e,d.showClock):this.display.hide()} | ||
|
|
|
311 | + /** | ||
|
|
|
312 | + * Common function to manipulate {@link lastPicked} by `unit`. | ||
|
|
|
313 | + * @param lastPicked | ||
|
|
|
314 | + * @param unit | ||
|
|
|
315 | + * @param value Value to change by | ||
|
|
|
316 | + */manipulateAndSet(e,t,s=1){const i=e.manipulate(s,t);this.validation.isValid(i,t)&&this.dates.setValue(i,this.dates.lastPickedIndex)}}class TempusDominus{constructor(e,t={}){this._subscribers={};this._isDisabled=false;this._inputChangeEvent=e=>{const t=e?.detail;if(t)return;const setViewDate=()=>{this.dates.lastPicked&&(this.optionsStore.viewDate=this.dates.lastPicked.clone)};const s=this.optionsStore.input.value;if(this.optionsStore.options.multipleDates)try{const e=s.split(this.optionsStore.options.multipleDatesSeparator);for(let t=0;t<e.length;t++)this.dates.setFromInput(e[t],t);setViewDate()}catch{console.warn("TD: Something went wrong trying to set the multipleDates values from the input field.")}else{this.dates.setFromInput(s,0);setViewDate()}};this._toggleClickEvent=()=>{this.optionsStore.element?.disabled||this.optionsStore.input?.disabled||this.toggle()};setupServiceLocator();this._eventEmitters=o.locate(EventEmitters);this.optionsStore=o.locate(OptionsStore);this.display=o.locate(Display);this.dates=o.locate(Dates);this.actions=o.locate(Actions);e||Namespace.errorMessages.mustProvideElement();this.optionsStore.element=e;this._initializeOptions(t,r,true);this.optionsStore.viewDate.setLocale(this.optionsStore.options.localization.locale);this.optionsStore.unset=true;this._initializeInput();this._initializeToggle();this.optionsStore.options.display.inline&&this.display.show();this._eventEmitters.triggerEvent.subscribe((e=>{this._triggerEvent(e)}));this._eventEmitters.viewUpdate.subscribe((()=>{this._viewUpdate()}))}get viewDate(){return this.optionsStore.viewDate} | ||
|
|
|
317 | + /** | ||
|
|
|
318 | + * Update the picker options. If `reset` is provide `options` will be merged with DefaultOptions instead. | ||
|
|
|
319 | + * @param options | ||
|
|
|
320 | + * @param reset | ||
|
|
|
321 | + * @public | ||
|
|
|
322 | + */ | ||
|
|
|
323 | + updateOptions(e,t=false){t?this._initializeOptions(e,r):this._initializeOptions(e,this.optionsStore.options);this.display._rebuild()}toggle(){this._isDisabled||this.display.toggle()}show(){this._isDisabled||this.display.show()}hide(){this.display.hide()}disable(){this._isDisabled=true;this.optionsStore.input?.setAttribute("disabled","disabled");this.display.hide()}enable(){this._isDisabled=false;this.optionsStore.input?.removeAttribute("disabled")}clear(){this.optionsStore.input.value="";this.dates.clear()} | ||
|
|
|
324 | + /** | ||
|
|
|
325 | + * Allows for a direct subscription to picker events, without having to use addEventListener on the element. | ||
|
|
|
326 | + * @param eventTypes See Namespace.Events | ||
|
|
|
327 | + * @param callbacks Function to call when event is triggered | ||
|
|
|
328 | + * @public | ||
|
|
|
329 | + */ | ||
|
|
|
330 | + subscribe(e,t){"string"===typeof e&&(e=[e]);let s;s=Array.isArray(t)?t:[t];e.length!==s.length&&Namespace.errorMessages.subscribeMismatch();const i=[];for(let t=0;t<e.length;t++){const a=e[t];Array.isArray(this._subscribers[a])||(this._subscribers[a]=[]);this._subscribers[a].push(s[t]);i.push({unsubscribe:this._unsubscribe.bind(this,a,this._subscribers[a].length-1)});if(1===e.length)return i[0]}return i}dispose(){this.display.hide();this.display._dispose();this.optionsStore.input?.removeEventListener("change",this._inputChangeEvent);this.optionsStore.options.allowInputToggle&&this.optionsStore.input?.removeEventListener("click",this._toggleClickEvent);this._toggle?.removeEventListener("click",this._toggleClickEvent);this._subscribers={}} | ||
|
|
|
331 | + /** | ||
|
|
|
332 | + * Updates the options to use the provided language. | ||
|
|
|
333 | + * THe language file must be loaded first. | ||
|
|
|
334 | + * @param language | ||
|
|
|
335 | + */locale(e){let t=l[e];t&&this.updateOptions({localization:t})} | ||
|
|
|
336 | + /** | ||
|
|
|
337 | + * Triggers an event like ChangeEvent when the picker has updated the value | ||
|
|
|
338 | + * of a selected date. | ||
|
|
|
339 | + * @param event Accepts a BaseEvent object. | ||
|
|
|
340 | + * @private | ||
|
|
|
341 | + */_triggerEvent(e){e.viewMode=this.optionsStore.currentView;const t=e.type===Namespace.events.change;if(t){const{date:t,oldDate:s,isClear:i}=e;if(t&&s&&t.isSame(s)||!i&&!t&&!s)return;this._handleAfterChangeEvent(e);this.optionsStore.input?.dispatchEvent(new CustomEvent(e.type,{detail:e}));this.optionsStore.input?.dispatchEvent(new CustomEvent("change",{detail:e}))}this.optionsStore.element.dispatchEvent(new CustomEvent(e.type,{detail:e}));if(window.jQuery){const s=window.jQuery;t&&this.optionsStore.input?s(this.optionsStore.input).trigger(e):s(this.optionsStore.element).trigger(e)}this._publish(e)}_publish(e){Array.isArray(this._subscribers[e.type])&&this._subscribers[e.type].forEach((t=>{t(e)}))}_viewUpdate(){this._triggerEvent({type:Namespace.events.update,viewDate:this.optionsStore.viewDate.clone})}_unsubscribe(e,t){this._subscribers[e].splice(t,1)} | ||
|
|
|
342 | + /** | ||
|
|
|
343 | + * Merges two Option objects together and validates options type | ||
|
|
|
344 | + * @param config new Options | ||
|
|
|
345 | + * @param mergeTo Options to merge into | ||
|
|
|
346 | + * @param includeDataset When true, the elements data-td attributes will be included in the | ||
|
|
|
347 | + * @private | ||
|
|
|
348 | + */_initializeOptions(e,t,s=false){let i=OptionConverter.deepCopy(e);i=OptionConverter._mergeOptions(i,t);s&&(i=OptionConverter._dataToOptions(this.optionsStore.element,i));OptionConverter._validateConflicts(i);i.viewDate=i.viewDate.setLocale(i.localization.locale);this.optionsStore.viewDate.isSame(i.viewDate)||(this.optionsStore.viewDate=i.viewDate);i.display.components.year&&(this.optionsStore.minimumCalendarViewMode=2);i.display.components.month&&(this.optionsStore.minimumCalendarViewMode=1);i.display.components.date&&(this.optionsStore.minimumCalendarViewMode=0);this.optionsStore.currentCalendarViewMode=Math.max(this.optionsStore.minimumCalendarViewMode,this.optionsStore.currentCalendarViewMode);n[this.optionsStore.currentCalendarViewMode].name!==i.display.viewMode&&(this.optionsStore.currentCalendarViewMode=Math.max(n.findIndex((e=>e.name===i.display.viewMode)),this.optionsStore.minimumCalendarViewMode));this.display?.isVisible&&this.display._update("all");void 0===i.display.components.useTwentyfourHour&&(i.display.components.useTwentyfourHour=!!!i.viewDate.parts()?.dayPeriod);this.optionsStore.options=i}_initializeInput(){if("INPUT"==this.optionsStore.element.tagName)this.optionsStore.input=this.optionsStore.element;else{let e=this.optionsStore.element.dataset.tdTargetInput;this.optionsStore.input=void 0==e||"nearest"==e?this.optionsStore.element.querySelector("input"):this.optionsStore.element.querySelector(e)}if(this.optionsStore.input){this.optionsStore.input.addEventListener("change",this._inputChangeEvent);this.optionsStore.options.allowInputToggle&&this.optionsStore.input.addEventListener("click",this._toggleClickEvent);this.optionsStore.input.value&&this._inputChangeEvent()}}_initializeToggle(){if(this.optionsStore.options.display.inline)return;let e=this.optionsStore.element.dataset.tdTargetToggle;"nearest"==e&&(e='[data-td-toggle="datetimepicker"]');this._toggle=void 0==e?this.optionsStore.element:this.optionsStore.element.querySelector(e);this._toggle.addEventListener("click",this._toggleClickEvent)} | ||
|
|
|
349 | + /** | ||
|
|
|
350 | + * If the option is enabled this will render the clock view after a date pick. | ||
|
|
|
351 | + * @param e change event | ||
|
|
|
352 | + * @private | ||
|
|
|
353 | + */_handleAfterChangeEvent(e){if(this.optionsStore.options.promptTimeOnDateChange&&!this.optionsStore.options.display.inline&&!this.optionsStore.options.display.sideBySide&&this.display._hasTime&&!this.display.widget?.getElementsByClassName(Namespace.css.show)[0].classList.contains(Namespace.css.timeContainer)&&!(!e.oldDate&&this.optionsStore.options.useCurrent||e.oldDate&&e.date?.isSame(e.oldDate))){clearTimeout(this._currentPromptTimeTimeout);this._currentPromptTimeTimeout=setTimeout((()=>{this.display.widget&&this._eventEmitters.action.emit({e:{currentTarget:this.display.widget.querySelector(`.${Namespace.css.switch} div`)},action:d.togglePicker})}),this.optionsStore.options.promptTimeOnDateChangeTransitionDelay)}}}const l={}; | ||
|
|
|
354 | + /** | ||
|
|
|
355 | + * Called from a locale plugin. | ||
|
|
|
356 | + * @param l locale object for localization options | ||
|
|
|
357 | + */const loadLocale=e=>{l[e.name]||(l[e.name]=e.localization)}; | ||
|
|
|
358 | + /** | ||
|
|
|
359 | + * A sets the global localization options to the provided locale name. | ||
|
|
|
360 | + * `loadLocale` MUST be called first. | ||
|
|
|
361 | + * @param l | ||
|
|
|
362 | + */const locale=e=>{let t=l[e];t&&(r.localization=t)}; | ||
|
|
|
363 | + /** | ||
|
|
|
364 | + * Called from a plugin to extend or override picker defaults. | ||
|
|
|
365 | + * @param plugin | ||
|
|
|
366 | + * @param option | ||
|
|
|
367 | + */const extend=function(e,t){if(!e)return h;if(!e.installed){e(t,{TempusDominus:TempusDominus,Dates:Dates,Display:Display,DateTime:DateTime,ErrorMessages:ErrorMessages},h);e.installed=true}return h};const p="6.2.4";const h={TempusDominus:TempusDominus,extend:extend,loadLocale:loadLocale,locale:locale,Namespace:Namespace,DefaultOptions:r,DateTime:DateTime,Unit:e,version:p};export{DateTime,r as DefaultOptions,Namespace,TempusDominus,e as Unit,extend,loadLocale,locale,p as version}; | ||
|
|
|
368 | + | ||
| @@ -42,6 +42,7 | |||||
|
|
42 | //new import |
|
42 | //new import |
|
|
43 | @import 'datatables/datatables.min'; |
|
43 | @import 'datatables/datatables.min'; |
|
|
44 | @import 'material_icons'; |
|
44 | @import 'material_icons'; |
|
|
|
45 | + @import 'tempus-dominus/tempus-dominus'; | ||
|
|
45 |
|
46 | ||
|
|
46 | //bootstrap navbar color (from) |
|
47 | //bootstrap navbar color (from) |
|
|
47 | /* |
|
48 | /* |
| @@ -4,13 +4,24 | |||||
|
|
4 | } |
|
4 | } |
|
|
5 |
|
5 | ||
|
|
6 |
|
6 | ||
|
|
7 |
- //for google material |
|
7 | + //for google material icon |
|
|
8 | .mi-bs { |
|
8 | .mi-bs { |
|
|
9 | vertical-align: middle; |
|
9 | vertical-align: middle; |
|
|
10 | position: relative; |
|
10 | position: relative; |
|
|
11 | top: -3px; |
|
11 | top: -3px; |
|
|
12 | } |
|
12 | } |
|
|
13 |
|
13 | ||
|
|
|
14 | + //for use google material icon with Tempus Dominus | ||
|
|
|
15 | + .mi-td-time:after { content: 'schedule'; } | ||
|
|
|
16 | + .mi-td-date:after { content: 'date_range'; } | ||
|
|
|
17 | + .mi-td-up:after { content: 'arrow_upward'; } | ||
|
|
|
18 | + .mi-td-down:after { content: 'arrow_downward'; } | ||
|
|
|
19 | + .mi-td-previous:after { content: 'arrow_back'; } | ||
|
|
|
20 | + .mi-td-next:after { content: 'arrow_forward'; } | ||
|
|
|
21 | + .mi-td-today:after { content: 'today'; } | ||
|
|
|
22 | + .mi-td-clear:after { content: 'delete'; } | ||
|
|
|
23 | + .mi-td-close:after { content: 'cancel'; } | ||
|
|
|
24 | + | ||
|
|
14 | // --------------- bootstrap file upload ---------------------- |
|
25 | // --------------- bootstrap file upload ---------------------- |
|
|
15 | .btn-file { |
|
26 | .btn-file { |
|
|
16 | position: relative; |
|
27 | position: relative; |
| @@ -45,6 +45,8 | |||||
|
|
45 |
|
45 | ||
|
|
46 | import "select2" |
|
46 | import "select2" |
|
|
47 | import "chart" |
|
47 | import "chart" |
|
|
|
48 | + import { TempusDominus } from "@eonasdan/tempus-dominus" | ||
|
|
|
49 | + window.TempusDominus = TempusDominus | ||
|
|
48 |
|
50 | ||
|
|
49 | //my own customization |
|
51 | //my own customization |
|
|
50 | import 'custom' |
|
52 | import 'custom' |
| @@ -10,8 +10,6 | |||||
|
|
10 | var e; |
|
10 | var e; |
|
|
11 | $(".select2").select2({ |
|
11 | $(".select2").select2({ |
|
|
12 | theme: "bootstrap-5", |
|
12 | theme: "bootstrap-5", |
|
|
13 | - //selectionCssClass: "select2--small", |
|
||
|
|
14 | - //dropdownCssClass: "select2--small", |
|
||
|
|
15 |
|
|
13 | }); |
|
|
16 |
|
14 | ||
|
|
17 | $('.btn-file :file').on('fileselect', function(event, numFiles, label) { |
|
15 | $('.btn-file :file').on('fileselect', function(event, numFiles, label) { |
| @@ -42,4 +40,38 | |||||
|
|
42 | } |
|
40 | } |
|
|
43 |
|
41 | ||
|
|
44 | //jQuery(".best_in_place").best_in_place(); |
|
42 | //jQuery(".best_in_place").best_in_place(); |
|
|
|
43 | + | ||
|
|
|
44 | + //default options for tempus dominus | ||
|
|
|
45 | + window.default_td_options = { | ||
|
|
|
46 | + display: { | ||
|
|
|
47 | + icons: { | ||
|
|
|
48 | + time: 'mi mi-td-time', | ||
|
|
|
49 | + date: 'mi mi-td-date', | ||
|
|
|
50 | + up: 'mi mi-td-up', | ||
|
|
|
51 | + down: 'mi mi-td-down', | ||
|
|
|
52 | + previous: 'mi mi-td-previous', | ||
|
|
|
53 | + next: 'mi mi-td-next', | ||
|
|
|
54 | + today: 'mi mi-td-today', | ||
|
|
|
55 | + clear: 'mi mi-td-clear', | ||
|
|
|
56 | + close: 'mi mi-td-close', | ||
|
|
|
57 | + }, | ||
|
|
|
58 | + buttons: { | ||
|
|
|
59 | + today: true, | ||
|
|
|
60 | + clear: false, | ||
|
|
|
61 | + close: true | ||
|
|
|
62 | + }, | ||
|
|
|
63 | + components: { | ||
|
|
|
64 | + calendar: true, | ||
|
|
|
65 | + date: true, | ||
|
|
|
66 | + month: true, | ||
|
|
|
67 | + year: true, | ||
|
|
|
68 | + decades: true, | ||
|
|
|
69 | + clock: true, | ||
|
|
|
70 | + hours: true, | ||
|
|
|
71 | + minutes: true, | ||
|
|
|
72 | + seconds: false, | ||
|
|
|
73 | + useTwentyfourHour: true, | ||
|
|
|
74 | + }, | ||
|
|
|
75 | + } | ||
|
|
|
76 | + } | ||
|
|
45 | }); |
|
77 | }); |
| @@ -1,30 +1,64 | |||||
|
|
1 | - - content_for :head do |
|
||
|
|
2 | - = stylesheet_link_tag 'problems' |
|
||
|
|
3 | - = javascript_include_tag 'local_jquery' |
|
||
|
|
4 | - |
|
||
|
|
5 | - |
|
||
|
|
6 | - |
|
||
|
|
7 |
|
|
1 | %h1 Manage problems |
|
|
8 |
|
2 | ||
|
|
9 | %p= link_to '[Back to problem list]', problems_path |
|
3 | %p= link_to '[Back to problem list]', problems_path |
|
|
10 |
|
4 | ||
|
|
11 | - = form_with url: do_manage_problems_path do |f| |
|
5 | + = form_with url: do_manage_problems_path, class: 'align-items-center' do |f| |
|
|
12 | .card.border-primary.mb-2 |
|
6 | .card.border-primary.mb-2 |
|
|
13 | .card-header.text-bg-primary.border-primary |
|
7 | .card-header.text-bg-primary.border-primary |
|
|
14 | Action |
|
8 | Action |
|
|
15 | .card-body |
|
9 | .card-body |
|
|
16 | - .submit-box |
|
10 | + What do you want to do to the selected problem? |
|
|
17 | - What do you want to do to the selected problem? |
|
11 | + %br/ |
|
|
18 | - %br/ |
|
12 | + (You can shift-click to select a range of problems) |
|
|
19 | - (You can shift-click to select a range of problems) |
|
13 | + .row |
|
|
20 |
- . |
|
14 | + .col-md-6 |
|
|
21 | - .col-md-auto |
|
15 | + .row.my-3.align-items-center |
|
|
22 | - = f.check_box :change_date_added, class: 'form-check-input' |
|
16 | + .col-md-auto |
|
|
23 | - .col-md-auto |
|
17 | + .form-check |
|
|
24 | - .form-check-label |
|
18 | + = f.label :change_date_added, 'Change "Date added" to' |
|
|
25 | - Change "Date added" to |
|
19 | + = f.check_box :change_date_added, class: 'form-check-input' |
|
|
26 | - .col-md-auto |
|
20 | + .col-md-auto |
|
|
27 | - |
|
21 | + = f.text_field :date_added, class: 'form-control' |
|
|
|
22 | + .row.mb-3.align-items-center | ||
|
|
|
23 | + .col-md-auto | ||
|
|
|
24 | + .form-check | ||
|
|
|
25 | + = f.label :change_enable, 'Set "Available" to' | ||
|
|
|
26 | + = f.check_box :change_enable, class: 'form-check-input' | ||
|
|
|
27 | + .col-md-auto | ||
|
|
|
28 | + = f.radio_button :enable, "yes", class: 'form-check-input' | ||
|
|
|
29 | + = f.label :enable_yes, "yes" | ||
|
|
|
30 | + .col-md-auto | ||
|
|
|
31 | + = f.radio_button :enable, "no", class: 'form-check-input' | ||
|
|
|
32 | + = f.label :enable_no, "no" | ||
|
|
|
33 | + .row.mb-3.align-items-center | ||
|
|
|
34 | + .col-md-auto | ||
|
|
|
35 | + .form-check | ||
|
|
|
36 | + = f.label :add_group, 'Add selected problems to user group' | ||
|
|
|
37 | + = f.check_box :add_group, class: 'form-check-input' | ||
|
|
|
38 | + .col-md-auto | ||
|
|
|
39 | + = f.select "group_id", options_from_collection_for_select( Group.all, 'id','name',params[:group_name]), {}, class: 'select2 form-control' | ||
|
|
|
40 | + .col-md-6 | ||
|
|
|
41 | + .row.mb-3.align-items-center | ||
|
|
|
42 | + .col-md-auto | ||
|
|
|
43 | + .form-check | ||
|
|
|
44 | + = f.label :add_tags, 'Add the following tags to the selected problems' | ||
|
|
|
45 | + = f.check_box :add_tags, class: 'form-check-input' | ||
|
|
|
46 | + .col-md-auto | ||
|
|
|
47 | + = f.select "tag_ids", options_from_collection_for_select( Tag.all, 'id','name'), {},class: 'select2', multiple: true, data: {placeholder: 'Select tags by clicking', width: "400px"} | ||
|
|
|
48 | + - if GraderConfiguration.multicontests? | ||
|
|
|
49 | + .row.mb-3.align-items-center | ||
|
|
|
50 | + .col-md-auto | ||
|
|
|
51 | + .form-check | ||
|
|
|
52 | + = f.label :add_contest, 'Add selected problems to contest' | ||
|
|
|
53 | + = f.check_box :add_contest, class: 'form-check-input' | ||
|
|
|
54 | + .col-md-auto | ||
|
|
|
55 | + = f.select "contest_id", options_from_collection_for_select( Contest.all, :id,:title), {}, class: 'select2 form-control' | ||
|
|
|
56 | + .row.mb-3 | ||
|
|
|
57 | + .col-auto | ||
|
|
|
58 | + = f.submit :go, class: 'btn btn-primary' | ||
|
|
|
59 | + | ||
|
|
|
60 | + | ||
|
|
|
61 | + -# | ||
|
|
28 | %ul.form-inline |
|
62 | %ul.form-inline |
|
|
29 | %li |
|
63 | %li |
|
|
30 | Change "Date added" to |
|
64 | Change "Date added" to |
| @@ -126,4 +160,23 | |||||
|
|
126 | $('.datatable').DataTable({ |
|
160 | $('.datatable').DataTable({ |
|
|
127 | paging: false |
|
161 | paging: false |
|
|
128 | }); |
|
162 | }); |
|
|
|
163 | + $('.select2').select2(); | ||
|
|
|
164 | + | ||
|
|
|
165 | + | ||
|
|
|
166 | + new TempusDominus(document.getElementById('date_added'), { | ||
|
|
|
167 | + display: { | ||
|
|
|
168 | + icons: { | ||
|
|
|
169 | + time: 'mi mi-td-time', | ||
|
|
|
170 | + date: 'mi mi-td-date', | ||
|
|
|
171 | + up: 'mi mi-td-up', | ||
|
|
|
172 | + down: 'mi mi-td-down', | ||
|
|
|
173 | + previous: 'bi bi-chevron-left', | ||
|
|
|
174 | + next: 'bi bi-chevron-right', | ||
|
|
|
175 | + today: 'bi bi-calendar-check', | ||
|
|
|
176 | + clear: 'bi bi-trash', | ||
|
|
|
177 | + close: 'bi bi-x', | ||
|
|
|
178 | + }, | ||
|
|
|
179 | + } | ||
|
|
|
180 | + }); | ||
|
|
|
181 | + | ||
|
|
129 | }); |
|
182 | }); |
| @@ -56,3 +56,4 | |||||
|
|
56 |
|
56 | ||
|
|
57 | #pin "ace-rails-ap" |
|
57 | #pin "ace-rails-ap" |
|
|
58 | pin "chart", to: 'chart.js' # @3.9.1 |
|
58 | pin "chart", to: 'chart.js' # @3.9.1 |
|
|
|
59 | + pin "@eonasdan/tempus-dominus", to: "@eonasdan--tempus-dominus.js" # @6.2.4 | ||
| deleted file |
You need to be logged in to leave comments.
Login now