Explorar el Código

added slide announcing markdown support (#15)

Hakim El Hattab hace 12 años
padre
commit
696346dccb
Se han modificado 3 ficheros con 53 adiciones y 31 borrados
  1. 3 1
      README.md
  2. 38 29
      index.html
  3. 12 1
      js/reveal.js

+ 3 - 1
README.md

@@ -182,7 +182,9 @@ You can change the appearance of the speaker notes by editing the file at `plugi
 - New API method ```Reveal.getPreviousSlide()```
 - New API method ```Reveal.getCurrentSlide()```
 - New API method ```Reveal.getIndices()```
-- Fixes bug where the ```.present``` class was sometimes left on the previous slide
+- Fixed bug where the ```.present``` class was sometimes left on the previous slide
+- Added support for slides written using markdown
+- Added helped method ```Reveal.getQueryHash()```
 
 #### 1.4
 - Main ```#reveal container``` is now selected via a class instead of ID

+ 38 - 29
index.html

@@ -100,19 +100,6 @@
 					</p>
 				</section>
 
-				<section>
-					<h2>Transition Styles</h2>
-					<p>
-						You can select from different transitions, like:
-					</p>
-					<ul>
-						<li><a href="http://lab.hakim.se/reveal-js/?transition=cube">Cube</a></li>
-						<li><a href="http://lab.hakim.se/reveal-js/?transition=page">Page</a></li>
-						<li><a href="http://lab.hakim.se/reveal-js/?transition=concave">Concave</a></li>
-						<li><a href="http://lab.hakim.se/reveal-js/?transition=linear">Linear</a></li>
-					</ul>
-				</section>
-
 				<section>
 					<h2>Marvelous Unordered List</h2>
 					<ul>
@@ -132,6 +119,32 @@
 					</ol>
 				</section>
 
+				<section data-markdown>
+					## Markdown support
+					
+					For those of you who like that sort of thing. Instructions and a bit more info 
+					available [here](https://github.com/hakimel/reveal.js#markdown).
+
+					<pre><code contenteditable style="margin-top: 20px;">&lt;section data-markdown&gt;
+  ## Markdown support
+  For those of you who like that sort of thing. Instructions and a bit more info available [here](https://github.com/hakimel/reveal.js#markdown).
+&lt;/section&gt;
+					</code></pre>
+				</section>
+
+				<section>
+					<h2>Transition Styles</h2>
+					<p>
+						You can select from different transitions, like:
+					</p>
+					<ul>
+						<li><a href="http://lab.hakim.se/reveal-js/?transition=cube">Cube</a></li>
+						<li><a href="http://lab.hakim.se/reveal-js/?transition=page">Page</a></li>
+						<li><a href="http://lab.hakim.se/reveal-js/?transition=concave">Concave</a></li>
+						<li><a href="http://lab.hakim.se/reveal-js/?transition=linear">Linear</a></li>
+					</ul>
+				</section>
+
 				<section>
 					<section data-state="alert">
 						<h2>Global State</h2>
@@ -259,7 +272,7 @@ function linkify( selector ) {
 		<script src="lib/js/head.min.js"></script>
 
 		<script>
-			// All scripts that should be loaded before initializing
+			// Scripts that should be loaded before initializing
 			var scripts = [];
 
 			// If the browser doesn't support classList, load a polyfill
@@ -273,15 +286,17 @@ function linkify( selector ) {
 				scripts.push( 'lib/js/data-markdown.js' );
 			}
 
-			scripts.push( 'js/reveal.js' );
+			// If we're runnning the notes server we need to include some additional JS
+			// TODO Is there a better way to determine if we're running the notes server?
+			if( window.location.host === 'localhost:1947' ) {
+				scripts.push( 'socket.io/socket.io.js' );
+				scripts.push( 'plugin/speakernotes/client.js' );
+			}
 
-			head.js.apply( null, scripts.concat([ function() {
+			scripts.push( 'js/reveal.js' );
 
-				// Parse the query string into a key/value object
-				var query = {};
-				location.search.replace( /[A-Z0-9]+?=(\w*)/gi, function(a) {
-					query[ a.split( '=' ).shift() ] = a.split( '=' ).pop();
-				} );
+			// Load the scripts and, when completed, initialize reveal.js
+			head.js.apply( null, scripts.concat([function() {
 
 				// Fires when a slide with data-state=customevent is activated
 				Reveal.addEventListener( 'customevent', function() {
@@ -300,8 +315,8 @@ function linkify( selector ) {
 					progress: true,
 					history: true,
 					
-					theme: query.theme || 'default', // default/neon/beige
-					transition: query.transition || 'default' // default/cube/page/concave/linear(2d)
+					theme: Reveal.getQueryHash().theme || 'default', // default/neon/beige
+					transition: Reveal.getQueryHash().transition || 'default' // default/cube/page/concave/linear(2d)
 				});
 
 			}]));
@@ -310,12 +325,6 @@ function linkify( selector ) {
 			head.js( 'lib/js/highlight.js', function() { 
 				hljs.initHighlightingOnLoad(); 
 			} );
-
-			// If we're runnning the notes server we need to include some additional JS
-			// TODO Is there a better way to determine if we're running the notes server?
-			if( window.location.host === 'localhost:1947' ) {
-				head.js( 'socket.io/socket.io.js', 'plugin/speakernotes/client.js' );
-			}
 		</script>
 		
 	</body>

+ 12 - 1
js/reveal.js

@@ -1,5 +1,5 @@
 /*!
- * reveal.js 1.5 r4
+ * reveal.js 1.5 r6
  * http://lab.hakim.se/reveal-js
  * MIT licensed
  * 
@@ -1015,6 +1015,17 @@ var Reveal = (function(){
 			return currentSlide
 		},
 
+		// Helper method, retrieves query string as a key/value hash
+		getQueryHash: function() {
+			var query = {};
+
+			location.search.replace( /[A-Z0-9]+?=(\w*)/gi, function(a) {
+				query[ a.split( '=' ).shift() ] = a.split( '=' ).pop();
+			} );
+
+			return query;
+		},
+
 		// Forward event binding to the reveal DOM element
 		addEventListener: function( type, listener, useCapture ) {
 			( dom.wrapper || document.querySelector( '.reveal' ) ).addEventListener( type, listener, useCapture );