ProjectMirador / mirador

An open-source, web-based 'multi-up' viewer that supports zoom-pan-rotate functionality, ability to display/compare simple images, and images with annotations.
https://projectmirador.org
Apache License 2.0
550 stars 257 forks source link

Create "Select workspace type" dialog and add to workspace menu #1838

Open jvine opened 5 years ago

jvine commented 5 years ago

Mockup addresses:

Add Select workspace type option to workspace menu.

screen shot 2019-02-07 at 1 40 02 pm

Menu has three groups:

  1. context-specific actions
  2. workspace tools
  3. settings/share/export

If there is more than one workspace type available in the implementation, add Select workspace type option to group 2.

Open selection dialog.

User selects Select workspace type. Close the menu and open a dialog centered in the window. The available worktypes are displayed in horizontal blocks.

screen shot 2019-02-07 at 4 05 09 pm

Each block includes:

Icons and their accompanying radio buttons/labels are clickable to select a workspace type. Selection is not applied until the user clicks SWITCH.

Cancel closes the dialog without changing the workspace.

Mobile layout

screen shot 2019-02-07 at 4 02 31 pm

Initial text

Move and size windows freely in an unlimited workspace. Windows can overlap.
Not responsive; retains layout and size when shared.
Move and size windows within a scrollable grid.
Responsive; adjusts window size and flow to the viewing device.`
Move and size windows in relation to each other, within the visible frame.
Responsive. Ideal for embedded presentations.

Icons Can provide placeholder SVG icons, but I'm not able attach them here...

Switch workspace type (magic)

There will need to be additional design work on this and a separate ticket. Initial intent is that windows will flow into the new layout in more or less their location order top left to bottom right; either normalize windows to a consistent size or retain some degree of their relative sizes as allowed by the new layout.

aeschylus commented 5 years ago

I've broken out a simpler first pass of this that provides a select box and the workspaceMenu side of things. Another PR is needed to add the "radio button + confirm" interaction, descriptions, icons, and dialog-local state.

PR (currently writing tests): https://github.com/ProjectMirador/mirador/pull/2041