I work with Acquia on improving the Date Repeat user interface. They would like to incorporate the change into Drupal Gardens. Here are a bunch of screenshots that show the new ui (according to their design):
Initial - https://skitch.com/temaruk/gm3uy/edit-date-test-daily-repeat-daterepeat....
Collect end date - https://skitch.com/temaruk/gm3u8/edit-date-test-daily-repeat-daterepeat....
DAILY - https://skitch.com/temaruk/gm3uu/edit-date-test-daily-repeat-daterepeat....
WEEKLY - https://skitch.com/temaruk/gm3uk/edit-date-test-daily-repeat-daterepeat....
MONTHLY - https://skitch.com/temaruk/gm3u7/edit-date-test-daily-repeat-daterepeat....
YEARLY - https://skitch.com/temaruk/gm3wb/edit-date-test-daily-repeat-daterepeat....
We would like the new UI to be part of the module. Patch will be attached in next comment.
| Comment | File | Size | Author |
|---|---|---|---|
| #32 | Date_repeat_ui_improvements-1354606-32.patch | 6.92 KB | temaruk |
| #30 | Date_repeat_ui_improvements-1354606-30.patch | 22.15 KB | temaruk |
| #24 | Date_repeat_ui_improvements-1354606-24.patch | 64.96 KB | temaruk |
| #23 | Date_repeat_ui_improvements-1354606-23.patch | 65.06 KB | temaruk |
| #14 | Google Calendar.jpg | 26.82 KB | karens |
Comments
Comment #1
temaruk commentedAttached the patch. It is against commit http://drupalcode.org/project/date.git/commit/6939eb1.
The commits can be checked at https://github.com/Yorirou/date.
Comment #2
arlinsandbulte commentedAfter just a quick glance, my only question/concern so far is the 'Never' option under 'Range of Repeat.'
Date does not handle an infinite number of repeats well... (rather it does not handle them at all IIRC).
Also, 'Range of Repeat' seems a bit un-intuitive. But I am not sure how to better describe that part. Perhaps 'Repeat Until' ...
Comment #3
temaruk commentedOther applications (possible suggestions):
Never means there will be no COUNT or UNTIL in the resulting RRULE.
Comment #4
karens commentedThe Date module does not support 'never' because we have no way to handle an infinite number of dates. That's why there is no such option now. Unless Acquia also wants to tackle the issue of how in the heck we can create a date field with unlimited values we need to hide that option.
Comment #5
temaruk commentedRerolled an updated patch against 7.x-2.0-alpha5.
Comment #6
karens commentedThe patch won't apply to dev at all. When I applied it to alpha5 I got a syntax error, Parse error: syntax error, unexpected T_FUNCTION in ../date/date_repeat/date_repeat_form.inc on line 1004. The code there looks like:
Which doesn't work at all, nor can I figure out what it should be doing.
Comment #7
temaruk commentedIn PHP 5.3 this is valid code. The error is because of the closure ( http://php.net/manual/en/functions.anonymous.php ), that is I wrote the callback function directly as the argument of array_filter(). This can be avoided if that closure is made into an actual function, like this (I also added a comment to explain what it does):
This function was needed because in the new design, some form elements that were select before became checkboxes. Further code expected the returned value to be in the format that is returned by a multiple select element. The checkboxes return value in a different format. Instead of changing the code in a lot of places, using this function, I made sure that the expected format will be returned.
Comment #8
temaruk commentedUpdated patch with fixing the problem above, also adds context for t()-s used in the repeat widget and contains some other changes as well. Still against 7.x-2.0-alpha5.
Comment #9
karens commentedCould you re-roll against dev?
Comment #10
temaruk commentedSure! Here it is, re-rolled against current dev!
Comment #11
temaruk commented@4: This has to be fixed/figured out. I suggest hiding/removing the option until there will be support for handling repeating without limit, and making it necessary to choose COUNT or UNTIL.
Comment #12
Noyz commentedKill it. Forcing a number into # of occurrences is probably sufficient
Comment #13
karens commentedI don't know what 'kill it' means. Do you mean hide the option or leave it in. I'm very confused about that comment.
The form seems to work fine so long as you choose an Until date, but if you choose a count instead the results are wrong. This is because there was logic in date_repeat.inc that assumed the only valid option was UNTIL. I am working on that. I got it working but my fix broke the date repeat tests, so I have to dig into it.
Comment #14
karens commentedI think I got the logic changes in date_repeat.inc and date_repeat_calc.inc figured out. I'm going to add an option to send and empty end day to date_repeat_calc.inc that is only valid if there is a count. Without one or the other we would potentially return an infinite array of values, which won't work.
I don't like the 'range of repeat' terminology either. I prefer Google calendar, just using 'Ends'. I think that is far more clear. Google calendar also floats the labels next to the elements (screenshot below), which takes less screen real estate. Is that a possibility?
I'm going to commit my changes that support the count option and do some more testing of the more complex possibilities. Can I ask you to write some tests for the new form and add them to the patch? I have tests for the calculation logic but especially when making changes like this to the form we could use some tests for the form itself.
Comment #15
karens commentedThe following commit should make it possible for the COUNT option to work correctly: http://drupalcode.org/project/date.git/commit/a4d8dea.
Comment #16
temaruk commented@12: I completely removed the 'Never' option. It just needed that change, because if COUNT or UNTIL is selected, it won't submit without a value entered.
@14: Will figure out tests.
Jeff? Do you approve the required changes? ('Ends' instead of 'Range of repeat'; float labels next to elements as in Google Calendar screenshot)
Comment #17
Noyz commentedSorry, but kill it, I meant exclude it from showing, i.e. leave it out or assume it was never in the design.
I also got a little tripped up on Range of Repeat - especially with the Never option. In fact I looked into that when this 'never' question came up. I didn't suggest a change though for two reasons..
1. If you use Google's 'ends' its confusing - seemingly conflicting - with the 'end' date that shows prior to selecting date.
2. If you remove Never I have less issue with the label, I.e.:
Range of repeat:
After [ ] occurrences'
I find this less confusing than two fields labeled 'End' (or End and Ends) that have two slightly different meanings.
What makes Google so successful here is that they use this format...
[ ] to [ ]
[x] Repeat
Ends
After [ ] occurrences.
I believe it's not an option to use the [ ] to [ ] format. As such, I think we need a new label for Range of Repeat that conflicts less with the first instances of End. 'Repeat ends' helps me quite a bit. You?
Comment #18
karens commentedI'm OK with either 'Repeat ends' or 'Stop repeating'.
Comment #19
Noyz commentedI like 'stop repeating'
Comment #20
temaruk commentedSounds good!
@Noyz: And what about the other changes? Namely, float labels next to elements as in Google Calendar screenshot?
Comment #21
Noyz commentedyou mean [ ] to [ ] ?
I thought this was off the table? Can you maybe reiterate the questions?
Comment #22
temaruk commentedPlease see #14, there is explanation and an attached screenshot.
Comment #23
temaruk commentedNew patch with date repeat form tests and 'Range of repeat' renaming to 'Stop repeating' included, against alpha5. Another patch against dev is on the way.
Comment #24
temaruk commentedSame patch re-rolled against dev.
Comment #25
karens commentedOK, this looks good and everything I tried works and you added tests and they work. The only thing not here is the idea of saving some screen real estate by floating the labels to the left, which is not critical. So I'm committing this much. If you interested and willing to do a follow-up patch to float the labels, that would be great. If not we can stop here.
I need to get this much committed because I have other issues about repeating values that I can't finish until this code is finalized.
Thanks!
Comment #26
temaruk commentedI would like to do a follow-up patch, as I added some other test cases, and did some code clean up too.
For the UI part I need approval from Noyz. Could we wait with the follow-up until that happens?
Comment #27
temaruk commentedIt is important for both of us to finalize this work, I would not want to block you work because of this. I will contact Noyz asap.
Thank you for the valuable feedbacks!
Comment #28
Noyz commentedThe only question I see is about floating labels to the left, so I'll answer that.
I think it's ok to do so. It's usable either way. However all floats are not equal: https://skitch.com/jeff.noyes/gqau1/adobe-fireworks-cs5, and floating is not the Drupal standard.
#1 is probably easiest to build, but the UI is a little noisier because of the number of left edges on the form element. Additionally forms controls are on the right of the label except on [ ] repeat, [ ] exclude dates, [ ] include dates - which is a bit strange. I don't think this strangeness would hinder a usability test though.
#2 is probably harder to build, but the UI is less noisy because the form elements left edges are aligned. however, in this UI, the distance between label and form element is it's weakness. This UI also has the oddity of forms controls being on the right of the label except on [ ] repeat, [ ] exclude dates, [ ] include dates - which is a bit strange. Again, neither of these would probably show in a usability test
#3 is how Google does it. They do this to keep left edges aligned to reduce noise, and to make sure the distance between label / form is not an issue. However, I don't know of a case in Drupal where this treatment is used. Also, this UI also has the oddity of forms controls being on the right of the label except on [ ] repeat, [ ] exclude dates, [ ] include dates. Again, neither of these would probably show in a usability test
Net net, I'm a bit agnostic since all will test similarly. As it stands (stacked), is usable and consistent with Drupal - and stacked doesn't have the oddity of forms controls being on the right of the label except on [ ] repeat, [ ] exclude dates, [ ] include dates. It may have the weakness of more vertical real-estate, but I don't think it's a big issue here. If you choose to float, I tend to think #2 is the best since the distance between label / form is not to great, and because this pattern does exist in Drupal.
Comment #29
karens commentedI guess I'm convinced we might as well leave it the way it is, stacked. Adding floating labels always introduces the possibility of browser bugs too.
So I guess the only thing left is whatever cleanup and additional tests temaruk was thinking about. I'll mark it 'needs work' to indicate we need that follow up patch.
Comment #30
temaruk commentedHere is the follow-up patch against dev. It includes some css adjustments and some basic tests for testing exceptions/additions.
Comment #31
karens commentedCommitted. Thanks! And thanks for adding tests for the additions and exceptions.
Comment #32
temaruk commentedHere is another follow-up against dev. Minor element positioning adjustments.
Comment #33
karens commentedOK, I committed the last bit. Thanks!