Calendar:Event in a Tab: Difference between revisions

== Design ==

The following two mockup images (A and B) and notes are based on the GSoC proposal and are a starting point for further refinements of the design.  See below for subsequent mockups and notes.

<gallery>

</gallery>

The mockup images are intended as relatively rough "wire frames" to show layout and they only approximate spacing, sizing, and aesthetic details.

There are two variants shown in two separate svg files.  They differ only in the placement of the "privacy," "priority," "status," and "show time as" elements.

The elements in the right-hand column are more optional, and in the simplest cases they will be left at their default settings.  Putting them in the right-hand column gives greater prominence to the less optional elements in the left-hand column, like the timing of events, that must be entered for every event.

A "Save" button has been added to the toolbar.

"Add Reminder," "Add Attachment," and "Invite Attendees," are shown right above the box where these items will be listed when added/invited.  The boxes containing these items are shown in a tabbed interface, much like the current implementation but with a "Reminders" tab added.  A difference is that the respective tabs do not appear until they have content.  When items are first added to them their tab is made the active tab.  Ideally, as the window is resized the size of these boxes adjusts to match the height of the window.

As currently, the "Notify Attendees" and "Separate Invitation Per Attendee" checkboxes are only shown when the attendees tab is active.

The toolbars shown in the mockup are simplified, without items like "Privacy" and "Invite Attendees" that can now be edited more directly "in place."  The thinking behind this is to simplify things by keeping display and editing of elements together and not spread them out in different places.  As shown, the toolbars only contain buttons that affect the event as a whole, like "save" and "delete."   

However, it may make sense, especially in the tab layout, to have more items in the toolbar to provide additional ways of editing elements for different users and use cases.  If desired, we could keep the current toolbar items and potentially, in the tab view, add "Priority," Show Time As," and "Status" to the default set of toolbar items.  There may even be additional items that could be added to the toolbar that go beyond the current toolbar options.

As the window expands horizontally, the elements (and possibly horizontal spacing/margins) expand with it up to a breakpoint where the two-column “tab” layout goes into effect.  Then the elements would continue to expand in both of the columns, up to a certain limit at which they would expand no further (to keep things more focused on a very wide monitor/window).  After reaching that limit the elements would stay in place (left-aligned, or possibly center-aligned) as the window expands further to the right.   

As shown, the two-column layout rearranges the elements somewhat.  This rearrangement is kept to a minimum for more consistency between the window and tab views.

Mockups C through I are based on feedback from Richard Marti who suggested a full-width Description box, moving the Privacy etc. items below the Description, and rearranging Attachments, Attendees, and Reminders.   

Mockup C

* reminders in the right column in same row as timing info

* attendees and attachments in the next row

Note: The basic layout of K or L could also be used with fixed-height individually scrollable boxes for Reminders, Attachments, etc. (i.e. instead of having the expand/collapse triangles and letting the page become scrollable).  (The disadvantage would be that there would not be a way to see all items at once when they become too many to fit in their box.)

=== Design Links ===