Improves WCF.Date.Picker

Closes #1427

diff --git a/com.woltlab.wcf/templates/headInclude.tpl b/com.woltlab.wcf/templates/headInclude.tpl
index e74ca760fc9f4e75f1d8df33d731004ad66d0fb3..ade02b605a269a7e082c2acdf2d558000f7375b3 100644 (file)
--- a/com.woltlab.wcf/templates/headInclude.tpl
+++ b/com.woltlab.wcf/templates/headInclude.tpl
@@ -121,6 +121,7 @@
                        'wcf.global.page.pageNavigation': '{lang}wcf.global.page.pageNavigation{/lang}',
                        'wcf.global.page.next': '{capture assign=pageNext}{lang}wcf.global.page.next{/lang}{/capture}{@$pageNext|encodeJS}',
                        'wcf.global.page.previous': '{capture assign=pagePrevious}{lang}wcf.global.page.previous{/lang}{/capture}{@$pagePrevious|encodeJS}',
+                       'wcf.global.pageDirection': '{lang}wcf.global.pageDirection{/lang}',
                        'wcf.global.success': '{lang}wcf.global.success{/lang}',
                        'wcf.global.success.add': '{lang}wcf.global.success.add{/lang}',
                        'wcf.global.success.edit': '{lang}wcf.global.success.edit{/lang}',

diff --git a/wcfsetup/install/files/acp/templates/header.tpl b/wcfsetup/install/files/acp/templates/header.tpl
index 1e888199e26cb54d010de5d44e9f279fdb4a1aa0..739297b5fcb4fa70137ce6f85c0a5356e941d84d 100644 (file)
--- a/wcfsetup/install/files/acp/templates/header.tpl
+++ b/wcfsetup/install/files/acp/templates/header.tpl
@@ -91,6 +91,7 @@
                                'wcf.global.page.pageNavigation': '{lang}wcf.global.page.pageNavigation{/lang}',
                                'wcf.global.page.next': '{capture assign=pageNext}{lang}wcf.global.page.next{/lang}{/capture}{@$pageNext|encodeJS}',
                                'wcf.global.page.previous': '{capture assign=pagePrevious}{lang}wcf.global.page.previous{/lang}{/capture}{@$pagePrevious|encodeJS}',
+                               'wcf.global.pageDirection': '{lang}wcf.global.pageDirection{/lang}',
                                'wcf.global.success': '{lang}wcf.global.success{/lang}',
                                'wcf.global.success.add': '{lang}wcf.global.success.add{/lang}',
                                'wcf.global.success.edit': '{lang}wcf.global.success.edit{/lang}',

