1. Video player container
2. Play/pause button
3. Volume button
4. Scrubber
5. Closed captioning button
6. Transcript button
7. Full-screen button
Keyboard interactions for _Video player container_:
\- On stop/pause, *enter/space* plays the video
\- On play, *enter/space* pauses the video
\- *up/down arrows* controls volume
\- *right/left arrows* controls scrubbing
\- *esc* ?
Keyboard interactions for _Play/pause button_:
\- *enter/space* alternates between play and pause
\- *up/down arrows* do nothing
\- *right/left arrows* do nothing
\- *esc* ?
Keyboard interactions for _Volume button_:
\- On focus, volume slider appears (focus is on the combined button + slider piece)
\- *enter/space* alternates between muting and unmuting the audio
\- *up/down arrows* increase/decrease the volume
\- *right/left arrows* do nothing
\- *esc* ?
Keyboard interactions for _Scrubber_:
\- *enter/space* do nothing
\- *up/down* arrows do nothing
\- *right/left* arrows scrub
\- *esc* ?
Keyboard interactions for _Closed captioning_ and _Transcript buttons_:
\- On focus, CC/Transcript menu does not appear automatically
\- *enter/space* on button opens/closes CC/Transcript menu
\- *up/down arrows* cycles through menu elements + button
\- *enter/space* on menu item activates the element and closes the menu; if the element is already active, keep element active and close the menu
\- *right/left arrows* do nothing
\- *esc* ?
Keyboard interactions for _Full screen button_:
\- *enter/space* alternates between full screen and windows
\- *up/down arrows* do nothing
\- *right/left arrows* do nothing
\- *esc* ?
Cascading priorities for *{_}esc{_}*:
1. If a menu is open, close it (i.e., transcript/closed captioning menu).
2. If in full-screen, return to windowed mode. Retain last focus.
3. If UI is open, return to container state.
\* in particular, no special interaction for *esc* with the _Volume button_
h3. Keyboard interactions
There will be a focus style for the CC button that will be different than the hover style.
Tabbing to the CC button will focus it but not show the menu. Enter or space will show the menu.
Once the menu is showing, arrow keys will move 'focus' within the menu items. This action alone will NOT actually 'activate' an item in the menu.
Items selected with the arrow keys will be styled differently than the currently active selection. James is still deciding whether or not this style will be different than the hover style.
While the menu is showing, enter or space will hide the menu. If the arrow keys had been used to change the selection, the new selection will be activated with the enter or space.
If the user has used the arrow keys to select something but NOT yet pressed enter or space, tabbing away from the CC button will hide the menu WITHOUT activating the selected menu item.