Make the fragments visible in speaker notes

This commit is contained in:
Michael Kühnel 2012-10-24 14:33:16 +02:00
parent 76a7bd83fa
commit 296242f8d3
2 changed files with 67 additions and 23 deletions

View file

@ -109,12 +109,15 @@
window.addEventListener( 'message', function( event ) {
var data = JSON.parse( event.data );
if( data.markdown ) {
notes.innerHTML = (new Showdown.converter()).makeHtml( data.notes );
}
else {
notes.innerHTML = data.notes;
console.log(data);
// No need for updating the notes in case of fragement changes
if ( data.notes !== undefined) {
if( data.markdown ) {
notes.innerHTML = (new Showdown.converter()).makeHtml( data.notes );
}
else {
notes.innerHTML = data.notes;
}
}
// Kill the slide listeners while responding to the event
@ -124,6 +127,14 @@
currentSlide.contentWindow.Reveal.slide( data.indexh, data.indexv );
nextSlide.contentWindow.Reveal.slide( data.nextindexh, data.nextindexv );
// Showing and hiding fragments
if (data.fragment === 'next') {
currentSlide.contentWindow.Reveal.nextFragment();
}
else if (data.fragment === 'prev') {
currentSlide.contentWindow.Reveal.prevFragment();
}
// Resume listening on the next cycle
setTimeout( addSlideListeners, 1 );

View file

@ -7,15 +7,36 @@ var RevealNotes = (function() {
function openNotes() {
var notesPopup = window.open( 'plugin/notes/notes.html', 'reveal.js - Notes', 'width=1120,height=850' );
Reveal.addEventListener( 'slidechanged', post );
// Fires when slide is changed
Reveal.addEventListener( 'slidechanged', function( event ) {
post('slidechanged');
} );
// Posts the current slide data to the notes window
function post() {
// Fires when a fragment is shown
Reveal.addEventListener( 'fragmentshown', function( event ) {
post('fragmentshown');
} );
// Fires when a fragment is hidden
Reveal.addEventListener( 'fragmenthidden', function( event ) {
post('fragmenthidden');
} );
/**
* @description Posts the current slide data to the notes window
*
* @param {string} eventType Expecting 'slidechanged', 'fragmentshown' or 'fragmenthidden'
* set in the events above to define the needed slideDate.
*/
function post(eventType) {
console.log(eventType);
var slideElement = Reveal.getCurrentSlide(),
indexh = Reveal.getIndices().h,
indexv = Reveal.getIndices().v,
notes = slideElement.querySelector( 'aside.notes' ),
nextindexh,
nextindexv;
nextindexv,
slideData;
if( slideElement.nextElementSibling && slideElement.parentNode.nodeName == 'SECTION' ) {
nextindexh = indexh;
@ -25,16 +46,26 @@ var RevealNotes = (function() {
nextindexv = 0;
}
var notes = slideElement.querySelector( 'aside.notes' );
var slideData = {
notes : notes ? notes.innerHTML : '',
indexh : indexh,
indexv : indexv,
nextindexh : nextindexh,
nextindexv : nextindexv,
markdown : notes ? typeof notes.getAttribute( 'data-markdown' ) === 'string' : false
};
if (eventType === 'slidechanged') {
slideData = {
notes : notes ? notes.innerHTML : '',
indexh : indexh,
indexv : indexv,
nextindexh : nextindexh,
nextindexv : nextindexv,
markdown : notes ? typeof notes.getAttribute( 'data-markdown' ) === 'string' : false
};
}
else if (eventType === 'fragmentshown') {
slideData = {
fragment : 'next'
};
}
else if (eventType === 'fragmenthidden') {
slideData = {
fragment : 'prev'
};
}
notesPopup.postMessage( JSON.stringify( slideData ), '*' );
}
@ -50,7 +81,9 @@ var RevealNotes = (function() {
} );
// Navigate to the current slide when the notes are loaded
notesPopup.addEventListener( 'load', post, false );
notesPopup.addEventListener( 'load', function( event ) {
post('slidechanged');
}, false );
}
// If the there's a 'notes' query set, open directly
@ -70,5 +103,5 @@ var RevealNotes = (function() {
}
}, false );
return { open: openNotes }
})();
return { open: openNotes };
})();