Opened 12 years ago

Closed 12 years ago

Last modified 9 years ago

#4426 closed defect (fixed)

TimeTextBox UI impractical for high granularity selection (ex: 5 minute intervals)

Reported by: alex Owned by: haysmark
Priority: high Milestone: 1.0
Component: Dijit - Form Version: 0.9
Keywords: 4alex Cc: alex, Adam Peller, Douglas Hays, bill
Blocked By: Blocking:

Description

The new time picker widget is nearly unusable. It's ugly, hard to get through, the quarter-hour spaces between hours provide nearly zero data about what they are, keyboard up-and-down arrows do not appear to affect the selection (at least on Safari and FF), and on Safari the popups on all widgets in the validation test page are off.

See http://dojotoolkit.org/~alex/anon_view/dijit/tests/form/test_validate.html

Change History (10)

comment:1 Changed 12 years ago by Adam Peller

Cc: Adam Peller haysmark bill added

ok, two issues - a) the widget isn't complete (doesn't show selection, needs more work on safari) and b) you don't like it. Is it possible the two are related? Is it style or function you've got a problem with? Let's try to be specific. I think the widget works well and offers a good deal of flexibility. It's also somethng we can localize.

comment:2 Changed 12 years ago by Adam Peller

Cc: Douglas Hays added; haysmark removed
Owner: set to haysmark

comment:3 Changed 12 years ago by alex

Ok, getting very specific:

Selecting hour and sub-hour time intervals in the same long list is just painful. It's hard to navigate in order to set the time quickly, and having them conjoined in a space-inefficient manner as they are today is a very, very broken design. Web apps authors would be better served by us generating a set of 2 or 3 <select> elements with hour/minute/ampm or the local equivalent versus the current rendering. A much better UI would be that of times in Apple's iCal. Each field is textual and the up/down arrow buttons treat them like a spinner. You get the benefit of "free" entry with validation and space efficiency. The current time picker widget has NONE of those advantages.

As for what can be localized, I think that's putting the cart before the horse. We need to propose a good design and then figure out how to localize it, not settle on a shitty UI because we *know* we can localize it.

comment:4 Changed 12 years ago by haysmark

Refer to #599. That is what bill wanted to base our time picking widget off of and it, too, suffers from the same usability problem you describe. But then, no one said NO to that ticket so it was implemented as-is and consequently made it into 0.9 as-is.

There are some dups in this ticket, so let's clarify that we already have these two issues in the 1.0 pipeline:

  • Lack of style: #4133 (widgets without theming are ugly and confusing in general)
  • Popup in wrong place: #4325 (dojo.coords bug affecting all popups in Safari)

The widget will be much more usable after the assigned people fix the above two issues for 1.0.

comment:5 Changed 12 years ago by Adam Peller

Alex - you are a little late to the party :) an argument in favor of this approach is that it is a graphical interface that parallels the calendar popup. We had a spinner before and I don't think it worked well, but we can reconsider, and perhaps we can offer a choice? Localization is something we have to look at right away. Why work on a design when we can look at it right away and know it's not localizable? We did this in 0.4 and wasted a lot of time. This should not imply we have to settle for something shitty.

Mark - please consider making test pages for time (and date) text boxes and perhaps the _TimePicker alone. Also, I believe there is a selection bug?

comment:6 Changed 12 years ago by bill

Milestone: 1.01.1
Summary: time picker widget looks awful, lacks individual test page, pops up in wrong place on Safari 3TimeTextBox UI impractical for high granularity selection (ex: 5 minute intervals)

It's true that the current design won't be practical if you have finer granularity than half-hour increments. On the other hand, if you have one hour granularity than having three <select> boxes is overkill. But yes, in general, probably 3 drop down boxes is better.

As for localization, it might be a hassle with having three <select> boxes on the page... might need to have separate templates per language although I hope not. Alex and Peller are both right... we need to think about localization from the beginning, but we can't use localization as an excuse to make a bad UI.

Themeing is also something we need to worry about, which means that we can't use actual <select> boxes, because they won't match how Combobox/FilteringSelect? looks. Could use Spinner or FilteringSelect?, I guess.

In 0.4 we had spinner but it was just a single <input> box for the hours, minutes, and seconds with a bunch of fancy logic to control which field the spinner buttons adjusted.

I'm changing the "summary" of the bug to remove the duplicate issues already filed in other tickets.

comment:7 Changed 12 years ago by bill

Keywords: 4alex added

comment:8 Changed 12 years ago by haysmark

See [10953]. Now the quarter hours give very useful information about what they are as you mouse over.

comment:9 Changed 12 years ago by bill

Milestone: 1.11.0
Resolution: fixed
Status: newclosed

Given the above [10953] fix, and the fact (I forgot this before) that you can manually type in a time, I'm going to close this bug. Also, there is also a spinner time text box in dojox that you can use if you don't like this one.

comment:10 Changed 9 years ago by bill

Component: DijitDijit - Form
Note: See TracTickets for help on using tickets.