diff --git a/wcfsetup/install/files/js/WCF.js b/wcfsetup/install/files/js/WCF.js
index d171e857bae72d88a4378219b0018cafd15f5c42..955ec19c91a76141aad2941fbdd78668b61814b8 100755 (executable)
--- a/wcfsetup/install/files/js/WCF.js
+++ b/wcfsetup/install/files/js/WCF.js
@@ -2736,10 +2736,12 @@ WCF.Date.Picker = {
         * Initializes the date picker for valid fields.
         */
        _initDatePicker: function() {
-               $('input[type=date]:not(.jsDatePicker)').each($.proxy(function(index, input) {
+               $('input[type=date]:not(.jsDatePicker), input[type=datetime]:not(.jsDatePicker)').each($.proxy(function(index, input) {
                        var $input = $(input);
                        var $inputName = $input.prop('name');
-                       var $inputValue = $input.val(); // should be Y-m-d, must be interpretable by Date
+                       var $inputValue = $input.val(); // should be Y-m-d (H:i:s), must be interpretable by Date
+                       
+                       var $hasTime = $input.attr('type') == 'datetime';
                        
                        // update $input
                        $input.prop('type', 'text').addClass('jsDatePicker');
@@ -2751,8 +2753,12 @@ WCF.Date.Picker = {
                        $input.removeAttr('name');
                        $input.before('<input type="hidden" id="' + $input.wcfIdentify() + 'DatePicker" name="' + $inputName + '" value="' + $inputValue + '" />');
                        
+                       // max- and mindate
+                       var $maxDate = $input.attr('max') ? new Date($input.attr('max').replace(' ', 'T')) : null;
+                       var $minDate = $input.attr('min') ? new Date($input.attr('min').replace(' ', 'T')) : null;
+                       
                        // init date picker
-                       $input.datepicker({
+                       $options = {
                                altField: '#' + $input.wcfIdentify() + 'DatePicker',
                                altFormat: 'yy-mm-dd', // PHPs strtotime() understands this best
                                beforeShow: function(input, instance) {
@@ -2772,89 +2778,52 @@ WCF.Date.Picker = {
                                dayNames: WCF.Language.get('__days'),
                                dayNamesMin: WCF.Language.get('__daysShort'),
                                dayNamesShort: WCF.Language.get('__daysShort'),
+                               isRTL: WCF.Language.get('wcf.global.pageDirection') == 'rtl',
+                               maxDate: $maxDate,
+                               minDate: $minDate,
                                monthNames: WCF.Language.get('__months'),
                                monthNamesShort: WCF.Language.get('__monthsShort'),
-                               showOtherMonths: true,
-                               yearRange: ($input.hasClass('birthday') ? '-100:+0' : '1900:2038'),
+                               showButtonPanel: false,
                                onClose: function(dateText, datePicker) {
                                        // clear altField when datepicker is cleared
                                        if (dateText == '') {
                                                $(datePicker.settings["altField"]).val(dateText);
                                        }
-                               }
-                       });
+                               },
+                               showOtherMonths: true,
+                               yearRange: ($input.hasClass('birthday') ? '-100:+0' : '1900:2038')
+                       };
                        
-                       // format default date
-                       if ($inputValue) {
-                               $input.datepicker('setDate', $inputValue);
+                       if ($hasTime) {
+                               // drop the seconds
+                               if (/[0-9]{2}:[0-9]{2}:[0-9]{2}$/.test($inputValue)) {
+                                       $inputValue = $inputValue.replace(/:[0-9]{2}$/, '');
+                                       $input.val($inputValue);
+                               }
+                               $inputValue = $inputValue.replace(' ', 'T');
+                               
+                               $options = $.extend($options, {
+                                       altFieldTimeOnly: false,
+                                       altTimeFormat: 'HH:mm',
+                                       controlType: 'select',
+                                       hourText: WCF.Language.get('wcf.date.hour'),
+                                       minuteText: WCF.Language.get('wcf.date.minute'),
+                                       showTime: false,
+                                       timeFormat: this._timeFormat,
+                                       yearRange: ($input.hasClass('birthday') ? '-100:+0' : '1900:2038')
+                               });
                        }
                        
-                       // bug workaround: setDate creates the widget but unfortunately doesn't hide it...
-                       $input.datepicker('widget').hide();
-               }, this));
-               
-               $('input[type=datetime]:not(.jsDatePicker)').each($.proxy(function(index, input) {
-                       var $input = $(input);
-                       var $inputName = $input.prop('name');
-                       var $inputValue = $input.val(); // should be Y-m-d H:i:s, must be interpretable by Date
-                       
-                       // drop the seconds
-                       if (/[0-9]{2}:[0-9]{2}:[0-9]{2}$/.test($inputValue)) {
-                               $inputValue = $inputValue.replace(/:[0-9]{2}$/, '');
-                               $input.val($inputValue);
+                       if ($hasTime) {
+                               $input.datetimepicker($options);
+                       }
+                       else {
+                               $input.datepicker($options);
                        }
-                       
-                       // update $input
-                       $input.prop('type', 'text').addClass('jsDatePicker');
-                       
-                       // insert a hidden element representing the actual date
-                       $input.removeAttr('name');
-                       $input.before('<input type="hidden" id="' + $input.wcfIdentify() + 'DatePicker" name="' + $inputName + '" value="' + $inputValue + '" />');
-                       
-                       // init date picker
-                       $input.datetimepicker({
-                               altField: '#' + $input.wcfIdentify() + 'DatePicker',
-                               altFieldTimeOnly: false,
-                               altFormat: 'yy-mm-dd', // PHPs strtotime() understands this best
-                               altTimeFormat: 'HH:mm',
-                               beforeShow: function(input, instance) {
-                                       // dirty hack to force opening below the input
-                                       setTimeout(function() {
-                                               instance.dpDiv.position({
-                                                       my: 'left top',
-                                                       at: 'left bottom',
-                                                       collision: 'none',
-                                                       of: input
-                                               });
-                                       }, 1);
-                               },
-                               changeMonth: true,
-                               changeYear: true,
-                               controlType: 'select',
-                               dateFormat: this._dateFormat,
-                               dayNames: WCF.Language.get('__days'),
-                               dayNamesMin: WCF.Language.get('__daysShort'),
-                               dayNamesShort: WCF.Language.get('__daysShort'),
-                               hourText: WCF.Language.get('wcf.date.hour'),
-                               minuteText: WCF.Language.get('wcf.date.minute'),
-                               monthNames: WCF.Language.get('__months'),
-                               monthNamesShort: WCF.Language.get('__monthsShort'),
-                               showButtonPanel: false,
-                               showTime: false,
-                               showOtherMonths: true,
-                               timeFormat: this._timeFormat,
-                               yearRange: ($input.hasClass('birthday') ? '-100:+0' : '1900:2038'),
-                               onClose: function(dateText, datePicker) {
-                                       // clear altField when datepicker is cleared
-                                       if (dateText == '') {
-                                               $(datePicker.settings.altField).val('');
-                                       }
-                               }
-                       });
                        
                        // format default date
                        if ($inputValue) {
-                               $input.removeClass('hasDatepicker').datetimepicker('setDate', new Date($inputValue.replace(' ', 'T')));
+                               $input.datepicker('setDate', $inputValue);
                        }
                        
                        // bug workaround: setDate creates the widget but unfortunately doesn't hide it...