xobs/fa23-si
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add 'resume presentation' button to pause overlay

Browse Source
This commit is contained in:
Hakim El Hattab 2018-07-02 11:08:45 +02:00
parent fd95c8c266
commit b9bb353a11
3 changed files with 40 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
css/reveal.css
View File

@ -964,6 +964,21 @@ body {
z-index: 100; z-index: 100;
transition: all 1s ease; } transition: all 1s ease; }
.reveal .pause-overlay .resume-button {
position: absolute;
bottom: 20px;
right: 20px;
color: #ccc;
border-radius: 2px;
padding: 6px 14px;
border: 2px solid #ccc;
font-size: 16px;
background: transparent;
cursor: pointer; }
.reveal .pause-overlay .resume-button:hover {
color: #fff;
border-color: #fff; }
.reveal.paused .pause-overlay { .reveal.paused .pause-overlay {
visibility: visible; visibility: visible;
opacity: 1; } opacity: 1; }

19
css/reveal.scss
View File

@ -1034,6 +1034,25 @@ $controlsArrowAngleActive: 36deg;
z-index: 100; z-index: 100;
transition: all 1s ease; transition: all 1s ease;
} }
.reveal .pause-overlay .resume-button {
position: absolute;
bottom: 20px;
right: 20px;
color: #ccc;
border-radius: 2px;
padding: 6px 14px;
border: 2px solid #ccc;
font-size: 16px;
background: transparent;
cursor: pointer;
&:hover {
color: #fff;
border-color: #fff;
}
}
.reveal.paused .pause-overlay { .reveal.paused .pause-overlay {
visibility: visible; visibility: visible;
opacity: 1; opacity: 1;

7
js/reveal.js
View File

@ -593,7 +593,8 @@
dom.speakerNotes.setAttribute( 'tabindex', '0' ); dom.speakerNotes.setAttribute( 'tabindex', '0' );
// Overlay graphic which is displayed during the paused mode // Overlay graphic which is displayed during the paused mode
createSingletonNode( dom.wrapper, 'div', 'pause-overlay', null ); dom.pauseOverlay = createSingletonNode( dom.wrapper, 'div', 'pause-overlay', '<button class="resume-button">Resume presentation</button>' );
dom.resumeButton = dom.pauseOverlay.querySelector( '.resume-button' );
dom.wrapper.setAttribute( 'role', 'application' ); dom.wrapper.setAttribute( 'role', 'application' );
@ -1298,6 +1299,8 @@
dom.progress.addEventListener( 'click', onProgressClicked, false ); dom.progress.addEventListener( 'click', onProgressClicked, false );
} }
dom.resumeButton.addEventListener( 'click', resume, false );
if( config.focusBodyOnPageVisibilityChange ) { if( config.focusBodyOnPageVisibilityChange ) {
var visibilityChange; var visibilityChange;
@ -1361,6 +1364,8 @@
dom.wrapper.removeEventListener( 'touchmove', onTouchMove, false ); dom.wrapper.removeEventListener( 'touchmove', onTouchMove, false );
dom.wrapper.removeEventListener( 'touchend', onTouchEnd, false ); dom.wrapper.removeEventListener( 'touchend', onTouchEnd, false );
dom.resumeButton.removeEventListener( 'click', resume, false );
if ( config.progress && dom.progress ) { if ( config.progress && dom.progress ) {
dom.progress.removeEventListener( 'click', onProgressClicked, false ); dom.progress.removeEventListener( 'click', onProgressClicked, false );
} }