docs/com/plugin/notes/notes.js

   1 /**
   2  * Handles opening of and synchronization with the reveal.js
   3  * notes window.
   4  *
   5  * Handshake process:
   6  * 1. This window posts 'connect' to notes window
   7  *    - Includes URL of presentation to show
   8  * 2. Notes window responds with 'connected' when it is available
   9  * 3. This window proceeds to send the current presentation state
  10  *    to the notes window
  11  */
  12 var RevealNotes = (function() {
  13
  14         function openNotes() {
  15                 var jsFileLocation = document.querySelector('script[src$="notes.js"]').src;  // this js file path
  16                 jsFileLocation = jsFileLocation.replace(/notes\.js(\?.*)?$/, '');   // the js folder path
  17                 var notesPopup = window.open( jsFileLocation + 'notes.html', 'reveal.js - Notes', 'width=1100,height=700' );
  18
  19                 /**
  20                  * Connect to the notes window through a postmessage handshake.
  21                  * Using postmessage enables us to work in situations where the
  22                  * origins differ, such as a presentation being opened from the
  23                  * file system.
  24                  */
  25                 function connect() {
  26                         // Keep trying to connect until we get a 'connected' message back
  27                         var connectInterval = setInterval( function() {
  28                                 notesPopup.postMessage( JSON.stringify( {
  29                                         namespace: 'reveal-notes',
  30                                         type: 'connect',
  31                                         url: window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search,
  32                                         state: Reveal.getState()
  33                                 } ), '*' );
  34                         }, 500 );
  35
  36                         window.addEventListener( 'message', function( event ) {
  37                                 var data = JSON.parse( event.data );
  38                                 if( data && data.namespace === 'reveal-notes' && data.type === 'connected' ) {
  39                                         clearInterval( connectInterval );
  40                                         onConnected();
  41                                 }
  42                         } );
  43                 }
  44
  45                 /**
  46                  * Posts the current slide data to the notes window
  47                  */
  48                 function post() {
  49
  50                         var slideElement = Reveal.getCurrentSlide(),
  51                                 notesElement = slideElement.querySelector( 'aside.notes' );
  52
  53                         var messageData = {
  54                                 namespace: 'reveal-notes',
  55                                 type: 'state',
  56                                 notes: '',
  57                                 markdown: false,
  58                                 whitespace: 'normal',
  59                                 state: Reveal.getState()
  60                         };
  61
  62                         // Look for notes defined in a slide attribute
  63                         if( slideElement.hasAttribute( 'data-notes' ) ) {
  64                                 messageData.notes = slideElement.getAttribute( 'data-notes' );
  65                                 messageData.whitespace = 'pre-wrap';
  66                         }
  67
  68                         // Look for notes defined in an aside element
  69                         if( notesElement ) {
  70                                 messageData.notes = notesElement.innerHTML;
  71                                 messageData.markdown = typeof notesElement.getAttribute( 'data-markdown' ) === 'string';
  72                         }
  73
  74                         notesPopup.postMessage( JSON.stringify( messageData ), '*' );
  75
  76                 }
  77
  78                 /**
  79                  * Called once we have established a connection to the notes
  80                  * window.
  81                  */
  82                 function onConnected() {
  83
  84                         // Monitor events that trigger a change in state
  85                         Reveal.addEventListener( 'slidechanged', post );
  86                         Reveal.addEventListener( 'fragmentshown', post );
  87                         Reveal.addEventListener( 'fragmenthidden', post );
  88                         Reveal.addEventListener( 'overviewhidden', post );
  89                         Reveal.addEventListener( 'overviewshown', post );
  90                         Reveal.addEventListener( 'paused', post );
  91                         Reveal.addEventListener( 'resumed', post );
  92
  93                         // Post the initial state
  94                         post();
  95
  96                 }
  97
  98                 connect();
  99         }
 100
 101         if( !/receiver/i.test( window.location.search ) ) {
 102
 103                 // If the there's a 'notes' query set, open directly
 104                 if( window.location.search.match( /(\?|\&)notes/gi ) !== null ) {
 105                         openNotes();
 106                 }
 107
 108                 // Open the notes when the 's' key is hit
 109                 document.addEventListener( 'keydown', function( event ) {
 110                         // Disregard the event if the target is editable or a
 111                         // modifier is present
 112                         if ( document.querySelector( ':focus' ) !== null || event.shiftKey || event.altKey || event.ctrlKey || event.metaKey ) return;
 113
 114                         if( event.keyCode === 83 ) {
 115                                 event.preventDefault();
 116                                 openNotes();
 117                         }
 118                 }, false );
 119
 120         }
 121
 122         return { open: openNotes };
 123
 124 })();