notes.js 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106
  1. /**
  2. * Handles opening of and synchronization with the reveal.js
  3. * notes window.
  4. */
  5. var RevealNotes = (function() {
  6. function openNotes() {
  7. var notesPopup = window.open( 'plugin/notes/notes.html', 'reveal.js - Notes', 'width=1120,height=850' );
  8. // Fires when slide is changed
  9. Reveal.addEventListener( 'slidechanged', function( event ) {
  10. post('slidechanged');
  11. } );
  12. // Fires when a fragment is shown
  13. Reveal.addEventListener( 'fragmentshown', function( event ) {
  14. post('fragmentshown');
  15. } );
  16. // Fires when a fragment is hidden
  17. Reveal.addEventListener( 'fragmenthidden', function( event ) {
  18. post('fragmenthidden');
  19. } );
  20. /**
  21. * @description Posts the current slide data to the notes window
  22. *
  23. * @param {string} eventType Expecting 'slidechanged', 'fragmentshown' or 'fragmenthidden'
  24. * set in the events above to define the needed slideDate.
  25. */
  26. function post(eventType) {
  27. var slideElement = Reveal.getCurrentSlide(),
  28. indexh = Reveal.getIndices().h,
  29. indexv = Reveal.getIndices().v,
  30. notes = slideElement.querySelector( 'aside.notes' ),
  31. nextindexh,
  32. nextindexv,
  33. slideData;
  34. if( slideElement.nextElementSibling && slideElement.parentNode.nodeName == 'SECTION' ) {
  35. nextindexh = indexh;
  36. nextindexv = indexv + 1;
  37. } else {
  38. nextindexh = indexh + 1;
  39. nextindexv = 0;
  40. }
  41. if (eventType === 'slidechanged') {
  42. slideData = {
  43. notes : notes ? notes.innerHTML : '',
  44. indexh : indexh,
  45. indexv : indexv,
  46. nextindexh : nextindexh,
  47. nextindexv : nextindexv,
  48. markdown : notes ? typeof notes.getAttribute( 'data-markdown' ) === 'string' : false
  49. };
  50. }
  51. else if (eventType === 'fragmentshown') {
  52. slideData = {
  53. fragment : 'next'
  54. };
  55. }
  56. else if (eventType === 'fragmenthidden') {
  57. slideData = {
  58. fragment : 'prev'
  59. };
  60. }
  61. notesPopup.postMessage( JSON.stringify( slideData ), '*' );
  62. }
  63. // The main presentation is kept in sync when navigating the
  64. // note slides so that the popup may be used as a remote
  65. window.addEventListener( 'message', function( event ) {
  66. var data = JSON.parse( event.data );
  67. if( data && typeof data.indexh === 'number' && typeof data.indexv === 'number' ) {
  68. Reveal.slide( data.indexh, data.indexv );
  69. }
  70. } );
  71. // Navigate to the current slide when the notes are loaded
  72. notesPopup.addEventListener( 'load', function( event ) {
  73. post('slidechanged');
  74. }, false );
  75. }
  76. // If the there's a 'notes' query set, open directly
  77. if( window.location.search.match(/(\?|\&)notes/gi ) !== null ) {
  78. openNotes();
  79. }
  80. // Open the notes when the 's' key is hit
  81. document.addEventListener( 'keydown', function( event ) {
  82. // Disregard the event if the target is editable or a
  83. // modifier is present
  84. if ( document.querySelector( ':focus' ) !== null || event.shiftKey || event.altKey || event.ctrlKey || event.metaKey ) return;
  85. if( event.keyCode === 83 ) {
  86. event.preventDefault();
  87. openNotes();
  88. }
  89. }, false );
  90. return { open: openNotes };
  91. })();