Trap keyboard focus when in full-screen mode

[jvine]

When the user is viewing an image in full-screen mode, the keyboard focus should be constrained to the visible controls. Currently, when the viewer is embedded in a page, it's possible to tab to, and activate, non-visible links on the page behind the full-screen viewer.

[edsilv]

This might work: https://stackoverflow.com/questions/24056593/whats-the-best-way-to-limit-focusable-controls-to-current-dialog

The UV already has an <a href="/" id="top"></a>, which is focused on full screen. Perhaps we could also add an <a href="#" id="bottom"></a>?

Here's where the top anchor is added: https://github.com/UniversalViewer/universalviewer/blob/v3/src/modules/uv-shared-module/BaseExtension.ts#L174

Perhaps add the bottom anchor here: https://github.com/UniversalViewer/universalviewer/blob/v3/src/modules/uv-shared-module/BaseExtension.ts#L512

Then use these instead of focusKeeper in the SO example.

The code would go in BaseExtension.ts

[hackartisan]

sul-dlss#11

Estimate: .5 days
Added by snydman