Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Added drag and drop, fixed conflicts by introducing hybrid selection

...

A single item may be selected by clicking on it , or touching it or by hitting the SPACE bar when it has the focus (object selection). If an interface supports selecting multiple items, it shows a checkbox next to an item. Thus, alternatively, this checkbox may be checked to select the item (toggle selection). In both cases, a strong visual marker around the item signals its selection.
So, while an item may be selected without checking its checkbox if you use mouse or touch input, its checkbox is always toggled if you select the item using the keyboard.

...

To select multiple items, you repeatedly select single items using their checkboxes until all your items are selected (toggle selection). Alternatively, use a rubber band rectangle when using a mouse to select the items (object selection). Note that in the latter case, the checkboxes of all selected items are also checked as soon as you release the mouse button. A previously selected group of items is first deselected before the newly defined group becomes selected.

Select and deselect all items.

Views supporting the selection of multiple items shall also always offer an additional checkbox to toggle the selection of all items (visible or invisible) in the view. Checking it first selects all items, checking it again de-selects the items.

...

By double-clicking or touble-tapping an item or hitting the Command/Ctrl-Enter key on a focused (see #Focus an item) or selected item (see #Select a single item), a separate window opens , which shows showing an edit or inspection view of the item depending on the permissions of the logged in user.

Drag and drop an item

Clicking on an item and starting a drag automatically selects the item and ticks its checkbox, in case it exists - the item is both object selected and toggle selected. During drag, the item being dragged is replaced by a place holder image. The interface provides constant feedback where the dragged item can be dropped by rendering an insertion bar and highlighting other items which may act as drop targets.

Drag and drop multiple items

If multiple items are selected, dragging one of the selected items initiates a drag of all selected items. Again, the items are replaced by a place holder image and object highlighting and insertion bars are rendered during the drag (see #Drag and drop an item).

Note that if multiple items are toggle selected and you start a drag on a single item with its checkbox unchecked, that object is added to the other selected items for the drag and its checkbox is immediately ticked as soon as the drag starts to clarify this behaviour.

Removing a selection

If you click on a list or tree view offering item selection and you do not click on a selectable item, all previously selected items are deselected. The items are also deselected if you toggle the "select all items" checkbox to first select all, then deselect all items (see #Select and deselect all items).

Executing an operation on selected items

If a view allows to select items, it always also offers operations to be executed on them. Selecting one or multiple items enables only those operations, which are defined on the list of selected items. For any view showing operations, it should be visually very obvious, which operations are currently available and which are not.

Please note that it is not acceptable to simply attempt to execute an operation and to return an error if it is detected that the operation has been undefined for one of the selected items. Errors should only be returned if executing an operation actually fails.

It is highly desirable that an operation is executed atomically on multiple items as this is expected semantically and allows properly supporting the undo functionality we plan to introduce with 5.0.

Solving conflicting usage

Allowing both object selection and toggle selection of items may result in a confusing interface. Magnolia solves this by actually implementing hybrid selection.

In short, this means:

  • when only selecting a single item, ticking its checkbox or simply selecting it using a click or tab doesn't make a difference
  • when multiple items are selected, starting a drag on a previously unselected item ticks the checkbox of this item and adds it to the set of already selected items - the drag includes all of these items.
  • when multiple items are selected and you select an item by clicking or tapping on it, the preview only shows this item.
  • when multiple items are selected and you open any item (selected or not), only that item is opened. The other items remain selected, though, as does the just opened item.
  • when executing an operation, it is always executed on all currently selected items, whether they have been selected by ticking their checkbox or not.

Summary

 

Mouse

Keyboard

Touch

Supports highlighting item
-> shows item details?

yes, on mouse over
optionally, after a longer delay

yes, when shifting kbd focus
yes, after short delay

no

Supports selecting single item without marking its checkbox
->show item details?

yes, on click
yes, immediately

no

yes, on touch
yes, immediately

Supports selecting single item by marking its checkbox
->show item details?

yes, on checking checkbox
yes, immediately

yes, on hitting SPACE bar
yes, immediately

yes, on checking checkbox
yes, immediately

Supports selecting multiple items by marking their checkbox
->show item details?

yes, on checking checkbox
yes, immediately

yes, on hitting SPACE bar
yes, immediately

yes, on checking checkbox
yes, immediately

 

 

 

 

Supports executing an operation when selected by checkbox

yes

yes

yes

Supports executing an operation when selected, but not by checkbox

yes

no

yes

...