add focus controller, manages keyboard focus across multiple embedded decks

This commit is contained in:
Hakim El Hattab
2020-05-11 09:15:02 +02:00
parent 57107ebe4c
commit 664beff715
6 changed files with 125 additions and 6 deletions

View File

@ -57,6 +57,15 @@
</div>
</div>
<style>
.reveal {
border: 4px solid #ccc;
}
.reveal.focused {
border-color: #94b5ff;
}
</style>
<script src="../dist/reveal.js"></script>
<script src="../dist/plugin/highlight.js"></script>
<script src="../dist/plugin/markdown.js"></script>
@ -65,7 +74,8 @@
let deck1 = new Reveal( document.querySelector( '.deck1' ), {
embedded: true,
keyboard: false,
progress: false,
keyboardCondition: 'focused',
plugins: [ RevealHighlight ]
} );
deck1.on( 'slidechanged', () => {
@ -75,7 +85,8 @@
let deck2 = new Reveal( document.querySelector( '.deck2' ), {
embedded: true,
keyboard: true,
progress: false,
keyboardCondition: 'focused',
plugins: [ RevealMarkdown, RevealMath ]
} );
deck2.initialize().then( () => {