Date and Time Picker: Streamlining

1 Requirements

Requirement 1: Redesign - Date/timepicker. Actual, users must click in max. 5 dropdowns to set the date and time he wishes. And a scrollbar is necessary in the Date and Hour dropdowns. A redesign of this picker could help.
 
I add two movies, the ILIAS Date-Time picker, and an example of an intuitive Date-Time picker, all in Overlay. Users just have to click in the field, and a Overlay occurs. Testing here: http://jsfiddle.net/Kz8ne/
 
What do you think about a redesign?

Requirement 2: Streamlining timepicker
 
There are different possibilities to choose starting and ending time in ILIAS with the ILIAS timepicker.
 
v1: In the settings of a session, when you change the "Start Date and Time", then the "End Date and Time" immediately adapt the "Start Date and Time". It starts at 08:00 and ends at 16:00. Small problem for some users: When Users set first the "End Date and Time" and then the "First Date and Time", then ILIAS also "corrects" die "End Date and Time".

v2: In the course-settings, ILIAS users can change the default "Starting Date and Time" (actual date) and "Ending Time" (actual date + 10 month = 24. 01. 2014 - 12. 12. 2014). Starting and Ending TimePicker are independent (a change in the Starting Time does nothing in the Ending time, and vice versa).

v3: You can choose a timepicker in the Availability of an object: eg. "Temorarily Avilable".
Starting Time and Ending Time use the actual date. If you change the starting time, then the ending time does not change. There are no connections between start and end time.

v1 and v2 are solutions that fits to the needs of teachers.
 
- Small issue in v1: If you change the ending time first, and then you you change the Starting-time, then it feels strange that this action will change the ending time.
- Discussion for v2 in courses: If you change the Starting time, then the Ending time maybe should change, too.
 
v3 should have an adapting of the ending time.
 

1.1 External Libs

• Datepicker from jQuery UI
• Trent Richardsons Timepicker Extension

1.2 Missing Guideline

JL says <http://www.ilias.de/mantis/view.php?id=12505>:
 
"We already had several bug reports from mkunkel about this. But there is no
guideline yet. In fact these are 2 different input GUIs:
a) period input GUI: does support the automatic adapting of the ending time
b) date/time input GUI: no connection between start and end
You will find both variations all over ILIAS."

Bug-Reports from MK:

2 Additional Information

• Idea / concept: Hansjörg Lauener
• Interest in funding: ILIAS-Verein as part of the Design Revision Part 2
• Maintainer: Meyer, Stefan [smeyer]
• Implementation of the feature is done by (company, developer)
• Testcases: Leifos

3 Discussion

AK 24 Feb 2014: I support the general idea. We should remove the old calendar widget and remove it with a jQuery UI based version. Having a text field instead of drop down selection lists as a basic input element increases usability, too. I will add the links to the libraries. The time selector should be discussed. I think a separate input field for the time could make thinks clearer.

Alex Killing, 10 Apr 2014: We discussed this with Stefan Meyer. He supports the idea.

JF 14 Apr 2014: We support the idea and schedule it for 4.5. We prefer v1 for the behaviour of start/end dates. If possible the datepicker should support historical dates (dates before 1971/1900). We are unsure, if sliders for time selection are the best solution, other suggestions are welcome.

MST 14 Apr 2014: What do you think about this example, for choosing the time? http://mugifly.github.io/jquery-simple-datetimepicker/jquery.simple-dtpicker.html.

Matthias Kunkel, March 18, 2015: This feature was already scheduled for 5.0 but not implemented due to missing funding / time. There is still a need for this feature. Therefore I have re-scheduled it for 5.1 to save time for discussing new feature requests. Nevertheless, funding is still needed to make this feature go into the 5.1 version.

Kunkel, Matthias [mkunkel], September 01, 2015: This feature is part of DR 5.1 - Issue 06: Date/Time input fields on Small media Devices and will be realised for 5.2.

4 Implementation

see DR 5.1 - Issue 06: Date/Time input fields on Small media Devices