312830 - scrollbar for overflowing dayboxes in month view is odd UI

Status: NEW

(Calendar :: Calendar Frontend, defect)

Description

[Chin Kuan, Low]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8b5) Gecko/20051008 Firefox/1.4.1
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8b5) Gecko/20051008 Firefox/1.4.1

The URL given contains a description of the clipping issue that appears when the
calendar box is too small to display all the events in it. Also in the same page
is the suggested solution to overcome this problem.

Reproducible: Always

Comment 1

[Dan Mosedale (:dmosedale, :dmose)]

What do people feel is the best way to solve this?  I can think of several
possibilities; all of which I kinda suspect will be difficult to implement:

a) allow the user to drag the grippy at the bottom of the week in question to
expand all the days in that week at the expense of all the days in the
subsequent week

b) add a little tiny scroll bar inside the day box

c) add a "more" button at the bottom of each day that overflows, and have it so
that when the button is clicked or moused over, the overflowing day will
temporarily expand on top of the day(s) below it

Of these three, I kinda like a) the best.  I'm very open to hearing other
suggestions.

Comment 2

[Mike Shaver (:shaver -- probably not reading bugmail closely)]

Unfortunately, I do not have cycles to work on Calendar stuff these days (just as it's getting to the good part!), so I am a bad owner for these bugs.  To delete the tragically-large chunk of bugspam, search for gregorianabdication.

Comment 3

[Michiel van Leeuwen (email: mvl+moz@)]

I think a) won't be very discoverable, and might be confusing. (How do you get back to the default state?)
Maybe a relativly easy solution would be chevron. ( >> button with a popupmenu). The advantage is that it is known UI, from the toolbars.

Comment 4

[Dan Mosedale (:dmosedale, :dmose)]

Attachment: adds a y scrollbar & reverts x-small font change, v1 (landed)

This adds a y-scrollbar if a day overflows with events so that events aren't actually missed.  It also reverts the x-small font change, as that made the fonts hard to read.  This is not a particularly pretty solution, so the idea is that this is a stopgap fix for now, and this bug will be left open for a better fix in the future.

Comment 5

[Michiel van Leeuwen (email: mvl+moz@)]

Comment on attachment 211055 [details] [diff] [review]
adds a y scrollbar & reverts x-small font change, v1 (landed)

looks good for me, but i'd like to hear jminta's opinion on this.

Comment 6

[Joey Minta]

Comment on attachment 211055 [details] [diff] [review]
adds a y scrollbar & reverts x-small font change, v1 (landed)

r=jminta  Ideally I'd like to see the scrollbars themed to match better, but that's for another day.  Maybe file that bug?

Comment 7

[Dan Mosedale (:dmosedale, :dmose)]

Comment on attachment 211055 [details] [diff] [review]
adds a y scrollbar & reverts x-small font change, v1 (landed)

Patch has landed; marking as obsolete.

Comment 8

[Dan Mosedale (:dmosedale, :dmose)]

(In reply to comment #6)
> (From update of attachment 211055 [details] [diff] [review] [edit])
> r=jminta  Ideally I'd like to see the scrollbars themed to match better, but
> that's for another day.  Maybe file that bug?
> 

I'll just leave this bug open, as it's now intended to address the UI for overflowing day boxes, and I think there's some chance that, down the road a bit, we'll end up deciding that scrollbars are not really the best solution to this problem.

Comment 9

[Martin Schröder [:mschroeder]]

CCing Christan for UI expert opinion :)

Comment 10

[Pete Riley]

(In reply to comment #1)
> b) add a little tiny scroll bar inside the day box

I like this option the most.  Scrollbars are well known by people, they're easy to use, and you know exactly what's going to happen when you use them.  And people don't have to move their mice to the scrollbar, they can simply put the mouse anywhere in the day box and use their mouse wheels to scroll the list of events.  It's easy and fast, and you don't have to hunt for a little navigation button (which is usually annoying with high-resolution displays).  (Mouse scrolling in day boxes is currently broken but I just filed a bug for that.)

