materialize_timepicker_rails 0.1.1 → 0.1.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 15069ef19b9beef527143dd2b94db36e40114246
4
- data.tar.gz: 57f2978b3e257f47cc443a97fbb07f2ceec21e7d
3
+ metadata.gz: fd5afcd47c164d53b082b8d8d79226690fbbfd64
4
+ data.tar.gz: 404fbf34c5a9e3a705b189408e1b998831cf26f4
5
5
  SHA512:
6
- metadata.gz: 7f2acbb7ef0771f92e8288ea8541a9a12531250d8112d39d591f9627a3db61398fcb980a8fc648e8fe6a61303d6919425dc4fe0eb6b844e642596d8cb23068fd
7
- data.tar.gz: 07f11d01ad9334217e49e642199e9062e1e9e6806e56d44637e9d5b2ca32c301a250e54ad3282f9576811af96628a8903fa5ab36fbe73d7b02060403e60bf1f4
6
+ metadata.gz: 65daffade3fdf775b20a9e033f05332571c29e9039737dcea452d95938da0d62e03a29c74edb440e235d3f3d65836aff9265d55c6efe57045362eeb91e1323b8
7
+ data.tar.gz: a1a0d7adbe28ba9ffffaca6cc0d94f6275144cbd2ff0a42f077416a115c17cd694e01ec6773f3b900601447345b284682a09707c08c96fad264b6c5e20ee51c1
@@ -1,3 +1,3 @@
1
1
  module MaterializeTimepickerRails
2
- VERSION = "0.1.1"
2
+ VERSION = "0.1.1.1"
3
3
  end
