Improve UI of date entry

Along with Make End Dates optional and add assistance for entering them I also posted Make all-day events less specific. The two issues are different but somewhat related. IMHO, the concept of "all day" is too specific, and generalizing it to "show or hide the time part" would make it applicable to a broader range of situations.

It would help to get a decision on the latter issue, because it can affect the UI of date entry.

Some comments on eventful.com:

1. It does not work when JavaScript is disabled! The "Ends" fields are disabled by default, and you can't enable them without JavaScript. Whatever we do, it must work with JavaScript disabled.
2. eventful.com's +/- support is cute, up/down is ambiguous, and left/right is not supported;
   Under Firefox, Event's comboboxes support left/right (besides up/down), even without JavaScript (!), they support typing just like eventful.com's edit fields, plus they support mouse selection with any browser!

   The one downside to the comboboxes is that they are limited to 20 items, and it's inconvenient when you have to scroll. However, this could be eased by letting the (24h) hours start with 05 and wrap around, putting the rarely used 01..04 below the fold; the minutes could be rearranged as 00, 05, 10, ... 55, --, 01, 02, 03, etc., putting all multiples of 5 within easy reach and still keeping the one-minute resolution that killes seems to like.

3. Synchronously moving the "Ends" along with the "Starts" is cute, but it introduces considerable complexity and I see no real benefit.
4. eventful.com labels "Mon" and "Day", but Event's way of using month names is superior. If Americans can't get used to having the day precede the month, we might be able to settle for YYYY-Month-DD?
5. Having a choice between 12h and 24h format is great, I have no preference between comboboxes or radiobuttons for the AM/PM.

Based on the ideas in #1 and #2 I'd propose something like this (shown for the 24h clock):

1. with JavaScript enabled:
   

   [X] show time
   Start: [31] [May     v] [2007]+/- — [08v]:[00v]     [ ] show end
   

   show time would work just like all day works now, only reversed (positive logic).
   If the user checks show end, we would make the End controls visible and set them to the same values as Start (which have just been entered by the user).
   The +/- could be text links to increment/decrement the year with a mouse click. This would be nice in December, when most events go into 2008...
    

2. with JavaScript disabled:
   

   [X] show time
   Start: [31] [May     v] [2007] — [08v]:[00v]     [X] show end
   End:   [31] [May     v] [2007] — [08v]:[00v]
   

   Here, everything needs to be (and remain) visible for technical reasons, but unchecking either checkbox would cause the PHP code to ignore the values that aren't needed.

I'm sorry, Michelle, but this is much closer to the current Event than to eventful.com — Event has a lot going for it...

Hans

Day preceding month? NO WAY! I'm American and there is no way I would support that. With YYYY-MM-DD you can still [string] compare to see if one is greater than or less that the other. If you go with YYYY-DD-MM, no comparison is possible. This is one of the ideas behind the ISO- and RFC-standard formats. Don't even think of using month names or something really dumb like DD-MM-YYYY.

BTW, just to be picky, there are "Americans" who are not US citizens. Last time I looked Canada, Mexico, and Argentina (and others) were all in an America, so they are Americans too. ;-)

Text boxes I don't care, it never bothered me that it was that way already. I'm more concerned about the way it's stored and used by code.

#4: 1) Yes, turning off / removing with JS is ok, but it needs to be there by default. Alternatively, in a straight html file, the two could be completely separate, but I'm not sure whether it's possible to get it through Drupal that way.

2) I like interfaces that work with the mouse as well as with the keyboard. What do you think about reordering the combobox items?

Haven't looked at the pop-up calendar yet. Will do, but I'm very short on time for the next couple of days.

"use" is better for the JS-less version. Maybe we can keep "show" for the JS version to give it an active meaning?

I don't usually do JavaScript, but if we can keep it along the lines we've outlined this far, then it shouldn't be too hard, and I'll give it a try, starting with what we have and building on that. This will not be quick though, and I'll need a competent reviewer...

#5: This is all about the UI. I expect PHP to give the single field numbers and localized month names and take back single field numbers.

[Re: Americans vs. US citizens: the odd MM/DD/YY format isn't confined to the US, is it?]

Currently, event_all_day is a separate module. We're talking as if it were part of the main module. Does it need to remain separate???

With "2)" I meant the reordering of the combobox items. Since no on has commented on that yet, I'll repeat it here (taken from #2.2):

The one downside to the comboboxes is that they are limited to 20 items, and it's inconvenient when you have to scroll. However, this could be eased by letting the (24h) hours start with 05 and wrap around, putting the rarely used 01..04 below the fold; the minutes could be rearranged as 00, 05, 10, ... 55, --, 01, 02, 03, etc., putting all multiples of 5 within easy reach and still keeping the one-minute resolution that killes seems to like.

This should go a long way towards satisfying the various requests for having less than 60 items in the minutes combobox, but it is a bit unusual. What do you think?

I don't know much about the technical side of things here, but I do like the screenshot that Michelle added. The only concern I might have for something like this, is will it break a design in the center of a page with a 3 column layout? A lot of these widgets are great for two column layouts, but really mess things up when you get into 3 columns. Just a thought.

Cheers,
Trae

Trae, it doesn't seem that much different than the current layout, and I do use a three column theme with no problems.

Add a checkbox (and flag in the database table)

[X] adjust time to the user's time zone

according to /node/153409. This would only be visible if the site was set to allow each user to configure the timezone. I'm not sure whether it should be checked or unchecked by default...

Note: Right now changing the site's time zone (such as to/from daylight savings time) leaves the daytimes alone, which must be preserved.

Hi, I'm just following up from the pointer Salvis gave me about this thread. I'd like to help if I can. I was attempting to figure out how to fix the 12/24 hour issues I ran into. I'm fairly comfortable with PHP and Javascript. I like the UI suggestions, I need to get more familiar with the coding environment - I recently started working with Drupal and would like to pitch in where I can.

The event calendar is a great module, I see a lot of folks getting a lot of mileage out of it. So, I'd be happy to help with the javascript and any other work being done on the calendar.

The thread where I was trying to fix my hide all day & 12/24 hour issues is at:
http://drupal.org/node/162659

Eric

Relatively new to Drupal and have run into the issue where I want to use a JS popup calendar.

Was surprised it was not an option for event. Now after setting up a CCK node type with date.module and its pretty good JS entry, I'm seeing that signup.module has some features hard coded to event.module

Sigh.

I'm a bit baffled why there isn't discussion of having event use date and the date api

-P

I looked for this in release notes, documentation, and the issues queue and find no mention of it?

How would someone use a single date field with jstools where the module uses several to represent a date?

Also, the jstools project page says their calendar is deprecated past v5:
http://drupal.org/project/jstools

Jscalendar
Popup calendar library using the Jscalendar library. To use, simply add a 'jscalendar' class to a textfield. As the Jscalendar library is no longer maintained, this module is deprecated past Drupal 5. There are jQuery-based alternatives.

The reason to have a better date input with event instead of using date is to preserve the use of module written specifically to coordinate with the event module, though at least the signup module is also working to support the date CCK module http://drupal.org/node/86462

Are there any tips, or snippets on getting the jstools calendar working?

-P

subscribing

Event for Drupal 8 is unrelated to older versions. If an issue similar to this one exists, please open a new issue with the 8.x branch.