I doubt that the list of events is going to be too long anyway for most people (maybe five hidden events at most?).  The exception might be someone who has fifteen meetings every day (unlikely) or is looking at several calendars from other people at the same time.  In this limited case, I think that it would be more effective for the user to temporarily switch to Week or Day view anyway, and that's easy to do.

By the way, that's all that Outlook 2007 does.  Instead of a scrollbar there's a tiny triangle at the bottom-right corner of the day box.  When you click it all it does is show you Day view.  In my opinion that's much worse than being able to use the mouse wheel / scrollbar.

One problem with using something that expands over other days or pops up on the screen is that now you can't see some of the other days in the month until you manually return the view to normal.

After saying all that, I think that this issue will become more important with Christian's proposal to show up to three rows per event.  However, I would still prefer the mouse-wheel solution.  If a different solution is implemented, I strongly hope that it will be optional.

Comment 11

[Christian Jansen]

Personally I find the scrollbar very distracting. Especially if more than 3 boxes are displayed...

I agree with Pete that the Outlook 2007 solution is even worse. These jumping views are fare away from being usable.

From my point of view it would be good to display a "there is more" button, if the calendar box is too small to display all the events in it.
The "there is more" button would call up a second window, which displays the single day, expanded. This solution would help us being flexible & it would not change view modes. In addition the "there is more" button is not too distracting.

----------------------------------------------------------------------------
|  Monday |  Tuesday   |  Wednesday | Thursday | Friday | Saturday | Sunday|
+---------+------------+------------+----------+--------+----------+-------+
|  1      | 2          | 3          | 4        | 5      | 6        | 8     |
|   Event |  Event     |            |          |        |          |       |
|   Event |  Event     |            |          |        |          |       |
|         |  Event     |            |          |        |          |       |
|         |  Event     |            |          |        |          |       |
|         |  Event     |            |          |        |          |       |
|         |       [ >] |            |          |        |          |       |
+---------+------------+------------+----------+--------+----------+-------+
|  9      | 10         | 11         | 12       | 13     | 14       | 15    |
|         |            |            |          |        |          |       |
|         |            |            |          |        |          |       |


