Focus body when page visibility changes to ensure keyboard shortcuts are usable

This commit is contained in:
Espen Hovlandsdal 2013-09-21 22:19:02 +02:00
parent 059311923b
commit 6043756b2e
2 changed files with 37 additions and 3 deletions

View File

@ -80,6 +80,9 @@ var Reveal = (function(){
// Opens links in an iframe preview overlay // Opens links in an iframe preview overlay
previewLinks: false, previewLinks: false,
// Focuses body when page changes visiblity to ensure keyboard shortcuts work
focusBodyOnPageVisiblityChange: true,
// Theme (see /css/theme) // Theme (see /css/theme)
theme: null, theme: null,
@ -610,6 +613,19 @@ var Reveal = (function(){
dom.progress.addEventListener( 'click', onProgressClicked, false ); dom.progress.addEventListener( 'click', onProgressClicked, false );
} }
if( config.focusBodyOnPageVisiblityChange ) {
var visibilityChange;
if ('hidden' in document) {
visibilityChange = 'visibilitychange';
} else if ('msHidden' in document) {
visibilityChange = 'msvisibilitychange';
} else if ('webkitHidden' in document) {
visibilityChange = 'webkitvisibilitychange';
}
document.addEventListener(visibilityChange, onPageVisibilityChange, false);
}
[ 'touchstart', 'click' ].forEach( function( eventName ) { [ 'touchstart', 'click' ].forEach( function( eventName ) {
dom.controlsLeft.forEach( function( el ) { el.addEventListener( eventName, onNavigateLeftClicked, false ); } ); dom.controlsLeft.forEach( function( el ) { el.addEventListener( eventName, onNavigateLeftClicked, false ); } );
dom.controlsRight.forEach( function( el ) { el.addEventListener( eventName, onNavigateRightClicked, false ); } ); dom.controlsRight.forEach( function( el ) { el.addEventListener( eventName, onNavigateRightClicked, false ); } );
@ -2655,6 +2671,24 @@ var Reveal = (function(){
} }
/**
* Handle for the window level 'visibilitychange' event.
*/
function onPageVisibilityChange( event ) {
var isHidden = document.webkitHidden ||
document.msHidden ||
document.hidden;
// If, after clicking a link or similar and we're coming back,
// focus the document.body to ensure we can use keyboard shortcuts
if( isHidden === false && document.activeElement !== document.body ) {
document.activeElement.blur();
document.body.focus();
}
}
/** /**
* Invoked when a slide is and we're in the overview. * Invoked when a slide is and we're in the overview.
*/ */

4
js/reveal.min.js vendored

File diff suppressed because one or more lines are too long