source: trunk/admin/themes/default/js/datepicker.js @ 29076

Last change on this file since 29076 was 28765, checked in by mistic100, 10 years ago

feature 3080: add cancel button, one minute granularity, fix missing css

File size: 3.8 KB
Line 
1jQuery.timepicker.log = jQuery.noop; // that's ugly, but the timepicker is acting weird and throws parsing errors
2
3jQuery.fn.pwgDatepicker = function(settings) {
4  var options = jQuery.extend(true, {
5    showTimepicker: false,
6    cancelButton: false,
7  }, settings || {});
8
9  return this.each(function() {
10    var $this = jQuery(this),
11        originalValue = $this.val(),
12        originalDate,
13        $target = jQuery('[name="'+ $this.data('datepicker') +'"]'),
14        linked = !!$target.length,
15        $start, $end;
16   
17    if (linked) {
18      originalValue = $target.val();
19    }
20
21    // custom setter
22    function set(date, init) {
23      if (date === '') date = null;
24      $this.datetimepicker('setDate', date);
25     
26      if ($this.data('datepicker-start') && $start) {
27        $start.datetimepicker('option', 'maxDate', date);
28      }
29      else if ($this.data('datepicker-end') && $end) {
30        if (!init) { // on init, "end" is not initialized yet (assuming "start" is before "end" in the DOM)
31          $end.datetimepicker('option', 'minDate', date);
32        }
33      }
34     
35      if (!date && linked) {
36        $target.val('');
37      }
38    }
39
40    // and custom cancel button
41    if (options.cancelButton) {
42      options.beforeShow = options.onChangeMonthYear = function() {
43        setTimeout(function() {
44          var buttonPane = $this.datepicker('widget')
45              .find('.ui-datepicker-buttonpane');
46         
47          if (buttonPane.find('.pwg-datepicker-cancel').length == 0) {
48            $('<button type="button">'+ options.cancelButton +'</button>')
49              .on('click', function() {
50                set(originalDate, false);
51                $this.datepicker('hide').blur();
52              })
53              .addClass('pwg-datepicker-cancel ui-state-error ui-corner-all')
54              .appendTo(buttonPane);
55          }
56        }, 1);
57      };
58    }
59
60    // init picker
61    $this.datetimepicker(jQuery.extend({
62      dateFormat: linked ? 'DD d MM yy' : 'yy-mm-dd',
63      timeFormat: 'HH:mm',
64     
65      altField: linked ? $target : null,
66      altFormat: 'yy-mm-dd',
67      altTimeFormat: options.showTimepicker ? 'HH:mm:ss' : '',
68     
69      autoSize: true,
70      changeMonth : true,
71      changeYear: true,
72      altFieldTimeOnly: false,
73      showSecond: false,
74      alwaysSetTime: false
75    }, options));
76   
77    // attach range pickers
78    if ($this.data('datepicker-start')) {
79      $start = jQuery('[data-datepicker="'+ $this.data('datepicker-start') +'"]');
80     
81      $this.datetimepicker('option', 'onClose', function(date) {
82        $start.datetimepicker('option', 'maxDate', date);
83      });
84     
85      $this.datetimepicker('option', 'minDate', $start.datetimepicker('getDate'));
86    }
87    else if ($this.data('datepicker-end')) {
88      $end = jQuery('[data-datepicker="'+ $this.data('datepicker-end') +'"]');
89     
90      $this.datetimepicker('option', 'onClose', function(date) {
91        $end.datetimepicker('option', 'minDate', date);
92      });
93    }
94   
95    // attach unset button
96    if ($this.data('datepicker-unset')) {
97      jQuery('#'+ $this.data('datepicker-unset')).on('click', function(e) {
98        e.preventDefault();
99        set(null, false);
100      });
101    }
102   
103    // set value from linked input
104    if (linked) {
105      var splitted = originalValue.split(' ');
106      if (splitted.length == 2 && options.showTimepicker) {
107        set(jQuery.datepicker.parseDateTime('yy-mm-dd', 'HH:mm:ss', originalValue), true);
108      }
109      else if (splitted[0].length == 10) {
110        set(jQuery.datepicker.parseDate('yy-mm-dd', splitted[0]), true);
111      }
112      else {
113        set(null, true);
114      }
115    }
116   
117    originalDate = $this.datetimepicker('getDate');
118   
119    // autoSize not handled by timepicker
120    if (options.showTimepicker) {
121      $this.attr('size', parseInt($this.attr('size'))+6);
122    }
123  });
124};
Note: See TracBrowser for help on using the repository browser.