diff options
Diffstat (limited to 'plugin')
| -rw-r--r-- | plugin/markdown/example.html | 22 | ||||
| -rwxr-xr-x | plugin/markdown/markdown.js | 180 | ||||
| -rw-r--r-- | plugin/multiplex/master.js | 3 | ||||
| -rw-r--r-- | plugin/notes/notes.html | 16 | ||||
| -rw-r--r-- | plugin/remotes/remotes.js | 8 |
5 files changed, 189 insertions, 40 deletions
diff --git a/plugin/markdown/example.html b/plugin/markdown/example.html index 0b07aa5..522d8ac 100644 --- a/plugin/markdown/example.html +++ b/plugin/markdown/example.html @@ -8,6 +8,8 @@ <link rel="stylesheet" href="../../css/reveal.css"> <link rel="stylesheet" href="../../css/theme/default.css" id="theme"> + + <link rel="stylesheet" href="../../lib/css/zenburn.css"> </head> <body> @@ -66,6 +68,22 @@ </script> </section> + <!-- Code --> + <section> + <section data-markdown> + <script type="text/template"> + ```php + public function foo() + { + $foo = array( + 'bar' => 'bar' + ) + } + ``` + </script> + </section> + </section> + </div> </div> @@ -80,14 +98,12 @@ history: true, center: true, - theme: Reveal.getQueryHash().theme, - transition: Reveal.getQueryHash().transition || 'default', - // Optional libraries used to extend on reveal.js dependencies: [ { src: '../../lib/js/classList.js', condition: function() { return !document.body.classList; } }, { src: 'marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } }, { src: 'markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } }, + { src: '../highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } }, { src: '../notes/notes.js' } ] }); diff --git a/plugin/markdown/markdown.js b/plugin/markdown/markdown.js index c5c2358..9564208 100755 --- a/plugin/markdown/markdown.js +++ b/plugin/markdown/markdown.js @@ -9,9 +9,8 @@ } else { // Browser globals (root is window) - root.returnExports = factory( root.marked ); - root.returnExports.processSlides(); - root.returnExports.convertSlides(); + root.RevealMarkdown = factory( root.marked ); + root.RevealMarkdown.initialize(); } }( this, function( marked ) { @@ -27,6 +26,12 @@ }); } + var DEFAULT_SLIDE_SEPARATOR = '^\n---\n$', + DEFAULT_NOTES_SEPARATOR = 'note:', + DEFAULT_ELEMENT_ATTRIBUTES_SEPARATOR = '{\\\.\s*?([^}]+?)}', + DEFAULT_SLIDE_ATTRIBUTES_SEPARATOR = '^.*?<!--\\\sslide-attributes:\\\s(.*?)-->'; + + /** * Retrieves the markdown contents of a slide section * element. Normalizes leading tabs/whitespace. @@ -68,7 +73,7 @@ value = attributes[i].value; // disregard attributes that are used for markdown loading/parsing - if( /data\-(markdown|separator|vertical|notes)/gi.test( name ) ) continue; + if( /data\-(markdown|separator|vertical|notes|attributes)/gi.test( name ) ) continue; if( value ) { result.push( name + '=' + value ); @@ -83,10 +88,28 @@ } /** + * Inspects the given options and fills out default + * values for what's not defined. + */ + function getSlidifyOptions( options ) { + + options = options || {}; + options.separator = options.separator || DEFAULT_SLIDE_SEPARATOR; + options.notesSeparator = options.notesSeparator || DEFAULT_NOTES_SEPARATOR; + options.attributes = options.attributes || ''; + options.slideAttributesSeparator = options.slideAttributesSeparator || DEFAULT_SLIDE_ATTRIBUTES_SEPARATOR; + + return options; + + } + + /** * Helper function for constructing a markdown slide. */ function createMarkdownSlide( content, options ) { + options = getSlidifyOptions( options ); + var notesMatch = content.split( new RegExp( options.notesSeparator, 'mgi' ) ); if( notesMatch.length === 2 ) { @@ -103,20 +126,20 @@ */ function slidify( markdown, options ) { - options = options || {}; - options.separator = options.separator || '^\n---\n$'; - options.notesSeparator = options.notesSeparator || 'note:'; - options.attributes = options.attributes || ''; + options = getSlidifyOptions( options ); var separatorRegex = new RegExp( options.separator + ( options.verticalSeparator ? '|' + options.verticalSeparator : '' ), 'mg' ), - horizontalSeparatorRegex = new RegExp( options.separator ); + horizontalSeparatorRegex = new RegExp( options.separator ), + slideAttributesSeparatorRegex = new RegExp( options.slideAttributesSeparator, 'm' ); var matches, lastIndex = 0, isHorizontal, wasHorizontal = true, content, - sectionStack = []; + sectionStack = [], + matchAttributes, + slideAttributes = ""; // iterate until all blocks between separators are stacked up while( matches = separatorRegex.exec( markdown ) ) { @@ -154,20 +177,36 @@ // flatten the hierarchical stack, and insert <section data-markdown> tags for( var i = 0, len = sectionStack.length; i < len; i++ ) { // vertical - if( sectionStack[i].propertyIsEnumerable( length ) && typeof sectionStack[i].splice === 'function' ) { - markdownSections += '<section '+ options.attributes +'>'; + if( sectionStack[i] instanceof Array ) { + // The 'data-xxx' attributes of the first child must be set on the wrapping parent section to be effective + // Mainly for data-transition (otherwise, it is ignored for the first vertical slide) + firstChild = sectionStack[i][0]; + matchAttributes = slideAttributesSeparatorRegex.exec( firstChild ); + slideAttributes = matchAttributes ? matchAttributes[1] : ""; + dataAttributes = ""; + if( slideAttributes != "" ) { + // http://stackoverflow.com/questions/18025762/javascript-regex-replace-all-word-characters-except-word-characters-between-ch + // Keep only data-attributes for the parent slide section. + dataAttributes = slideAttributes.replace( /(data-\S+=\"[^\"]+?\")|\w|[\"=]/g, function(a, b) { return b || ''; }); + } + markdownSections += '<section '+ options.attributes + ' ' + dataAttributes + '>'; sectionStack[i].forEach( function( child ) { - markdownSections += '<section data-markdown>' + createMarkdownSlide( child, options ) + '</section>'; + matchAttributes = slideAttributesSeparatorRegex.exec( child ); + slideAttributes = matchAttributes ? matchAttributes[1] : ""; + child = matchAttributes ? child.replace( slideAttributesSeparatorRegex,"" ) : child + markdownSections += '<section ' + slideAttributes + ' data-markdown>' + createMarkdownSlide( child, options ) + '</section>'; } ); markdownSections += '</section>'; } else { - markdownSections += '<section '+ options.attributes +' data-markdown>' + createMarkdownSlide( sectionStack[i], options ) + '</section>'; + matchAttributes = slideAttributesSeparatorRegex.exec( sectionStack[i] ); + slideAttributes = matchAttributes ? matchAttributes[1] : ""; + content = matchAttributes ? sectionStack[i].replace( slideAttributesSeparatorRegex,"" ) : sectionStack[i] + markdownSections += '<section '+ options.attributes + ' ' + slideAttributes +' data-markdown>' + createMarkdownSlide( content, options ) + '</section>'; } } - return markdownSections; } @@ -201,12 +240,12 @@ xhr.onreadystatechange = function() { if( xhr.readyState === 4 ) { if ( xhr.status >= 200 && xhr.status < 300 ) { - section.outerHTML = slidify( xhr.responseText, { separator: section.getAttribute( 'data-separator' ), verticalSeparator: section.getAttribute( 'data-vertical' ), notesSeparator: section.getAttribute( 'data-notes' ), - attributes: getForwardedAttributes( section ) + attributes: getForwardedAttributes( section ), + slideAttributesSeparator: section.getAttribute( 'data-attributes' ), }); } @@ -232,16 +271,86 @@ } } - else if( section.getAttribute( 'data-separator' ) ) { + else if( section.getAttribute( 'data-separator' ) || section.getAttribute( 'data-vertical' ) || section.getAttribute( 'data-notes' ) ) { section.outerHTML = slidify( getMarkdownFromSlide( section ), { separator: section.getAttribute( 'data-separator' ), verticalSeparator: section.getAttribute( 'data-vertical' ), notesSeparator: section.getAttribute( 'data-notes' ), - attributes: getForwardedAttributes( section ) + attributes: getForwardedAttributes( section ), + slideAttributesSeparator: section.getAttribute( 'data-attributes' ), }); } + else { + var content = getMarkdownFromSlide( section ); + var slideAttributesSeparatorRegex = new RegExp( section.getAttribute( 'data-attributes' ) || DEFAULT_SLIDE_ATTRIBUTES_SEPARATOR, 'm' ); + var matchAttributes = slideAttributesSeparatorRegex.exec( content ); + if ( matchAttributes ) { + var slideAttributes = matchAttributes[1]; + content = content.replace( slideAttributesSeparatorRegex,"" ); + var slideAttributesRegex = new RegExp( "([^\"= ]+?)=\"([^\"=]+?)\"", 'mg' ); + while( matchesAttributes = slideAttributesRegex.exec( slideAttributes ) ) { + section.setAttribute( matchesAttributes[1], matchesAttributes[2] ); + } + } + section.innerHTML = createMarkdownSlide( content ); + } + } + + } + + /** + * Check if a node value has the attributes pattern. + * If yes, extract it and add that value as one or several attributes + * the the terget element. + * + * You need Cache Killer on Chrome to see the effect on any FOM transformation + * directly on refresh (F5) + * http://stackoverflow.com/questions/5690269/disabling-chrome-cache-for-website-development/7000899#answer-11786277 + */ + function addAttributeInElement( node, elementTarget, separator ) { + + var mardownClassesInElementsRegex = new RegExp( separator, 'mg' ); + var mardownClassRegex = new RegExp( "([^\"= ]+?)=\"([^\"=]+?)\"", 'mg' ); + var nodeValue = node.nodeValue; + if( matches = mardownClassesInElementsRegex.exec( nodeValue ) ) { + + var classes = matches[1]; + nodeValue = nodeValue.substring( 0, matches.index ) + nodeValue.substring( mardownClassesInElementsRegex.lastIndex ); + node.nodeValue = nodeValue; + + while( matchesClass = mardownClassRegex.exec( classes ) ) { + elementTarget.setAttribute( matchesClass[1], matchesClass[2] ); + } + } + + } + + /** + * Add attributes to the parent element of a text node, + * or the element of an attribute node. + */ + function addAttributes( element, separator ) { + + if( element.childNodes.length > 0 ) { + for( var i = 0; i < element.childNodes.length; i++ ) { + addAttributes( element.childNodes[i], separator ); + } + } + + var nodeValue; + var elementTarget; + + // From http://stackoverflow.com/questions/9178174/find-all-text-nodes + if( element.nodeType == Node.TEXT_NODE && /\S/.test(element.nodeValue) ) { + addAttributeInElement( element, element.parentNode, separator ); + } + if( element.nodeType == Node.ELEMENT_NODE && element.attributes.length > 0 ) { + for( var j = 0; j < element.attributes.length; j++ ){ + var attr = element.attributes[j]; + addAttributeInElement( attr, element, separator ); + } } } @@ -258,25 +367,44 @@ var section = sections[i]; - var notes = section.querySelector( 'aside.notes' ); - var markdown = getMarkdownFromSlide( section ); + // Only parse the same slide once + if( !section.getAttribute( 'data-markdown-parsed' ) ) { + + section.setAttribute( 'data-markdown-parsed', true ) - section.innerHTML = marked( markdown ); + var notes = section.querySelector( 'aside.notes' ); + var markdown = getMarkdownFromSlide( section ); + + section.innerHTML = marked( markdown ); + addAttributes( section, section.getAttribute( 'data-element-attributes' ) || + section.parentNode.getAttribute( 'data-element-attributes' ) || + DEFAULT_ELEMENT_ATTRIBUTES_SEPARATOR ); + + // If there were notes, we need to re-add them after + // having overwritten the section's HTML + if( notes ) { + section.appendChild( notes ); + } - // If there were notes, we need to re-add them after - // having overwritten the section's HTML - if( notes ) { - section.appendChild( notes ); } } } + // API return { + + initialize: function() { + processSlides(); + convertSlides(); + }, + + // TODO: Do these belong in the API? processSlides: processSlides, convertSlides: convertSlides, slidify: slidify + }; })); diff --git a/plugin/multiplex/master.js b/plugin/multiplex/master.js index deb39cd..b6a7eb7 100644 --- a/plugin/multiplex/master.js +++ b/plugin/multiplex/master.js @@ -1,6 +1,7 @@ (function() { - // don't emit events from inside the previews themselves + // Don't emit events from inside of notes windows if ( window.location.search.match( /receiver/gi ) ) { return; } + var multiplex = Reveal.getConfig().multiplex; var socket = io.connect(multiplex.url); diff --git a/plugin/notes/notes.html b/plugin/notes/notes.html index 7e542e4..847499d 100644 --- a/plugin/notes/notes.html +++ b/plugin/notes/notes.html @@ -138,12 +138,20 @@ <body> + <script> + function getNotesURL( controls ) { + return window.opener.location.protocol + '//' + window.opener.location.host + window.opener.location.pathname + '?receiver&controls='+ ( controls || 'false' ) +'&progress=false&overview=false' + window.opener.location.hash; + } + var notesCurrentSlideURL = getNotesURL( true ); + var notesNextSlideURL = getNotesURL( false ); + </script> + <div id="wrap-current-slide" class="slides"> - <script>document.write( '<iframe width="1280" height="1024" id="current-slide" src="'+ window.opener.location.href +'"></iframe>' );</script> + <script>document.write( '<iframe width="1280" height="1024" id="current-slide" src="'+ notesCurrentSlideURL +'"></iframe>' );</script> </div> <div id="wrap-next-slide" class="slides"> - <script>document.write( '<iframe width="640" height="512" id="next-slide" src="'+ window.opener.location.href +'"></iframe>' );</script> + <script>document.write( '<iframe width="640" height="512" id="next-slide" src="'+ notesNextSlideURL +'"></iframe>' );</script> <span>UPCOMING:</span> </div> @@ -239,10 +247,6 @@ currentSlide.contentWindow.Reveal.addEventListener( 'fragmentshown', synchronizeMainWindow ); currentSlide.contentWindow.Reveal.addEventListener( 'fragmenthidden', synchronizeMainWindow ); - // Reconfigure the notes window to remove needless UI - currentSlide.contentWindow.Reveal.configure({ controls: false, progress: false, overview: false }); - nextSlide.contentWindow.Reveal.configure({ controls: false, progress: false, overview: false }); - } else { diff --git a/plugin/remotes/remotes.js b/plugin/remotes/remotes.js index 694e9c0..ba0dbad 100644 --- a/plugin/remotes/remotes.js +++ b/plugin/remotes/remotes.js @@ -17,11 +17,11 @@ * Detects if notes are enable and the current page is opened inside an /iframe * this prevents loading Remotes.io several times */ - var remotesAndIsNotes = (function(){ - return !(window.RevealNotes && self == top); + var isNotesAndIframe = (function(){ + return window.RevealNotes && !(self == top); })(); - if(!hasTouch && !remotesAndIsNotes){ + if(!hasTouch && !isNotesAndIframe){ head.ready( 'remotes.ne.min.js', function() { new Remotes("preview") .on("swipe-left", function(e){ Reveal.right(); }) @@ -34,6 +34,6 @@ ; } ); - head.js('https://raw.github.com/Remotes/Remotes/master/dist/remotes.ne.min.js'); + head.js('https://hakim-static.s3.amazonaws.com/reveal-js/remotes.ne.min.js'); } })(window);
\ No newline at end of file |