----------------------------------------------------------------------------
|  Monday |  Tuesday   |  Wednesday | Thursday | Friday | Saturday | Sunday|
+---------+------------+------------+----------+--------+----------+-------+
|  1      | 2          | 3          | 4        | 5      | 6        | 8     |
|   Event |  Event 1   |            |          |        |          |       |
|   Event |  Event 2  +-------------------+    |        |          |       |
|         |  Event 3  |     Tuesday   [X] |    |        |          |       |
|         |  Event 4  |-------------------|    |        |          |       |
|         |  Event 5  /  Event 1          |    |        |          |       |
|         |      [[ >]   Event 2          |    |        |          |       |
+---------+-----------\  Event 3          |----+--------+----------+-------+
|  9      | 10        |  Event 4          |    |        |          |       |
|         |           |  Event 5          |    |        |          |       |
|         |           |  Event 6          |    |        |          |       |
|         |           |  Event 7          |    |        |          |       |
|         |           |  Event 8          |    |        |          |       |
|         |           |  Event 9          |    |        |          |       |
+---------+-----------|  Event 10         |----+--------+----------+-------+-
|         |           |  Event 11         |    |        |          |       |
|         |           |  Event 12         |    |        |          |       |
|         |           +-------------------+    |        |          |       |

Comment 12

[Pete Riley]

I would think that the popups would have to be fully functional (allow double clicks, right clicks, keyboard usage, drag&drop, etc.), otherwise people would have to switch to another view to do anything useful with these events.

Possibly there could be a semi-transparent background too so that we can see events underneath it.

Another nice thing would be that the first click on the > would open the popup and a second click would close it.  This would avoid the need to move the mouse to the X to close it if we only want to quickly look at the events.

Comment 13

[Pete Riley]

Instead of the popup, yet another idea is to take advantage of the empty space at the bottom of the left pane.  For example, the minimonth and the calendar list use less than half of the space on my screen, and all the rest of the left pane is wasted when I'm in calendar mode.  It could show the entire list of events and tasks for the currently selected day.

Hmm, why not just show the today pane on the left side (and add the calendar list to it only when in calendar mode).  There could be a splitter between the calendar list and the events list.  The today pane could reflect the contents of the currently selected day (just like it can in mail mode).  If people didn't want the today pane to change every time that the selected day changes in the month grid, then perhaps there could be an option so that the today pane would only change if they click on the > in a day box in the month grid.  A second click on the > could return the today pane to today's date.

While it's possible that scrolling would occasionally be necessary in the today pane, it seems less likely because the today pane is much taller than a day box in the grid.  Anyway, that person would probably also have to scroll in the today pane in mail mode, so that 'problem' already exists anyway.

I'm strongly in favor of having the COMPLETE today pane in both mail mode and calendar mode, and this would also address bug 389150.

Comment 14

[Pete Riley]

I thought of another problem if the today pane was used when we click the >.  We'd have to move the mouse way over to the today pane to edit an event -- not very nice.  Plus there is the potential scrolling in the today pane that I mentioned.  So, I'm beginning to agree that the popup is the best idea.

Also please disregard my comment about using transparency because I'm thinking now that it's not necessary and it could make the events in the popup harder to see.  However, I'm assuming that we'll be able to move the popup if necessary.

Comment 15

[ovidiu]

I would like to indicate couple of things related to this:

1. The month view day box scroll as implemented now (0.8) has an issue cause is including the day label along with events. Please take this into account in future of this if scroll still the option.
Q:I explained that in bug 322979 where I think that belongs, but I'm not sure if this one is not more appropriate. Or if I should file a separate bug on that specific issue to be dependent on this one. Quick glimpse:
+-----------------+
| *6*         [^] |  \
|  ---------  | | |   .
| | event 1 | |-| |   .
|  ---------  |-| |    > all this is scrolling!
|  ---------  |-| |   .
| | event 2 | | | |   .
|  ---------  [v] |  /
+-----------------+
should be
+-----------------+
| *6*             |     ->no scroll at this level
|  ---------  [^] |  \
| | event 1 | | | |   .
|  ---------  |-| |    > only this should be scrolling!
|  ---------  |-| |   .
| | event 2 | | | |   .
|  ---------  [v] |  /
+-----------------+

2. If there's to be a popup or something to expand the day, I would not go for a pop like in comment #11 with a >> to pop and [x] to close it, but rather really expanding the very day box over others on hover or on click on it. Cause is more immediate and simple than having 3 clicks. This is where the scroll seams more simple and "non modal", if you allow this ..

for example:
------------------------------------
|  Monday |  Tuesday   |  Wednesday 
+---------+------------+------------
|  1      | 2          | 3          
|   Event |  Event     |  Event     
|   Event |  Event     |  Event     
|         |  Event     |  Event     
|         |  Event     |            
|         |  Event     |            
|         |  .....  >  |            
+---------+------------+------------
|  9      | 10         | 11         
|         |            |            
|         |            |            

------------------------------------ or ------------------------------------
|  Monday |  Tuesday   |  Wednesday     |  Monday |  Tuesday   |  Wednesday  
+---------+------------+------------    +---------+------------+------------ 
|  1      |2           ||3              |  1      |+------------+3           
|   Event | Event 1    || Event         |   Event ||2           | Event      
|   Event | Event 2    || Event         |   Event || Event 1    | Event      
|         | Event 3    || Event         |         || Event 2    | Event      
|         | Event 4    ||               |         || Event 3    |            
|         | Event 5    ||               |         || Event 4    |            
+---------| Event 6    ||-----------    +---------+| Event 5    |----------- 
|  9      | Event 7    ||11             |  9      || Event 6    |11          
|         | Event 8    ||               |         || Event 7    |
|         +------------+|               |         || Event 8    |
           -------------                           +------------+
on mouse over or mouse click, and may just extend it up or down with a drop shadow effect to show that something is happening (maybe along with same effect on hover over other days, but no expansion)

Comment 16

[ovidiu]

FWIW, resolved part of comment #15 about scroll issue
bug 322972 resolved with a patch 
(also resolving bug 391281)