From 75a53da9e54a462fe9bb313f2cd44320e0e4445a Mon Sep 17 00:00:00 2001 From: nava teja Date: Sun, 8 Jun 2014 00:59:29 +0530 Subject: Shows keyboard shorcuts overlay on pressing question mark --- js/reveal.js | 65 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 65 insertions(+) (limited to 'js') diff --git a/js/reveal.js b/js/reveal.js index 5cbb3ff..27fcb49 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -177,6 +177,20 @@ var Reveal = (function(){ startCount: 0, captured: false, threshold: 40 + }, + + // Holds information about the keyboard shortcuts + keyboard_shortcuts = { + 'p': "Previous slide", + 'n': "Next slide", + 'h': "Navigate left", + 'l': "Navigate right", + 'k': "Navigate up", + 'j': "Navigate down", + 'Home': "First slide", + 'End': "Last slide", + 'b': "Pause", + 'f': "Fullscreen" }; /** @@ -646,6 +660,7 @@ var Reveal = (function(){ if( config.keyboard ) { document.addEventListener( 'keydown', onDocumentKeyDown, false ); + document.addEventListener( 'keypress', onDocumentKeyPress, false ); } if( config.progress && dom.progress ) { @@ -689,6 +704,7 @@ var Reveal = (function(){ eventsAreBound = false; document.removeEventListener( 'keydown', onDocumentKeyDown, false ); + document.removeEventListener( 'keypress', onDocumentKeyPress, false ); window.removeEventListener( 'hashchange', onWindowHashChange, false ); window.removeEventListener( 'resize', onWindowResize, false ); @@ -1019,6 +1035,44 @@ var Reveal = (function(){ } + /** + * Opens a overlay window for the keyboard shortcuts. + */ + function openShortcutsOverlay() { + + closePreview(); + + dom.preview = document.createElement( 'div' ); + dom.preview.classList.add( 'preview-link-overlay' ); + dom.wrapper.appendChild( dom.preview ); + + var html = '
Keyboard Shortcuts

'; + html += ''; + for( var key in keyboard_shortcuts ) { + html += '' + } + html += '
KEY ACTION
' + key + ' ' + keyboard_shortcuts[key] + '
'; + + dom.preview.innerHTML = [ + '
', + '', + '
', + '
', + '
'+html+'
', + '
' + ].join(''); + + dom.preview.querySelector( '.close' ).addEventListener( 'click', function( event ) { + closePreview(); + event.preventDefault(); + }, false ); + + setTimeout( function() { + dom.preview.classList.add( 'visible' ); + }, 1 ); + + } + /** * Applies JavaScript-controlled layout rules to the * presentation. @@ -2642,6 +2696,17 @@ var Reveal = (function(){ } + /** + * Handler for the document level 'keypress' event. + */ + + function onDocumentKeyPress( event ) { + // Check if the pressed key is question mark + if( event.shiftKey && event.charCode == 63 ) { + openShortcutsOverlay(); + } + } + /** * Handler for the document level 'keydown' event. */ -- cgit v1.2.3 From ab7efe6bf2da9b31b31a3af859e9f7f413fd2d0d Mon Sep 17 00:00:00 2001 From: navateja Date: Mon, 9 Jun 2014 14:35:59 +0530 Subject: creates a new branch for the feature --- js/reveal.js | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) (limited to 'js') diff --git a/js/reveal.js b/js/reveal.js index 27fcb49..e668d48 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -181,16 +181,16 @@ var Reveal = (function(){ // Holds information about the keyboard shortcuts keyboard_shortcuts = { - 'p': "Previous slide", - 'n': "Next slide", - 'h': "Navigate left", - 'l': "Navigate right", - 'k': "Navigate up", - 'j': "Navigate down", - 'Home': "First slide", - 'End': "Last slide", - 'b': "Pause", - 'f': "Fullscreen" + 'p': 'Previous slide', + 'n': 'Next slide', + 'h': 'Navigate left', + 'l': 'Navigate right', + 'k': 'Navigate up', + 'j': 'Navigate down', + 'Home': 'First slide', + 'End': 'Last slide', + 'b': 'Pause', + 'f': 'Fullscreen' }; /** -- cgit v1.2.3