Added support for time-only datepicker

diff --git a/wcfsetup/install/files/js/WoltLab/WCF/Date/Picker.js b/wcfsetup/install/files/js/WoltLab/WCF/Date/Picker.js
index fc4eaff97a61aea66de628e76e1a3f358b8dc088..00804f2b858bd64c395cee497028a2ffa2318cfc 100644 (file)
--- a/wcfsetup/install/files/js/WoltLab/WCF/Date/Picker.js
+++ b/wcfsetup/install/files/js/WoltLab/WCF/Date/Picker.js
@@ -48,15 +48,26 @@ define(['DateUtil', 'Language', 'ObjectMap', 'Dom/ChangeListener', 'Ui/Alignment
                                element.readOnly = true;
                                
                                var isDateTime = (elAttr(element, 'type') === 'datetime');
+                               var isTimeOnly = (isDateTime && elDataBool(element, 'time-only'));
                                
                                elData(element, 'is-date-time', isDateTime);
+                               elData(element, 'is-time-only', isTimeOnly);
                                
                                // convert value
                                var date = null, value = elAttr(element, 'value');
                                if (elAttr(element, 'value')) {
-                                       date = new Date(value);
+                                       if (isDateTime) {
+                                               date = new Date();
+                                               var tmp = value.split(':');
+                                               date.setHours(tmp[0], tmp[1]);
+                                       }
+                                       else {
+                                               date = new Date(value);
+                                       }
+                                       
                                        elData(element, 'value', date.getTime());
-                                       value = DateUtil['formatDate' + (isDateTime ? 'Time' : '')](date);
+                                       var format = (isTimeOnly) ? 'formatTime' : ('formatDate' + (isDateTime ? 'Time' : '')); 
+                                       value = DateUtil[format](date);
                                }
                                
                                var isEmpty = (value.length === 0);
@@ -90,7 +101,12 @@ define(['DateUtil', 'Language', 'ObjectMap', 'Dom/ChangeListener', 'Ui/Alignment
                                shadowElement.type = 'hidden';
                                
                                if (date !== null) {
-                                       shadowElement.value = DateUtil.format(date, (isDateTime) ? 'c' : 'Y-m-d');
+                                       if (isTimeOnly) {
+                                               shadowElement.value = DateUtil.format(date, 'H:i');
+                                       }
+                                       else {
+                                               shadowElement.value = DateUtil.format(date, (isDateTime) ? 'c' : 'Y-m-d');
+                                       }
                                }
                                
                                element.parentNode.insertBefore(shadowElement, element);
@@ -143,6 +159,7 @@ define(['DateUtil', 'Language', 'ObjectMap', 'Dom/ChangeListener', 'Ui/Alignment
                                        
                                        isDateTime: isDateTime,
                                        isEmpty: isEmpty,
+                                       isTimeOnly: isTimeOnly,
                                        
                                        onClose: null
                                });
@@ -251,6 +268,8 @@ define(['DateUtil', 'Language', 'ObjectMap', 'Dom/ChangeListener', 'Ui/Alignment
                                _datePicker.classList.remove('datePickerTime');
                        }
                        
+                       _datePicker.classList[(data.isTimeOnly) ? 'add' : 'remove']('datePickerTimeOnly');
+                       
                        this._renderPicker(date.getDate(), date.getMonth(), date.getFullYear());
                        
                        UiAlignment.set(_datePicker, _input);
@@ -436,8 +455,14 @@ define(['DateUtil', 'Language', 'ObjectMap', 'Dom/ChangeListener', 'Ui/Alignment
                                        _dateMinute.value
                                );
                                
-                               value = DateUtil.formatDateTime(date);
-                               shadowValue = DateUtil.format(date, 'c');
+                               if (data.isTimeOnly) {
+                                       value = DateUtil.formatTime(date);
+                                       shadowValue = DateUtil.format(date, 'H:i');
+                               }
+                               else {
+                                       value = DateUtil.formatDateTime(date);
+                                       shadowValue = DateUtil.format(date, 'c');
+                               }
                        }
                        else {
                                date = new Date(

diff --git a/wcfsetup/install/files/style/ui/datePicker.scss b/wcfsetup/install/files/style/ui/datePicker.scss
index fd0d06ed5dc91d8a12fdaef75772152d6d6dfe0e..52bbb44081d15c27e5eff0fe4a7e989cccfc1cae 100644 (file)
--- a/wcfsetup/install/files/style/ui/datePicker.scss
+++ b/wcfsetup/install/files/style/ui/datePicker.scss
@@ -18,8 +18,21 @@
                display: block;
        }
        
-       &.datePickerTime > footer {
-               display: block;
+       &.datePickerTime {
+               &.datePickerTimeOnly {
+                       > header,
+                       > ul {
+                               display: none;
+                       }
+                       
+                       > footer {
+                               border-top-width: 0;
+                       }
+               }
+               
+               > footer {
+                       display: block;
+               }
        }
        
        > header {