@@ -1,1542 +1 @@
1
- /*!
2
- * ClockPicker v0.0.7 (http://weareoutman.github.io/clockpicker/)
3
- * Copyright 2014 Wang Shenwei.
4
- * Licensed under MIT (https://github.com/weareoutman/clockpicker/blob/gh-pages/LICENSE)
5
- *
6
- * Further modified
7
- * Copyright 2015 Ching Yaw Hao.
8
- *
9
- * Gemified Rails 4+
10
- * Copyright 2016 Shawn Wilson.
11
- */
12
-
13
- ;(function(){
14
- var $ = window.jQuery,
15
- $win = $(window),
16
- $doc = $(document);
17
-
18
- // Can I use inline svg ?
19
- var svgNS = 'http://www.w3.org/2000/svg',
20
- svgSupported = 'SVGAngle' in window && (function() {
21
- var supported,
22
- el = document.createElement('div');
23
- el.innerHTML = '<svg/>';
24
- supported = (el.firstChild && el.firstChild.namespaceURI) == svgNS;
25
- el.innerHTML = '';
26
- return supported;
27
- })();
28
-
29
- // Can I use transition ?
30
- var transitionSupported = (function() {
31
- var style = document.createElement('div').style;
32
- return 'transition' in style ||
33
- 'WebkitTransition' in style ||
34
- 'MozTransition' in style ||
35
- 'msTransition' in style ||
36
- 'OTransition' in style;
37
- })();
38
-
39
- // Listen touch events in touch screen device, instead of mouse events in desktop.
40
- var touchSupported = 'ontouchstart' in window,
41
- mousedownEvent = 'mousedown' + ( touchSupported ? ' touchstart' : ''),
42
- mousemoveEvent = 'mousemove.clockpicker' + ( touchSupported ? ' touchmove.clockpicker' : ''),
43
- mouseupEvent = 'mouseup.clockpicker' + ( touchSupported ? ' touchend.clockpicker' : '');
44
-
45
- // Vibrate the device if supported
46
- var vibrate = navigator.vibrate ? 'vibrate' : navigator.webkitVibrate ? 'webkitVibrate' : null;
47
-
48
- function createSvgElement(name) {
49
- return document.createElementNS(svgNS, name);
50
- }
51
-
52
- function leadingZero(num) {
53
- return (num < 10 ? '0' : '') + num;
54
- }
55
-
56
- // Get a unique id
57
- var idCounter = 0;
58
- function uniqueId(prefix) {
59
- var id = ++idCounter + '';
60
- return prefix ? prefix + id : id;
61
- }
62
-
63
- // Clock size
64
- var dialRadius = 135,
65
- outerRadius = 110,
66
- // innerRadius = 80 on 12 hour clock
67
- innerRadius = 80,
68
- tickRadius = 20,
69
- diameter = dialRadius * 2,
70
- duration = transitionSupported ? 350 : 1;
71
-
72
- // Popover template
73
- var tpl = [
74
- '<div class="clockpicker picker">',
75
- '<div class="picker__holder">',
76
- '<div class="picker__frame">',
77
- '<div class="picker__wrap">',
78
- '<div class="picker__box">',
79
- '<div class="picker__date-display">',
80
- '<div class="clockpicker-display">',
81
- '<div class="clockpicker-display-column">',
82
- '<span class="clockpicker-span-hours text-primary"></span>',
83
- ':',
84
- '<span class="clockpicker-span-minutes"></span>',
85
- '</div>',
86
- '<div class="clockpicker-display-column clockpicker-display-am-pm">',
87
- '<div class="clockpicker-span-am-pm"></div>',
88
- '</div>',
89
- '</div>',
90
- '</div>',
91
- '<div class="picker__calendar-container">',
92
- '<div class="clockpicker-plate">',
93
- '<div class="clockpicker-canvas"></div>',
94
- '<div class="clockpicker-dial clockpicker-hours"></div>',
95
- '<div class="clockpicker-dial clockpicker-minutes clockpicker-dial-out"></div>',
96
- '</div>',
97
- '<div class="clockpicker-am-pm-block">',
98
- '</div>',
99
- '</div>',
100
- '<div class="picker__footer">',
101
- '</div>',
102
- '</div>',
103
- '</div>',
104
- '</div>',
105
- '</div>',
106
- '</div>'
107
- ].join('');
108
-
109
- // ClockPicker
110
- function ClockPicker(element, options) {
111
- var popover = $(tpl),
112
- plate = popover.find('.clockpicker-plate'),
113
- holder = popover.find('.picker__holder'),
114
- hoursView = popover.find('.clockpicker-hours'),
115
- minutesView = popover.find('.clockpicker-minutes'),
116
- amPmBlock = popover.find('.clockpicker-am-pm-block'),
117
- isInput = element.prop('tagName') === 'INPUT',
118
- input = isInput ? element : element.find('input'),
119
- label = $("label[for=" + input.attr("id") + "]"),
120
- self = this,
121
- timer;
122
-
123
- this.id = uniqueId('cp');
124
- this.element = element;
125
- this.holder = holder;
126
- this.options = options;
127
- this.isAppended = false;
128
- this.isShown = false;
129
- this.currentView = 'hours';
130
- this.isInput = isInput;
131
- this.input = input;
132
- this.label = label;
133
- this.popover = popover;
134
- this.plate = plate;
135
- this.hoursView = hoursView;
136
- this.minutesView = minutesView;
137
- this.amPmBlock = amPmBlock;
138
- this.spanHours = popover.find('.clockpicker-span-hours');
139
- this.spanMinutes = popover.find('.clockpicker-span-minutes');
140
- this.spanAmPm = popover.find('.clockpicker-span-am-pm');
141
- this.footer = popover.find('.picker__footer');
142
- this.amOrPm = "PM";
143
-
144
- // Setup for for 12 hour clock if option is selected
145
- if (options.twelvehour) {
146
- var amPmButtonsTemplate = [
147
- '<div class="clockpicker-am-pm-block">',
148
- '<button type="button" class="btn-floating btn-flat clockpicker-button clockpicker-am-button">',
149
- 'AM',
150
- '</button>',
151
- '<button type="button" class="btn-floating btn-flat clockpicker-button clockpicker-pm-button">',
152
- 'PM',
153
- '</button>',
154
- '</div>'
155
- ].join('');
156
-
157
- var amPmButtons = $(amPmButtonsTemplate);
158
-
159
- if(!options.ampmclickable) {
160
- $('<button type="button" class="btn-floating btn-flat clockpicker-button am-button" tabindex="1">' + "AM" + '</button>').on("click", function() {
161
- self.amOrPm = "AM";
162
- self.amPmBlock.children('.pm-button').removeClass('active');
163
- self.amPmBlock.children('.am-button').addClass('active');
164
- self.spanAmPm.empty().append('AM');
165
- }).appendTo(this.amPmBlock);
166
- $('<button type="button" class="btn-floating btn-flat clockpicker-button pm-button" tabindex="2">' + "PM" + '</button>').on("click", function() {
167
- self.amOrPm = 'PM';
168
- self.amPmBlock.children('.am-button').removeClass('active');
169
- self.amPmBlock.children('.pm-button').addClass('active');
170
- self.spanAmPm.empty().append('PM');
171
- }).appendTo(this.amPmBlock);
172
- }
173
- else {
174
- this.spanAmPm.empty();
175
- $('<div id="click-am">AM</div>').on("click", function() {
176
- self.spanAmPm.children('#click-am').addClass("text-primary");
177
- self.spanAmPm.children('#click-pm').removeClass("text-primary");
178
- self.amOrPm = "AM";
179
- }).appendTo(this.spanAmPm);
180
- $('<div id="click-pm">PM</div>').on("click", function() {
181
- self.spanAmPm.children('#click-pm').addClass("text-primary");
182
- self.spanAmPm.children('#click-am').removeClass("text-primary");
183
- self.amOrPm = 'PM';
184
- }).appendTo(this.spanAmPm);
185
- }
186
- }
187
- //force input to type ( disable type=time )
188
- input.attr('type','text');
189
-
190
- //convertir el dato por defecto y agregarlo al input
191
- var value = ((this.options['default'] || this.input.prop('value') || 'now') + '').split(':'),
192
- submit = ((this.options['default'] || this.input.prop('value') || 'now') + '').split(':');
193
-
194
- if(this.options.twelvehour && !(typeof value[1] === 'undefined')) {
195
- var hour = parseInt(value[0]);
196
- value[0] = (hour == 0) ? 12 : ((hour > 12) ? (hour - 12) : hour);
197
- value[1] = value[1] + ((hour < 12) ? 'AM' : 'PM');
198
- }
199
- //en caso que no se haya especificado un valor por defecto,
200
- //el input se deja vacio pero el reloj se carga con la hora del sistema
201
- if (value[0] === 'now') {
202
- var now = new Date(+ new Date() + this.options.fromnow);
203
- this.options.default = 'now';
204
- submit = [ leadingZero(now.getHours()), leadingZero(now.getMinutes()), '00' ];
205
- input.prop({
206
- default:submit.join(':')
207
- }).data({
208
- default:submit.join(':'),
209
- submit:submit.join(':')
210
- }).attr({
211
- 'data-default':submit.join(':'),
212
- 'data-submit':submit.join(':')
213
- });
214
- } else {
215
- input.prop({value:(value[0] +':'+ value[1])})
216
- .data({submit:submit.join(':')})
217
- .attr({
218
- value:(value[0] +':'+ value[1]),
219
- 'data-submit':submit.join(':')
220
- });
221
- }
222
- if(options.darktheme)
223
- popover.addClass('darktheme');
224
-
225
- // If autoclose is not setted, append a button
226
- $('<button type="button" class="btn-flat clockpicker-button" tabindex="' + (options.twelvehour? '3' : '1') + '">' + options.donetext + '</button>').click($.proxy(this.done, this)).appendTo(this.footer);
227
-
228
- this.spanHours.click($.proxy(this.toggleView, this, 'hours'));
229
- this.spanMinutes.click($.proxy(this.toggleView, this, 'minutes'));
230
-
231
- // Show or toggle
232
- input.on('focus.clockpicker click.clockpicker', $.proxy(this.show, this));
233
-
234
- // Build ticks
235
- var tickTpl = $('<div class="clockpicker-tick"></div>'),
236
- i, tick, radian, radius;
237
-
238
- // Hours view
239
- if (options.twelvehour) {
240
- for (i = 1; i < 13; i += 1) {
241
- tick = tickTpl.clone();
242
- radian = i / 6 * Math.PI;
243
- radius = outerRadius;
244
- tick.css('font-size', '140%');
245
- tick.css({
246
- left: dialRadius + Math.sin(radian) * radius - tickRadius,
247
- top: dialRadius - Math.cos(radian) * radius - tickRadius
248
- });
249
- tick.html(i === 0 ? '00' : i);
250
- hoursView.append(tick);
251
- tick.on(mousedownEvent, mousedown);
252
- }
253
- } else {
254
- for (i = 0; i < 24; i += 1) {
255
- tick = tickTpl.clone();
256
- radian = i / 6 * Math.PI;
257
- var inner = i > 0 && i < 13;
258
- radius = inner ? innerRadius : outerRadius;
259
- tick.css({
260
- left: dialRadius + Math.sin(radian) * radius - tickRadius,
261
- top: dialRadius - Math.cos(radian) * radius - tickRadius
262
- });
263
- if (inner)
264
- tick.css('font-size', '120%');
265
- tick.html(i === 0 ? '00' : i);
266
- hoursView.append(tick);
267
- tick.on(mousedownEvent, mousedown);
268
- }
269
- }
270
-
271
- // Minutes view
272
- for (i = 0; i < 60; i += 5) {
273
- tick = tickTpl.clone();
274
- radian = i / 30 * Math.PI;
275
- tick.css({
276
- left: dialRadius + Math.sin(radian) * outerRadius - tickRadius,
277
- top: dialRadius - Math.cos(radian) * outerRadius - tickRadius
278
- });
279
- tick.css('font-size', '140%');
280
- tick.html(leadingZero(i));
281
- minutesView.append(tick);
282
- tick.on(mousedownEvent, mousedown);
283
- }
284
-
285
- // Clicking on minutes view space
286
- plate.on(mousedownEvent, function(e) {
287
- if ($(e.target).closest('.clockpicker-tick').length === 0)
288
- mousedown(e, true);
289
- });
290
-
291
- // Mousedown or touchstart
292
- function mousedown(e, space) {
293
- var offset = plate.offset(),
294
- isTouch = /^touch/.test(e.type),
295
- x0 = offset.left + dialRadius,
296
- y0 = offset.top + dialRadius,
297
- dx = (isTouch ? e.originalEvent.touches[0] : e).pageX - x0,
298
- dy = (isTouch ? e.originalEvent.touches[0] : e).pageY - y0,
299
- z = Math.sqrt(dx * dx + dy * dy),
300
- moved = false;
301
-
302
- // When clicking on minutes view space, check the mouse position
303
- if (space && (z < outerRadius - tickRadius || z > outerRadius + tickRadius))
304
- return;
305
- e.preventDefault();
306
-
307
- // Set cursor style of body after 200ms
308
- var movingTimer = setTimeout(function(){
309
- self.popover.addClass('clockpicker-moving');
310
- }, 200);
311
-
312
- // Place the canvas to top
313
- if (svgSupported)
314
- plate.append(self.canvas);
315
-
316
- // Clock
317
- self.setHand(dx, dy, !space, true);
318
-
319
- // Mousemove on document
320
- $doc.off(mousemoveEvent).on(mousemoveEvent, function(e){
321
- e.preventDefault();
322
- var isTouch = /^touch/.test(e.type),
323
- x = (isTouch ? e.originalEvent.touches[0] : e).pageX - x0,
324
- y = (isTouch ? e.originalEvent.touches[0] : e).pageY - y0;
325
- if (! moved && x === dx && y === dy)
326
- // Clicking in chrome on windows will trigger a mousemove event
327
- return;
328
- moved = true;
329
- self.setHand(x, y, false, true);
330
- });
331
-
332
- // Mouseup on document
333
- $doc.off(mouseupEvent).on(mouseupEvent, function(e) {
334
- $doc.off(mouseupEvent);
335
- e.preventDefault();
336
- var isTouch = /^touch/.test(e.type),
337
- x = (isTouch ? e.originalEvent.changedTouches[0] : e).pageX - x0,
338
- y = (isTouch ? e.originalEvent.changedTouches[0] : e).pageY - y0;
339
- if ((space || moved) && x === dx && y === dy)
340
- self.setHand(x, y);
341
- if (self.currentView === 'hours')
342
- self.toggleView('minutes', duration / 2);
343
- else
344
- if (options.autoclose) {
345
- self.minutesView.addClass('clockpicker-dial-out');
346
- setTimeout(function(){
347
- self.done();
348
- }, duration / 2);
349
- }
350
- plate.prepend(canvas);
351
-
352
- // Reset cursor style of body
353
- clearTimeout(movingTimer);
354
- self.popover.removeClass('clockpicker-moving');
355
-
356
- // Unbind mousemove event
357
- $doc.off(mousemoveEvent);
358
- });
359
- }
360
-
361
- if (svgSupported) {
362
- // Draw clock hands and others
363
- var canvas = popover.find('.clockpicker-canvas'),
364
- svg = createSvgElement('svg');
365
- svg.setAttribute('class', 'clockpicker-svg');
366
- svg.setAttribute('width', diameter);
367
- svg.setAttribute('height', diameter);
368
- var g = createSvgElement('g');
369
- g.setAttribute('transform', 'translate(' + dialRadius + ',' + dialRadius + ')');
370
- var bearing = createSvgElement('circle');
371
- bearing.setAttribute('class', 'clockpicker-canvas-bearing');
372
- bearing.setAttribute('cx', 0);
373
- bearing.setAttribute('cy', 0);
374
- bearing.setAttribute('r', 2);
375
- var hand = createSvgElement('line');
376
- hand.setAttribute('x1', 0);
377
- hand.setAttribute('y1', 0);
378
- var bg = createSvgElement('circle');
379
- bg.setAttribute('class', 'clockpicker-canvas-bg');
380
- bg.setAttribute('r', tickRadius);
381
- var fg = createSvgElement('circle');
382
- fg.setAttribute('class', 'clockpicker-canvas-fg');
383
- fg.setAttribute('r', 5);
384
- g.appendChild(hand);
385
- g.appendChild(bg);
386
- g.appendChild(fg);
387
- g.appendChild(bearing);
388
- svg.appendChild(g);
389
- canvas.append(svg);
390
-
391
- this.hand = hand;
392
- this.bg = bg;
393
- this.fg = fg;
394
- this.bearing = bearing;
395
- this.g = g;
396
- this.canvas = canvas;
397
- }
398
-
399
- raiseCallback(this.options.init);
400
- }
401
-
402
- function raiseCallback(callbackFunction) {
403
- if(callbackFunction && typeof callbackFunction === "function")
404
- callbackFunction();
405
- }
406
-
407
- // Default options
408
- ClockPicker.DEFAULTS = {
409
- 'default': '', // default time, 'now' or '13:14' e.g.
410
- fromnow: 0, // set default time to * milliseconds from now (using with default = 'now')
411
- donetext: 'Done', // done button text
412
- autoclose: false, // auto close when minute is selected
413
- ampmclickable: false, // set am/pm button on itself
414
- darktheme: false, // set to dark theme
415
- twelvehour: true, // change to 12 hour AM/PM clock from 24 hour
416
- vibrate: true, // vibrate the device when dragging clock hand
417
- submit: '' // guarda el valor time en 24 horas
418
- };
419
-
420
- // Show or hide popover
421
- ClockPicker.prototype.toggle = function() {
422
- this[this.isShown ? 'hide' : 'show']();
423
- };
424
-
425
- // Set popover position
426
- ClockPicker.prototype.locate = function() {
427
- var element = this.element,
428
- popover = this.popover,
429
- offset = element.offset(),
430
- width = element.outerWidth(),
431
- height = element.outerHeight(),
432
- align = this.options.align,
433
- self = this;
434
-
435
- popover.show();
436
- };
437
- // Show popover
438
- ClockPicker.prototype.show = function(e){
439
- this.setAMorPM = function(option) {
440
- var active = option;
441
- var inactive = (option == "pm"? "am":"pm");
442
- if(this.options.twelvehour) {
443
- this.amOrPm = active.toUpperCase();
444
- if(!this.options.ampmclickable) {
445
- this.amPmBlock.children('.' + inactive + '-button').removeClass('active');
446
- this.amPmBlock.children('.' + active + '-button').addClass('active');
447
- this.spanAmPm.empty().append(this.amOrPm);
448
- }
449
- else {
450
- this.spanAmPm.children('#click-' + active + '').addClass("text-primary");
451
- this.spanAmPm.children('#click-' + inactive + '').removeClass("text-primary");
452
- }
453
- }
454
- }
455
- // Not show again
456
- if (this.isShown) {
457
- return;
458
- }
459
- raiseCallback(this.options.beforeShow);
460
- $(':input').each(function() {
461
- $(this).attr('tabindex', -1);
462
- })
463
- var self = this;
464
- // Initialize
465
- this.input.blur();
466
- this.popover.addClass('picker--opened');
467
- this.input.addClass('picker__input picker__input--active');
468
- $(document.body).css('overflow', 'hidden');
469
- if (!this.isAppended) {
470
- // Append popover to options.container
471
- if(this.options.hasOwnProperty('container'))
472
- this.popover.appendTo(this.options.container);
473
- else
474
- this.popover.insertAfter(this.input);
475
- this.setAMorPM("pm");
476
- // Reset position when resize
477
- $win.on('resize.clockpicker' + this.id, function() {
478
- if (self.isShown) {
479
- self.locate();
480
- }
481
- });
482
- this.isAppended = true;
483
- }
484
- // Get the time
485
- var value = ((this.options['default'] || this.input.prop('value') || 'now') + '').split(':');
486
- if(this.options.twelvehour && !(typeof value[1] === 'undefined')) {
487
- if(value[1].includes('AM'))
488
- this.setAMorPM("am");
489
- else
490
- this.setAMorPM("pm");
491
- value[1] = value[1].replace("AM", "").replace("PM", "");
492
- }
493
- if (value[0] === 'now') {
494
- var now = new Date(+ new Date() + this.options.fromnow);
495
- if (now.getHours() >= 12 || parseInt(value[0]) < 12 )
496
- this.setAMorPM("pm");
497
- else
498
- this.setAMorPM("am");
499
- value = [
500
- now.getHours(),
501
- now.getMinutes()
502
- ];
503
- }
504
- this.hours = + value[0] || 0;
505
- this.minutes = + value[1] || 0;
506
- this.spanHours.html(leadingZero(this.hours));
507
- this.spanMinutes.html(leadingZero(this.minutes));
508
- // Toggle to hours view
509
- this.toggleView('hours');
510
- // Set position
511
- this.locate();
512
- this.isShown = true;
513
- // Hide when clicking or tabbing on any element except the clock and input
514
- $doc.on('click.clockpicker.' + this.id + ' focusin.clockpicker.' + this.id, function(e) {
515
- var target = $(e.target);
516
- if (target.closest(self.popover.find('.picker__wrap')).length === 0 && target.closest(self.input).length === 0)
517
- self.hide();
518
- });
519
- // Hide when ESC is pressed
520
- $doc.on('keyup.clockpicker.' + this.id, function(e){
521
- if (e.keyCode === 27)
522
- self.hide();
523
- });
524
- raiseCallback(this.options.afterShow);
525
- };
526
- // Hide popover
527
- ClockPicker.prototype.hide = function() {
528
- raiseCallback(this.options.beforeHide);
529
- this.input.removeClass('picker__input picker__input--active');
530
- this.popover.removeClass('picker--opened');
531
- $(document.body).css('overflow', 'visible');
532
- this.isShown = false;
533
- $(':input').each(function(index) {
534
- $(this).attr('tabindex', index + 1);
535
- });
536
- // Unbinding events on document
537
- $doc.off('click.clockpicker.' + this.id + ' focusin.clockpicker.' + this.id);
538
- $doc.off('keyup.clockpicker.' + this.id);
539
- this.popover.hide();
540
- raiseCallback(this.options.afterHide);
541
- };
542
- // Toggle to hours or minutes view
543
- ClockPicker.prototype.toggleView = function(view, delay) {
544
- var raiseAfterHourSelect = false;
545
- if (view === 'minutes' && $(this.hoursView).css("visibility") === "visible") {
546
- raiseCallback(this.options.beforeHourSelect);
547
- raiseAfterHourSelect = true;
548
- }
549
- var isHours = view === 'hours',
550
- nextView = isHours ? this.hoursView : this.minutesView,
551
- hideView = isHours ? this.minutesView : this.hoursView;
552
- this.currentView = view;
553
-
554
- this.spanHours.toggleClass('text-primary', isHours);
555
- this.spanMinutes.toggleClass('text-primary', ! isHours);
556
-
557
- // Let's make transitions
558
- hideView.addClass('clockpicker-dial-out');
559
- nextView.css('visibility', 'visible').removeClass('clockpicker-dial-out');
560
-
561
- // Reset clock hand
562
- this.resetClock(delay);
563
-
564
- // After transitions ended
565
- clearTimeout(this.toggleViewTimer);
566
- this.toggleViewTimer = setTimeout(function() {
567
- hideView.css('visibility', 'hidden');
568
- }, duration);
569
-
570
- if (raiseAfterHourSelect)
571
- raiseCallback(this.options.afterHourSelect);
572
- };
573
-
574
- // Reset clock hand
575
- ClockPicker.prototype.resetClock = function(delay) {
576
- var view = this.currentView,
577
- value = this[view],
578
- isHours = view === 'hours',
579
- unit = Math.PI / (isHours ? 6 : 30),
580
- radian = value * unit,
581
- radius = isHours && value > 0 && value < 13 ? innerRadius : outerRadius,
582
- x = Math.sin(radian) * radius,
583
- y = - Math.cos(radian) * radius,
584
- self = this;
585
-
586
- if(svgSupported && delay) {
587
- self.canvas.addClass('clockpicker-canvas-out');
588
- setTimeout(function(){
589
- self.canvas.removeClass('clockpicker-canvas-out');
590
- self.setHand(x, y);
591
- }, delay);
592
- } else
593
- this.setHand(x, y);
594
- };
595
-
596
- // Set clock hand to (x, y)
597
- ClockPicker.prototype.setHand = function(x, y, roundBy5, dragging) {
598
- var radian = Math.atan2(x, - y),
599
- isHours = this.currentView === 'hours',
600
- unit = Math.PI / (isHours || roundBy5? 6 : 30),
601
- z = Math.sqrt(x * x + y * y),
602
- options = this.options,
603
- inner = isHours && z < (outerRadius + innerRadius) / 2,
604
- radius = inner ? innerRadius : outerRadius,
605
- value;
606
-
607
- if (options.twelvehour)
608
- radius = outerRadius;
609
-
610
- // Radian should in range [0, 2PI]
611
- if (radian < 0)
612
- radian = Math.PI * 2 + radian;
613
-
614
- // Get the round value
615
- value = Math.round(radian / unit);
616
-
617
- // Get the round radian
618
- radian = value * unit;
619
-
620
- // Correct the hours or minutes
621
- if(options.twelvehour) {
622
- if(isHours) {
623
- if(value === 0)
624
- value = 12;
625
- } else {
626
- if(roundBy5)
627
- value *= 5;
628
- if(value === 60)
629
- value = 0;
630
- }
631
- } else {
632
- if(isHours) {
633
- if(value === 12)
634
- value = 0;
635
- value = inner ? (value === 0 ? 12 : value) : value === 0 ? 0 : value + 12;
636
- } else {
637
- if(roundBy5)
638
- value *= 5;
639
- if(value === 60)
640
- value = 0;
641
- }
642
- }
643
- if (isHours)
644
- this.fg.setAttribute('class', 'clockpicker-canvas-fg');
645
- else {
646
- if(value % 5 == 0)
647
- this.fg.setAttribute('class', 'clockpicker-canvas-fg');
648
- else
649
- this.fg.setAttribute('class', 'clockpicker-canvas-fg active');
650
- }
651
-
652
- // Once hours or minutes changed, vibrate the device
653
- if (this[this.currentView] !== value)
654
- if (vibrate && this.options.vibrate)
655
- // Do not vibrate too frequently
656
- if (! this.vibrateTimer) {
657
- navigator[vibrate](10);
658
- this.vibrateTimer = setTimeout($.proxy(function(){
659
- this.vibrateTimer = null;
660
- }, this), 100);
661
- }
662
-
663
- this[this.currentView] = value;
664
- this[isHours ? 'spanHours' : 'spanMinutes'].html(leadingZero(value));
665
-
666
- // If svg is not supported, just add an active class to the tick
667
- if (! svgSupported) {
668
- this[isHours ? 'hoursView' : 'minutesView'].find('.clockpicker-tick').each(function(){
669
- var tick = $(this);
670
- tick.toggleClass('active', value === + tick.html());
671
- });
672
- return;
673
- }
674
-
675
- // Place clock hand at the top when dragging
676
- if (dragging || (! isHours && value % 5)) {
677
- this.g.insertBefore(this.hand, this.bearing);
678
- this.g.insertBefore(this.bg, this.fg);
679
- this.bg.setAttribute('class', 'clockpicker-canvas-bg clockpicker-canvas-bg-trans');
680
- } else {
681
- // Or place it at the bottom
682
- this.g.insertBefore(this.hand, this.bg);
683
- this.g.insertBefore(this.fg, this.bg);
684
- this.bg.setAttribute('class', 'clockpicker-canvas-bg');
685
- }
686
-
687
- // Set clock hand and others' position
688
- var cx1 = Math.sin(radian) * (radius - tickRadius),
689
- cy1 = - Math.cos(radian) * (radius - tickRadius),
690
- cx2 = Math.sin(radian) * radius,
691
- cy2 = - Math.cos(radian) * radius;
692
- this.hand.setAttribute('x2', cx1);
693
- this.hand.setAttribute('y2', cy1);
694
- this.bg.setAttribute('cx', cx2);
695
- this.bg.setAttribute('cy', cy2);
696
- this.fg.setAttribute('cx', cx2);
697
- this.fg.setAttribute('cy', cy2);
698
- };
699
-
700
- // Hours and minutes are selected
701
- ClockPicker.prototype.done = function() {
702
- raiseCallback(this.options.beforeDone);
703
- this.hide();
704
- this.label.addClass('active');
705
-
706
- var last = this.input.prop('value') || this.input.attr('value'),
707
- value = leadingZero(this.hours) + ':' + leadingZero(this.minutes);
708
- submit = leadingZero(this.hours) + ':' + leadingZero(this.minutes) + ':00';
709
-
710
- if (this.options.twelvehour) {
711
- value = value + this.amOrPm;
712
- if ( this.amOrPm == 'PM' ) {
713
- submit = ((this.hours > 12) ? (this.hours + 12) : '00') + ':' + leadingZero(this.minutes) + ':00';
714
- console.log(this.hours, this.minutes, this.amOrPm);
715
- }
716
- }
717
- /*!
718
- * ClockPicker v0.0.7 (http://weareoutman.github.io/clockpicker/)
719
- * Copyright 2014 Wang Shenwei.
720
- * Licensed under MIT (https://github.com/weareoutman/clockpicker/blob/gh-pages/LICENSE)
721
- *
722
- * Further modified
723
- * Copyright 2015 Ching Yaw Hao.
724
- */
725
-
726
- ;(function(){
727
- var $ = window.jQuery,
728
- $win = $(window),
729
- $doc = $(document);
730
-
731
- // Can I use inline svg ?
732
- var svgNS = 'http://www.w3.org/2000/svg',
733
- svgSupported = 'SVGAngle' in window && (function() {
734
- var supported,
735
- el = document.createElement('div');
736
- el.innerHTML = '<svg/>';
737
- supported = (el.firstChild && el.firstChild.namespaceURI) == svgNS;
738
- el.innerHTML = '';
739
- return supported;
740
- })();
741
-
742
- // Can I use transition ?
743
- var transitionSupported = (function() {
744
- var style = document.createElement('div').style;
745
- return 'transition' in style ||
746
- 'WebkitTransition' in style ||
747
- 'MozTransition' in style ||
748
- 'msTransition' in style ||
749
- 'OTransition' in style;
750
- })();
751
-
752
- // Listen touch events in touch screen device, instead of mouse events in desktop.
753
- var touchSupported = 'ontouchstart' in window,
754
- mousedownEvent = 'mousedown' + ( touchSupported ? ' touchstart' : ''),
755
- mousemoveEvent = 'mousemove.clockpicker' + ( touchSupported ? ' touchmove.clockpicker' : ''),
756
- mouseupEvent = 'mouseup.clockpicker' + ( touchSupported ? ' touchend.clockpicker' : '');
757
-
758
- // Vibrate the device if supported
759
- var vibrate = navigator.vibrate ? 'vibrate' : navigator.webkitVibrate ? 'webkitVibrate' : null;
760
-
761
- function createSvgElement(name) {
762
- return document.createElementNS(svgNS, name);
763
- }
764
-
765
- function leadingZero(num) {
766
- return (num < 10 ? '0' : '') + num;
767
- }
768
-
769
- // Get a unique id
770
- var idCounter = 0;
771
- function uniqueId(prefix) {
772
- var id = ++idCounter + '';
773
- return prefix ? prefix + id : id;
774
- }
775
-
776
- // Clock size
777
- var dialRadius = 135,
778
- outerRadius = 110,
779
- // innerRadius = 80 on 12 hour clock
780
- innerRadius = 80,
781
- tickRadius = 20,
782
- diameter = dialRadius * 2,
783
- duration = transitionSupported ? 350 : 1;
784
-
785
- // Popover template
786
- var tpl = [
787
- '<div class="clockpicker picker">',
788
- '<div class="picker__holder">',
789
- '<div class="picker__frame">',
790
- '<div class="picker__wrap">',
791
- '<div class="picker__box">',
792
- '<div class="picker__date-display">',
793
- '<div class="clockpicker-display">',
794
- '<div class="clockpicker-display-column">',
795
- '<span class="clockpicker-span-hours text-primary"></span>',
796
- ':',
797
- '<span class="clockpicker-span-minutes"></span>',
798
- '</div>',
799
- '<div class="clockpicker-display-column clockpicker-display-am-pm">',
800
- '<div class="clockpicker-span-am-pm"></div>',
801
- '</div>',
802
- '</div>',
803
- '</div>',
804
- '<div class="picker__calendar-container">',
805
- '<div class="clockpicker-plate">',
806
- '<div class="clockpicker-canvas"></div>',
807
- '<div class="clockpicker-dial clockpicker-hours"></div>',
808
- '<div class="clockpicker-dial clockpicker-minutes clockpicker-dial-out"></div>',
809
- '</div>',
810
- '<div class="clockpicker-am-pm-block">',
811
- '</div>',
812
- '</div>',
813
- '<div class="picker__footer">',
814
- '</div>',
815
- '</div>',
816
- '</div>',
817
- '</div>',
818
- '</div>',
819
- '</div>'
820
- ].join('');
821
-
822
- // ClockPicker
823
- function ClockPicker(element, options) {
824
- var popover = $(tpl),
825
- plate = popover.find('.clockpicker-plate'),
826
- holder = popover.find('.picker__holder'),
827
- hoursView = popover.find('.clockpicker-hours'),
828
- minutesView = popover.find('.clockpicker-minutes'),
829
- amPmBlock = popover.find('.clockpicker-am-pm-block'),
830
- isInput = element.prop('tagName') === 'INPUT',
831
- input = isInput ? element : element.find('input'),
832
- label = $("label[for=" + input.attr("id") + "]"),
833
- self = this,
834
- timer;
835
-
836
- this.id = uniqueId('cp');
837
- this.element = element;
838
- this.holder = holder;
839
- this.options = options;
840
- this.isAppended = false;
841
- this.isShown = false;
842
- this.currentView = 'hours';
843
- this.isInput = isInput;
844
- this.input = input;
845
- this.label = label;
846
- this.popover = popover;
847
- this.plate = plate;
848
- this.hoursView = hoursView;
849
- this.minutesView = minutesView;
850
- this.amPmBlock = amPmBlock;
851
- this.spanHours = popover.find('.clockpicker-span-hours');
852
- this.spanMinutes = popover.find('.clockpicker-span-minutes');
853
- this.spanAmPm = popover.find('.clockpicker-span-am-pm');
854
- this.footer = popover.find('.picker__footer');
855
- this.amOrPm = "PM";
856
-
857
- // Setup for for 12 hour clock if option is selected
858
- if (options.twelvehour) {
859
- var amPmButtonsTemplate = [
860
- '<div class="clockpicker-am-pm-block">',
861
- '<button type="button" class="btn-floating btn-flat clockpicker-button clockpicker-am-button">',
862
- 'AM',
863
- '</button>',
864
- '<button type="button" class="btn-floating btn-flat clockpicker-button clockpicker-pm-button">',
865
- 'PM',
866
- '</button>',
867
- '</div>'
868
- ].join('');
869
-
870
- var amPmButtons = $(amPmButtonsTemplate);
871
-
872
- if(!options.ampmclickable) {
873
- $('<button type="button" class="btn-floating btn-flat clockpicker-button am-button" tabindex="1">' + "AM" + '</button>').on("click", function() {
874
- self.amOrPm = "AM";
875
- self.amPmBlock.children('.pm-button').removeClass('active');
876
- self.amPmBlock.children('.am-button').addClass('active');
877
- self.spanAmPm.empty().append('AM');
878
- }).appendTo(this.amPmBlock);
879
- $('<button type="button" class="btn-floating btn-flat clockpicker-button pm-button" tabindex="2">' + "PM" + '</button>').on("click", function() {
880
- self.amOrPm = 'PM';
881
- self.amPmBlock.children('.am-button').removeClass('active');
882
- self.amPmBlock.children('.pm-button').addClass('active');
883
- self.spanAmPm.empty().append('PM');
884
- }).appendTo(this.amPmBlock);
885
- }
886
- else {
887
- this.spanAmPm.empty();
888
- $('<div id="click-am">AM</div>').on("click", function() {
889
- self.spanAmPm.children('#click-am').addClass("text-primary");
890
- self.spanAmPm.children('#click-pm').removeClass("text-primary");
891
- self.amOrPm = "AM";
892
- }).appendTo(this.spanAmPm);
893
- $('<div id="click-pm">PM</div>').on("click", function() {
894
- self.spanAmPm.children('#click-pm').addClass("text-primary");
895
- self.spanAmPm.children('#click-am').removeClass("text-primary");
896
- self.amOrPm = 'PM';
897
- }).appendTo(this.spanAmPm);
898
- }
899
- }
900
- //force input to type ( disable type=time )
901
- input.attr('type','text');
902
-
903
- // PERSONALIZADO
904
- var value = ((this.options['default'] || this.input.prop('value') || 'now') + '').split(':'),
905
- submit = ((this.options['default'] || this.input.prop('value') || 'now') + '').split(':');
906
-
907
- if(this.options.twelvehour && !(typeof value[1] === 'undefined')) {
908
- var hour = parseInt(value[0]);
909
- value[0] = (hour == 0) ? 12 : ((hour > 12) ? (hour - 12) : hour);
910
- value[1] = value[1] + ((hour < 12) ? 'AM' : 'PM');
911
- }
912
-
913
- if (value[0] === 'now') {
914
-
915
- this.options.default = 'now';
916
-
917
- var now = new Date(+ new Date() + this.options.fromnow),
918
- hour = now.getHours(),
919
- minute = now.getMinutes();
920
-
921
- if( options.twelvehour ) {
922
- value = [
923
- leadingZero((hour == 0) ? 12 : ((hour > 12) ? (hour - 12) : hour)),
924
- (leadingZero(minute) + (hour < 12 ? 'AM':'PM'))
925
- ];
926
- } else {
927
- value = [ leadingZero(hour), leadingZero(minute) ];
928
- }
929
-
930
- submit = [ leadingZero(hour), leadingZero(minute), '00' ];
931
- input.prop({
932
- default:submit.join(':')
933
- }).data({
934
- default:submit.join(':'),
935
- submit:submit.join(':')
936
- }).attr({
937
- 'data-default':submit.join(':'),
938
- 'data-submit':submit.join(':')
939
- });
940
-
941
- } else {
942
- input.prop({value:(value[0] +':'+ value[1])})
943
- .data({submit:submit.join(':')})
944
- .attr({
945
- value:(value[0] +':'+ value[1]),
946
- 'data-submit':submit.join(':')
947
- });
948
- }
949
-
950
- if(options.darktheme)
951
- popover.addClass('darktheme');
952
-
953
- // If autoclose is not setted, append a button
954
- $('<button type="button" class="btn-flat clockpicker-button" tabindex="' + (options.twelvehour? '3' : '1') + '">' + options.donetext + '</button>').click($.proxy(this.done, this)).appendTo(this.footer);
955
-
956
- this.spanHours.click($.proxy(this.toggleView, this, 'hours'));
957
- this.spanMinutes.click($.proxy(this.toggleView, this, 'minutes'));
958
-
959
- // Show or toggle
960
- input.on('focus.clockpicker click.clockpicker', $.proxy(this.show, this));
961
-
962
- // Build ticks
963
- var tickTpl = $('<div class="clockpicker-tick"></div>'),
964
- i, tick, radian, radius;
965
-
966
- // Hours view
967
- if (options.twelvehour) {
968
- for (i = 1; i < 13; i += 1) {
969
- tick = tickTpl.clone();
970
- radian = i / 6 * Math.PI;
971
- radius = outerRadius;
972
- tick.css('font-size', '140%');
973
- tick.css({
974
- left: dialRadius + Math.sin(radian) * radius - tickRadius,
975
- top: dialRadius - Math.cos(radian) * radius - tickRadius
976
- });
977
- tick.html(i === 0 ? '00' : i);
978
- hoursView.append(tick);
979
- tick.on(mousedownEvent, mousedown);
980
- }
981
- } else {
982
- for (i = 0; i < 24; i += 1) {
983
- tick = tickTpl.clone();
984
- radian = i / 6 * Math.PI;
985
- var inner = i > 0 && i < 13;
986
- radius = inner ? innerRadius : outerRadius;
987
- tick.css({
988
- left: dialRadius + Math.sin(radian) * radius - tickRadius,
989
- top: dialRadius - Math.cos(radian) * radius - tickRadius
990
- });
991
- if (inner)
992
- tick.css('font-size', '120%');
993
- tick.html(i === 0 ? '00' : i);
994
- hoursView.append(tick);
995
- tick.on(mousedownEvent, mousedown);
996
- }
997
- }
998
-
999
- // Minutes view
1000
- for (i = 0; i < 60; i += 5) {
1001
- tick = tickTpl.clone();
1002
- radian = i / 30 * Math.PI;
1003
- tick.css({
1004
- left: dialRadius + Math.sin(radian) * outerRadius - tickRadius,
1005
- top: dialRadius - Math.cos(radian) * outerRadius - tickRadius
1006
- });
1007
- tick.css('font-size', '140%');
1008
- tick.html(leadingZero(i));
1009
- minutesView.append(tick);
1010
- tick.on(mousedownEvent, mousedown);
1011
- }
1012
-
1013
- // Clicking on minutes view space
1014
- plate.on(mousedownEvent, function(e) {
1015
- if ($(e.target).closest('.clockpicker-tick').length === 0)
1016
- mousedown(e, true);
1017
- });
1018
-
1019
- // Mousedown or touchstart
1020
- function mousedown(e, space) {
1021
- var offset = plate.offset(),
1022
- isTouch = /^touch/.test(e.type),
1023
- x0 = offset.left + dialRadius,
1024
- y0 = offset.top + dialRadius,
1025
- dx = (isTouch ? e.originalEvent.touches[0] : e).pageX - x0,
1026
- dy = (isTouch ? e.originalEvent.touches[0] : e).pageY - y0,
1027
- z = Math.sqrt(dx * dx + dy * dy),
1028
- moved = false;
1029
-
1030
- // When clicking on minutes view space, check the mouse position
1031
- if (space && (z < outerRadius - tickRadius || z > outerRadius + tickRadius))
1032
- return;
1033
- e.preventDefault();
1034
-
1035
- // Set cursor style of body after 200ms
1036
- var movingTimer = setTimeout(function(){
1037
- self.popover.addClass('clockpicker-moving');
1038
- }, 200);
1039
-
1040
- // Place the canvas to top
1041
- if (svgSupported)
1042
- plate.append(self.canvas);
1043
-
1044
- // Clock
1045
- self.setHand(dx, dy, !space, true);
1046
-
1047
- // Mousemove on document
1048
- $doc.off(mousemoveEvent).on(mousemoveEvent, function(e){
1049
- e.preventDefault();
1050
- var isTouch = /^touch/.test(e.type),
1051
- x = (isTouch ? e.originalEvent.touches[0] : e).pageX - x0,
1052
- y = (isTouch ? e.originalEvent.touches[0] : e).pageY - y0;
1053
- if (! moved && x === dx && y === dy)
1054
- // Clicking in chrome on windows will trigger a mousemove event
1055
- return;
1056
- moved = true;
1057
- self.setHand(x, y, false, true);
1058
- });
1059
-
1060
- // Mouseup on document
1061
- $doc.off(mouseupEvent).on(mouseupEvent, function(e) {
1062
- $doc.off(mouseupEvent);
1063
- e.preventDefault();
1064
- var isTouch = /^touch/.test(e.type),
1065
- x = (isTouch ? e.originalEvent.changedTouches[0] : e).pageX - x0,
1066
- y = (isTouch ? e.originalEvent.changedTouches[0] : e).pageY - y0;
1067
- if ((space || moved) && x === dx && y === dy)
1068
- self.setHand(x, y);
1069
- if (self.currentView === 'hours')
1070
- self.toggleView('minutes', duration / 2);
1071
- else
1072
- if (options.autoclose) {
1073
- self.minutesView.addClass('clockpicker-dial-out');
1074
- setTimeout(function(){
1075
- self.done();
1076
- }, duration / 2);
1077
- }
1078
- plate.prepend(canvas);
1079
-
1080
- // Reset cursor style of body
1081
- clearTimeout(movingTimer);
1082
- self.popover.removeClass('clockpicker-moving');
1083
-
1084
- // Unbind mousemove event
1085
- $doc.off(mousemoveEvent);
1086
- });
1087
- }
1088
-
1089
- if (svgSupported) {
1090
- // Draw clock hands and others
1091
- var canvas = popover.find('.clockpicker-canvas'),
1092
- svg = createSvgElement('svg');
1093
- svg.setAttribute('class', 'clockpicker-svg');
1094
- svg.setAttribute('width', diameter);
1095
- svg.setAttribute('height', diameter);
1096
- var g = createSvgElement('g');
1097
- g.setAttribute('transform', 'translate(' + dialRadius + ',' + dialRadius + ')');
1098
- var bearing = createSvgElement('circle');
1099
- bearing.setAttribute('class', 'clockpicker-canvas-bearing');
1100
- bearing.setAttribute('cx', 0);
1101
- bearing.setAttribute('cy', 0);
1102
- bearing.setAttribute('r', 2);
1103
- var hand = createSvgElement('line');
1104
- hand.setAttribute('x1', 0);
1105
- hand.setAttribute('y1', 0);
1106
- var bg = createSvgElement('circle');
1107
- bg.setAttribute('class', 'clockpicker-canvas-bg');
1108
- bg.setAttribute('r', tickRadius);
1109
- var fg = createSvgElement('circle');
1110
- fg.setAttribute('class', 'clockpicker-canvas-fg');
1111
- fg.setAttribute('r', 5);
1112
- g.appendChild(hand);
1113
- g.appendChild(bg);
1114
- g.appendChild(fg);
1115
- g.appendChild(bearing);
1116
- svg.appendChild(g);
1117
- canvas.append(svg);
1118
-
1119
- this.hand = hand;
1120
- this.bg = bg;
1121
- this.fg = fg;
1122
- this.bearing = bearing;
1123
- this.g = g;
1124
- this.canvas = canvas;
1125
- }
1126
-
1127
- raiseCallback(this.options.init);
1128
- }
1129
-
1130
- function raiseCallback(callbackFunction) {
1131
- if(callbackFunction && typeof callbackFunction === "function")
1132
- callbackFunction();
1133
- }
1134
-
1135
- // Default options
1136
- ClockPicker.DEFAULTS = {
1137
- 'default': '', // default time, 'now' or '13:14' e.g.
1138
- fromnow: 0, // set default time to * milliseconds from now (using with default = 'now')
1139
- donetext: 'Done', // done button text
1140
- autoclose: false, // auto close when minute is selected
1141
- ampmclickable: false, // set am/pm button on itself
1142
- darktheme: false, // set to dark theme
1143
- twelvehour: true, // change to 12 hour AM/PM clock from 24 hour
1144
- vibrate: true, // vibrate the device when dragging clock hand
1145
- submit: ''
1146
- };
1147
-
1148
- // Show or hide popover
1149
- ClockPicker.prototype.toggle = function() {
1150
- this[this.isShown ? 'hide' : 'show']();
1151
- };
1152
-
1153
- // Set popover position
1154
- ClockPicker.prototype.locate = function() {
1155
- var element = this.element,
1156
- popover = this.popover,
1157
- offset = element.offset(),
1158
- width = element.outerWidth(),
1159
- height = element.outerHeight(),
1160
- align = this.options.align,
1161
- self = this;
1162
-
1163
- popover.show();
1164
- };
1165
- // Show popover
1166
- ClockPicker.prototype.show = function(e){
1167
- this.setAMorPM = function(option) {
1168
- var active = option;
1169
- var inactive = (option == "pm"? "am":"pm");
1170
- if(this.options.twelvehour) {
1171
- this.amOrPm = active.toUpperCase();
1172
- if(!this.options.ampmclickable) {
1173
- this.amPmBlock.children('.' + inactive + '-button').removeClass('active');
1174
- this.amPmBlock.children('.' + active + '-button').addClass('active');
1175
- this.spanAmPm.empty().append(this.amOrPm);
1176
- }
1177
- else {
1178
- this.spanAmPm.children('#click-' + active + '').addClass("text-primary");
1179
- this.spanAmPm.children('#click-' + inactive + '').removeClass("text-primary");
1180
- }
1181
- }
1182
- }
1183
- // Not show again
1184
- if (this.isShown) {
1185
- return;
1186
- }
1187
- raiseCallback(this.options.beforeShow);
1188
- $(':input').each(function() {
1189
- $(this).attr('tabindex', -1);
1190
- })
1191
- var self = this;
1192
- // Initialize
1193
- this.input.blur();
1194
- this.popover.addClass('picker--opened');
1195
- this.input.addClass('picker__input picker__input--active');
1196
- $(document.body).css('overflow', 'hidden');
1197
- if (!this.isAppended) {
1198
- // Append popover to options.container
1199
- if(this.options.hasOwnProperty('container'))
1200
- this.popover.appendTo(this.options.container);
1201
- else
1202
- this.popover.insertAfter(this.input);
1203
- this.setAMorPM("pm");
1204
- // Reset position when resize
1205
- $win.on('resize.clockpicker' + this.id, function() {
1206
- if (self.isShown) {
1207
- self.locate();
1208
- }
1209
- });
1210
- this.isAppended = true;
1211
- }
1212
- // Get the time
1213
- var value = ((this.options['default'] || this.input.prop('value') || 'now') + '').split(':');
1214
-
1215
- if(this.options.twelvehour && !(typeof value[1] === 'undefined')) {
1216
- if(value[1].includes('AM') || parseInt(value[0]) < 12 )
1217
- this.setAMorPM("am");
1218
- else
1219
- this.setAMorPM("pm");
1220
-
1221
- value[1] = value[1].replace("AM", "").replace("PM", "");
1222
- }
1223
-
1224
- if (value[0] === 'now') {
1225
- var now = new Date(+ new Date() + this.options.fromnow);
1226
- if (now.getHours() >= 12)
1227
- this.setAMorPM("pm");
1228
- else
1229
- this.setAMorPM("am");
1230
- value = [
1231
- now.getHours(),
1232
- now.getMinutes()
1233
- ];
1234
- }
1235
-
1236
- this.hours = + value[0] || 0;
1237
- this.minutes = + value[1] || 0;
1238
- this.spanHours.html(leadingZero(this.hours));
1239
- this.spanMinutes.html(leadingZero(this.minutes));
1240
- // Toggle to hours view
1241
- this.toggleView('hours');
1242
- // Set position
1243
- this.locate();
1244
- this.isShown = true;
1245
- // Hide when clicking or tabbing on any element except the clock and input
1246
- $doc.on('click.clockpicker.' + this.id + ' focusin.clockpicker.' + this.id, function(e) {
1247
- var target = $(e.target);
1248
- if (target.closest(self.popover.find('.picker__wrap')).length === 0 && target.closest(self.input).length === 0)
1249
- self.hide();
1250
- });
1251
- // Hide when ESC is pressed
1252
- $doc.on('keyup.clockpicker.' + this.id, function(e){
1253
- if (e.keyCode === 27)
1254
- self.hide();
1255
- });
1256
- raiseCallback(this.options.afterShow);
1257
- };
1258
- // Hide popover
1259
- ClockPicker.prototype.hide = function() {
1260
- raiseCallback(this.options.beforeHide);
1261
- this.input.removeClass('picker__input picker__input--active');
1262
- this.popover.removeClass('picker--opened');
1263
- $(document.body).css('overflow', 'visible');
1264
- this.isShown = false;
1265
- $(':input').each(function(index) {
1266
- $(this).attr('tabindex', index + 1);
1267
- });
1268
- // Unbinding events on document
1269
- $doc.off('click.clockpicker.' + this.id + ' focusin.clockpicker.' + this.id);
1270
- $doc.off('keyup.clockpicker.' + this.id);
1271
- this.popover.hide();
1272
- raiseCallback(this.options.afterHide);
1273
- };
1274
- // Toggle to hours or minutes view
1275
- ClockPicker.prototype.toggleView = function(view, delay) {
1276
- var raiseAfterHourSelect = false;
1277
- if (view === 'minutes' && $(this.hoursView).css("visibility") === "visible") {
1278
- raiseCallback(this.options.beforeHourSelect);
1279
- raiseAfterHourSelect = true;
1280
- }
1281
- var isHours = view === 'hours',
1282
- nextView = isHours ? this.hoursView : this.minutesView,
1283
- hideView = isHours ? this.minutesView : this.hoursView;
1284
- this.currentView = view;
1285
-
1286
- this.spanHours.toggleClass('text-primary', isHours);
1287
- this.spanMinutes.toggleClass('text-primary', ! isHours);
1288
-
1289
- // Let's make transitions
1290
- hideView.addClass('clockpicker-dial-out');
1291
- nextView.css('visibility', 'visible').removeClass('clockpicker-dial-out');
1292
-
1293
- // Reset clock hand
1294
- this.resetClock(delay);
1295
-
1296
- // After transitions ended
1297
- clearTimeout(this.toggleViewTimer);
1298
- this.toggleViewTimer = setTimeout(function() {
1299
- hideView.css('visibility', 'hidden');
1300
- }, duration);
1301
-
1302
- if (raiseAfterHourSelect)
1303
- raiseCallback(this.options.afterHourSelect);
1304
- };
1305
-
1306
- // Reset clock hand
1307
- ClockPicker.prototype.resetClock = function(delay) {
1308
- var view = this.currentView,
1309
- value = this[view],
1310
- isHours = view === 'hours',
1311
- unit = Math.PI / (isHours ? 6 : 30),
1312
- radian = value * unit,
1313
- radius = isHours && value > 0 && value < 13 ? innerRadius : outerRadius,
1314
- x = Math.sin(radian) * radius,
1315
- y = - Math.cos(radian) * radius,
1316
- self = this;
1317
-
1318
- if(svgSupported && delay) {
1319
- self.canvas.addClass('clockpicker-canvas-out');
1320
- setTimeout(function(){
1321
- self.canvas.removeClass('clockpicker-canvas-out');
1322
- self.setHand(x, y);
1323
- }, delay);
1324
- } else
1325
- this.setHand(x, y);
1326
- };
1327
-
1328
- // Set clock hand to (x, y)
1329
- ClockPicker.prototype.setHand = function(x, y, roundBy5, dragging) {
1330
- var radian = Math.atan2(x, - y),
1331
- isHours = this.currentView === 'hours',
1332
- unit = Math.PI / (isHours || roundBy5? 6 : 30),
1333
- z = Math.sqrt(x * x + y * y),
1334
- options = this.options,
1335
- inner = isHours && z < (outerRadius + innerRadius) / 2,
1336
- radius = inner ? innerRadius : outerRadius,
1337
- value;
1338
-
1339
- if (options.twelvehour)
1340
- radius = outerRadius;
1341
-
1342
- // Radian should in range [0, 2PI]
1343
- if (radian < 0)
1344
- radian = Math.PI * 2 + radian;
1345
-
1346
- // Get the round value
1347
- value = Math.round(radian / unit);
1348
-
1349
- // Get the round radian
1350
- radian = value * unit;
1351
-
1352
- // Correct the hours or minutes
1353
- if(options.twelvehour) {
1354
- if(isHours) {
1355
- if(value === 0)
1356
- value = 12;
1357
- } else {
1358
- if(roundBy5)
1359
- value *= 5;
1360
- if(value === 60)
1361
- value = 0;
1362
- }
1363
- } else {
1364
- if(isHours) {
1365
- if(value === 12)
1366
- value = 0;
1367
- value = inner ? (value === 0 ? 12 : value) : value === 0 ? 0 : value + 12;
1368
- } else {
1369
- if(roundBy5)
1370
- value *= 5;
1371
- if(value === 60)
1372
- value = 0;
1373
- }
1374
- }
1375
- if (isHours)
1376
- this.fg.setAttribute('class', 'clockpicker-canvas-fg');
1377
- else {
1378
- if(value % 5 == 0)
1379
- this.fg.setAttribute('class', 'clockpicker-canvas-fg');
1380
- else
1381
- this.fg.setAttribute('class', 'clockpicker-canvas-fg active');
1382
- }
1383
-
1384
- // Once hours or minutes changed, vibrate the device
1385
- if (this[this.currentView] !== value)
1386
- if (vibrate && this.options.vibrate)
1387
- // Do not vibrate too frequently
1388
- if (! this.vibrateTimer) {
1389
- navigator[vibrate](10);
1390
- this.vibrateTimer = setTimeout($.proxy(function(){
1391
- this.vibrateTimer = null;
1392
- }, this), 100);
1393
- }
1394
-
1395
- this[this.currentView] = value;
1396
- this[isHours ? 'spanHours' : 'spanMinutes'].html(leadingZero(value));
1397
-
1398
- // If svg is not supported, just add an active class to the tick
1399
- if (! svgSupported) {
1400
- this[isHours ? 'hoursView' : 'minutesView'].find('.clockpicker-tick').each(function(){
1401
- var tick = $(this);
1402
- tick.toggleClass('active', value === + tick.html());
1403
- });
1404
- return;
1405
- }
1406
-
1407
- // Place clock hand at the top when dragging
1408
- if (dragging || (! isHours && value % 5)) {
1409
- this.g.insertBefore(this.hand, this.bearing);
1410
- this.g.insertBefore(this.bg, this.fg);
1411
- this.bg.setAttribute('class', 'clockpicker-canvas-bg clockpicker-canvas-bg-trans');
1412
- } else {
1413
- // Or place it at the bottom
1414
- this.g.insertBefore(this.hand, this.bg);
1415
- this.g.insertBefore(this.fg, this.bg);
1416
- this.bg.setAttribute('class', 'clockpicker-canvas-bg');
1417
- }
1418
-
1419
- // Set clock hand and others' position
1420
- var cx1 = Math.sin(radian) * (radius - tickRadius),
1421
- cy1 = - Math.cos(radian) * (radius - tickRadius),
1422
- cx2 = Math.sin(radian) * radius,
1423
- cy2 = - Math.cos(radian) * radius;
1424
- this.hand.setAttribute('x2', cx1);
1425
- this.hand.setAttribute('y2', cy1);
1426
- this.bg.setAttribute('cx', cx2);
1427
- this.bg.setAttribute('cy', cy2);
1428
- this.fg.setAttribute('cx', cx2);
1429
- this.fg.setAttribute('cy', cy2);
1430
- };
1431
-
1432
- // Hours and minutes are selected
1433
- ClockPicker.prototype.done = function() {
1434
- raiseCallback(this.options.beforeDone);
1435
- this.hide();
1436
- this.label.addClass('active');
1437
-
1438
- var last = this.input.prop('value'),
1439
- value = leadingZero(this.hours) + ':' + leadingZero(this.minutes);
1440
- submit = leadingZero(this.hours) + ':' + leadingZero(this.minutes) + ':00';
1441
-
1442
- if (this.options.twelvehour) {
1443
- value = value + this.amOrPm;
1444
- if ( this.amOrPm == 'PM' )
1445
- submit = ((this.hours < 12) ? (this.hours + 12) : 12) + ':' + leadingZero(this.minutes) + ':00';
1446
- else
1447
- submit = ((this.hours < 12) ? leadingZero(this.hours) : '00') + ':' + leadingZero(this.minutes) + ':00';
1448
- }
1449
- this.input
1450
- .prop({'value': value})
1451
- .data({'submit':submit})
1452
- .attr({'value': value, 'data-submit':submit});//Force data
1453
- this.options.default = submit;
1454
- if(value !== last) {
1455
- this.input.triggerHandler('change');
1456
- if(!this.isInput)
1457
- this.element.trigger('change');
1458
- }
1459
- if(this.options.autoclose)
1460
- this.input.trigger('blur');
1461
-
1462
- raiseCallback(this.options.afterDone(this.input, submit));
1463
- };
1464
-
1465
- // Remove clockpicker from input
1466
- ClockPicker.prototype.remove = function() {
1467
- this.element.removeData('clockpicker');
1468
- this.input.off('focus.clockpicker click.clockpicker');
1469
- if (this.isShown)
1470
- this.hide();
1471
- if (this.isAppended) {
1472
- $win.off('resize.clockpicker' + this.id);
1473
- this.popover.remove();
1474
- }
1475
- };
1476
-
1477
- // Extends $.fn.clockpicker
1478
- $.fn.pickatime = function(option){
1479
- var args = Array.prototype.slice.call(arguments, 1);
1480
- return this.each(function(){
1481
- var $this = $(this),
1482
- data = $this.data('clockpicker');
1483
- if (!data) {
1484
- var options = $.extend({}, ClockPicker.DEFAULTS, $this.data(), typeof option == 'object' && option);
1485
- $this.data('clockpicker', new ClockPicker($this, options));
1486
- } else {
1487
- // Manual operatsions. show, hide, remove, e.g.
1488
- if (typeof data[option] === 'function')
1489
- data[option].apply(data, args);
1490
- }
1491
- });
1492
- };
1493
- }());
1494
-
1495
- this.input
1496
- .prop({value: value})
1497
- .data({submit:submit})
1498
- .attr({value: value, 'data-submit':submit}); //forzar nuevos valores
1499
-
1500
- this.options.default = submit;
1501
-
1502
- if(value !== last) {
1503
- this.input.triggerHandler('change');
1504
- if(!this.isInput)
1505
- this.element.trigger('change');
1506
- }
1507
-
1508
- if(this.options.autoclose)
1509
- this.input.trigger('blur');
1510
-
1511
- raiseCallback(this.options.afterDone);
1512
- };
1513
-
1514
- // Remove clockpicker from input
1515
- ClockPicker.prototype.remove = function() {
1516
- this.element.removeData('clockpicker');
1517
- this.input.off('focus.clockpicker click.clockpicker');
1518
- if (this.isShown)
1519
- this.hide();
1520
- if (this.isAppended) {
1521
- $win.off('resize.clockpicker' + this.id);
1522
- this.popover.remove();
1523
- }
1524
- };
1525
-
1526
- // Extends $.fn.clockpicker
1527
- $.fn.pickatime = function(option){
1528
- var args = Array.prototype.slice.call(arguments, 1);
1529
- return this.each(function(){
1530
- var $this = $(this),
1531
- data = $this.data('clockpicker');
1532
- if (!data) {
1533
- var options = $.extend({}, ClockPicker.DEFAULTS, $this.data(), typeof option == 'object' && option);
1534
- $this.data('clockpicker', new ClockPicker($this, options));
1535
- } else {
1536
- // Manual operatsions. show, hide, remove, e.g.
1537
- if (typeof data[option] === 'function')
1538
- data[option].apply(data, args);
1539
- }
1540
- });
1541
- };
1542
- }());
1
+ !function(){function t(t){return document.createElementNS(r,t)}function i(t){return(t<10?"0":"")+t}function e(t){var i=++v+"";return t?t+i:i}function s(s,n){function r(t,i){var e=h.offset(),s=/^touch/.test(t.type),o=e.left+f,c=e.top+f,r=(s?t.originalEvent.touches[0]:t).pageX-o,l=(s?t.originalEvent.touches[0]:t).pageY-c,u=Math.sqrt(r*r+l*l),m=!1;if(!i||!(u<b-w||u>b+w)){t.preventDefault();var v=setTimeout(function(){V.popover.addClass("clockpicker-moving")},200);p&&h.append(V.canvas),V.setHand(r,l,!i,!0),a.off(d).on(d,function(t){t.preventDefault();var i=/^touch/.test(t.type),e=(i?t.originalEvent.touches[0]:t).pageX-o,s=(i?t.originalEvent.touches[0]:t).pageY-c;(m||e!==r||s!==l)&&(m=!0,V.setHand(e,s,!1,!0))}),a.off(k).on(k,function(t){a.off(k),t.preventDefault();var e=/^touch/.test(t.type),s=(e?t.originalEvent.changedTouches[0]:t).pageX-o,p=(e?t.originalEvent.changedTouches[0]:t).pageY-c;(i||m)&&s===r&&p===l&&V.setHand(s,p),"hours"===V.currentView?V.toggleView("minutes",A/2):n.autoclose&&(V.minutesView.addClass("clockpicker-dial-out"),setTimeout(function(){V.done()},A/2)),h.prepend(z),clearTimeout(v),V.popover.removeClass("clockpicker-moving"),a.off(d)})}}var l=c(M),h=l.find(".clockpicker-plate"),m=l.find(".picker__holder"),v=l.find(".clockpicker-hours"),P=l.find(".clockpicker-minutes"),C=l.find(".clockpicker-am-pm-block"),x="INPUT"===s.prop("tagName"),T=x?s:s.find("input"),_=c("label[for="+T.attr("id")+"]"),V=this;if(this.id=e("cp"),this.element=s,this.holder=m,this.options=n,this.isAppended=!1,this.isShown=!1,this.currentView="hours",this.isInput=x,this.input=T,this.label=_,this.popover=l,this.plate=h,this.hoursView=v,this.minutesView=P,this.amPmBlock=C,this.spanHours=l.find(".clockpicker-span-hours"),this.spanMinutes=l.find(".clockpicker-span-minutes"),this.spanAmPm=l.find(".clockpicker-span-am-pm"),this.footer=l.find(".picker__footer"),this.amOrPm="PM",n.twelvehour){var H=['<div class="clockpicker-am-pm-block">','<button type="button" class="btn-floating btn-flat clockpicker-button clockpicker-am-button">',"AM","</button>",'<button type="button" class="btn-floating btn-flat clockpicker-button clockpicker-pm-button">',"PM","</button>","</div>"].join("");c(H);n.ampmclickable?(this.spanAmPm.empty(),c('<div id="click-am">AM</div>').on("click",function(){V.spanAmPm.children("#click-am").addClass("text-primary"),V.spanAmPm.children("#click-pm").removeClass("text-primary"),V.amOrPm="AM"}).appendTo(this.spanAmPm),c('<div id="click-pm">PM</div>').on("click",function(){V.spanAmPm.children("#click-pm").addClass("text-primary"),V.spanAmPm.children("#click-am").removeClass("text-primary"),V.amOrPm="PM"}).appendTo(this.spanAmPm)):(c('<button type="button" class="btn-floating btn-flat clockpicker-button am-button" tabindex="1">AM</button>').on("click",function(){V.amOrPm="AM",V.amPmBlock.children(".pm-button").removeClass("active"),V.amPmBlock.children(".am-button").addClass("active"),V.spanAmPm.empty().append("AM")}).appendTo(this.amPmBlock),c('<button type="button" class="btn-floating btn-flat clockpicker-button pm-button" tabindex="2">PM</button>').on("click",function(){V.amOrPm="PM",V.amPmBlock.children(".am-button").removeClass("active"),V.amPmBlock.children(".pm-button").addClass("active"),V.spanAmPm.empty().append("PM")}).appendTo(this.amPmBlock))}T.attr("type","text"),n.darktheme&&l.addClass("darktheme"),c('<button type="button" class="btn-flat clockpicker-button" tabindex="'+(n.twelvehour?"3":"1")+'">'+n.donetext+"</button>").click(c.proxy(this.done,this)).appendTo(this.footer),this.spanHours.click(c.proxy(this.toggleView,this,"hours")),this.spanMinutes.click(c.proxy(this.toggleView,this,"minutes")),T.on("focus.clockpicker click.clockpicker",c.proxy(this.show,this));var S,B,D,E,I=c('<div class="clockpicker-tick"></div>');if(n.twelvehour)for(S=1;S<13;S+=1)B=I.clone(),D=S/6*Math.PI,E=b,B.css("font-size","140%"),B.css({left:f+Math.sin(D)*E-w,top:f-Math.cos(D)*E-w}),B.html(0===S?"00":S),v.append(B),B.on(u,r);else for(S=0;S<24;S+=1){B=I.clone(),D=S/6*Math.PI;var O=S>0&&S<13;E=O?g:b,B.css({left:f+Math.sin(D)*E-w,top:f-Math.cos(D)*E-w}),O&&B.css("font-size","120%"),B.html(0===S?"00":S),v.append(B),B.on(u,r)}for(S=0;S<60;S+=5)B=I.clone(),D=S/30*Math.PI,B.css({left:f+Math.sin(D)*b-w,top:f-Math.cos(D)*b-w}),B.css("font-size","140%"),B.html(i(S)),P.append(B),B.on(u,r);if(h.on(u,function(t){0===c(t.target).closest(".clockpicker-tick").length&&r(t,!0)}),p){var z=l.find(".clockpicker-canvas"),U=t("svg");U.setAttribute("class","clockpicker-svg"),U.setAttribute("width",y),U.setAttribute("height",y);var j=t("g");j.setAttribute("transform","translate("+f+","+f+")");var L=t("circle");L.setAttribute("class","clockpicker-canvas-bearing"),L.setAttribute("cx",0),L.setAttribute("cy",0),L.setAttribute("r",2);var N=t("line");N.setAttribute("x1",0),N.setAttribute("y1",0);var X=t("circle");X.setAttribute("class","clockpicker-canvas-bg"),X.setAttribute("r",w);var Y=t("circle");Y.setAttribute("class","clockpicker-canvas-fg"),Y.setAttribute("r",5),j.appendChild(N),j.appendChild(X),j.appendChild(Y),j.appendChild(L),U.appendChild(j),z.append(U),this.hand=N,this.bg=X,this.fg=Y,this.bearing=L,this.g=j,this.canvas=z}o(this.options.init)}function o(t){t&&"function"==typeof t&&t()}var c=window.jQuery,n=c(window),a=c(document),r="http://www.w3.org/2000/svg",p="SVGAngle"in window&&function(){var t,i=document.createElement("div");return i.innerHTML="<svg/>",t=(i.firstChild&&i.firstChild.namespaceURI)==r,i.innerHTML="",t}(),l=function(){var t=document.createElement("div").style;return"transition"in t||"WebkitTransition"in t||"MozTransition"in t||"msTransition"in t||"OTransition"in t}(),h="ontouchstart"in window,u="mousedown"+(h?" touchstart":""),d="mousemove.clockpicker"+(h?" touchmove.clockpicker":""),k="mouseup.clockpicker"+(h?" touchend.clockpicker":""),m=navigator.vibrate?"vibrate":navigator.webkitVibrate?"webkitVibrate":null,v=0,f=135,b=110,g=80,w=20,y=2*f,A=l?350:1,M=['<div class="clockpicker picker">','<div class="picker__holder">','<div class="picker__frame">','<div class="picker__wrap">','<div class="picker__box">','<div class="picker__date-display">','<div class="clockpicker-display">','<div class="clockpicker-display-column">','<span class="clockpicker-span-hours text-primary"></span>',":",'<span class="clockpicker-span-minutes"></span>',"</div>",'<div class="clockpicker-display-column clockpicker-display-am-pm">','<div class="clockpicker-span-am-pm"></div>',"</div>","</div>","</div>",'<div class="picker__calendar-container">','<div class="clockpicker-plate">','<div class="clockpicker-canvas"></div>','<div class="clockpicker-dial clockpicker-hours"></div>','<div class="clockpicker-dial clockpicker-minutes clockpicker-dial-out"></div>',"</div>",'<div class="clockpicker-am-pm-block">',"</div>","</div>",'<div class="picker__footer">',"</div>","</div>","</div>","</div>","</div>","</div>"].join("");s.DEFAULTS={"default":"",fromnow:0,donetext:"Done",autoclose:!1,ampmclickable:!1,darktheme:!1,twelvehour:!0,vibrate:!0},s.prototype.toggle=function(){this[this.isShown?"hide":"show"]()},s.prototype.locate=function(){var t=this.element,i=this.popover;t.offset(),t.outerWidth(),t.outerHeight(),this.options.align;i.show()},s.prototype.show=function(t){if(this.setAMorPM=function(t){var i=t,e="pm"==t?"am":"pm";this.options.twelvehour&&(this.amOrPm=i.toUpperCase(),this.options.ampmclickable?(this.spanAmPm.children("#click-"+i).addClass("text-primary"),this.spanAmPm.children("#click-"+e).removeClass("text-primary")):(this.amPmBlock.children("."+e+"-button").removeClass("active"),this.amPmBlock.children("."+i+"-button").addClass("active"),this.spanAmPm.empty().append(this.amOrPm)))},!this.isShown){o(this.options.beforeShow),c(":input").each(function(){c(this).attr("tabindex",-1)});var e=this;this.input.blur(),this.popover.addClass("picker--opened"),this.input.addClass("picker__input picker__input--active"),c(document.body).css("overflow","hidden"),this.isAppended||(this.options.hasOwnProperty("container")?this.popover.appendTo(this.options.container):this.popover.insertAfter(this.input),this.setAMorPM("pm"),n.on("resize.clockpicker"+this.id,function(){e.isShown&&e.locate()}),this.isAppended=!0);var s=((this.input.prop("value")||this.options["default"]||"")+"").split(":");if(this.options.twelvehour&&"undefined"!=typeof s[1]&&(s[1].includes("AM")?this.setAMorPM("am"):this.setAMorPM("pm"),s[1]=s[1].replace("AM","").replace("PM","")),"now"===s[0]){var r=new Date(+new Date+this.options.fromnow);r.getHours()>=12?this.setAMorPM("pm"):this.setAMorPM("am"),s=[r.getHours(),r.getMinutes()]}this.hours=+s[0]||0,this.minutes=+s[1]||0,this.spanHours.html(i(this.hours)),this.spanMinutes.html(i(this.minutes)),this.toggleView("hours"),this.locate(),this.isShown=!0,a.on("click.clockpicker."+this.id+" focusin.clockpicker."+this.id,function(t){var i=c(t.target);0===i.closest(e.popover.find(".picker__wrap")).length&&0===i.closest(e.input).length&&e.hide()}),a.on("keyup.clockpicker."+this.id,function(t){27===t.keyCode&&e.hide()}),o(this.options.afterShow)}},s.prototype.hide=function(){o(this.options.beforeHide),this.input.removeClass("picker__input picker__input--active"),this.popover.removeClass("picker--opened"),c(document.body).css("overflow","visible"),this.isShown=!1,c(":input").each(function(t){c(this).attr("tabindex",t+1)}),a.off("click.clockpicker."+this.id+" focusin.clockpicker."+this.id),a.off("keyup.clockpicker."+this.id),this.popover.hide(),o(this.options.afterHide)},s.prototype.toggleView=function(t,i){var e=!1;"minutes"===t&&"visible"===c(this.hoursView).css("visibility")&&(o(this.options.beforeHourSelect),e=!0);var s="hours"===t,n=s?this.hoursView:this.minutesView,a=s?this.minutesView:this.hoursView;this.currentView=t,this.spanHours.toggleClass("text-primary",s),this.spanMinutes.toggleClass("text-primary",!s),a.addClass("clockpicker-dial-out"),n.css("visibility","visible").removeClass("clockpicker-dial-out"),this.resetClock(i),clearTimeout(this.toggleViewTimer),this.toggleViewTimer=setTimeout(function(){a.css("visibility","hidden")},A),e&&o(this.options.afterHourSelect)},s.prototype.resetClock=function(t){var i=this.currentView,e=this[i],s="hours"===i,o=Math.PI/(s?6:30),c=e*o,n=s&&e>0&&e<13?g:b,a=Math.sin(c)*n,r=-Math.cos(c)*n,l=this;p&&t?(l.canvas.addClass("clockpicker-canvas-out"),setTimeout(function(){l.canvas.removeClass("clockpicker-canvas-out"),l.setHand(a,r)},t)):this.setHand(a,r)},s.prototype.setHand=function(t,e,s,o){var n,a=Math.atan2(t,-e),r="hours"===this.currentView,l=Math.PI/(r||s?6:30),h=Math.sqrt(t*t+e*e),u=this.options,d=r&&h<(b+g)/2,k=d?g:b;if(u.twelvehour&&(k=b),a<0&&(a=2*Math.PI+a),n=Math.round(a/l),a=n*l,u.twelvehour?r?0===n&&(n=12):(s&&(n*=5),60===n&&(n=0)):r?(12===n&&(n=0),n=d?0===n?12:n:0===n?0:n+12):(s&&(n*=5),60===n&&(n=0)),r?this.fg.setAttribute("class","clockpicker-canvas-fg"):n%5==0?this.fg.setAttribute("class","clockpicker-canvas-fg"):this.fg.setAttribute("class","clockpicker-canvas-fg active"),this[this.currentView]!==n&&m&&this.options.vibrate&&(this.vibrateTimer||(navigator[m](10),this.vibrateTimer=setTimeout(c.proxy(function(){this.vibrateTimer=null},this),100))),this[this.currentView]=n,this[r?"spanHours":"spanMinutes"].html(i(n)),!p)return void this[r?"hoursView":"minutesView"].find(".clockpicker-tick").each(function(){var t=c(this);t.toggleClass("active",n===+t.html())});o||!r&&n%5?(this.g.insertBefore(this.hand,this.bearing),this.g.insertBefore(this.bg,this.fg),this.bg.setAttribute("class","clockpicker-canvas-bg clockpicker-canvas-bg-trans")):(this.g.insertBefore(this.hand,this.bg),this.g.insertBefore(this.fg,this.bg),this.bg.setAttribute("class","clockpicker-canvas-bg"));var v=Math.sin(a)*(k-w),f=-Math.cos(a)*(k-w),y=Math.sin(a)*k,A=-Math.cos(a)*k;this.hand.setAttribute("x2",v),this.hand.setAttribute("y2",f),this.bg.setAttribute("cx",y),this.bg.setAttribute("cy",A),this.fg.setAttribute("cx",y),this.fg.setAttribute("cy",A)},s.prototype.done=function(){o(this.options.beforeDone),this.hide(),this.label.addClass("active");var t=this.input.prop("value"),e=i(this.hours)+":"+i(this.minutes);this.options.twelvehour&&(e+=this.amOrPm),this.input.prop("value",e),e!==t&&(this.input.triggerHandler("change"),this.isInput||this.element.trigger("change")),this.options.autoclose&&this.input.trigger("blur"),o(this.options.afterDone)},s.prototype.remove=function(){this.element.removeData("clockpicker"),this.input.off("focus.clockpicker click.clockpicker"),this.isShown&&this.hide(),this.isAppended&&(n.off("resize.clockpicker"+this.id),this.popover.remove())},c.fn.pickatime=function(t){var i=Array.prototype.slice.call(arguments,1);return this.each(function(){var e=c(this),o=e.data("clockpicker");if(o)"function"==typeof o[t]&&o[t].apply(o,i);else{var n=c.extend({},s.DEFAULTS,e.data(),"object"==typeof t&&t);e.data("clockpicker",new s(e,n))}})}}();