Simple Text Inline Edit Storycards
Implemented
IE Story 1 (FLUID-775): Allow user to edit a simple, single piece of text without leaving their context
Details:
When the user hovers over the text with the mouse, the text will be highlighted
Put a (reasonably-sized) min-width on empty fields so that the yellow background shows up on rollover
The user can Tab to the text and the highlight will also appear
Hover message appears after hovering for <2 seconds.
When the user clicks on the text, an edit field appears. Cursor is placed at end of current text.
Double click selects word, triple click selects entire text
The user can type and press enter to automatically save the text.
Simple Text Inline Edit Storyboard
Mockups and examples of interaction in context
Testing Details: Interaction & UI match storyboard
IE Story 2 (Fluid-780): Provide user with undo capabilities
Details:
Once an edit is complete, provide user with "undo edit" link (perhaps replaced with icon later)
The link is persistent until the user goes to another page
The link undoes the previous edit
Should be placed close the edited field
Simple Text Inline Edit Storyboard
Mockups and examples of interaction in context
IE Story 3: Provide user with "redo edit" capabilities
Details:
Once a user has initiated "undo edit" give them a "redo edit" link
Redo should only change the field back to the value it had been prior to the last undo, and after activation become an Undo icon again.
(Note: This storycard appears to have been completed without an associated JIRA task.)
In Design (to be scheduled for development)
IE Story 6: Placeholder for error handling (e.x. name exists, etc.) - NEEDS TO BE FLESHED OUT & SCHEDULED
Name already exists
Empty field not allowed