From f79210c6c1451bb4ae2942068de6c7d543f58d89 Mon Sep 17 00:00:00 2001 From: Daniel Teixeira Date: Thu, 5 Mar 2015 18:48:26 -0300 Subject: [PATCH 001/228] Add support for custom notes.html file It would be nice if we could define a custom notes.html file. Actually, I'm used to compile my js files before releasing my app and, using selectors like `script[src$="notes.js"]`, doesn't work :( So, what do you think about it? --- plugin/notes/notes.js | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/plugin/notes/notes.js b/plugin/notes/notes.js index 27199af..f353a8d 100644 --- a/plugin/notes/notes.js +++ b/plugin/notes/notes.js @@ -11,10 +11,14 @@ */ var RevealNotes = (function() { - function openNotes() { - var jsFileLocation = document.querySelector('script[src$="notes.js"]').src; // this js file path - jsFileLocation = jsFileLocation.replace(/notes\.js(\?.*)?$/, ''); // the js folder path - var notesPopup = window.open( jsFileLocation + 'notes.html', 'reveal.js - Notes', 'width=1100,height=700' ); + function openNotes(notes_html_file_path) { + if (!notes_html_file_path) { + var jsFileLocation = document.querySelector('script[src$="notes.js"]').src; // this js file path + jsFileLocation = jsFileLocation.replace(/notes\.js(\?.*)?$/, ''); // the js folder path + notes_html_file_path = jsFileLocation + 'notes.html'; + } + + var notesPopup = window.open(notes_html_file_path, 'reveal.js - Notes', 'width=1100,height=700' ); /** * Connect to the notes window through a postmessage handshake. From a96cabaf70938df3fdb9f258758f743f398a14e5 Mon Sep 17 00:00:00 2001 From: "Philipp A." Date: Sun, 3 May 2015 17:40:11 +0200 Subject: [PATCH 002/228] Fixed last header having a border-bottom `` is automatically inserted, so we can guarantee that this affects all ths and tds in the last row of the table *body* and the head is left untouched --- css/theme/template/theme.scss | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/css/theme/template/theme.scss b/css/theme/template/theme.scss index d1be10a..b5069d3 100644 --- a/css/theme/template/theme.scss +++ b/css/theme/template/theme.scss @@ -199,8 +199,9 @@ body { border-bottom: 1px solid; } -.reveal table tr:last-child td { - border-bottom: none; +.reveal table tbody tr:last-child th, +.reveal table tbody tr:last-child td { + border-bottom: none; } .reveal sup { From cee64858dd0e0bb4aed195f04dc6d74b2980cdfa Mon Sep 17 00:00:00 2001 From: jzgdev Date: Wed, 1 Jul 2015 22:51:01 -0700 Subject: [PATCH 003/228] Gruntfile.js: watch tasks restructured --- Gruntfile.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/Gruntfile.js b/Gruntfile.js index a851845..8be2929 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -112,9 +112,6 @@ module.exports = function(grunt) { }, watch: { - options: { - livereload: true - }, js: { files: [ 'Gruntfile.js', 'js/reveal.js' ], tasks: 'js' @@ -129,6 +126,9 @@ module.exports = function(grunt) { }, html: { files: [ 'index.html'] + }, + options: { + livereload: true } } From ccbc7ed6bcd9a2fe9a8d6c651fdc8644ecc08ee6 Mon Sep 17 00:00:00 2001 From: Dan Allen Date: Fri, 7 Aug 2015 22:55:37 -0600 Subject: [PATCH 004/228] resolves #1324 allow display property to be configured - allow display property apply to current slide to be configured --- js/reveal.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/js/reveal.js b/js/reveal.js index ff5ea53..499d006 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -45,6 +45,9 @@ minScale: 0.2, maxScale: 1.5, + // Value of the display CSS property applied to current slide to make it visible + display: 'block', + // Display controls in the bottom right corner controls: true, @@ -2721,7 +2724,7 @@ function showSlide( slide ) { // Show the slide element - slide.style.display = 'block'; + slide.style.display = config.display; // Media elements with data-src attributes toArray( slide.querySelectorAll( 'img[data-src], video[data-src], audio[data-src]' ) ).forEach( function( element ) { From d6d4c68013f2d77d7eb4c967c6500885c333955e Mon Sep 17 00:00:00 2001 From: Wendy Smoak Date: Sun, 13 Sep 2015 09:14:12 -0400 Subject: [PATCH 005/228] Add the data-noescape attribute and example --- README.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 573b195..3137f5d 100644 --- a/README.md +++ b/README.md @@ -582,15 +582,15 @@ Reveal.addEventListener( 'fragmenthidden', function( event ) { ### Code syntax highlighting -By default, Reveal is configured with [highlight.js](http://softwaremaniacs.org/soft/highlight/en/) for code syntax highlighting. Below is an example with clojure code that will be syntax highlighted. When the `data-trim` attribute is present surrounding whitespace is automatically removed. +By default, Reveal is configured with [highlight.js](http://softwaremaniacs.org/soft/highlight/en/) for code syntax highlighting. Below is an example with clojure code that will be syntax highlighted. When the `data-trim` attribute is present, surrounding whitespace is automatically removed. HTML will be escaped by default. To avoid this, for example if you are using `` to call out a line of code, add the `data-noescape` attribute to the `` element. ```html
-

+	

 (def lazy-fib
   (concat
    [0 1]
-   ((fn rfib [a b]
+   ((fn rfib [a b]
         (lazy-cons (+ a b) (rfib b (+ a b)))) 0 1)))
 	
From bcfd0aae3c007d972ac380d72e79dfdd3a5d08e0 Mon Sep 17 00:00:00 2001 From: Alex Batista Date: Mon, 28 Sep 2015 23:04:47 -0300 Subject: [PATCH 006/228] bug fix - when the first section has a background-video, the vido do not execute. Now, it's work --- js/reveal.js | 17 +++++++++++++++-- 1 file changed, 15 insertions(+), 2 deletions(-) diff --git a/js/reveal.js b/js/reveal.js index 65ac29f..ae5810c 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -147,6 +147,10 @@ // Flags if reveal.js is loaded (has dispatched the 'ready' event) loaded = false, + // Flags if video background is loaded + loadeddataVideo = false, + + // The horizontal and vertical index of the currently active slide indexh, indexv, @@ -2472,8 +2476,17 @@ // Start video playback var currentVideo = currentBackground.querySelector( 'video' ); if( currentVideo ) { - currentVideo.currentTime = 0; - currentVideo.play(); + + currentVideo.addEventListener("loadeddata", function() { + currentVideo.currentTime = 0; + currentVideo.play(); + loadeddataVideo = true; + this.removeEventListener("loadeddata",function(){return false}); + }); + if(loadeddataVideo === true){ + currentVideo.currentTime = 0; + currentVideo.play(); + } } // Don't transition between identical backgrounds. This From b0d6e5578f50483abff747d200146baa401de11e Mon Sep 17 00:00:00 2001 From: Alex Batista Date: Tue, 29 Sep 2015 15:18:17 -0300 Subject: [PATCH 007/228] improvement on spaces and indentation --- js/reveal.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/js/reveal.js b/js/reveal.js index ae5810c..ce5c2b6 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -150,7 +150,6 @@ // Flags if video background is loaded loadeddataVideo = false, - // The horizontal and vertical index of the currently active slide indexh, indexv, @@ -2481,8 +2480,9 @@ currentVideo.currentTime = 0; currentVideo.play(); loadeddataVideo = true; - this.removeEventListener("loadeddata",function(){return false}); + this.removeEventListener("loadeddata",function(){return false}); }); + if(loadeddataVideo === true){ currentVideo.currentTime = 0; currentVideo.play(); From 92a69967547ca4849f4c669c0905485f7a1b4856 Mon Sep 17 00:00:00 2001 From: Alex Batista Date: Tue, 29 Sep 2015 20:49:25 -0300 Subject: [PATCH 008/228] Improvement of code. Now none flag is used, but the readyState property from video element --- js/reveal.js | 19 +++++++++---------- 1 file changed, 9 insertions(+), 10 deletions(-) diff --git a/js/reveal.js b/js/reveal.js index ae5810c..5b4a545 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -150,7 +150,6 @@ // Flags if video background is loaded loadeddataVideo = false, - // The horizontal and vertical index of the currently active slide indexh, indexv, @@ -2473,19 +2472,19 @@ if( currentBackground ) { - // Start video playback - var currentVideo = currentBackground.querySelector( 'video' ); - if( currentVideo ) { - - currentVideo.addEventListener("loadeddata", function() { + // Start video playback + var currentVideo = currentBackground.querySelector( 'video' ); + if( currentVideo ) { + if(currentVideo.readyState >1){ currentVideo.currentTime = 0; currentVideo.play(); - loadeddataVideo = true; - this.removeEventListener("loadeddata",function(){return false}); - }); - if(loadeddataVideo === true){ + } + else{ + currentVideo.addEventListener("loadeddata", function() { currentVideo.currentTime = 0; currentVideo.play(); + currentVideo.removeEventListener("loadeddata",function(){return false}); + }); } } From e258db0994a435075b0c94b757abb40adf90aa18 Mon Sep 17 00:00:00 2001 From: Alex Batista Date: Tue, 29 Sep 2015 21:01:50 -0300 Subject: [PATCH 009/228] UPDATED - Improvement of code. Now none flag is used, but the readyState property from video element --- js/reveal.js | 3 --- 1 file changed, 3 deletions(-) diff --git a/js/reveal.js b/js/reveal.js index 5b4a545..3758a41 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -147,9 +147,6 @@ // Flags if reveal.js is loaded (has dispatched the 'ready' event) loaded = false, - // Flags if video background is loaded - loadeddataVideo = false, - // The horizontal and vertical index of the currently active slide indexh, indexv, From c1cb328e19c5bc95d26db0caa21e9ab16561dacc Mon Sep 17 00:00:00 2001 From: Alex Batista Date: Tue, 29 Sep 2015 21:07:02 -0300 Subject: [PATCH 010/228] UPDATED - Improvement on spaces and indentation --- js/reveal.js | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/js/reveal.js b/js/reveal.js index 3758a41..9d4b344 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -2469,10 +2469,11 @@ if( currentBackground ) { - // Start video playback - var currentVideo = currentBackground.querySelector( 'video' ); - if( currentVideo ) { - if(currentVideo.readyState >1){ + // Start video playback + var currentVideo = currentBackground.querySelector( 'video' ); + if( currentVideo ) { + + if(currentVideo.readyState >1){ currentVideo.currentTime = 0; currentVideo.play(); } @@ -2483,6 +2484,7 @@ currentVideo.removeEventListener("loadeddata",function(){return false}); }); } + } // Don't transition between identical backgrounds. This From ec119e79a7708931267b41d672e6022861fceeb5 Mon Sep 17 00:00:00 2001 From: Alex Batista Date: Tue, 29 Sep 2015 21:09:41 -0300 Subject: [PATCH 011/228] UPDATED - Improvement on spaces and indentation --- js/reveal.js | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/js/reveal.js b/js/reveal.js index 9d4b344..421fa2c 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -2472,19 +2472,17 @@ // Start video playback var currentVideo = currentBackground.querySelector( 'video' ); if( currentVideo ) { - - if(currentVideo.readyState >1){ + if(currentVideo.readyState > 1){ currentVideo.currentTime = 0; currentVideo.play(); } else{ currentVideo.addEventListener("loadeddata", function() { - currentVideo.currentTime = 0; - currentVideo.play(); - currentVideo.removeEventListener("loadeddata",function(){return false}); + currentVideo.currentTime = 0; + currentVideo.play(); + currentVideo.removeEventListener("loadeddata",function(){return false}); }); } - } // Don't transition between identical backgrounds. This From 625831b9930c50114ab96dd635813a36655e7614 Mon Sep 17 00:00:00 2001 From: Liu Zhanhong <275368990@qq.com> Date: Mon, 19 Oct 2015 19:50:43 +0800 Subject: [PATCH 012/228] format note content when creating slide In html content, marked allow `Inline-Level Grammar` but not `Block-Level Grammar`, so when I write following: ``` note: * a * b * c ``` it become: ```html

a b

  • c
``` unbelievable! --- plugin/markdown/markdown.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugin/markdown/markdown.js b/plugin/markdown/markdown.js index f4035e2..031160c 100755 --- a/plugin/markdown/markdown.js +++ b/plugin/markdown/markdown.js @@ -117,7 +117,7 @@ var notesMatch = content.split( new RegExp( options.notesSeparator, 'mgi' ) ); if( notesMatch.length === 2 ) { - content = notesMatch[0] + ''; + content = notesMatch[0] + ''; } // prevent script end tags in the content from interfering From 43f0d081550e5a4a3bc86e478ecc145990ad9a40 Mon Sep 17 00:00:00 2001 From: teawithfruit Date: Mon, 2 Nov 2015 10:37:16 +0100 Subject: [PATCH 013/228] fixed loading --- plugin/markdown/markdown.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/plugin/markdown/markdown.js b/plugin/markdown/markdown.js index f4035e2..f40e2b6 100755 --- a/plugin/markdown/markdown.js +++ b/plugin/markdown/markdown.js @@ -4,7 +4,11 @@ * of external markdown documents. */ (function( root, factory ) { - if( typeof exports === 'object' ) { + if (typeof define === 'function' && define.amd) { + root.marked = require( './marked' ); + root.RevealMarkdown = factory( root.marked ); + root.RevealMarkdown.initialize(); + } else if( typeof exports === 'object' ) { module.exports = factory( require( './marked' ) ); } else { From 695293145193ed84b7ef193b538bb144ecb2832e Mon Sep 17 00:00:00 2001 From: Riceball LEE Date: Tue, 10 Nov 2015 21:40:46 +0000 Subject: [PATCH 014/228] * update marked.js version to 0.3.5 --- plugin/markdown/marked.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugin/markdown/marked.js b/plugin/markdown/marked.js index 70af29b..555c1dc 100644 --- a/plugin/markdown/marked.js +++ b/plugin/markdown/marked.js @@ -3,4 +3,4 @@ * Copyright (c) 2011-2014, Christopher Jeffrey. (MIT Licensed) * https://github.com/chjj/marked */ -(function(){function e(e){this.tokens=[],this.tokens.links={},this.options=e||a.defaults,this.rules=p.normal,this.options.gfm&&(this.rules=this.options.tables?p.tables:p.gfm)}function t(e,t){if(this.options=t||a.defaults,this.links=e,this.rules=u.normal,this.renderer=this.options.renderer||new n,this.renderer.options=this.options,!this.links)throw new Error("Tokens array requires a `links` property.");this.options.gfm?this.rules=this.options.breaks?u.breaks:u.gfm:this.options.pedantic&&(this.rules=u.pedantic)}function n(e){this.options=e||{}}function r(e){this.tokens=[],this.token=null,this.options=e||a.defaults,this.options.renderer=this.options.renderer||new n,this.renderer=this.options.renderer,this.renderer.options=this.options}function s(e,t){return e.replace(t?/&/g:/&(?!#?\w+;)/g,"&").replace(//g,">").replace(/"/g,""").replace(/'/g,"'")}function i(e){return e.replace(/&([#\w]+);/g,function(e,t){return t=t.toLowerCase(),"colon"===t?":":"#"===t.charAt(0)?String.fromCharCode("x"===t.charAt(1)?parseInt(t.substring(2),16):+t.substring(1)):""})}function l(e,t){return e=e.source,t=t||"",function n(r,s){return r?(s=s.source||s,s=s.replace(/(^|[^\[])\^/g,"$1"),e=e.replace(r,s),n):new RegExp(e,t)}}function o(){}function h(e){for(var t,n,r=1;rAn error occured:

"+s(c.message+"",!0)+"
";throw c}}var p={newline:/^\n+/,code:/^( {4}[^\n]+\n*)+/,fences:o,hr:/^( *[-*_]){3,} *(?:\n+|$)/,heading:/^ *(#{1,6}) *([^\n]+?) *#* *(?:\n+|$)/,nptable:o,lheading:/^([^\n]+)\n *(=|-){2,} *(?:\n+|$)/,blockquote:/^( *>[^\n]+(\n(?!def)[^\n]+)*\n*)+/,list:/^( *)(bull) [\s\S]+?(?:hr|def|\n{2,}(?! )(?!\1bull )\n*|\s*$)/,html:/^ *(?:comment *(?:\n|\s*$)|closed *(?:\n{2,}|\s*$)|closing *(?:\n{2,}|\s*$))/,def:/^ *\[([^\]]+)\]: *]+)>?(?: +["(]([^\n]+)[")])? *(?:\n+|$)/,table:o,paragraph:/^((?:[^\n]+\n?(?!hr|heading|lheading|blockquote|tag|def))+)\n*/,text:/^[^\n]+/};p.bullet=/(?:[*+-]|\d+\.)/,p.item=/^( *)(bull) [^\n]*(?:\n(?!\1bull )[^\n]*)*/,p.item=l(p.item,"gm")(/bull/g,p.bullet)(),p.list=l(p.list)(/bull/g,p.bullet)("hr","\\n+(?=\\1?(?:[-*_] *){3,}(?:\\n+|$))")("def","\\n+(?="+p.def.source+")")(),p.blockquote=l(p.blockquote)("def",p.def)(),p._tag="(?!(?:a|em|strong|small|s|cite|q|dfn|abbr|data|time|code|var|samp|kbd|sub|sup|i|b|u|mark|ruby|rt|rp|bdi|bdo|span|br|wbr|ins|del|img)\\b)\\w+(?!:/|[^\\w\\s@]*@)\\b",p.html=l(p.html)("comment",//)("closed",/<(tag)[\s\S]+?<\/\1>/)("closing",/])*?>/)(/tag/g,p._tag)(),p.paragraph=l(p.paragraph)("hr",p.hr)("heading",p.heading)("lheading",p.lheading)("blockquote",p.blockquote)("tag","<"+p._tag)("def",p.def)(),p.normal=h({},p),p.gfm=h({},p.normal,{fences:/^ *(`{3,}|~{3,}) *(\S+)? *\n([\s\S]+?)\s*\1 *(?:\n+|$)/,paragraph:/^/}),p.gfm.paragraph=l(p.paragraph)("(?!","(?!"+p.gfm.fences.source.replace("\\1","\\2")+"|"+p.list.source.replace("\\1","\\3")+"|")(),p.tables=h({},p.gfm,{nptable:/^ *(\S.*\|.*)\n *([-:]+ *\|[-| :]*)\n((?:.*\|.*(?:\n|$))*)\n*/,table:/^ *\|(.+)\n *\|( *[-:]+[-| :]*)\n((?: *\|.*(?:\n|$))*)\n*/}),e.rules=p,e.lex=function(t,n){var r=new e(n);return r.lex(t)},e.prototype.lex=function(e){return e=e.replace(/\r\n|\r/g,"\n").replace(/\t/g," ").replace(/\u00a0/g," ").replace(/\u2424/g,"\n"),this.token(e,!0)},e.prototype.token=function(e,t,n){for(var r,s,i,l,o,h,a,u,c,e=e.replace(/^ +$/gm,"");e;)if((i=this.rules.newline.exec(e))&&(e=e.substring(i[0].length),i[0].length>1&&this.tokens.push({type:"space"})),i=this.rules.code.exec(e))e=e.substring(i[0].length),i=i[0].replace(/^ {4}/gm,""),this.tokens.push({type:"code",text:this.options.pedantic?i:i.replace(/\n+$/,"")});else if(i=this.rules.fences.exec(e))e=e.substring(i[0].length),this.tokens.push({type:"code",lang:i[2],text:i[3]});else if(i=this.rules.heading.exec(e))e=e.substring(i[0].length),this.tokens.push({type:"heading",depth:i[1].length,text:i[2]});else if(t&&(i=this.rules.nptable.exec(e))){for(e=e.substring(i[0].length),h={type:"table",header:i[1].replace(/^ *| *\| *$/g,"").split(/ *\| */),align:i[2].replace(/^ *|\| *$/g,"").split(/ *\| */),cells:i[3].replace(/\n$/,"").split("\n")},u=0;u ?/gm,""),this.token(i,t,!0),this.tokens.push({type:"blockquote_end"});else if(i=this.rules.list.exec(e)){for(e=e.substring(i[0].length),l=i[2],this.tokens.push({type:"list_start",ordered:l.length>1}),i=i[0].match(this.rules.item),r=!1,c=i.length,u=0;c>u;u++)h=i[u],a=h.length,h=h.replace(/^ *([*+-]|\d+\.) +/,""),~h.indexOf("\n ")&&(a-=h.length,h=this.options.pedantic?h.replace(/^ {1,4}/gm,""):h.replace(new RegExp("^ {1,"+a+"}","gm"),"")),this.options.smartLists&&u!==c-1&&(o=p.bullet.exec(i[u+1])[0],l===o||l.length>1&&o.length>1||(e=i.slice(u+1).join("\n")+e,u=c-1)),s=r||/\n\n(?!\s*$)/.test(h),u!==c-1&&(r="\n"===h.charAt(h.length-1),s||(s=r)),this.tokens.push({type:s?"loose_item_start":"list_item_start"}),this.token(h,!1,n),this.tokens.push({type:"list_item_end"});this.tokens.push({type:"list_end"})}else if(i=this.rules.html.exec(e))e=e.substring(i[0].length),this.tokens.push({type:this.options.sanitize?"paragraph":"html",pre:"pre"===i[1]||"script"===i[1]||"style"===i[1],text:i[0]});else if(!n&&t&&(i=this.rules.def.exec(e)))e=e.substring(i[0].length),this.tokens.links[i[1].toLowerCase()]={href:i[2],title:i[3]};else if(t&&(i=this.rules.table.exec(e))){for(e=e.substring(i[0].length),h={type:"table",header:i[1].replace(/^ *| *\| *$/g,"").split(/ *\| */),align:i[2].replace(/^ *|\| *$/g,"").split(/ *\| */),cells:i[3].replace(/(?: *\| *)?\n$/,"").split("\n")},u=0;u])/,autolink:/^<([^ >]+(@|:\/)[^ >]+)>/,url:o,tag:/^|^<\/?\w+(?:"[^"]*"|'[^']*'|[^'">])*?>/,link:/^!?\[(inside)\]\(href\)/,reflink:/^!?\[(inside)\]\s*\[([^\]]*)\]/,nolink:/^!?\[((?:\[[^\]]*\]|[^\[\]])*)\]/,strong:/^__([\s\S]+?)__(?!_)|^\*\*([\s\S]+?)\*\*(?!\*)/,em:/^\b_((?:__|[\s\S])+?)_\b|^\*((?:\*\*|[\s\S])+?)\*(?!\*)/,code:/^(`+)\s*([\s\S]*?[^`])\s*\1(?!`)/,br:/^ {2,}\n(?!\s*$)/,del:o,text:/^[\s\S]+?(?=[\\?(?:\s+['"]([\s\S]*?)['"])?\s*/,u.link=l(u.link)("inside",u._inside)("href",u._href)(),u.reflink=l(u.reflink)("inside",u._inside)(),u.normal=h({},u),u.pedantic=h({},u.normal,{strong:/^__(?=\S)([\s\S]*?\S)__(?!_)|^\*\*(?=\S)([\s\S]*?\S)\*\*(?!\*)/,em:/^_(?=\S)([\s\S]*?\S)_(?!_)|^\*(?=\S)([\s\S]*?\S)\*(?!\*)/}),u.gfm=h({},u.normal,{escape:l(u.escape)("])","~|])")(),url:/^(https?:\/\/[^\s<]+[^<.,:;"')\]\s])/,del:/^~~(?=\S)([\s\S]*?\S)~~/,text:l(u.text)("]|","~]|")("|","|https?://|")()}),u.breaks=h({},u.gfm,{br:l(u.br)("{2,}","*")(),text:l(u.gfm.text)("{2,}","*")()}),t.rules=u,t.output=function(e,n,r){var s=new t(n,r);return s.output(e)},t.prototype.output=function(e){for(var t,n,r,i,l="";e;)if(i=this.rules.escape.exec(e))e=e.substring(i[0].length),l+=i[1];else if(i=this.rules.autolink.exec(e))e=e.substring(i[0].length),"@"===i[2]?(n=this.mangle(":"===i[1].charAt(6)?i[1].substring(7):i[1]),r=this.mangle("mailto:")+n):(n=s(i[1]),r=n),l+=this.renderer.link(r,null,n);else if(this.inLink||!(i=this.rules.url.exec(e))){if(i=this.rules.tag.exec(e))!this.inLink&&/^/i.test(i[0])&&(this.inLink=!1),e=e.substring(i[0].length),l+=this.options.sanitize?s(i[0]):i[0];else if(i=this.rules.link.exec(e))e=e.substring(i[0].length),this.inLink=!0,l+=this.outputLink(i,{href:i[2],title:i[3]}),this.inLink=!1;else if((i=this.rules.reflink.exec(e))||(i=this.rules.nolink.exec(e))){if(e=e.substring(i[0].length),t=(i[2]||i[1]).replace(/\s+/g," "),t=this.links[t.toLowerCase()],!t||!t.href){l+=i[0].charAt(0),e=i[0].substring(1)+e;continue}this.inLink=!0,l+=this.outputLink(i,t),this.inLink=!1}else if(i=this.rules.strong.exec(e))e=e.substring(i[0].length),l+=this.renderer.strong(this.output(i[2]||i[1]));else if(i=this.rules.em.exec(e))e=e.substring(i[0].length),l+=this.renderer.em(this.output(i[2]||i[1]));else if(i=this.rules.code.exec(e))e=e.substring(i[0].length),l+=this.renderer.codespan(s(i[2],!0));else if(i=this.rules.br.exec(e))e=e.substring(i[0].length),l+=this.renderer.br();else if(i=this.rules.del.exec(e))e=e.substring(i[0].length),l+=this.renderer.del(this.output(i[1]));else if(i=this.rules.text.exec(e))e=e.substring(i[0].length),l+=s(this.smartypants(i[0]));else if(e)throw new Error("Infinite loop on byte: "+e.charCodeAt(0))}else e=e.substring(i[0].length),n=s(i[1]),r=n,l+=this.renderer.link(r,null,n);return l},t.prototype.outputLink=function(e,t){var n=s(t.href),r=t.title?s(t.title):null;return"!"!==e[0].charAt(0)?this.renderer.link(n,r,this.output(e[1])):this.renderer.image(n,r,s(e[1]))},t.prototype.smartypants=function(e){return this.options.smartypants?e.replace(/--/g,"—").replace(/(^|[-\u2014/(\[{"\s])'/g,"$1‘").replace(/'/g,"’").replace(/(^|[-\u2014/(\[{\u2018\s])"/g,"$1“").replace(/"/g,"”").replace(/\.{3}/g,"…"):e},t.prototype.mangle=function(e){for(var t,n="",r=e.length,s=0;r>s;s++)t=e.charCodeAt(s),Math.random()>.5&&(t="x"+t.toString(16)),n+="&#"+t+";";return n},n.prototype.code=function(e,t,n){if(this.options.highlight){var r=this.options.highlight(e,t);null!=r&&r!==e&&(n=!0,e=r)}return t?'
'+(n?e:s(e,!0))+"\n
\n":"
"+(n?e:s(e,!0))+"\n
"},n.prototype.blockquote=function(e){return"
\n"+e+"
\n"},n.prototype.html=function(e){return e},n.prototype.heading=function(e,t,n){return"'+e+"\n"},n.prototype.hr=function(){return this.options.xhtml?"
\n":"
\n"},n.prototype.list=function(e,t){var n=t?"ol":"ul";return"<"+n+">\n"+e+"\n"},n.prototype.listitem=function(e){return"
  • "+e+"
  • \n"},n.prototype.paragraph=function(e){return"

    "+e+"

    \n"},n.prototype.table=function(e,t){return"\n\n"+e+"\n\n"+t+"\n
    \n"},n.prototype.tablerow=function(e){return"\n"+e+"\n"},n.prototype.tablecell=function(e,t){var n=t.header?"th":"td",r=t.align?"<"+n+' style="text-align:'+t.align+'">':"<"+n+">";return r+e+"\n"},n.prototype.strong=function(e){return""+e+""},n.prototype.em=function(e){return""+e+""},n.prototype.codespan=function(e){return""+e+""},n.prototype.br=function(){return this.options.xhtml?"
    ":"
    "},n.prototype.del=function(e){return""+e+""},n.prototype.link=function(e,t,n){if(this.options.sanitize){try{var r=decodeURIComponent(i(e)).replace(/[^\w:]/g,"").toLowerCase()}catch(s){return""}if(0===r.indexOf("javascript:")||0===r.indexOf("vbscript:"))return""}var l='
    "},n.prototype.image=function(e,t,n){var r=''+n+'":">"},r.parse=function(e,t,n){var s=new r(t,n);return s.parse(e)},r.prototype.parse=function(e){this.inline=new t(e.links,this.options,this.renderer),this.tokens=e.reverse();for(var n="";this.next();)n+=this.tok();return n},r.prototype.next=function(){return this.token=this.tokens.pop()},r.prototype.peek=function(){return this.tokens[this.tokens.length-1]||0},r.prototype.parseText=function(){for(var e=this.token.text;"text"===this.peek().type;)e+="\n"+this.next().text;return this.inline.output(e)},r.prototype.tok=function(){switch(this.token.type){case"space":return"";case"hr":return this.renderer.hr();case"heading":return this.renderer.heading(this.inline.output(this.token.text),this.token.depth,this.token.text);case"code":return this.renderer.code(this.token.text,this.token.lang,this.token.escaped);case"table":var e,t,n,r,s,i="",l="";for(n="",e=0;e[^\n]+(\n(?!def)[^\n]+)*\n*)+/,list:/^( *)(bull) [\s\S]+?(?:hr|def|\n{2,}(?! )(?!\1bull )\n*|\s*$)/,html:/^ *(?:comment *(?:\n|\s*$)|closed *(?:\n{2,}|\s*$)|closing *(?:\n{2,}|\s*$))/,def:/^ *\[([^\]]+)\]: *]+)>?(?: +["(]([^\n]+)[")])? *(?:\n+|$)/,table:noop,paragraph:/^((?:[^\n]+\n?(?!hr|heading|lheading|blockquote|tag|def))+)\n*/,text:/^[^\n]+/};block.bullet=/(?:[*+-]|\d+\.)/;block.item=/^( *)(bull) [^\n]*(?:\n(?!\1bull )[^\n]*)*/;block.item=replace(block.item,"gm")(/bull/g,block.bullet)();block.list=replace(block.list)(/bull/g,block.bullet)("hr","\\n+(?=\\1?(?:[-*_] *){3,}(?:\\n+|$))")("def","\\n+(?="+block.def.source+")")();block.blockquote=replace(block.blockquote)("def",block.def)();block._tag="(?!(?:"+"a|em|strong|small|s|cite|q|dfn|abbr|data|time|code"+"|var|samp|kbd|sub|sup|i|b|u|mark|ruby|rt|rp|bdi|bdo"+"|span|br|wbr|ins|del|img)\\b)\\w+(?!:/|[^\\w\\s@]*@)\\b";block.html=replace(block.html)("comment",//)("closed",/<(tag)[\s\S]+?<\/\1>/)("closing",/])*?>/)(/tag/g,block._tag)();block.paragraph=replace(block.paragraph)("hr",block.hr)("heading",block.heading)("lheading",block.lheading)("blockquote",block.blockquote)("tag","<"+block._tag)("def",block.def)();block.normal=merge({},block);block.gfm=merge({},block.normal,{fences:/^ *(`{3,}|~{3,})[ \.]*(\S+)? *\n([\s\S]*?)\s*\1 *(?:\n+|$)/,paragraph:/^/,heading:/^ *(#{1,6}) +([^\n]+?) *#* *(?:\n+|$)/});block.gfm.paragraph=replace(block.paragraph)("(?!","(?!"+block.gfm.fences.source.replace("\\1","\\2")+"|"+block.list.source.replace("\\1","\\3")+"|")();block.tables=merge({},block.gfm,{nptable:/^ *(\S.*\|.*)\n *([-:]+ *\|[-| :]*)\n((?:.*\|.*(?:\n|$))*)\n*/,table:/^ *\|(.+)\n *\|( *[-:]+[-| :]*)\n((?: *\|.*(?:\n|$))*)\n*/});function Lexer(options){this.tokens=[];this.tokens.links={};this.options=options||marked.defaults;this.rules=block.normal;if(this.options.gfm){if(this.options.tables){this.rules=block.tables}else{this.rules=block.gfm}}}Lexer.rules=block;Lexer.lex=function(src,options){var lexer=new Lexer(options);return lexer.lex(src)};Lexer.prototype.lex=function(src){src=src.replace(/\r\n|\r/g,"\n").replace(/\t/g," ").replace(/\u00a0/g," ").replace(/\u2424/g,"\n");return this.token(src,true)};Lexer.prototype.token=function(src,top,bq){var src=src.replace(/^ +$/gm,""),next,loose,cap,bull,b,item,space,i,l;while(src){if(cap=this.rules.newline.exec(src)){src=src.substring(cap[0].length);if(cap[0].length>1){this.tokens.push({type:"space"})}}if(cap=this.rules.code.exec(src)){src=src.substring(cap[0].length);cap=cap[0].replace(/^ {4}/gm,"");this.tokens.push({type:"code",text:!this.options.pedantic?cap.replace(/\n+$/,""):cap});continue}if(cap=this.rules.fences.exec(src)){src=src.substring(cap[0].length);this.tokens.push({type:"code",lang:cap[2],text:cap[3]||""});continue}if(cap=this.rules.heading.exec(src)){src=src.substring(cap[0].length);this.tokens.push({type:"heading",depth:cap[1].length,text:cap[2]});continue}if(top&&(cap=this.rules.nptable.exec(src))){src=src.substring(cap[0].length);item={type:"table",header:cap[1].replace(/^ *| *\| *$/g,"").split(/ *\| */),align:cap[2].replace(/^ *|\| *$/g,"").split(/ *\| */),cells:cap[3].replace(/\n$/,"").split("\n")};for(i=0;i ?/gm,"");this.token(cap,top,true);this.tokens.push({type:"blockquote_end"});continue}if(cap=this.rules.list.exec(src)){src=src.substring(cap[0].length);bull=cap[2];this.tokens.push({type:"list_start",ordered:bull.length>1});cap=cap[0].match(this.rules.item);next=false;l=cap.length;i=0;for(;i1&&b.length>1)){src=cap.slice(i+1).join("\n")+src;i=l-1}}loose=next||/\n\n(?!\s*$)/.test(item);if(i!==l-1){next=item.charAt(item.length-1)==="\n";if(!loose)loose=next}this.tokens.push({type:loose?"loose_item_start":"list_item_start"});this.token(item,false,bq);this.tokens.push({type:"list_item_end"})}this.tokens.push({type:"list_end"});continue}if(cap=this.rules.html.exec(src)){src=src.substring(cap[0].length);this.tokens.push({type:this.options.sanitize?"paragraph":"html",pre:!this.options.sanitizer&&(cap[1]==="pre"||cap[1]==="script"||cap[1]==="style"),text:cap[0]});continue}if(!bq&&top&&(cap=this.rules.def.exec(src))){src=src.substring(cap[0].length);this.tokens.links[cap[1].toLowerCase()]={href:cap[2],title:cap[3]};continue}if(top&&(cap=this.rules.table.exec(src))){src=src.substring(cap[0].length);item={type:"table",header:cap[1].replace(/^ *| *\| *$/g,"").split(/ *\| */),align:cap[2].replace(/^ *|\| *$/g,"").split(/ *\| */),cells:cap[3].replace(/(?: *\| *)?\n$/,"").split("\n")};for(i=0;i])/,autolink:/^<([^ >]+(@|:\/)[^ >]+)>/,url:noop,tag:/^|^<\/?\w+(?:"[^"]*"|'[^']*'|[^'">])*?>/,link:/^!?\[(inside)\]\(href\)/,reflink:/^!?\[(inside)\]\s*\[([^\]]*)\]/,nolink:/^!?\[((?:\[[^\]]*\]|[^\[\]])*)\]/,strong:/^__([\s\S]+?)__(?!_)|^\*\*([\s\S]+?)\*\*(?!\*)/,em:/^\b_((?:[^_]|__)+?)_\b|^\*((?:\*\*|[\s\S])+?)\*(?!\*)/,code:/^(`+)\s*([\s\S]*?[^`])\s*\1(?!`)/,br:/^ {2,}\n(?!\s*$)/,del:noop,text:/^[\s\S]+?(?=[\\?(?:\s+['"]([\s\S]*?)['"])?\s*/;inline.link=replace(inline.link)("inside",inline._inside)("href",inline._href)();inline.reflink=replace(inline.reflink)("inside",inline._inside)();inline.normal=merge({},inline);inline.pedantic=merge({},inline.normal,{strong:/^__(?=\S)([\s\S]*?\S)__(?!_)|^\*\*(?=\S)([\s\S]*?\S)\*\*(?!\*)/,em:/^_(?=\S)([\s\S]*?\S)_(?!_)|^\*(?=\S)([\s\S]*?\S)\*(?!\*)/});inline.gfm=merge({},inline.normal,{escape:replace(inline.escape)("])","~|])")(),url:/^(https?:\/\/[^\s<]+[^<.,:;"')\]\s])/,del:/^~~(?=\S)([\s\S]*?\S)~~/,text:replace(inline.text)("]|","~]|")("|","|https?://|")()});inline.breaks=merge({},inline.gfm,{br:replace(inline.br)("{2,}","*")(),text:replace(inline.gfm.text)("{2,}","*")()});function InlineLexer(links,options){this.options=options||marked.defaults;this.links=links;this.rules=inline.normal;this.renderer=this.options.renderer||new Renderer;this.renderer.options=this.options;if(!this.links){throw new Error("Tokens array requires a `links` property.")}if(this.options.gfm){if(this.options.breaks){this.rules=inline.breaks}else{this.rules=inline.gfm}}else if(this.options.pedantic){this.rules=inline.pedantic}}InlineLexer.rules=inline;InlineLexer.output=function(src,links,options){var inline=new InlineLexer(links,options);return inline.output(src)};InlineLexer.prototype.output=function(src){var out="",link,text,href,cap;while(src){if(cap=this.rules.escape.exec(src)){src=src.substring(cap[0].length);out+=cap[1];continue}if(cap=this.rules.autolink.exec(src)){src=src.substring(cap[0].length);if(cap[2]==="@"){text=cap[1].charAt(6)===":"?this.mangle(cap[1].substring(7)):this.mangle(cap[1]);href=this.mangle("mailto:")+text}else{text=escape(cap[1]);href=text}out+=this.renderer.link(href,null,text);continue}if(!this.inLink&&(cap=this.rules.url.exec(src))){src=src.substring(cap[0].length);text=escape(cap[1]);href=text;out+=this.renderer.link(href,null,text);continue}if(cap=this.rules.tag.exec(src)){if(!this.inLink&&/^/i.test(cap[0])){this.inLink=false}src=src.substring(cap[0].length);out+=this.options.sanitize?this.options.sanitizer?this.options.sanitizer(cap[0]):escape(cap[0]):cap[0];continue}if(cap=this.rules.link.exec(src)){src=src.substring(cap[0].length);this.inLink=true;out+=this.outputLink(cap,{href:cap[2],title:cap[3]});this.inLink=false;continue}if((cap=this.rules.reflink.exec(src))||(cap=this.rules.nolink.exec(src))){src=src.substring(cap[0].length);link=(cap[2]||cap[1]).replace(/\s+/g," ");link=this.links[link.toLowerCase()];if(!link||!link.href){out+=cap[0].charAt(0);src=cap[0].substring(1)+src;continue}this.inLink=true;out+=this.outputLink(cap,link);this.inLink=false;continue}if(cap=this.rules.strong.exec(src)){src=src.substring(cap[0].length);out+=this.renderer.strong(this.output(cap[2]||cap[1]));continue}if(cap=this.rules.em.exec(src)){src=src.substring(cap[0].length);out+=this.renderer.em(this.output(cap[2]||cap[1]));continue}if(cap=this.rules.code.exec(src)){src=src.substring(cap[0].length);out+=this.renderer.codespan(escape(cap[2],true));continue}if(cap=this.rules.br.exec(src)){src=src.substring(cap[0].length);out+=this.renderer.br();continue}if(cap=this.rules.del.exec(src)){src=src.substring(cap[0].length);out+=this.renderer.del(this.output(cap[1]));continue}if(cap=this.rules.text.exec(src)){src=src.substring(cap[0].length);out+=this.renderer.text(escape(this.smartypants(cap[0])));continue}if(src){throw new Error("Infinite loop on byte: "+src.charCodeAt(0))}}return out};InlineLexer.prototype.outputLink=function(cap,link){var href=escape(link.href),title=link.title?escape(link.title):null;return cap[0].charAt(0)!=="!"?this.renderer.link(href,title,this.output(cap[1])):this.renderer.image(href,title,escape(cap[1]))};InlineLexer.prototype.smartypants=function(text){if(!this.options.smartypants)return text;return text.replace(/---/g,"—").replace(/--/g,"–").replace(/(^|[-\u2014/(\[{"\s])'/g,"$1‘").replace(/'/g,"’").replace(/(^|[-\u2014/(\[{\u2018\s])"/g,"$1“").replace(/"/g,"”").replace(/\.{3}/g,"…")};InlineLexer.prototype.mangle=function(text){if(!this.options.mangle)return text;var out="",l=text.length,i=0,ch;for(;i.5){ch="x"+ch.toString(16)}out+="&#"+ch+";"}return out};function Renderer(options){this.options=options||{}}Renderer.prototype.code=function(code,lang,escaped){if(this.options.highlight){var out=this.options.highlight(code,lang);if(out!=null&&out!==code){escaped=true;code=out}}if(!lang){return"
    "+(escaped?code:escape(code,true))+"\n
    "}return'
    '+(escaped?code:escape(code,true))+"\n
    \n"};Renderer.prototype.blockquote=function(quote){return"
    \n"+quote+"
    \n"};Renderer.prototype.html=function(html){return html};Renderer.prototype.heading=function(text,level,raw){return"'+text+"\n"};Renderer.prototype.hr=function(){return this.options.xhtml?"
    \n":"
    \n"};Renderer.prototype.list=function(body,ordered){var type=ordered?"ol":"ul";return"<"+type+">\n"+body+"\n"};Renderer.prototype.listitem=function(text){return"
  • "+text+"
  • \n"};Renderer.prototype.paragraph=function(text){return"

    "+text+"

    \n"};Renderer.prototype.table=function(header,body){return"\n"+"\n"+header+"\n"+"\n"+body+"\n"+"
    \n"};Renderer.prototype.tablerow=function(content){return"\n"+content+"\n"};Renderer.prototype.tablecell=function(content,flags){var type=flags.header?"th":"td";var tag=flags.align?"<"+type+' style="text-align:'+flags.align+'">':"<"+type+">";return tag+content+"\n"};Renderer.prototype.strong=function(text){return""+text+""};Renderer.prototype.em=function(text){return""+text+""};Renderer.prototype.codespan=function(text){return""+text+""};Renderer.prototype.br=function(){return this.options.xhtml?"
    ":"
    "};Renderer.prototype.del=function(text){return""+text+""};Renderer.prototype.link=function(href,title,text){if(this.options.sanitize){try{var prot=decodeURIComponent(unescape(href)).replace(/[^\w:]/g,"").toLowerCase()}catch(e){return""}if(prot.indexOf("javascript:")===0||prot.indexOf("vbscript:")===0){return""}}var out='
    ";return out};Renderer.prototype.image=function(href,title,text){var out=''+text+'":">";return out};Renderer.prototype.text=function(text){return text};function Parser(options){this.tokens=[];this.token=null;this.options=options||marked.defaults;this.options.renderer=this.options.renderer||new Renderer;this.renderer=this.options.renderer;this.renderer.options=this.options}Parser.parse=function(src,options,renderer){var parser=new Parser(options,renderer);return parser.parse(src)};Parser.prototype.parse=function(src){this.inline=new InlineLexer(src.links,this.options,this.renderer);this.tokens=src.reverse();var out="";while(this.next()){out+=this.tok()}return out};Parser.prototype.next=function(){return this.token=this.tokens.pop()};Parser.prototype.peek=function(){return this.tokens[this.tokens.length-1]||0};Parser.prototype.parseText=function(){var body=this.token.text;while(this.peek().type==="text"){body+="\n"+this.next().text}return this.inline.output(body)};Parser.prototype.tok=function(){switch(this.token.type){case"space":{return""}case"hr":{return this.renderer.hr()}case"heading":{return this.renderer.heading(this.inline.output(this.token.text),this.token.depth,this.token.text)}case"code":{return this.renderer.code(this.token.text,this.token.lang,this.token.escaped)}case"table":{var header="",body="",i,row,cell,flags,j;cell="";for(i=0;i/g,">").replace(/"/g,""").replace(/'/g,"'")}function unescape(html){return html.replace(/&([#\w]+);/g,function(_,n){n=n.toLowerCase();if(n==="colon")return":";if(n.charAt(0)==="#"){return n.charAt(1)==="x"?String.fromCharCode(parseInt(n.substring(2),16)):String.fromCharCode(+n.substring(1))}return""})}function replace(regex,opt){regex=regex.source;opt=opt||"";return function self(name,val){if(!name)return new RegExp(regex,opt);val=val.source||val;val=val.replace(/(^|[^\[])\^/g,"$1");regex=regex.replace(name,val);return self}}function noop(){}noop.exec=noop;function merge(obj){var i=1,target,key;for(;iAn error occured:

    "+escape(e.message+"",true)+"
    "}throw e}}marked.options=marked.setOptions=function(opt){merge(marked.defaults,opt);return marked};marked.defaults={gfm:true,tables:true,breaks:false,pedantic:false,sanitize:false,sanitizer:null,mangle:true,smartLists:false,silent:false,highlight:null,langPrefix:"lang-",smartypants:false,headerPrefix:"",renderer:new Renderer,xhtml:false};marked.Parser=Parser;marked.parser=Parser.parse;marked.Renderer=Renderer;marked.Lexer=Lexer;marked.lexer=Lexer.lex;marked.InlineLexer=InlineLexer;marked.inlineLexer=InlineLexer.output;marked.parse=marked;if(typeof module!=="undefined"&&typeof exports==="object"){module.exports=marked}else if(typeof define==="function"&&define.amd){define(function(){return marked})}else{this.marked=marked}}).call(function(){return this||(typeof window!=="undefined"?window:global)}()); \ No newline at end of file From 16ebf2a783724527faac2036bc2f971df8dea0a5 Mon Sep 17 00:00:00 2001 From: Riceball LEE Date: Wed, 11 Nov 2015 07:37:08 +0000 Subject: [PATCH 015/228] * [bug] the markdown plugin can not render highlight codes for marked.setOptions(highlight) --- plugin/markdown/markdown.js | 4 ++-- test/simple.md | 10 +++++++++ test/test-markdown-external.html | 36 ++++++++++++++++++++++++++++++++ test/test-markdown-external.js | 19 +++++++++++++++++ 4 files changed, 67 insertions(+), 2 deletions(-) create mode 100644 test/simple.md create mode 100644 test/test-markdown-external.html create mode 100644 test/test-markdown-external.js diff --git a/plugin/markdown/markdown.js b/plugin/markdown/markdown.js index f4035e2..5544599 100755 --- a/plugin/markdown/markdown.js +++ b/plugin/markdown/markdown.js @@ -20,8 +20,8 @@ if( typeof hljs !== 'undefined' ) { marked.setOptions({ - highlight: function( lang, code ) { - return hljs.highlightAuto( lang, code ).value; + highlight: function( code, lang ) { + return hljs.highlightAuto( code, [lang] ).value; } }); } diff --git a/test/simple.md b/test/simple.md new file mode 100644 index 0000000..cd57d70 --- /dev/null +++ b/test/simple.md @@ -0,0 +1,10 @@ +## Slide 1.1 + +```js +var a = 1; +``` + +## Slide 1.2 + + +## Slide 2 diff --git a/test/test-markdown-external.html b/test/test-markdown-external.html new file mode 100644 index 0000000..859d0a1 --- /dev/null +++ b/test/test-markdown-external.html @@ -0,0 +1,36 @@ + + + + + + + reveal.js - Test Markdown + + + + + + + +
    +
    + + + + + + + + + + + + + + diff --git a/test/test-markdown-external.js b/test/test-markdown-external.js new file mode 100644 index 0000000..a9ea034 --- /dev/null +++ b/test/test-markdown-external.js @@ -0,0 +1,19 @@ + + +Reveal.addEventListener( 'ready', function() { + + QUnit.module( 'Markdown' ); + + test( 'Vertical separator', function() { + strictEqual( document.querySelectorAll( '.reveal .slides>section>section' ).length, 2, 'found two slides' ); + }); + test( 'language highlighter', function() { + strictEqual( document.querySelectorAll( '.hljs-keyword' ).length, 1, 'got rendered highlight tag.' ); + strictEqual( document.querySelector( '.hljs-keyword' ).innerHTML, 'var', 'the same keyword: var.' ); + }); + + +} ); + +Reveal.initialize(); + From d457b9270a015f7c5393066d0d58c185ca8e59e7 Mon Sep 17 00:00:00 2001 From: Leonardo Kewitz Date: Sun, 22 Nov 2015 18:34:25 -0200 Subject: [PATCH 016/228] Added 4 fragment transitions effect. --- css/reveal.css | 454 +++++++++++++++++------------------------------- css/reveal.scss | 50 +++++- index.html | 1 + 3 files changed, 211 insertions(+), 294 deletions(-) diff --git a/css/reveal.css b/css/reveal.css index 2f115e5..88858f6 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -59,8 +59,7 @@ html:-moz-full-screen-ancestor { .reveal .slides section .fragment { opacity: 0; visibility: hidden; - -webkit-transition: all 0.2s ease; - transition: all 0.2s ease; } + transition: all .2s ease; } .reveal .slides section .fragment.visible { opacity: 1; visibility: visible; } @@ -69,26 +68,18 @@ html:-moz-full-screen-ancestor { opacity: 1; visibility: visible; } .reveal .slides section .fragment.grow.visible { - -webkit-transform: scale(1.3); - -ms-transform: scale(1.3); - transform: scale(1.3); } + transform: scale(1.3); } .reveal .slides section .fragment.shrink { opacity: 1; visibility: visible; } .reveal .slides section .fragment.shrink.visible { - -webkit-transform: scale(0.7); - -ms-transform: scale(0.7); - transform: scale(0.7); } + transform: scale(0.7); } .reveal .slides section .fragment.zoom-in { - -webkit-transform: scale(0.1); - -ms-transform: scale(0.1); - transform: scale(0.1); } + transform: scale(0.1); } .reveal .slides section .fragment.zoom-in.visible { - -webkit-transform: none; - -ms-transform: none; - transform: none; } + transform: none; } .reveal .slides section .fragment.fade-out { opacity: 1; @@ -110,6 +101,42 @@ html:-moz-full-screen-ancestor { .reveal .slides section .fragment.strike.visible { text-decoration: line-through; } +.reveal .slides section .fragment.fade-up { + opacity: 0; + transform: translate(0, 20%); + visibility: hidden; } + .reveal .slides section .fragment.fade-up.visible { + opacity: 1; + transform: translate(0, 0); + visibility: visible; } + +.reveal .slides section .fragment.fade-down { + opacity: 0; + transform: translate(0, -20%); + visibility: hidden; } + .reveal .slides section .fragment.fade-down.visible { + opacity: 1; + transform: translate(0, 0); + visibility: visible; } + +.reveal .slides section .fragment.fade-right { + opacity: 0; + transform: translate(-20%, 0); + visibility: hidden; } + .reveal .slides section .fragment.fade-right.visible { + opacity: 1; + transform: translate(0, 0); + visibility: visible; } + +.reveal .slides section .fragment.fade-left { + opacity: 0; + transform: translate(20%, 0); + visibility: hidden; } + .reveal .slides section .fragment.fade-left.visible { + opacity: 1; + transform: translate(0, 0); + visibility: visible; } + .reveal .slides section .fragment.current-visible { opacity: 0; visibility: hidden; } @@ -189,13 +216,10 @@ html:-moz-full-screen-ancestor { height: 0; background-color: transparent; border: 12px solid transparent; - -webkit-transform: scale(0.9999); - -ms-transform: scale(0.9999); - transform: scale(0.9999); - -webkit-transition: all 0.2s ease; - transition: all 0.2s ease; + transform: scale(0.9999); + transition: all 0.2s ease; -webkit-appearance: none; - -webkit-tap-highlight-color: transparent; } + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .reveal .controls .enabled { opacity: 0.7; @@ -264,8 +288,7 @@ html:-moz-full-screen-ancestor { height: 100%; width: 0px; background-color: #000; - -webkit-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); - transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } + transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } /********************************************* * SLIDE NUMBER @@ -294,8 +317,7 @@ html:-moz-full-screen-ancestor { width: 100%; height: 100%; overflow: hidden; - -ms-touch-action: none; - touch-action: none; } + touch-action: none; } .reveal .slides { position: absolute; @@ -309,10 +331,8 @@ html:-moz-full-screen-ancestor { overflow: visible; z-index: 1; text-align: center; - -webkit-perspective: 600px; - perspective: 600px; - -webkit-perspective-origin: 50% 40%; - perspective-origin: 50% 40%; } + perspective: 600px; + perspective-origin: 50% 40%; } .reveal .slides > section { -ms-perspective: 600px; } @@ -324,29 +344,22 @@ html:-moz-full-screen-ancestor { width: 100%; padding: 20px 0px; z-index: 10; - -webkit-transform-style: preserve-3d; - transform-style: preserve-3d; - -webkit-transition: -webkit-transform-origin 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), -webkit-transform 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), visibility 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), opacity 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); - transition: -ms-transform-origin 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), transform 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), visibility 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), opacity 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); - transition: transform-origin 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), transform 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), visibility 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), opacity 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } + transform-style: preserve-3d; + transition: transform-origin 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), transform 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), visibility 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), opacity 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } /* Global transition speed settings */ .reveal[data-transition-speed="fast"] .slides section { - -webkit-transition-duration: 400ms; - transition-duration: 400ms; } + transition-duration: 400ms; } .reveal[data-transition-speed="slow"] .slides section { - -webkit-transition-duration: 1200ms; - transition-duration: 1200ms; } + transition-duration: 1200ms; } /* Slide-specific transition speed overrides */ .reveal .slides section[data-transition-speed="fast"] { - -webkit-transition-duration: 400ms; - transition-duration: 400ms; } + transition-duration: 400ms; } .reveal .slides section[data-transition-speed="slow"] { - -webkit-transition-duration: 1200ms; - transition-duration: 1200ms; } + transition-duration: 1200ms; } .reveal .slides > section.stack { padding-top: 0; @@ -388,68 +401,50 @@ html:-moz-full-screen-ancestor { * Aliased 'linear' for backwards compatibility *********************************************/ .reveal.slide section { - -webkit-backface-visibility: hidden; - backface-visibility: hidden; } + backface-visibility: hidden; } .reveal .slides > section[data-transition=slide].past, .reveal .slides > section[data-transition~=slide-out].past, .reveal.slide .slides > section:not([data-transition]).past { - -webkit-transform: translate(-150%, 0); - -ms-transform: translate(-150%, 0); - transform: translate(-150%, 0); } + transform: translate(-150%, 0); } .reveal .slides > section[data-transition=slide].future, .reveal .slides > section[data-transition~=slide-in].future, .reveal.slide .slides > section:not([data-transition]).future { - -webkit-transform: translate(150%, 0); - -ms-transform: translate(150%, 0); - transform: translate(150%, 0); } + transform: translate(150%, 0); } .reveal .slides > section > section[data-transition=slide].past, .reveal .slides > section > section[data-transition~=slide-out].past, .reveal.slide .slides > section > section:not([data-transition]).past { - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - transform: translate(0, -150%); } + transform: translate(0, -150%); } .reveal .slides > section > section[data-transition=slide].future, .reveal .slides > section > section[data-transition~=slide-in].future, .reveal.slide .slides > section > section:not([data-transition]).future { - -webkit-transform: translate(0, 150%); - -ms-transform: translate(0, 150%); - transform: translate(0, 150%); } + transform: translate(0, 150%); } .reveal.linear section { - -webkit-backface-visibility: hidden; - backface-visibility: hidden; } + backface-visibility: hidden; } .reveal .slides > section[data-transition=linear].past, .reveal .slides > section[data-transition~=linear-out].past, .reveal.linear .slides > section:not([data-transition]).past { - -webkit-transform: translate(-150%, 0); - -ms-transform: translate(-150%, 0); - transform: translate(-150%, 0); } + transform: translate(-150%, 0); } .reveal .slides > section[data-transition=linear].future, .reveal .slides > section[data-transition~=linear-in].future, .reveal.linear .slides > section:not([data-transition]).future { - -webkit-transform: translate(150%, 0); - -ms-transform: translate(150%, 0); - transform: translate(150%, 0); } + transform: translate(150%, 0); } .reveal .slides > section > section[data-transition=linear].past, .reveal .slides > section > section[data-transition~=linear-out].past, .reveal.linear .slides > section > section:not([data-transition]).past { - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - transform: translate(0, -150%); } + transform: translate(0, -150%); } .reveal .slides > section > section[data-transition=linear].future, .reveal .slides > section > section[data-transition~=linear-in].future, .reveal.linear .slides > section > section:not([data-transition]).future { - -webkit-transform: translate(0, 150%); - -ms-transform: translate(0, 150%); - transform: translate(0, 150%); } + transform: translate(0, 150%); } /********************************************* * CONVEX TRANSITION @@ -458,50 +453,42 @@ html:-moz-full-screen-ancestor { .reveal .slides > section[data-transition=default].past, .reveal .slides > section[data-transition~=default-out].past, .reveal.default .slides > section:not([data-transition]).past { - -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); - transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } + transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } .reveal .slides > section[data-transition=default].future, .reveal .slides > section[data-transition~=default-in].future, .reveal.default .slides > section:not([data-transition]).future { - -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } + transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } .reveal .slides > section > section[data-transition=default].past, .reveal .slides > section > section[data-transition~=default-out].past, .reveal.default .slides > section > section:not([data-transition]).past { - -webkit-transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); - transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); } + transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); } .reveal .slides > section > section[data-transition=default].future, .reveal .slides > section > section[data-transition~=default-in].future, .reveal.default .slides > section > section:not([data-transition]).future { - -webkit-transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); - transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); } + transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); } .reveal .slides > section[data-transition=convex].past, .reveal .slides > section[data-transition~=convex-out].past, .reveal.convex .slides > section:not([data-transition]).past { - -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); - transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } + transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } .reveal .slides > section[data-transition=convex].future, .reveal .slides > section[data-transition~=convex-in].future, .reveal.convex .slides > section:not([data-transition]).future { - -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } + transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } .reveal .slides > section > section[data-transition=convex].past, .reveal .slides > section > section[data-transition~=convex-out].past, .reveal.convex .slides > section > section:not([data-transition]).past { - -webkit-transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); - transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); } + transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); } .reveal .slides > section > section[data-transition=convex].future, .reveal .slides > section > section[data-transition~=convex-in].future, .reveal.convex .slides > section > section:not([data-transition]).future { - -webkit-transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); - transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); } + transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); } /********************************************* * CONCAVE TRANSITION @@ -509,77 +496,62 @@ html:-moz-full-screen-ancestor { .reveal .slides > section[data-transition=concave].past, .reveal .slides > section[data-transition~=concave-out].past, .reveal.concave .slides > section:not([data-transition]).past { - -webkit-transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); - transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); } + transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); } .reveal .slides > section[data-transition=concave].future, .reveal .slides > section[data-transition~=concave-in].future, .reveal.concave .slides > section:not([data-transition]).future { - -webkit-transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); } + transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); } .reveal .slides > section > section[data-transition=concave].past, .reveal .slides > section > section[data-transition~=concave-out].past, .reveal.concave .slides > section > section:not([data-transition]).past { - -webkit-transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); - transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); } + transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); } .reveal .slides > section > section[data-transition=concave].future, .reveal .slides > section > section[data-transition~=concave-in].future, .reveal.concave .slides > section > section:not([data-transition]).future { - -webkit-transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0); - transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0); } + transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0); } /********************************************* * ZOOM TRANSITION *********************************************/ .reveal .slides section[data-transition=zoom], .reveal.zoom .slides section:not([data-transition]) { - -webkit-transition-timing-function: ease; - transition-timing-function: ease; } + transition-timing-function: ease; } .reveal .slides > section[data-transition=zoom].past, .reveal .slides > section[data-transition~=zoom-out].past, .reveal.zoom .slides > section:not([data-transition]).past { visibility: hidden; - -webkit-transform: scale(16); - -ms-transform: scale(16); - transform: scale(16); } + transform: scale(16); } .reveal .slides > section[data-transition=zoom].future, .reveal .slides > section[data-transition~=zoom-in].future, .reveal.zoom .slides > section:not([data-transition]).future { visibility: hidden; - -webkit-transform: scale(0.2); - -ms-transform: scale(0.2); - transform: scale(0.2); } + transform: scale(0.2); } .reveal .slides > section > section[data-transition=zoom].past, .reveal .slides > section > section[data-transition~=zoom-out].past, .reveal.zoom .slides > section > section:not([data-transition]).past { - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - transform: translate(0, -150%); } + transform: translate(0, -150%); } .reveal .slides > section > section[data-transition=zoom].future, .reveal .slides > section > section[data-transition~=zoom-in].future, .reveal.zoom .slides > section > section:not([data-transition]).future { - -webkit-transform: translate(0, 150%); - -ms-transform: translate(0, 150%); - transform: translate(0, 150%); } + transform: translate(0, 150%); } /********************************************* * CUBE TRANSITION *********************************************/ .reveal.cube .slides { - -webkit-perspective: 1300px; - perspective: 1300px; } + perspective: 1300px; } .reveal.cube .slides section { padding: 30px; min-height: 700px; - -webkit-backface-visibility: hidden; - backface-visibility: hidden; + backface-visibility: hidden; box-sizing: border-box; } .reveal.center.cube .slides section { @@ -595,8 +567,7 @@ html:-moz-full-screen-ancestor { top: 0; background: rgba(0, 0, 0, 0.1); border-radius: 4px; - -webkit-transform: translateZ(-20px); - transform: translateZ(-20px); } + transform: translateZ(-20px); } .reveal.cube .slides section:not(.stack):after { content: ''; @@ -610,49 +581,34 @@ html:-moz-full-screen-ancestor { z-index: 1; border-radius: 4px; box-shadow: 0px 95px 25px rgba(0, 0, 0, 0.2); - -webkit-transform: translateZ(-90px) rotateX(65deg); - transform: translateZ(-90px) rotateX(65deg); } + transform: translateZ(-90px) rotateX(65deg); } .reveal.cube .slides > section.stack { padding: 0; background: none; } .reveal.cube .slides > section.past { - -webkit-transform-origin: 100% 0%; - -ms-transform-origin: 100% 0%; - transform-origin: 100% 0%; - -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg); - transform: translate3d(-100%, 0, 0) rotateY(-90deg); } + transform-origin: 100% 0%; + transform: translate3d(-100%, 0, 0) rotateY(-90deg); } .reveal.cube .slides > section.future { - -webkit-transform-origin: 0% 0%; - -ms-transform-origin: 0% 0%; - transform-origin: 0% 0%; - -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg); - transform: translate3d(100%, 0, 0) rotateY(90deg); } + transform-origin: 0% 0%; + transform: translate3d(100%, 0, 0) rotateY(90deg); } .reveal.cube .slides > section > section.past { - -webkit-transform-origin: 0% 100%; - -ms-transform-origin: 0% 100%; - transform-origin: 0% 100%; - -webkit-transform: translate3d(0, -100%, 0) rotateX(90deg); - transform: translate3d(0, -100%, 0) rotateX(90deg); } + transform-origin: 0% 100%; + transform: translate3d(0, -100%, 0) rotateX(90deg); } .reveal.cube .slides > section > section.future { - -webkit-transform-origin: 0% 0%; - -ms-transform-origin: 0% 0%; - transform-origin: 0% 0%; - -webkit-transform: translate3d(0, 100%, 0) rotateX(-90deg); - transform: translate3d(0, 100%, 0) rotateX(-90deg); } + transform-origin: 0% 0%; + transform: translate3d(0, 100%, 0) rotateX(-90deg); } /********************************************* * PAGE TRANSITION *********************************************/ .reveal.page .slides { - -webkit-perspective-origin: 0% 50%; - perspective-origin: 0% 50%; - -webkit-perspective: 3000px; - perspective: 3000px; } + perspective-origin: 0% 50%; + perspective: 3000px; } .reveal.page .slides section { padding: 30px; @@ -671,8 +627,7 @@ html:-moz-full-screen-ancestor { left: 0; top: 0; background: rgba(0, 0, 0, 0.1); - -webkit-transform: translateZ(-20px); - transform: translateZ(-20px); } + transform: translateZ(-20px); } .reveal.page .slides section:not(.stack):after { content: ''; @@ -693,32 +648,20 @@ html:-moz-full-screen-ancestor { background: none; } .reveal.page .slides > section.past { - -webkit-transform-origin: 0% 0%; - -ms-transform-origin: 0% 0%; - transform-origin: 0% 0%; - -webkit-transform: translate3d(-40%, 0, 0) rotateY(-80deg); - transform: translate3d(-40%, 0, 0) rotateY(-80deg); } + transform-origin: 0% 0%; + transform: translate3d(-40%, 0, 0) rotateY(-80deg); } .reveal.page .slides > section.future { - -webkit-transform-origin: 100% 0%; - -ms-transform-origin: 100% 0%; - transform-origin: 100% 0%; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); } + transform-origin: 100% 0%; + transform: translate3d(0, 0, 0); } .reveal.page .slides > section > section.past { - -webkit-transform-origin: 0% 0%; - -ms-transform-origin: 0% 0%; - transform-origin: 0% 0%; - -webkit-transform: translate3d(0, -40%, 0) rotateX(80deg); - transform: translate3d(0, -40%, 0) rotateX(80deg); } + transform-origin: 0% 0%; + transform: translate3d(0, -40%, 0) rotateX(80deg); } .reveal.page .slides > section > section.future { - -webkit-transform-origin: 0% 100%; - -ms-transform-origin: 0% 100%; - transform-origin: 0% 100%; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); } + transform-origin: 0% 100%; + transform: translate3d(0, 0, 0); } /********************************************* * FADE TRANSITION @@ -726,27 +669,20 @@ html:-moz-full-screen-ancestor { .reveal .slides section[data-transition=fade], .reveal.fade .slides section:not([data-transition]), .reveal.fade .slides > section > section:not([data-transition]) { - -webkit-transform: none; - -ms-transform: none; - transform: none; - -webkit-transition: opacity 0.5s; - transition: opacity 0.5s; } + transform: none; + transition: opacity 0.5s; } .reveal.fade.overview .slides section, .reveal.fade.overview .slides > section > section { - -webkit-transition: none; - transition: none; } + transition: none; } /********************************************* * NO TRANSITION *********************************************/ .reveal .slides section[data-transition=none], .reveal.none .slides section:not([data-transition]) { - -webkit-transform: none; - -ms-transform: none; - transform: none; - -webkit-transition: none; - transition: none; } + transform: none; + transition: none; } /********************************************* * PAUSED MODE @@ -761,8 +697,7 @@ html:-moz-full-screen-ancestor { visibility: hidden; opacity: 0; z-index: 100; - -webkit-transition: all 1s ease; - transition: all 1s ease; } + transition: all 1s ease; } .reveal.paused .pause-overlay { visibility: visible; @@ -796,17 +731,14 @@ html:-moz-full-screen-ancestor { top: 0; left: -50%; margin: 70px 0; - -webkit-transform: none; - -ms-transform: none; - transform: none; } + transform: none; } .no-transforms .reveal .slides section section { left: 0; } .reveal .no-transition, .reveal .no-transition * { - -webkit-transition: none !important; - transition: none !important; } + transition: none !important; } /********************************************* * PER-SLIDE BACKGROUNDS @@ -817,8 +749,7 @@ html:-moz-full-screen-ancestor { height: 100%; top: 0; left: 0; - -webkit-perspective: 600px; - perspective: 600px; } + perspective: 600px; } .reveal .slide-background { display: none; @@ -827,12 +758,11 @@ html:-moz-full-screen-ancestor { height: 100%; opacity: 0; visibility: hidden; - background-color: transparent; + background-color: rgba(0, 0, 0, 0); background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; - -webkit-transition: all 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); - transition: all 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } + transition: all 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } .reveal .slide-background.stack { display: block; } @@ -858,145 +788,114 @@ html:-moz-full-screen-ancestor { /* Immediate transition style */ .reveal[data-background-transition=none] > .backgrounds .slide-background, .reveal > .backgrounds .slide-background[data-background-transition=none] { - -webkit-transition: none; - transition: none; } + transition: none; } /* Slide */ .reveal[data-background-transition=slide] > .backgrounds .slide-background, .reveal > .backgrounds .slide-background[data-background-transition=slide] { opacity: 1; - -webkit-backface-visibility: hidden; - backface-visibility: hidden; } + backface-visibility: hidden; } .reveal[data-background-transition=slide] > .backgrounds .slide-background.past, .reveal > .backgrounds .slide-background.past[data-background-transition=slide] { - -webkit-transform: translate(-100%, 0); - -ms-transform: translate(-100%, 0); - transform: translate(-100%, 0); } + transform: translate(-100%, 0); } .reveal[data-background-transition=slide] > .backgrounds .slide-background.future, .reveal > .backgrounds .slide-background.future[data-background-transition=slide] { - -webkit-transform: translate(100%, 0); - -ms-transform: translate(100%, 0); - transform: translate(100%, 0); } + transform: translate(100%, 0); } .reveal[data-background-transition=slide] > .backgrounds .slide-background > .slide-background.past, .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=slide] { - -webkit-transform: translate(0, -100%); - -ms-transform: translate(0, -100%); - transform: translate(0, -100%); } + transform: translate(0, -100%); } .reveal[data-background-transition=slide] > .backgrounds .slide-background > .slide-background.future, .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=slide] { - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - transform: translate(0, 100%); } + transform: translate(0, 100%); } /* Convex */ .reveal[data-background-transition=convex] > .backgrounds .slide-background.past, .reveal > .backgrounds .slide-background.past[data-background-transition=convex] { opacity: 0; - -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); - transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } + transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } .reveal[data-background-transition=convex] > .backgrounds .slide-background.future, .reveal > .backgrounds .slide-background.future[data-background-transition=convex] { opacity: 0; - -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } + transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } .reveal[data-background-transition=convex] > .backgrounds .slide-background > .slide-background.past, .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=convex] { opacity: 0; - -webkit-transform: translate3d(0, -100%, 0) rotateX(90deg) translate3d(0, -100%, 0); - transform: translate3d(0, -100%, 0) rotateX(90deg) translate3d(0, -100%, 0); } + transform: translate3d(0, -100%, 0) rotateX(90deg) translate3d(0, -100%, 0); } .reveal[data-background-transition=convex] > .backgrounds .slide-background > .slide-background.future, .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=convex] { opacity: 0; - -webkit-transform: translate3d(0, 100%, 0) rotateX(-90deg) translate3d(0, 100%, 0); - transform: translate3d(0, 100%, 0) rotateX(-90deg) translate3d(0, 100%, 0); } + transform: translate3d(0, 100%, 0) rotateX(-90deg) translate3d(0, 100%, 0); } /* Concave */ .reveal[data-background-transition=concave] > .backgrounds .slide-background.past, .reveal > .backgrounds .slide-background.past[data-background-transition=concave] { opacity: 0; - -webkit-transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); - transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); } + transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); } .reveal[data-background-transition=concave] > .backgrounds .slide-background.future, .reveal > .backgrounds .slide-background.future[data-background-transition=concave] { opacity: 0; - -webkit-transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); } + transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); } .reveal[data-background-transition=concave] > .backgrounds .slide-background > .slide-background.past, .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=concave] { opacity: 0; - -webkit-transform: translate3d(0, -100%, 0) rotateX(-90deg) translate3d(0, -100%, 0); - transform: translate3d(0, -100%, 0) rotateX(-90deg) translate3d(0, -100%, 0); } + transform: translate3d(0, -100%, 0) rotateX(-90deg) translate3d(0, -100%, 0); } .reveal[data-background-transition=concave] > .backgrounds .slide-background > .slide-background.future, .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=concave] { opacity: 0; - -webkit-transform: translate3d(0, 100%, 0) rotateX(90deg) translate3d(0, 100%, 0); - transform: translate3d(0, 100%, 0) rotateX(90deg) translate3d(0, 100%, 0); } + transform: translate3d(0, 100%, 0) rotateX(90deg) translate3d(0, 100%, 0); } /* Zoom */ .reveal[data-background-transition=zoom] > .backgrounds .slide-background, .reveal > .backgrounds .slide-background[data-background-transition=zoom] { - -webkit-transition-timing-function: ease; - transition-timing-function: ease; } + transition-timing-function: ease; } .reveal[data-background-transition=zoom] > .backgrounds .slide-background.past, .reveal > .backgrounds .slide-background.past[data-background-transition=zoom] { opacity: 0; visibility: hidden; - -webkit-transform: scale(16); - -ms-transform: scale(16); - transform: scale(16); } + transform: scale(16); } .reveal[data-background-transition=zoom] > .backgrounds .slide-background.future, .reveal > .backgrounds .slide-background.future[data-background-transition=zoom] { opacity: 0; visibility: hidden; - -webkit-transform: scale(0.2); - -ms-transform: scale(0.2); - transform: scale(0.2); } + transform: scale(0.2); } .reveal[data-background-transition=zoom] > .backgrounds .slide-background > .slide-background.past, .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=zoom] { opacity: 0; visibility: hidden; - -webkit-transform: scale(16); - -ms-transform: scale(16); - transform: scale(16); } + transform: scale(16); } .reveal[data-background-transition=zoom] > .backgrounds .slide-background > .slide-background.future, .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=zoom] { opacity: 0; visibility: hidden; - -webkit-transform: scale(0.2); - -ms-transform: scale(0.2); - transform: scale(0.2); } + transform: scale(0.2); } /* Global transition speed settings */ .reveal[data-transition-speed="fast"] > .backgrounds .slide-background { - -webkit-transition-duration: 400ms; - transition-duration: 400ms; } + transition-duration: 400ms; } .reveal[data-transition-speed="slow"] > .backgrounds .slide-background { - -webkit-transition-duration: 1200ms; - transition-duration: 1200ms; } + transition-duration: 1200ms; } /********************************************* * OVERVIEW *********************************************/ .reveal.overview { - -webkit-perspective-origin: 50% 50%; - perspective-origin: 50% 50%; - -webkit-perspective: 700px; - perspective: 700px; } + perspective-origin: 50% 50%; + perspective: 700px; } .reveal.overview .slides section { height: 700px; opacity: 1 !important; @@ -1010,8 +909,7 @@ html:-moz-full-screen-ancestor { outline-offset: 10px; } .reveal.overview .slides section .fragment { opacity: 1; - -webkit-transition: none; - transition: none; } + transition: none; } .reveal.overview .slides section:after, .reveal.overview .slides section:before { display: none !important; } @@ -1022,8 +920,7 @@ html:-moz-full-screen-ancestor { outline: none; overflow: visible; } .reveal.overview .backgrounds { - -webkit-perspective: inherit; - perspective: inherit; } + perspective: inherit; } .reveal.overview .backgrounds .slide-background { opacity: 1; visibility: visible; @@ -1032,17 +929,14 @@ html:-moz-full-screen-ancestor { .reveal.overview .slides section, .reveal.overview-deactivating .slides section { - -webkit-transition: none; - transition: none; } + transition: none; } .reveal.overview .backgrounds .slide-background, .reveal.overview-deactivating .backgrounds .slide-background { - -webkit-transition: none; - transition: none; } + transition: none; } .reveal.overview-animated .slides { - -webkit-transition: -webkit-transform 0.4s ease; - transition: transform 0.4s ease; } + transition: transform 0.4s ease; } /********************************************* * RTL SUPPORT @@ -1072,17 +966,14 @@ html:-moz-full-screen-ancestor { * PARALLAX BACKGROUND *********************************************/ .reveal.has-parallax-background .backgrounds { - -webkit-transition: all 0.8s ease; - transition: all 0.8s ease; } + transition: all 0.8s ease; } /* Global transition speed settings */ .reveal.has-parallax-background[data-transition-speed="fast"] .backgrounds { - -webkit-transition-duration: 400ms; - transition-duration: 400ms; } + transition-duration: 400ms; } .reveal.has-parallax-background[data-transition-speed="slow"] .backgrounds { - -webkit-transition-duration: 1200ms; - transition-duration: 1200ms; } + transition-duration: 1200ms; } /********************************************* * LINK PREVIEW OVERLAY @@ -1097,8 +988,7 @@ html:-moz-full-screen-ancestor { background: rgba(0, 0, 0, 0.9); opacity: 0; visibility: hidden; - -webkit-transition: all 0.3s ease; - transition: all 0.3s ease; } + transition: all 0.3s ease; } .reveal .overlay.visible { opacity: 1; @@ -1116,8 +1006,7 @@ html:-moz-full-screen-ancestor { background-image: url(data:image/gif;base64,R0lGODlhIAAgAPMAAJmZmf%2F%2F%2F6%2Bvr8nJybW1tcDAwOjo6Nvb26ioqKOjo7Ozs%2FLy8vz8%2FAAAAAAAAAAAACH%2FC05FVFNDQVBFMi4wAwEAAAAh%2FhpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh%2BQQJCgAAACwAAAAAIAAgAAAE5xDISWlhperN52JLhSSdRgwVo1ICQZRUsiwHpTJT4iowNS8vyW2icCF6k8HMMBkCEDskxTBDAZwuAkkqIfxIQyhBQBFvAQSDITM5VDW6XNE4KagNh6Bgwe60smQUB3d4Rz1ZBApnFASDd0hihh12BkE9kjAJVlycXIg7CQIFA6SlnJ87paqbSKiKoqusnbMdmDC2tXQlkUhziYtyWTxIfy6BE8WJt5YJvpJivxNaGmLHT0VnOgSYf0dZXS7APdpB309RnHOG5gDqXGLDaC457D1zZ%2FV%2FnmOM82XiHRLYKhKP1oZmADdEAAAh%2BQQJCgAAACwAAAAAIAAgAAAE6hDISWlZpOrNp1lGNRSdRpDUolIGw5RUYhhHukqFu8DsrEyqnWThGvAmhVlteBvojpTDDBUEIFwMFBRAmBkSgOrBFZogCASwBDEY%2FCZSg7GSE0gSCjQBMVG023xWBhklAnoEdhQEfyNqMIcKjhRsjEdnezB%2BA4k8gTwJhFuiW4dokXiloUepBAp5qaKpp6%2BHo7aWW54wl7obvEe0kRuoplCGepwSx2jJvqHEmGt6whJpGpfJCHmOoNHKaHx61WiSR92E4lbFoq%2BB6QDtuetcaBPnW6%2BO7wDHpIiK9SaVK5GgV543tzjgGcghAgAh%2BQQJCgAAACwAAAAAIAAgAAAE7hDISSkxpOrN5zFHNWRdhSiVoVLHspRUMoyUakyEe8PTPCATW9A14E0UvuAKMNAZKYUZCiBMuBakSQKG8G2FzUWox2AUtAQFcBKlVQoLgQReZhQlCIJesQXI5B0CBnUMOxMCenoCfTCEWBsJColTMANldx15BGs8B5wlCZ9Po6OJkwmRpnqkqnuSrayqfKmqpLajoiW5HJq7FL1Gr2mMMcKUMIiJgIemy7xZtJsTmsM4xHiKv5KMCXqfyUCJEonXPN2rAOIAmsfB3uPoAK%2B%2BG%2Bw48edZPK%2BM6hLJpQg484enXIdQFSS1u6UhksENEQAAIfkECQoAAAAsAAAAACAAIAAABOcQyEmpGKLqzWcZRVUQnZYg1aBSh2GUVEIQ2aQOE%2BG%2BcD4ntpWkZQj1JIiZIogDFFyHI0UxQwFugMSOFIPJftfVAEoZLBbcLEFhlQiqGp1Vd140AUklUN3eCA51C1EWMzMCezCBBmkxVIVHBWd3HHl9JQOIJSdSnJ0TDKChCwUJjoWMPaGqDKannasMo6WnM562R5YluZRwur0wpgqZE7NKUm%2BFNRPIhjBJxKZteWuIBMN4zRMIVIhffcgojwCF117i4nlLnY5ztRLsnOk%2BaV%2BoJY7V7m76PdkS4trKcdg0Zc0tTcKkRAAAIfkECQoAAAAsAAAAACAAIAAABO4QyEkpKqjqzScpRaVkXZWQEximw1BSCUEIlDohrft6cpKCk5xid5MNJTaAIkekKGQkWyKHkvhKsR7ARmitkAYDYRIbUQRQjWBwJRzChi9CRlBcY1UN4g0%2FVNB0AlcvcAYHRyZPdEQFYV8ccwR5HWxEJ02YmRMLnJ1xCYp0Y5idpQuhopmmC2KgojKasUQDk5BNAwwMOh2RtRq5uQuPZKGIJQIGwAwGf6I0JXMpC8C7kXWDBINFMxS4DKMAWVWAGYsAdNqW5uaRxkSKJOZKaU3tPOBZ4DuK2LATgJhkPJMgTwKCdFjyPHEnKxFCDhEAACH5BAkKAAAALAAAAAAgACAAAATzEMhJaVKp6s2nIkolIJ2WkBShpkVRWqqQrhLSEu9MZJKK9y1ZrqYK9WiClmvoUaF8gIQSNeF1Er4MNFn4SRSDARWroAIETg1iVwuHjYB1kYc1mwruwXKC9gmsJXliGxc%2BXiUCby9ydh1sOSdMkpMTBpaXBzsfhoc5l58Gm5yToAaZhaOUqjkDgCWNHAULCwOLaTmzswadEqggQwgHuQsHIoZCHQMMQgQGubVEcxOPFAcMDAYUA85eWARmfSRQCdcMe0zeP1AAygwLlJtPNAAL19DARdPzBOWSm1brJBi45soRAWQAAkrQIykShQ9wVhHCwCQCACH5BAkKAAAALAAAAAAgACAAAATrEMhJaVKp6s2nIkqFZF2VIBWhUsJaTokqUCoBq%2BE71SRQeyqUToLA7VxF0JDyIQh%2FMVVPMt1ECZlfcjZJ9mIKoaTl1MRIl5o4CUKXOwmyrCInCKqcWtvadL2SYhyASyNDJ0uIiRMDjI0Fd30%2FiI2UA5GSS5UDj2l6NoqgOgN4gksEBgYFf0FDqKgHnyZ9OX8HrgYHdHpcHQULXAS2qKpENRg7eAMLC7kTBaixUYFkKAzWAAnLC7FLVxLWDBLKCwaKTULgEwbLA4hJtOkSBNqITT3xEgfLpBtzE%2FjiuL04RGEBgwWhShRgQExHBAAh%2BQQJCgAAACwAAAAAIAAgAAAE7xDISWlSqerNpyJKhWRdlSAVoVLCWk6JKlAqAavhO9UkUHsqlE6CwO1cRdCQ8iEIfzFVTzLdRAmZX3I2SfZiCqGk5dTESJeaOAlClzsJsqwiJwiqnFrb2nS9kmIcgEsjQydLiIlHehhpejaIjzh9eomSjZR%2BipslWIRLAgMDOR2DOqKogTB9pCUJBagDBXR6XB0EBkIIsaRsGGMMAxoDBgYHTKJiUYEGDAzHC9EACcUGkIgFzgwZ0QsSBcXHiQvOwgDdEwfFs0sDzt4S6BK4xYjkDOzn0unFeBzOBijIm1Dgmg5YFQwsCMjp1oJ8LyIAACH5BAkKAAAALAAAAAAgACAAAATwEMhJaVKp6s2nIkqFZF2VIBWhUsJaTokqUCoBq%2BE71SRQeyqUToLA7VxF0JDyIQh%2FMVVPMt1ECZlfcjZJ9mIKoaTl1MRIl5o4CUKXOwmyrCInCKqcWtvadL2SYhyASyNDJ0uIiUd6GGl6NoiPOH16iZKNlH6KmyWFOggHhEEvAwwMA0N9GBsEC6amhnVcEwavDAazGwIDaH1ipaYLBUTCGgQDA8NdHz0FpqgTBwsLqAbWAAnIA4FWKdMLGdYGEgraigbT0OITBcg5QwPT4xLrROZL6AuQAPUS7bxLpoWidY0JtxLHKhwwMJBTHgPKdEQAACH5BAkKAAAALAAAAAAgACAAAATrEMhJaVKp6s2nIkqFZF2VIBWhUsJaTokqUCoBq%2BE71SRQeyqUToLA7VxF0JDyIQh%2FMVVPMt1ECZlfcjZJ9mIKoaTl1MRIl5o4CUKXOwmyrCInCKqcWtvadL2SYhyASyNDJ0uIiUd6GAULDJCRiXo1CpGXDJOUjY%2BYip9DhToJA4RBLwMLCwVDfRgbBAaqqoZ1XBMHswsHtxtFaH1iqaoGNgAIxRpbFAgfPQSqpbgGBqUD1wBXeCYp1AYZ19JJOYgH1KwA4UBvQwXUBxPqVD9L3sbp2BNk2xvvFPJd%2BMFCN6HAAIKgNggY0KtEBAAh%2BQQJCgAAACwAAAAAIAAgAAAE6BDISWlSqerNpyJKhWRdlSAVoVLCWk6JKlAqAavhO9UkUHsqlE6CwO1cRdCQ8iEIfzFVTzLdRAmZX3I2SfYIDMaAFdTESJeaEDAIMxYFqrOUaNW4E4ObYcCXaiBVEgULe0NJaxxtYksjh2NLkZISgDgJhHthkpU4mW6blRiYmZOlh4JWkDqILwUGBnE6TYEbCgevr0N1gH4At7gHiRpFaLNrrq8HNgAJA70AWxQIH1%2BvsYMDAzZQPC9VCNkDWUhGkuE5PxJNwiUK4UfLzOlD4WvzAHaoG9nxPi5d%2BjYUqfAhhykOFwJWiAAAIfkECQoAAAAsAAAAACAAIAAABPAQyElpUqnqzaciSoVkXVUMFaFSwlpOCcMYlErAavhOMnNLNo8KsZsMZItJEIDIFSkLGQoQTNhIsFehRww2CQLKF0tYGKYSg%2BygsZIuNqJksKgbfgIGepNo2cIUB3V1B3IvNiBYNQaDSTtfhhx0CwVPI0UJe0%2Bbm4g5VgcGoqOcnjmjqDSdnhgEoamcsZuXO1aWQy8KAwOAuTYYGwi7w5h%2BKr0SJ8MFihpNbx%2B4Erq7BYBuzsdiH1jCAzoSfl0rVirNbRXlBBlLX%2BBP0XJLAPGzTkAuAOqb0WT5AH7OcdCm5B8TgRwSRKIHQtaLCwg1RAAAOwAAAAAAAAAAAA%3D%3D); visibility: visible; opacity: 0.6; - -webkit-transition: all 0.3s ease; - transition: all 0.3s ease; } + transition: all 0.3s ease; } .reveal .overlay header { position: absolute; @@ -1169,8 +1058,7 @@ html:-moz-full-screen-ancestor { border: 0; opacity: 0; visibility: hidden; - -webkit-transition: all 0.3s ease; - transition: all 0.3s ease; } + transition: all 0.3s ease; } .reveal .overlay.overlay-preview.loaded .viewport iframe { opacity: 1; @@ -1179,9 +1067,7 @@ html:-moz-full-screen-ancestor { .reveal .overlay.overlay-preview.loaded .spinner { opacity: 0; visibility: hidden; - -webkit-transform: scale(0.2); - -ms-transform: scale(0.2); - transform: scale(0.2); } + transform: scale(0.2); } .reveal .overlay.overlay-help .viewport { overflow: auto; @@ -1222,8 +1108,7 @@ html:-moz-full-screen-ancestor { bottom: 20px; z-index: 30; cursor: pointer; - -webkit-transition: all 400ms ease; - transition: all 400ms ease; } + transition: all 400ms ease; } .reveal.overview .playback { opacity: 0; @@ -1237,10 +1122,8 @@ html:-moz-full-screen-ancestor { line-height: 1.2; overflow: hidden; vertical-align: top; - -webkit-perspective: 400px; - perspective: 400px; - -webkit-perspective-origin: 50% 50%; - perspective-origin: 50% 50%; } + perspective: 400px; + perspective-origin: 50% 50%; } .reveal .roll:hover { background: none; @@ -1251,20 +1134,14 @@ html:-moz-full-screen-ancestor { position: relative; padding: 0 2px; pointer-events: none; - -webkit-transition: all 400ms ease; - transition: all 400ms ease; - -webkit-transform-origin: 50% 0%; - -ms-transform-origin: 50% 0%; - transform-origin: 50% 0%; - -webkit-transform-style: preserve-3d; - transform-style: preserve-3d; - -webkit-backface-visibility: hidden; - backface-visibility: hidden; } + transition: all 400ms ease; + transform-origin: 50% 0%; + transform-style: preserve-3d; + backface-visibility: hidden; } .reveal .roll:hover span { background: rgba(0, 0, 0, 0.5); - -webkit-transform: translate3d(0px, 0px, -45px) rotateX(90deg); - transform: translate3d(0px, 0px, -45px) rotateX(90deg); } + transform: translate3d(0px, 0px, -45px) rotateX(90deg); } .reveal .roll span:after { content: attr(data-title); @@ -1273,13 +1150,9 @@ html:-moz-full-screen-ancestor { left: 0; top: 0; padding: 0 2px; - -webkit-backface-visibility: hidden; - backface-visibility: hidden; - -webkit-transform-origin: 50% 0%; - -ms-transform-origin: 50% 0%; - transform-origin: 50% 0%; - -webkit-transform: translate3d(0px, 110%, 0px) rotateX(-90deg); - transform: translate3d(0px, 110%, 0px) rotateX(-90deg); } + backface-visibility: hidden; + transform-origin: 50% 0%; + transform: translate3d(0px, 110%, 0px) rotateX(-90deg); } /********************************************* * SPEAKER NOTES @@ -1312,20 +1185,17 @@ html:-moz-full-screen-ancestor { @media screen and (max-width: 1024px) { .reveal .speaker-notes { font-size: 14px; } } - @media screen and (max-width: 600px) { .reveal .speaker-notes { width: 90%; left: 5%; } } - /********************************************* * ZOOM PLUGIN *********************************************/ .zoomed .reveal *, .zoomed .reveal *:before, .zoomed .reveal *:after { - -webkit-backface-visibility: visible !important; - backface-visibility: visible !important; } + backface-visibility: visible !important; } .zoomed .reveal .progress, .zoomed .reveal .controls { diff --git a/css/reveal.scss b/css/reveal.scss index d932269..1cea73e 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -137,6 +137,54 @@ html:-moz-full-screen-ancestor { } } +.reveal .slides section .fragment.fade-up { + opacity: 0; + transform: translate(0, 20%); + visibility: hidden; + + &.visible { + opacity: 1; + transform: translate(0, 0); + visibility: visible; + } +} + +.reveal .slides section .fragment.fade-down { + opacity: 0; + transform: translate(0, -20%); + visibility: hidden; + + &.visible { + opacity: 1; + transform: translate(0, 0); + visibility: visible; + } +} + +.reveal .slides section .fragment.fade-right { + opacity: 0; + transform: translate(-20%, 0); + visibility: hidden; + + &.visible { + opacity: 1; + transform: translate(0, 0); + visibility: visible; + } +} + +.reveal .slides section .fragment.fade-left { + opacity: 0; + transform: translate(20%, 0); + visibility: hidden; + + &.visible { + opacity: 1; + transform: translate(0, 0); + visibility: visible; + } +} + .reveal .slides section .fragment.current-visible { opacity: 0; visibility: hidden; @@ -1375,5 +1423,3 @@ html:-moz-full-screen-ancestor { .zoomed .reveal .roll span:after { visibility: hidden; } - - diff --git a/index.html b/index.html index c951ff7..0125d22 100644 --- a/index.html +++ b/index.html @@ -139,6 +139,7 @@

    grow

    shrink

    fade-out

    +

    fade-up (also down, left and right!)

    current-visible

    highlight-red

    highlight-blue

    From 2909440fde651af3a2477d0b569d3b43ba64ca6e Mon Sep 17 00:00:00 2001 From: Leonardo Kewitz Date: Sun, 22 Nov 2015 18:52:42 -0200 Subject: [PATCH 017/228] Clean version of the new transitions. --- css/reveal.css | 450 ++++++++++++++++++++++++++++++++---------------- css/reveal.scss | 16 -- 2 files changed, 300 insertions(+), 166 deletions(-) diff --git a/css/reveal.css b/css/reveal.css index 88858f6..8979008 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -59,7 +59,8 @@ html:-moz-full-screen-ancestor { .reveal .slides section .fragment { opacity: 0; visibility: hidden; - transition: all .2s ease; } + -webkit-transition: all 0.2s ease; + transition: all 0.2s ease; } .reveal .slides section .fragment.visible { opacity: 1; visibility: visible; } @@ -68,18 +69,26 @@ html:-moz-full-screen-ancestor { opacity: 1; visibility: visible; } .reveal .slides section .fragment.grow.visible { - transform: scale(1.3); } + -webkit-transform: scale(1.3); + -ms-transform: scale(1.3); + transform: scale(1.3); } .reveal .slides section .fragment.shrink { opacity: 1; visibility: visible; } .reveal .slides section .fragment.shrink.visible { - transform: scale(0.7); } + -webkit-transform: scale(0.7); + -ms-transform: scale(0.7); + transform: scale(0.7); } .reveal .slides section .fragment.zoom-in { - transform: scale(0.1); } + -webkit-transform: scale(0.1); + -ms-transform: scale(0.1); + transform: scale(0.1); } .reveal .slides section .fragment.zoom-in.visible { - transform: none; } + -webkit-transform: none; + -ms-transform: none; + transform: none; } .reveal .slides section .fragment.fade-out { opacity: 1; @@ -102,40 +111,24 @@ html:-moz-full-screen-ancestor { text-decoration: line-through; } .reveal .slides section .fragment.fade-up { - opacity: 0; - transform: translate(0, 20%); - visibility: hidden; } + transform: translate(0, 20%); } .reveal .slides section .fragment.fade-up.visible { - opacity: 1; - transform: translate(0, 0); - visibility: visible; } + transform: translate(0, 0); } .reveal .slides section .fragment.fade-down { - opacity: 0; - transform: translate(0, -20%); - visibility: hidden; } + transform: translate(0, -20%); } .reveal .slides section .fragment.fade-down.visible { - opacity: 1; - transform: translate(0, 0); - visibility: visible; } + transform: translate(0, 0); } .reveal .slides section .fragment.fade-right { - opacity: 0; - transform: translate(-20%, 0); - visibility: hidden; } + transform: translate(-20%, 0); } .reveal .slides section .fragment.fade-right.visible { - opacity: 1; - transform: translate(0, 0); - visibility: visible; } + transform: translate(0, 0); } .reveal .slides section .fragment.fade-left { - opacity: 0; - transform: translate(20%, 0); - visibility: hidden; } + transform: translate(20%, 0); } .reveal .slides section .fragment.fade-left.visible { - opacity: 1; - transform: translate(0, 0); - visibility: visible; } + transform: translate(0, 0); } .reveal .slides section .fragment.current-visible { opacity: 0; @@ -216,10 +209,13 @@ html:-moz-full-screen-ancestor { height: 0; background-color: transparent; border: 12px solid transparent; - transform: scale(0.9999); - transition: all 0.2s ease; + -webkit-transform: scale(0.9999); + -ms-transform: scale(0.9999); + transform: scale(0.9999); + -webkit-transition: all 0.2s ease; + transition: all 0.2s ease; -webkit-appearance: none; - -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } + -webkit-tap-highlight-color: transparent; } .reveal .controls .enabled { opacity: 0.7; @@ -288,7 +284,8 @@ html:-moz-full-screen-ancestor { height: 100%; width: 0px; background-color: #000; - transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } + -webkit-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); + transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } /********************************************* * SLIDE NUMBER @@ -317,7 +314,8 @@ html:-moz-full-screen-ancestor { width: 100%; height: 100%; overflow: hidden; - touch-action: none; } + -ms-touch-action: none; + touch-action: none; } .reveal .slides { position: absolute; @@ -331,8 +329,10 @@ html:-moz-full-screen-ancestor { overflow: visible; z-index: 1; text-align: center; - perspective: 600px; - perspective-origin: 50% 40%; } + -webkit-perspective: 600px; + perspective: 600px; + -webkit-perspective-origin: 50% 40%; + perspective-origin: 50% 40%; } .reveal .slides > section { -ms-perspective: 600px; } @@ -344,22 +344,29 @@ html:-moz-full-screen-ancestor { width: 100%; padding: 20px 0px; z-index: 10; - transform-style: preserve-3d; - transition: transform-origin 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), transform 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), visibility 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), opacity 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; + -webkit-transition: -webkit-transform-origin 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), -webkit-transform 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), visibility 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), opacity 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); + transition: -ms-transform-origin 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), transform 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), visibility 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), opacity 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); + transition: transform-origin 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), transform 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), visibility 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), opacity 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } /* Global transition speed settings */ .reveal[data-transition-speed="fast"] .slides section { - transition-duration: 400ms; } + -webkit-transition-duration: 400ms; + transition-duration: 400ms; } .reveal[data-transition-speed="slow"] .slides section { - transition-duration: 1200ms; } + -webkit-transition-duration: 1200ms; + transition-duration: 1200ms; } /* Slide-specific transition speed overrides */ .reveal .slides section[data-transition-speed="fast"] { - transition-duration: 400ms; } + -webkit-transition-duration: 400ms; + transition-duration: 400ms; } .reveal .slides section[data-transition-speed="slow"] { - transition-duration: 1200ms; } + -webkit-transition-duration: 1200ms; + transition-duration: 1200ms; } .reveal .slides > section.stack { padding-top: 0; @@ -401,50 +408,68 @@ html:-moz-full-screen-ancestor { * Aliased 'linear' for backwards compatibility *********************************************/ .reveal.slide section { - backface-visibility: hidden; } + -webkit-backface-visibility: hidden; + backface-visibility: hidden; } .reveal .slides > section[data-transition=slide].past, .reveal .slides > section[data-transition~=slide-out].past, .reveal.slide .slides > section:not([data-transition]).past { - transform: translate(-150%, 0); } + -webkit-transform: translate(-150%, 0); + -ms-transform: translate(-150%, 0); + transform: translate(-150%, 0); } .reveal .slides > section[data-transition=slide].future, .reveal .slides > section[data-transition~=slide-in].future, .reveal.slide .slides > section:not([data-transition]).future { - transform: translate(150%, 0); } + -webkit-transform: translate(150%, 0); + -ms-transform: translate(150%, 0); + transform: translate(150%, 0); } .reveal .slides > section > section[data-transition=slide].past, .reveal .slides > section > section[data-transition~=slide-out].past, .reveal.slide .slides > section > section:not([data-transition]).past { - transform: translate(0, -150%); } + -webkit-transform: translate(0, -150%); + -ms-transform: translate(0, -150%); + transform: translate(0, -150%); } .reveal .slides > section > section[data-transition=slide].future, .reveal .slides > section > section[data-transition~=slide-in].future, .reveal.slide .slides > section > section:not([data-transition]).future { - transform: translate(0, 150%); } + -webkit-transform: translate(0, 150%); + -ms-transform: translate(0, 150%); + transform: translate(0, 150%); } .reveal.linear section { - backface-visibility: hidden; } + -webkit-backface-visibility: hidden; + backface-visibility: hidden; } .reveal .slides > section[data-transition=linear].past, .reveal .slides > section[data-transition~=linear-out].past, .reveal.linear .slides > section:not([data-transition]).past { - transform: translate(-150%, 0); } + -webkit-transform: translate(-150%, 0); + -ms-transform: translate(-150%, 0); + transform: translate(-150%, 0); } .reveal .slides > section[data-transition=linear].future, .reveal .slides > section[data-transition~=linear-in].future, .reveal.linear .slides > section:not([data-transition]).future { - transform: translate(150%, 0); } + -webkit-transform: translate(150%, 0); + -ms-transform: translate(150%, 0); + transform: translate(150%, 0); } .reveal .slides > section > section[data-transition=linear].past, .reveal .slides > section > section[data-transition~=linear-out].past, .reveal.linear .slides > section > section:not([data-transition]).past { - transform: translate(0, -150%); } + -webkit-transform: translate(0, -150%); + -ms-transform: translate(0, -150%); + transform: translate(0, -150%); } .reveal .slides > section > section[data-transition=linear].future, .reveal .slides > section > section[data-transition~=linear-in].future, .reveal.linear .slides > section > section:not([data-transition]).future { - transform: translate(0, 150%); } + -webkit-transform: translate(0, 150%); + -ms-transform: translate(0, 150%); + transform: translate(0, 150%); } /********************************************* * CONVEX TRANSITION @@ -453,42 +478,50 @@ html:-moz-full-screen-ancestor { .reveal .slides > section[data-transition=default].past, .reveal .slides > section[data-transition~=default-out].past, .reveal.default .slides > section:not([data-transition]).past { - transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } + -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } .reveal .slides > section[data-transition=default].future, .reveal .slides > section[data-transition~=default-in].future, .reveal.default .slides > section:not([data-transition]).future { - transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } + -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } .reveal .slides > section > section[data-transition=default].past, .reveal .slides > section > section[data-transition~=default-out].past, .reveal.default .slides > section > section:not([data-transition]).past { - transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); } + -webkit-transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); + transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); } .reveal .slides > section > section[data-transition=default].future, .reveal .slides > section > section[data-transition~=default-in].future, .reveal.default .slides > section > section:not([data-transition]).future { - transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); } + -webkit-transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); + transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); } .reveal .slides > section[data-transition=convex].past, .reveal .slides > section[data-transition~=convex-out].past, .reveal.convex .slides > section:not([data-transition]).past { - transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } + -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } .reveal .slides > section[data-transition=convex].future, .reveal .slides > section[data-transition~=convex-in].future, .reveal.convex .slides > section:not([data-transition]).future { - transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } + -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } .reveal .slides > section > section[data-transition=convex].past, .reveal .slides > section > section[data-transition~=convex-out].past, .reveal.convex .slides > section > section:not([data-transition]).past { - transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); } + -webkit-transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); + transform: translate3d(0, -300px, 0) rotateX(70deg) translate3d(0, -300px, 0); } .reveal .slides > section > section[data-transition=convex].future, .reveal .slides > section > section[data-transition~=convex-in].future, .reveal.convex .slides > section > section:not([data-transition]).future { - transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); } + -webkit-transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); + transform: translate3d(0, 300px, 0) rotateX(-70deg) translate3d(0, 300px, 0); } /********************************************* * CONCAVE TRANSITION @@ -496,62 +529,77 @@ html:-moz-full-screen-ancestor { .reveal .slides > section[data-transition=concave].past, .reveal .slides > section[data-transition~=concave-out].past, .reveal.concave .slides > section:not([data-transition]).past { - transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); } + -webkit-transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); } .reveal .slides > section[data-transition=concave].future, .reveal .slides > section[data-transition~=concave-in].future, .reveal.concave .slides > section:not([data-transition]).future { - transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); } + -webkit-transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); } .reveal .slides > section > section[data-transition=concave].past, .reveal .slides > section > section[data-transition~=concave-out].past, .reveal.concave .slides > section > section:not([data-transition]).past { - transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); } + -webkit-transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); + transform: translate3d(0, -80%, 0) rotateX(-70deg) translate3d(0, -80%, 0); } .reveal .slides > section > section[data-transition=concave].future, .reveal .slides > section > section[data-transition~=concave-in].future, .reveal.concave .slides > section > section:not([data-transition]).future { - transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0); } + -webkit-transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0); + transform: translate3d(0, 80%, 0) rotateX(70deg) translate3d(0, 80%, 0); } /********************************************* * ZOOM TRANSITION *********************************************/ .reveal .slides section[data-transition=zoom], .reveal.zoom .slides section:not([data-transition]) { - transition-timing-function: ease; } + -webkit-transition-timing-function: ease; + transition-timing-function: ease; } .reveal .slides > section[data-transition=zoom].past, .reveal .slides > section[data-transition~=zoom-out].past, .reveal.zoom .slides > section:not([data-transition]).past { visibility: hidden; - transform: scale(16); } + -webkit-transform: scale(16); + -ms-transform: scale(16); + transform: scale(16); } .reveal .slides > section[data-transition=zoom].future, .reveal .slides > section[data-transition~=zoom-in].future, .reveal.zoom .slides > section:not([data-transition]).future { visibility: hidden; - transform: scale(0.2); } + -webkit-transform: scale(0.2); + -ms-transform: scale(0.2); + transform: scale(0.2); } .reveal .slides > section > section[data-transition=zoom].past, .reveal .slides > section > section[data-transition~=zoom-out].past, .reveal.zoom .slides > section > section:not([data-transition]).past { - transform: translate(0, -150%); } + -webkit-transform: translate(0, -150%); + -ms-transform: translate(0, -150%); + transform: translate(0, -150%); } .reveal .slides > section > section[data-transition=zoom].future, .reveal .slides > section > section[data-transition~=zoom-in].future, .reveal.zoom .slides > section > section:not([data-transition]).future { - transform: translate(0, 150%); } + -webkit-transform: translate(0, 150%); + -ms-transform: translate(0, 150%); + transform: translate(0, 150%); } /********************************************* * CUBE TRANSITION *********************************************/ .reveal.cube .slides { - perspective: 1300px; } + -webkit-perspective: 1300px; + perspective: 1300px; } .reveal.cube .slides section { padding: 30px; min-height: 700px; - backface-visibility: hidden; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; box-sizing: border-box; } .reveal.center.cube .slides section { @@ -567,7 +615,8 @@ html:-moz-full-screen-ancestor { top: 0; background: rgba(0, 0, 0, 0.1); border-radius: 4px; - transform: translateZ(-20px); } + -webkit-transform: translateZ(-20px); + transform: translateZ(-20px); } .reveal.cube .slides section:not(.stack):after { content: ''; @@ -581,34 +630,49 @@ html:-moz-full-screen-ancestor { z-index: 1; border-radius: 4px; box-shadow: 0px 95px 25px rgba(0, 0, 0, 0.2); - transform: translateZ(-90px) rotateX(65deg); } + -webkit-transform: translateZ(-90px) rotateX(65deg); + transform: translateZ(-90px) rotateX(65deg); } .reveal.cube .slides > section.stack { padding: 0; background: none; } .reveal.cube .slides > section.past { - transform-origin: 100% 0%; - transform: translate3d(-100%, 0, 0) rotateY(-90deg); } + -webkit-transform-origin: 100% 0%; + -ms-transform-origin: 100% 0%; + transform-origin: 100% 0%; + -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg); + transform: translate3d(-100%, 0, 0) rotateY(-90deg); } .reveal.cube .slides > section.future { - transform-origin: 0% 0%; - transform: translate3d(100%, 0, 0) rotateY(90deg); } + -webkit-transform-origin: 0% 0%; + -ms-transform-origin: 0% 0%; + transform-origin: 0% 0%; + -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg); + transform: translate3d(100%, 0, 0) rotateY(90deg); } .reveal.cube .slides > section > section.past { - transform-origin: 0% 100%; - transform: translate3d(0, -100%, 0) rotateX(90deg); } + -webkit-transform-origin: 0% 100%; + -ms-transform-origin: 0% 100%; + transform-origin: 0% 100%; + -webkit-transform: translate3d(0, -100%, 0) rotateX(90deg); + transform: translate3d(0, -100%, 0) rotateX(90deg); } .reveal.cube .slides > section > section.future { - transform-origin: 0% 0%; - transform: translate3d(0, 100%, 0) rotateX(-90deg); } + -webkit-transform-origin: 0% 0%; + -ms-transform-origin: 0% 0%; + transform-origin: 0% 0%; + -webkit-transform: translate3d(0, 100%, 0) rotateX(-90deg); + transform: translate3d(0, 100%, 0) rotateX(-90deg); } /********************************************* * PAGE TRANSITION *********************************************/ .reveal.page .slides { - perspective-origin: 0% 50%; - perspective: 3000px; } + -webkit-perspective-origin: 0% 50%; + perspective-origin: 0% 50%; + -webkit-perspective: 3000px; + perspective: 3000px; } .reveal.page .slides section { padding: 30px; @@ -627,7 +691,8 @@ html:-moz-full-screen-ancestor { left: 0; top: 0; background: rgba(0, 0, 0, 0.1); - transform: translateZ(-20px); } + -webkit-transform: translateZ(-20px); + transform: translateZ(-20px); } .reveal.page .slides section:not(.stack):after { content: ''; @@ -648,20 +713,32 @@ html:-moz-full-screen-ancestor { background: none; } .reveal.page .slides > section.past { - transform-origin: 0% 0%; - transform: translate3d(-40%, 0, 0) rotateY(-80deg); } + -webkit-transform-origin: 0% 0%; + -ms-transform-origin: 0% 0%; + transform-origin: 0% 0%; + -webkit-transform: translate3d(-40%, 0, 0) rotateY(-80deg); + transform: translate3d(-40%, 0, 0) rotateY(-80deg); } .reveal.page .slides > section.future { - transform-origin: 100% 0%; - transform: translate3d(0, 0, 0); } + -webkit-transform-origin: 100% 0%; + -ms-transform-origin: 100% 0%; + transform-origin: 100% 0%; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); } .reveal.page .slides > section > section.past { - transform-origin: 0% 0%; - transform: translate3d(0, -40%, 0) rotateX(80deg); } + -webkit-transform-origin: 0% 0%; + -ms-transform-origin: 0% 0%; + transform-origin: 0% 0%; + -webkit-transform: translate3d(0, -40%, 0) rotateX(80deg); + transform: translate3d(0, -40%, 0) rotateX(80deg); } .reveal.page .slides > section > section.future { - transform-origin: 0% 100%; - transform: translate3d(0, 0, 0); } + -webkit-transform-origin: 0% 100%; + -ms-transform-origin: 0% 100%; + transform-origin: 0% 100%; + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); } /********************************************* * FADE TRANSITION @@ -669,20 +746,27 @@ html:-moz-full-screen-ancestor { .reveal .slides section[data-transition=fade], .reveal.fade .slides section:not([data-transition]), .reveal.fade .slides > section > section:not([data-transition]) { - transform: none; - transition: opacity 0.5s; } + -webkit-transform: none; + -ms-transform: none; + transform: none; + -webkit-transition: opacity 0.5s; + transition: opacity 0.5s; } .reveal.fade.overview .slides section, .reveal.fade.overview .slides > section > section { - transition: none; } + -webkit-transition: none; + transition: none; } /********************************************* * NO TRANSITION *********************************************/ .reveal .slides section[data-transition=none], .reveal.none .slides section:not([data-transition]) { - transform: none; - transition: none; } + -webkit-transform: none; + -ms-transform: none; + transform: none; + -webkit-transition: none; + transition: none; } /********************************************* * PAUSED MODE @@ -697,7 +781,8 @@ html:-moz-full-screen-ancestor { visibility: hidden; opacity: 0; z-index: 100; - transition: all 1s ease; } + -webkit-transition: all 1s ease; + transition: all 1s ease; } .reveal.paused .pause-overlay { visibility: visible; @@ -731,14 +816,17 @@ html:-moz-full-screen-ancestor { top: 0; left: -50%; margin: 70px 0; - transform: none; } + -webkit-transform: none; + -ms-transform: none; + transform: none; } .no-transforms .reveal .slides section section { left: 0; } .reveal .no-transition, .reveal .no-transition * { - transition: none !important; } + -webkit-transition: none !important; + transition: none !important; } /********************************************* * PER-SLIDE BACKGROUNDS @@ -749,7 +837,8 @@ html:-moz-full-screen-ancestor { height: 100%; top: 0; left: 0; - perspective: 600px; } + -webkit-perspective: 600px; + perspective: 600px; } .reveal .slide-background { display: none; @@ -758,11 +847,12 @@ html:-moz-full-screen-ancestor { height: 100%; opacity: 0; visibility: hidden; - background-color: rgba(0, 0, 0, 0); + background-color: transparent; background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; - transition: all 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } + -webkit-transition: all 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); + transition: all 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } .reveal .slide-background.stack { display: block; } @@ -788,114 +878,145 @@ html:-moz-full-screen-ancestor { /* Immediate transition style */ .reveal[data-background-transition=none] > .backgrounds .slide-background, .reveal > .backgrounds .slide-background[data-background-transition=none] { - transition: none; } + -webkit-transition: none; + transition: none; } /* Slide */ .reveal[data-background-transition=slide] > .backgrounds .slide-background, .reveal > .backgrounds .slide-background[data-background-transition=slide] { opacity: 1; - backface-visibility: hidden; } + -webkit-backface-visibility: hidden; + backface-visibility: hidden; } .reveal[data-background-transition=slide] > .backgrounds .slide-background.past, .reveal > .backgrounds .slide-background.past[data-background-transition=slide] { - transform: translate(-100%, 0); } + -webkit-transform: translate(-100%, 0); + -ms-transform: translate(-100%, 0); + transform: translate(-100%, 0); } .reveal[data-background-transition=slide] > .backgrounds .slide-background.future, .reveal > .backgrounds .slide-background.future[data-background-transition=slide] { - transform: translate(100%, 0); } + -webkit-transform: translate(100%, 0); + -ms-transform: translate(100%, 0); + transform: translate(100%, 0); } .reveal[data-background-transition=slide] > .backgrounds .slide-background > .slide-background.past, .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=slide] { - transform: translate(0, -100%); } + -webkit-transform: translate(0, -100%); + -ms-transform: translate(0, -100%); + transform: translate(0, -100%); } .reveal[data-background-transition=slide] > .backgrounds .slide-background > .slide-background.future, .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=slide] { - transform: translate(0, 100%); } + -webkit-transform: translate(0, 100%); + -ms-transform: translate(0, 100%); + transform: translate(0, 100%); } /* Convex */ .reveal[data-background-transition=convex] > .backgrounds .slide-background.past, .reveal > .backgrounds .slide-background.past[data-background-transition=convex] { opacity: 0; - transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } + -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0) rotateY(-90deg) translate3d(-100%, 0, 0); } .reveal[data-background-transition=convex] > .backgrounds .slide-background.future, .reveal > .backgrounds .slide-background.future[data-background-transition=convex] { opacity: 0; - transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } + -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0) rotateY(90deg) translate3d(100%, 0, 0); } .reveal[data-background-transition=convex] > .backgrounds .slide-background > .slide-background.past, .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=convex] { opacity: 0; - transform: translate3d(0, -100%, 0) rotateX(90deg) translate3d(0, -100%, 0); } + -webkit-transform: translate3d(0, -100%, 0) rotateX(90deg) translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0) rotateX(90deg) translate3d(0, -100%, 0); } .reveal[data-background-transition=convex] > .backgrounds .slide-background > .slide-background.future, .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=convex] { opacity: 0; - transform: translate3d(0, 100%, 0) rotateX(-90deg) translate3d(0, 100%, 0); } + -webkit-transform: translate3d(0, 100%, 0) rotateX(-90deg) translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0) rotateX(-90deg) translate3d(0, 100%, 0); } /* Concave */ .reveal[data-background-transition=concave] > .backgrounds .slide-background.past, .reveal > .backgrounds .slide-background.past[data-background-transition=concave] { opacity: 0; - transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); } + -webkit-transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); + transform: translate3d(-100%, 0, 0) rotateY(90deg) translate3d(-100%, 0, 0); } .reveal[data-background-transition=concave] > .backgrounds .slide-background.future, .reveal > .backgrounds .slide-background.future[data-background-transition=concave] { opacity: 0; - transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); } + -webkit-transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); + transform: translate3d(100%, 0, 0) rotateY(-90deg) translate3d(100%, 0, 0); } .reveal[data-background-transition=concave] > .backgrounds .slide-background > .slide-background.past, .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=concave] { opacity: 0; - transform: translate3d(0, -100%, 0) rotateX(-90deg) translate3d(0, -100%, 0); } + -webkit-transform: translate3d(0, -100%, 0) rotateX(-90deg) translate3d(0, -100%, 0); + transform: translate3d(0, -100%, 0) rotateX(-90deg) translate3d(0, -100%, 0); } .reveal[data-background-transition=concave] > .backgrounds .slide-background > .slide-background.future, .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=concave] { opacity: 0; - transform: translate3d(0, 100%, 0) rotateX(90deg) translate3d(0, 100%, 0); } + -webkit-transform: translate3d(0, 100%, 0) rotateX(90deg) translate3d(0, 100%, 0); + transform: translate3d(0, 100%, 0) rotateX(90deg) translate3d(0, 100%, 0); } /* Zoom */ .reveal[data-background-transition=zoom] > .backgrounds .slide-background, .reveal > .backgrounds .slide-background[data-background-transition=zoom] { - transition-timing-function: ease; } + -webkit-transition-timing-function: ease; + transition-timing-function: ease; } .reveal[data-background-transition=zoom] > .backgrounds .slide-background.past, .reveal > .backgrounds .slide-background.past[data-background-transition=zoom] { opacity: 0; visibility: hidden; - transform: scale(16); } + -webkit-transform: scale(16); + -ms-transform: scale(16); + transform: scale(16); } .reveal[data-background-transition=zoom] > .backgrounds .slide-background.future, .reveal > .backgrounds .slide-background.future[data-background-transition=zoom] { opacity: 0; visibility: hidden; - transform: scale(0.2); } + -webkit-transform: scale(0.2); + -ms-transform: scale(0.2); + transform: scale(0.2); } .reveal[data-background-transition=zoom] > .backgrounds .slide-background > .slide-background.past, .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=zoom] { opacity: 0; visibility: hidden; - transform: scale(16); } + -webkit-transform: scale(16); + -ms-transform: scale(16); + transform: scale(16); } .reveal[data-background-transition=zoom] > .backgrounds .slide-background > .slide-background.future, .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=zoom] { opacity: 0; visibility: hidden; - transform: scale(0.2); } + -webkit-transform: scale(0.2); + -ms-transform: scale(0.2); + transform: scale(0.2); } /* Global transition speed settings */ .reveal[data-transition-speed="fast"] > .backgrounds .slide-background { - transition-duration: 400ms; } + -webkit-transition-duration: 400ms; + transition-duration: 400ms; } .reveal[data-transition-speed="slow"] > .backgrounds .slide-background { - transition-duration: 1200ms; } + -webkit-transition-duration: 1200ms; + transition-duration: 1200ms; } /********************************************* * OVERVIEW *********************************************/ .reveal.overview { - perspective-origin: 50% 50%; - perspective: 700px; } + -webkit-perspective-origin: 50% 50%; + perspective-origin: 50% 50%; + -webkit-perspective: 700px; + perspective: 700px; } .reveal.overview .slides section { height: 700px; opacity: 1 !important; @@ -909,7 +1030,8 @@ html:-moz-full-screen-ancestor { outline-offset: 10px; } .reveal.overview .slides section .fragment { opacity: 1; - transition: none; } + -webkit-transition: none; + transition: none; } .reveal.overview .slides section:after, .reveal.overview .slides section:before { display: none !important; } @@ -920,7 +1042,8 @@ html:-moz-full-screen-ancestor { outline: none; overflow: visible; } .reveal.overview .backgrounds { - perspective: inherit; } + -webkit-perspective: inherit; + perspective: inherit; } .reveal.overview .backgrounds .slide-background { opacity: 1; visibility: visible; @@ -929,14 +1052,17 @@ html:-moz-full-screen-ancestor { .reveal.overview .slides section, .reveal.overview-deactivating .slides section { - transition: none; } + -webkit-transition: none; + transition: none; } .reveal.overview .backgrounds .slide-background, .reveal.overview-deactivating .backgrounds .slide-background { - transition: none; } + -webkit-transition: none; + transition: none; } .reveal.overview-animated .slides { - transition: transform 0.4s ease; } + -webkit-transition: -webkit-transform 0.4s ease; + transition: transform 0.4s ease; } /********************************************* * RTL SUPPORT @@ -966,14 +1092,17 @@ html:-moz-full-screen-ancestor { * PARALLAX BACKGROUND *********************************************/ .reveal.has-parallax-background .backgrounds { - transition: all 0.8s ease; } + -webkit-transition: all 0.8s ease; + transition: all 0.8s ease; } /* Global transition speed settings */ .reveal.has-parallax-background[data-transition-speed="fast"] .backgrounds { - transition-duration: 400ms; } + -webkit-transition-duration: 400ms; + transition-duration: 400ms; } .reveal.has-parallax-background[data-transition-speed="slow"] .backgrounds { - transition-duration: 1200ms; } + -webkit-transition-duration: 1200ms; + transition-duration: 1200ms; } /********************************************* * LINK PREVIEW OVERLAY @@ -988,7 +1117,8 @@ html:-moz-full-screen-ancestor { background: rgba(0, 0, 0, 0.9); opacity: 0; visibility: hidden; - transition: all 0.3s ease; } + -webkit-transition: all 0.3s ease; + transition: all 0.3s ease; } .reveal .overlay.visible { opacity: 1; @@ -1006,7 +1136,8 @@ html:-moz-full-screen-ancestor { background-image: url(data:image/gif;base64,R0lGODlhIAAgAPMAAJmZmf%2F%2F%2F6%2Bvr8nJybW1tcDAwOjo6Nvb26ioqKOjo7Ozs%2FLy8vz8%2FAAAAAAAAAAAACH%2FC05FVFNDQVBFMi4wAwEAAAAh%2FhpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh%2BQQJCgAAACwAAAAAIAAgAAAE5xDISWlhperN52JLhSSdRgwVo1ICQZRUsiwHpTJT4iowNS8vyW2icCF6k8HMMBkCEDskxTBDAZwuAkkqIfxIQyhBQBFvAQSDITM5VDW6XNE4KagNh6Bgwe60smQUB3d4Rz1ZBApnFASDd0hihh12BkE9kjAJVlycXIg7CQIFA6SlnJ87paqbSKiKoqusnbMdmDC2tXQlkUhziYtyWTxIfy6BE8WJt5YJvpJivxNaGmLHT0VnOgSYf0dZXS7APdpB309RnHOG5gDqXGLDaC457D1zZ%2FV%2FnmOM82XiHRLYKhKP1oZmADdEAAAh%2BQQJCgAAACwAAAAAIAAgAAAE6hDISWlZpOrNp1lGNRSdRpDUolIGw5RUYhhHukqFu8DsrEyqnWThGvAmhVlteBvojpTDDBUEIFwMFBRAmBkSgOrBFZogCASwBDEY%2FCZSg7GSE0gSCjQBMVG023xWBhklAnoEdhQEfyNqMIcKjhRsjEdnezB%2BA4k8gTwJhFuiW4dokXiloUepBAp5qaKpp6%2BHo7aWW54wl7obvEe0kRuoplCGepwSx2jJvqHEmGt6whJpGpfJCHmOoNHKaHx61WiSR92E4lbFoq%2BB6QDtuetcaBPnW6%2BO7wDHpIiK9SaVK5GgV543tzjgGcghAgAh%2BQQJCgAAACwAAAAAIAAgAAAE7hDISSkxpOrN5zFHNWRdhSiVoVLHspRUMoyUakyEe8PTPCATW9A14E0UvuAKMNAZKYUZCiBMuBakSQKG8G2FzUWox2AUtAQFcBKlVQoLgQReZhQlCIJesQXI5B0CBnUMOxMCenoCfTCEWBsJColTMANldx15BGs8B5wlCZ9Po6OJkwmRpnqkqnuSrayqfKmqpLajoiW5HJq7FL1Gr2mMMcKUMIiJgIemy7xZtJsTmsM4xHiKv5KMCXqfyUCJEonXPN2rAOIAmsfB3uPoAK%2B%2BG%2Bw48edZPK%2BM6hLJpQg484enXIdQFSS1u6UhksENEQAAIfkECQoAAAAsAAAAACAAIAAABOcQyEmpGKLqzWcZRVUQnZYg1aBSh2GUVEIQ2aQOE%2BG%2BcD4ntpWkZQj1JIiZIogDFFyHI0UxQwFugMSOFIPJftfVAEoZLBbcLEFhlQiqGp1Vd140AUklUN3eCA51C1EWMzMCezCBBmkxVIVHBWd3HHl9JQOIJSdSnJ0TDKChCwUJjoWMPaGqDKannasMo6WnM562R5YluZRwur0wpgqZE7NKUm%2BFNRPIhjBJxKZteWuIBMN4zRMIVIhffcgojwCF117i4nlLnY5ztRLsnOk%2BaV%2BoJY7V7m76PdkS4trKcdg0Zc0tTcKkRAAAIfkECQoAAAAsAAAAACAAIAAABO4QyEkpKqjqzScpRaVkXZWQEximw1BSCUEIlDohrft6cpKCk5xid5MNJTaAIkekKGQkWyKHkvhKsR7ARmitkAYDYRIbUQRQjWBwJRzChi9CRlBcY1UN4g0%2FVNB0AlcvcAYHRyZPdEQFYV8ccwR5HWxEJ02YmRMLnJ1xCYp0Y5idpQuhopmmC2KgojKasUQDk5BNAwwMOh2RtRq5uQuPZKGIJQIGwAwGf6I0JXMpC8C7kXWDBINFMxS4DKMAWVWAGYsAdNqW5uaRxkSKJOZKaU3tPOBZ4DuK2LATgJhkPJMgTwKCdFjyPHEnKxFCDhEAACH5BAkKAAAALAAAAAAgACAAAATzEMhJaVKp6s2nIkolIJ2WkBShpkVRWqqQrhLSEu9MZJKK9y1ZrqYK9WiClmvoUaF8gIQSNeF1Er4MNFn4SRSDARWroAIETg1iVwuHjYB1kYc1mwruwXKC9gmsJXliGxc%2BXiUCby9ydh1sOSdMkpMTBpaXBzsfhoc5l58Gm5yToAaZhaOUqjkDgCWNHAULCwOLaTmzswadEqggQwgHuQsHIoZCHQMMQgQGubVEcxOPFAcMDAYUA85eWARmfSRQCdcMe0zeP1AAygwLlJtPNAAL19DARdPzBOWSm1brJBi45soRAWQAAkrQIykShQ9wVhHCwCQCACH5BAkKAAAALAAAAAAgACAAAATrEMhJaVKp6s2nIkqFZF2VIBWhUsJaTokqUCoBq%2BE71SRQeyqUToLA7VxF0JDyIQh%2FMVVPMt1ECZlfcjZJ9mIKoaTl1MRIl5o4CUKXOwmyrCInCKqcWtvadL2SYhyASyNDJ0uIiRMDjI0Fd30%2FiI2UA5GSS5UDj2l6NoqgOgN4gksEBgYFf0FDqKgHnyZ9OX8HrgYHdHpcHQULXAS2qKpENRg7eAMLC7kTBaixUYFkKAzWAAnLC7FLVxLWDBLKCwaKTULgEwbLA4hJtOkSBNqITT3xEgfLpBtzE%2FjiuL04RGEBgwWhShRgQExHBAAh%2BQQJCgAAACwAAAAAIAAgAAAE7xDISWlSqerNpyJKhWRdlSAVoVLCWk6JKlAqAavhO9UkUHsqlE6CwO1cRdCQ8iEIfzFVTzLdRAmZX3I2SfZiCqGk5dTESJeaOAlClzsJsqwiJwiqnFrb2nS9kmIcgEsjQydLiIlHehhpejaIjzh9eomSjZR%2BipslWIRLAgMDOR2DOqKogTB9pCUJBagDBXR6XB0EBkIIsaRsGGMMAxoDBgYHTKJiUYEGDAzHC9EACcUGkIgFzgwZ0QsSBcXHiQvOwgDdEwfFs0sDzt4S6BK4xYjkDOzn0unFeBzOBijIm1Dgmg5YFQwsCMjp1oJ8LyIAACH5BAkKAAAALAAAAAAgACAAAATwEMhJaVKp6s2nIkqFZF2VIBWhUsJaTokqUCoBq%2BE71SRQeyqUToLA7VxF0JDyIQh%2FMVVPMt1ECZlfcjZJ9mIKoaTl1MRIl5o4CUKXOwmyrCInCKqcWtvadL2SYhyASyNDJ0uIiUd6GGl6NoiPOH16iZKNlH6KmyWFOggHhEEvAwwMA0N9GBsEC6amhnVcEwavDAazGwIDaH1ipaYLBUTCGgQDA8NdHz0FpqgTBwsLqAbWAAnIA4FWKdMLGdYGEgraigbT0OITBcg5QwPT4xLrROZL6AuQAPUS7bxLpoWidY0JtxLHKhwwMJBTHgPKdEQAACH5BAkKAAAALAAAAAAgACAAAATrEMhJaVKp6s2nIkqFZF2VIBWhUsJaTokqUCoBq%2BE71SRQeyqUToLA7VxF0JDyIQh%2FMVVPMt1ECZlfcjZJ9mIKoaTl1MRIl5o4CUKXOwmyrCInCKqcWtvadL2SYhyASyNDJ0uIiUd6GAULDJCRiXo1CpGXDJOUjY%2BYip9DhToJA4RBLwMLCwVDfRgbBAaqqoZ1XBMHswsHtxtFaH1iqaoGNgAIxRpbFAgfPQSqpbgGBqUD1wBXeCYp1AYZ19JJOYgH1KwA4UBvQwXUBxPqVD9L3sbp2BNk2xvvFPJd%2BMFCN6HAAIKgNggY0KtEBAAh%2BQQJCgAAACwAAAAAIAAgAAAE6BDISWlSqerNpyJKhWRdlSAVoVLCWk6JKlAqAavhO9UkUHsqlE6CwO1cRdCQ8iEIfzFVTzLdRAmZX3I2SfYIDMaAFdTESJeaEDAIMxYFqrOUaNW4E4ObYcCXaiBVEgULe0NJaxxtYksjh2NLkZISgDgJhHthkpU4mW6blRiYmZOlh4JWkDqILwUGBnE6TYEbCgevr0N1gH4At7gHiRpFaLNrrq8HNgAJA70AWxQIH1%2BvsYMDAzZQPC9VCNkDWUhGkuE5PxJNwiUK4UfLzOlD4WvzAHaoG9nxPi5d%2BjYUqfAhhykOFwJWiAAAIfkECQoAAAAsAAAAACAAIAAABPAQyElpUqnqzaciSoVkXVUMFaFSwlpOCcMYlErAavhOMnNLNo8KsZsMZItJEIDIFSkLGQoQTNhIsFehRww2CQLKF0tYGKYSg%2BygsZIuNqJksKgbfgIGepNo2cIUB3V1B3IvNiBYNQaDSTtfhhx0CwVPI0UJe0%2Bbm4g5VgcGoqOcnjmjqDSdnhgEoamcsZuXO1aWQy8KAwOAuTYYGwi7w5h%2BKr0SJ8MFihpNbx%2B4Erq7BYBuzsdiH1jCAzoSfl0rVirNbRXlBBlLX%2BBP0XJLAPGzTkAuAOqb0WT5AH7OcdCm5B8TgRwSRKIHQtaLCwg1RAAAOwAAAAAAAAAAAA%3D%3D); visibility: visible; opacity: 0.6; - transition: all 0.3s ease; } + -webkit-transition: all 0.3s ease; + transition: all 0.3s ease; } .reveal .overlay header { position: absolute; @@ -1058,7 +1189,8 @@ html:-moz-full-screen-ancestor { border: 0; opacity: 0; visibility: hidden; - transition: all 0.3s ease; } + -webkit-transition: all 0.3s ease; + transition: all 0.3s ease; } .reveal .overlay.overlay-preview.loaded .viewport iframe { opacity: 1; @@ -1067,7 +1199,9 @@ html:-moz-full-screen-ancestor { .reveal .overlay.overlay-preview.loaded .spinner { opacity: 0; visibility: hidden; - transform: scale(0.2); } + -webkit-transform: scale(0.2); + -ms-transform: scale(0.2); + transform: scale(0.2); } .reveal .overlay.overlay-help .viewport { overflow: auto; @@ -1108,7 +1242,8 @@ html:-moz-full-screen-ancestor { bottom: 20px; z-index: 30; cursor: pointer; - transition: all 400ms ease; } + -webkit-transition: all 400ms ease; + transition: all 400ms ease; } .reveal.overview .playback { opacity: 0; @@ -1122,8 +1257,10 @@ html:-moz-full-screen-ancestor { line-height: 1.2; overflow: hidden; vertical-align: top; - perspective: 400px; - perspective-origin: 50% 50%; } + -webkit-perspective: 400px; + perspective: 400px; + -webkit-perspective-origin: 50% 50%; + perspective-origin: 50% 50%; } .reveal .roll:hover { background: none; @@ -1134,14 +1271,20 @@ html:-moz-full-screen-ancestor { position: relative; padding: 0 2px; pointer-events: none; - transition: all 400ms ease; - transform-origin: 50% 0%; - transform-style: preserve-3d; - backface-visibility: hidden; } + -webkit-transition: all 400ms ease; + transition: all 400ms ease; + -webkit-transform-origin: 50% 0%; + -ms-transform-origin: 50% 0%; + transform-origin: 50% 0%; + -webkit-transform-style: preserve-3d; + transform-style: preserve-3d; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; } .reveal .roll:hover span { background: rgba(0, 0, 0, 0.5); - transform: translate3d(0px, 0px, -45px) rotateX(90deg); } + -webkit-transform: translate3d(0px, 0px, -45px) rotateX(90deg); + transform: translate3d(0px, 0px, -45px) rotateX(90deg); } .reveal .roll span:after { content: attr(data-title); @@ -1150,9 +1293,13 @@ html:-moz-full-screen-ancestor { left: 0; top: 0; padding: 0 2px; - backface-visibility: hidden; - transform-origin: 50% 0%; - transform: translate3d(0px, 110%, 0px) rotateX(-90deg); } + -webkit-backface-visibility: hidden; + backface-visibility: hidden; + -webkit-transform-origin: 50% 0%; + -ms-transform-origin: 50% 0%; + transform-origin: 50% 0%; + -webkit-transform: translate3d(0px, 110%, 0px) rotateX(-90deg); + transform: translate3d(0px, 110%, 0px) rotateX(-90deg); } /********************************************* * SPEAKER NOTES @@ -1185,17 +1332,20 @@ html:-moz-full-screen-ancestor { @media screen and (max-width: 1024px) { .reveal .speaker-notes { font-size: 14px; } } + @media screen and (max-width: 600px) { .reveal .speaker-notes { width: 90%; left: 5%; } } + /********************************************* * ZOOM PLUGIN *********************************************/ .zoomed .reveal *, .zoomed .reveal *:before, .zoomed .reveal *:after { - backface-visibility: visible !important; } + -webkit-backface-visibility: visible !important; + backface-visibility: visible !important; } .zoomed .reveal .progress, .zoomed .reveal .controls { diff --git a/css/reveal.scss b/css/reveal.scss index 1cea73e..7525b2a 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -138,50 +138,34 @@ html:-moz-full-screen-ancestor { } .reveal .slides section .fragment.fade-up { - opacity: 0; transform: translate(0, 20%); - visibility: hidden; &.visible { - opacity: 1; transform: translate(0, 0); - visibility: visible; } } .reveal .slides section .fragment.fade-down { - opacity: 0; transform: translate(0, -20%); - visibility: hidden; &.visible { - opacity: 1; transform: translate(0, 0); - visibility: visible; } } .reveal .slides section .fragment.fade-right { - opacity: 0; transform: translate(-20%, 0); - visibility: hidden; &.visible { - opacity: 1; transform: translate(0, 0); - visibility: visible; } } .reveal .slides section .fragment.fade-left { - opacity: 0; transform: translate(20%, 0); - visibility: hidden; &.visible { - opacity: 1; transform: translate(0, 0); - visibility: visible; } } From de4406f26ce506944b2b629890bba9e091468e05 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micha=C5=82=20Zaj=C4=85c?= Date: Mon, 30 Nov 2015 10:46:21 +0100 Subject: [PATCH 018/228] Chromium users need to check Background graphics option when printing. --- README.md | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 52dcd22..38f53e8 100644 --- a/README.md +++ b/README.md @@ -708,7 +708,8 @@ Here's an example of an exported presentation that's been uploaded to SlideShare 3. Change the **Destination** setting to **Save as PDF**. 4. Change the **Layout** to **Landscape**. 5. Change the **Margins** to **None**. -6. Click **Save**. +6. (Under Chromium) In **Options** check **Background graphics**. +7. Click **Save**. ![Chrome Print Settings](https://s3.amazonaws.com/hakim-static/reveal-js/pdf-print-settings.png) From 07affa27509e78f9b7447371ed143f9510f87dfd Mon Sep 17 00:00:00 2001 From: Bo-Yi Wu Date: Tue, 8 Dec 2015 14:14:42 +0800 Subject: [PATCH 019/228] remove redundant spaces. --- package.json | 1 - 1 file changed, 1 deletion(-) diff --git a/package.json b/package.json index 15c84d0..7f058f3 100644 --- a/package.json +++ b/package.json @@ -40,6 +40,5 @@ "grunt": "~0.4.5", "node-sass": "~3.3.3" }, - "license": "MIT" } From 5abf5001a8ccde91fddcab8794dce23441143545 Mon Sep 17 00:00:00 2001 From: Bjoern Kimminich Date: Mon, 21 Dec 2015 23:02:57 +0100 Subject: [PATCH 020/228] ignoring IntelliJ IDEA files --- .gitignore | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/.gitignore b/.gitignore index a5df313..e7b4f21 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,8 @@ +.idea/ +*.iml +*.iws +*.eml +out/ .DS_Store .svn log/*.log @@ -5,4 +10,4 @@ tmp/** node_modules/ .sass-cache css/reveal.min.css -js/reveal.min.js +js/reveal.min.js \ No newline at end of file From de4efa5d194329095f90911101a67c5b5e13922f Mon Sep 17 00:00:00 2001 From: Bjoern Kimminich Date: Mon, 21 Dec 2015 23:17:53 +0100 Subject: [PATCH 021/228] updated to mustache 2.2.1 prevents XSS vulnerability (see https://github.com/janl/mustache.js/pull/388) --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 15c84d0..f7035aa 100644 --- a/package.json +++ b/package.json @@ -24,7 +24,7 @@ "dependencies": { "underscore": "~1.8.3", "express": "~4.13.3", - "mustache": "~2.1.3", + "mustache": "~2.2.1", "socket.io": "~1.3.7" }, "devDependencies": { From 5da75aef01a16f694632c377d47d6d0518fbb8c5 Mon Sep 17 00:00:00 2001 From: Ian Smith Date: Sun, 27 Dec 2015 12:35:13 -0600 Subject: [PATCH 022/228] Fix spelling error in print-pdf plugin --- plugin/print-pdf/print-pdf.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugin/print-pdf/print-pdf.js b/plugin/print-pdf/print-pdf.js index 86dc4df..38a698d 100644 --- a/plugin/print-pdf/print-pdf.js +++ b/plugin/print-pdf/print-pdf.js @@ -40,7 +40,7 @@ console.log( 'Printing PDF (Paper size: '+ page.paperSize.width + 'x' + page.pap page.open( inputFile, function( status ) { window.setTimeout( function() { - console.log( 'Printed succesfully' ); + console.log( 'Printed successfully' ); page.render( outputFile ); phantom.exit(); }, 1000 ); From 18b644cf8f1ae04b16f962655b99cb786f08ef2c Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Mon, 4 Jan 2016 09:29:55 +0100 Subject: [PATCH 023/228] :copyright: :copyright: :copyright: :copyright: :copyright: closes #1469 --- Gruntfile.js | 2 +- LICENSE | 2 +- README.md | 2 +- css/reveal.css | 2 +- css/reveal.scss | 2 +- css/theme/black.css | 2 +- css/theme/source/black.scss | 2 +- css/theme/source/white.scss | 2 +- css/theme/white.css | 2 +- js/reveal.js | 2 +- 10 files changed, 10 insertions(+), 10 deletions(-) diff --git a/Gruntfile.js b/Gruntfile.js index f6c71e2..675adff 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -13,7 +13,7 @@ module.exports = function(grunt) { ' * http://lab.hakim.se/reveal-js\n' + ' * MIT licensed\n' + ' *\n' + - ' * Copyright (C) 2015 Hakim El Hattab, http://hakim.se\n' + + ' * Copyright (C) 2016 Hakim El Hattab, http://hakim.se\n' + ' */' }, diff --git a/LICENSE b/LICENSE index 0962307..faadd00 100644 --- a/LICENSE +++ b/LICENSE @@ -1,4 +1,4 @@ -Copyright (C) 2015 Hakim El Hattab, http://hakim.se +Copyright (C) 2016 Hakim El Hattab, http://hakim.se Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal diff --git a/README.md b/README.md index 52dcd22..e7857cc 100644 --- a/README.md +++ b/README.md @@ -1016,4 +1016,4 @@ Some reveal.js features, like external Markdown and speaker notes, require that MIT licensed -Copyright (C) 2015 Hakim El Hattab, http://hakim.se +Copyright (C) 2016 Hakim El Hattab, http://hakim.se diff --git a/css/reveal.css b/css/reveal.css index 2f115e5..9739291 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -3,7 +3,7 @@ * http://lab.hakim.se/reveal-js * MIT licensed * - * Copyright (C) 2015 Hakim El Hattab, http://hakim.se + * Copyright (C) 2016 Hakim El Hattab, http://hakim.se */ /********************************************* * RESET STYLES diff --git a/css/reveal.scss b/css/reveal.scss index d932269..eb600ac 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -3,7 +3,7 @@ * http://lab.hakim.se/reveal-js * MIT licensed * - * Copyright (C) 2015 Hakim El Hattab, http://hakim.se + * Copyright (C) 2016 Hakim El Hattab, http://hakim.se */ diff --git a/css/theme/black.css b/css/theme/black.css index 54d44c3..deccc46 100644 --- a/css/theme/black.css +++ b/css/theme/black.css @@ -1,7 +1,7 @@ /** * Black theme for reveal.js. This is the opposite of the 'white' theme. * - * Copyright (C) 2015 Hakim El Hattab, http://hakim.se + * By Hakim El Hattab, http://hakim.se */ @import url(../../lib/font/source-sans-pro/source-sans-pro.css); section.has-light-background, section.has-light-background h1, section.has-light-background h2, section.has-light-background h3, section.has-light-background h4, section.has-light-background h5, section.has-light-background h6 { diff --git a/css/theme/source/black.scss b/css/theme/source/black.scss index 73dfecb..5f7f601 100644 --- a/css/theme/source/black.scss +++ b/css/theme/source/black.scss @@ -1,7 +1,7 @@ /** * Black theme for reveal.js. This is the opposite of the 'white' theme. * - * Copyright (C) 2015 Hakim El Hattab, http://hakim.se + * By Hakim El Hattab, http://hakim.se */ diff --git a/css/theme/source/white.scss b/css/theme/source/white.scss index 4c5b647..6758ce0 100644 --- a/css/theme/source/white.scss +++ b/css/theme/source/white.scss @@ -1,7 +1,7 @@ /** * White theme for reveal.js. This is the opposite of the 'black' theme. * - * Copyright (C) 2015 Hakim El Hattab, http://hakim.se + * By Hakim El Hattab, http://hakim.se */ diff --git a/css/theme/white.css b/css/theme/white.css index a05cd85..14e1703 100644 --- a/css/theme/white.css +++ b/css/theme/white.css @@ -1,7 +1,7 @@ /** * White theme for reveal.js. This is the opposite of the 'black' theme. * - * Copyright (C) 2015 Hakim El Hattab, http://hakim.se + * By Hakim El Hattab, http://hakim.se */ @import url(../../lib/font/source-sans-pro/source-sans-pro.css); section.has-dark-background, section.has-dark-background h1, section.has-dark-background h2, section.has-dark-background h3, section.has-dark-background h4, section.has-dark-background h5, section.has-dark-background h6 { diff --git a/js/reveal.js b/js/reveal.js index 164996d..2c92954 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -3,7 +3,7 @@ * http://lab.hakim.se/reveal-js * MIT licensed * - * Copyright (C) 2015 Hakim El Hattab, http://hakim.se + * Copyright (C) 2016 Hakim El Hattab, http://hakim.se */ (function( root, factory ) { if( typeof define === 'function' && define.amd ) { From 4881281ea11f2ecdd927cc8c0c262ddff7354ca3 Mon Sep 17 00:00:00 2001 From: Victor Powell Date: Wed, 6 Jan 2016 13:01:58 -0800 Subject: [PATCH 024/228] Add the grunt-cli as a dependency instead of assuming global grunt. --- package.json | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 7f058f3..fd8e36c 100644 --- a/package.json +++ b/package.json @@ -22,10 +22,11 @@ "node": "~4.1.1" }, "dependencies": { - "underscore": "~1.8.3", "express": "~4.13.3", + "grunt-cli": "^0.1.13", "mustache": "~2.1.3", - "socket.io": "~1.3.7" + "socket.io": "~1.3.7", + "underscore": "~1.8.3" }, "devDependencies": { "grunt-contrib-qunit": "~0.7.0", From b7644a3bf7ac586900012904860f239bc3c6f7f5 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Fri, 8 Jan 2016 10:26:41 +0100 Subject: [PATCH 025/228] expose version number through #1451 --- js/reveal.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/js/reveal.js b/js/reveal.js index 398da41..9302f82 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -25,6 +25,9 @@ var Reveal; + // The reveal.js version + var VERSION = '3.2.0'; + var SLIDES_SELECTOR = '.slides section', HORIZONTAL_SLIDES_SELECTOR = '.slides>section', VERTICAL_SLIDES_SELECTOR = '.slides>section.present>section', @@ -4526,6 +4529,8 @@ Reveal = { + VERSION: VERSION, + initialize: initialize, configure: configure, sync: sync, From 2a8646543476bf39475606aa9d5aef622675f302 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Fri, 8 Jan 2016 10:35:25 +0100 Subject: [PATCH 026/228] tweak to pdf print isntructions --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 0fa8e76..87988ef 100644 --- a/README.md +++ b/README.md @@ -708,10 +708,10 @@ Here's an example of an exported presentation that's been uploaded to SlideShare 3. Change the **Destination** setting to **Save as PDF**. 4. Change the **Layout** to **Landscape**. 5. Change the **Margins** to **None**. -6. (Under Chromium) In **Options** check **Background graphics**. +6. Enable the **Background graphics** option. 7. Click **Save**. -![Chrome Print Settings](https://s3.amazonaws.com/hakim-static/reveal-js/pdf-print-settings.png) +![Chrome Print Settings](https://s3.amazonaws.com/hakim-static/reveal-js/pdf-print-settings-2.png) Alternatively you can use the [decktape](https://github.com/astefanutti/decktape) project. From ee877845d8c1c03b55d218f0f28b352c52ccba6e Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Fri, 8 Jan 2016 10:41:20 +0100 Subject: [PATCH 027/228] add new fragment styles to readme #1445 --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index db48102..79c5755 100644 --- a/README.md +++ b/README.md @@ -550,6 +550,7 @@ The default fragment style is to start out invisible and fade in. This style can

    grow

    shrink

    fade-out

    +

    fade-up (also down, left and right!)

    visible only once

    blue only once

    highlight-red

    From 7621e1085d6389b214f244ac3e3ddb78c381d1c8 Mon Sep 17 00:00:00 2001 From: Bjoern Kimminich Date: Fri, 8 Jan 2016 10:46:28 +0100 Subject: [PATCH 028/228] added retire.js to build process -allows security vulnerability check in used npm-dependencies and own scripts -execute with ```grunt retire``` --- Gruntfile.js | 10 +++++++++- package.json | 3 ++- 2 files changed, 11 insertions(+), 2 deletions(-) diff --git a/Gruntfile.js b/Gruntfile.js index f6c71e2..11bd42b 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -134,7 +134,14 @@ module.exports = function(grunt) { markdown: { files: [ './*.md' ] } - } + }, + + retire: { + js: ['js/reveal.js', 'lib/js/*.js', 'plugin/**/*.js'], + node: ['.'], + options: { + } + } }); @@ -148,6 +155,7 @@ module.exports = function(grunt) { grunt.loadNpmTasks( 'grunt-contrib-connect' ); grunt.loadNpmTasks( 'grunt-autoprefixer' ); grunt.loadNpmTasks( 'grunt-zip' ); + grunt.loadNpmTasks('grunt-retire'); // Default task grunt.registerTask( 'default', [ 'css', 'js' ] ); diff --git a/package.json b/package.json index f7035aa..b75bb90 100644 --- a/package.json +++ b/package.json @@ -36,10 +36,11 @@ "grunt-sass": "~1.1.0-beta", "grunt-contrib-connect": "~0.11.2", "grunt-autoprefixer": "~3.0.3", + "grunt-retire": "~0.3.10", "grunt-zip": "~0.17.1", "grunt": "~0.4.5", "node-sass": "~3.3.3" }, - + "license": "MIT" } From 52aec94800dd092a81d3de0439f95a32cba8a8cf Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Fri, 8 Jan 2016 10:58:13 +0100 Subject: [PATCH 029/228] center help overlay with flexbox --- css/reveal.css | 44 ++++++++++++++++++++++++++++++++------------ css/reveal.scss | 9 +++++---- 2 files changed, 37 insertions(+), 16 deletions(-) diff --git a/css/reveal.css b/css/reveal.css index 4530584..fc16f5b 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -111,24 +111,40 @@ html:-moz-full-screen-ancestor { text-decoration: line-through; } .reveal .slides section .fragment.fade-up { - transform: translate(0, 20%); } + -webkit-transform: translate(0, 20%); + -ms-transform: translate(0, 20%); + transform: translate(0, 20%); } .reveal .slides section .fragment.fade-up.visible { - transform: translate(0, 0); } + -webkit-transform: translate(0, 0); + -ms-transform: translate(0, 0); + transform: translate(0, 0); } .reveal .slides section .fragment.fade-down { - transform: translate(0, -20%); } + -webkit-transform: translate(0, -20%); + -ms-transform: translate(0, -20%); + transform: translate(0, -20%); } .reveal .slides section .fragment.fade-down.visible { - transform: translate(0, 0); } + -webkit-transform: translate(0, 0); + -ms-transform: translate(0, 0); + transform: translate(0, 0); } .reveal .slides section .fragment.fade-right { - transform: translate(-20%, 0); } + -webkit-transform: translate(-20%, 0); + -ms-transform: translate(-20%, 0); + transform: translate(-20%, 0); } .reveal .slides section .fragment.fade-right.visible { - transform: translate(0, 0); } + -webkit-transform: translate(0, 0); + -ms-transform: translate(0, 0); + transform: translate(0, 0); } .reveal .slides section .fragment.fade-left { - transform: translate(20%, 0); } + -webkit-transform: translate(20%, 0); + -ms-transform: translate(20%, 0); + transform: translate(20%, 0); } .reveal .slides section .fragment.fade-left.visible { - transform: translate(0, 0); } + -webkit-transform: translate(0, 0); + -ms-transform: translate(0, 0); + transform: translate(0, 0); } .reveal .slides section .fragment.current-visible { opacity: 0; @@ -1176,6 +1192,10 @@ html:-moz-full-screen-ancestor { .reveal .overlay .viewport { position: absolute; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; top: 40px; right: 0; bottom: 0; @@ -1209,8 +1229,8 @@ html:-moz-full-screen-ancestor { .reveal .overlay.overlay-help .viewport .viewport-inner { width: 600px; - margin: 0 auto; - padding: 60px; + margin: auto; + padding: 20px 20px 80px 20px; text-align: center; letter-spacing: normal; } @@ -1220,12 +1240,12 @@ html:-moz-full-screen-ancestor { .reveal .overlay.overlay-help .viewport .viewport-inner table { border: 1px solid #fff; border-collapse: collapse; - font-size: 14px; } + font-size: 16px; } .reveal .overlay.overlay-help .viewport .viewport-inner table th, .reveal .overlay.overlay-help .viewport .viewport-inner table td { width: 200px; - padding: 10px; + padding: 14px; border: 1px solid #fff; vertical-align: middle; } diff --git a/css/reveal.scss b/css/reveal.scss index 5a66671..da1fb22 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -1204,6 +1204,7 @@ html:-moz-full-screen-ancestor { .reveal .overlay .viewport { position: absolute; + display: flex; top: 40px; right: 0; bottom: 0; @@ -1240,8 +1241,8 @@ html:-moz-full-screen-ancestor { .reveal .overlay.overlay-help .viewport .viewport-inner { width: 600px; - margin: 0 auto; - padding: 60px; + margin: auto; + padding: 20px 20px 80px 20px; text-align: center; letter-spacing: normal; } @@ -1253,13 +1254,13 @@ html:-moz-full-screen-ancestor { .reveal .overlay.overlay-help .viewport .viewport-inner table { border: 1px solid #fff; border-collapse: collapse; - font-size: 14px; + font-size: 16px; } .reveal .overlay.overlay-help .viewport .viewport-inner table th, .reveal .overlay.overlay-help .viewport .viewport-inner table td { width: 200px; - padding: 10px; + padding: 14px; border: 1px solid #fff; vertical-align: middle; } From 4ee6769e0f3a80e8609f5586163d5fb5d4e65eb9 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Fri, 8 Jan 2016 11:05:59 +0100 Subject: [PATCH 030/228] tweaked fragment examples --- index.html | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/index.html b/index.html index 0125d22..37b65e2 100644 --- a/index.html +++ b/index.html @@ -141,8 +141,7 @@

    fade-out

    fade-up (also down, left and right!)

    current-visible

    -

    highlight-red

    -

    highlight-blue

    +

    Highlight red blue green

    From 06cdd9b7cd62ffde1f8ebcc91b66ae45944718c7 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Fri, 8 Jan 2016 13:49:06 +0100 Subject: [PATCH 031/228] include speaker view keyboard shortcut when applicable #1466 --- js/reveal.js | 5 +++++ plugin/notes/notes.js | 3 +++ 2 files changed, 8 insertions(+) diff --git a/js/reveal.js b/js/reveal.js index 9302f82..c576c8c 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -4684,6 +4684,11 @@ // Programatically triggers a keyboard event triggerKey: function( keyCode ) { onDocumentKeyDown( { keyCode: keyCode } ); + }, + + // Registers a new shortcut to include in the help overlay + registerKeyboardShortcut: function( key, value ) { + keyboardShortcuts[key] = value; } }; diff --git a/plugin/notes/notes.js b/plugin/notes/notes.js index 202e73b..deb4891 100644 --- a/plugin/notes/notes.js +++ b/plugin/notes/notes.js @@ -120,6 +120,9 @@ var RevealNotes = (function() { } }, false ); + // Show our keyboard shortcut in the reveal.js help overlay + if( window.Reveal ) Reveal.registerKeyboardShortcut( 'S', 'Speaker notes view' ); + } return { open: openNotes }; From 8ec529d7675392f7732612cd0e6566f2b0c4fac1 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Fri, 8 Jan 2016 13:59:12 +0100 Subject: [PATCH 032/228] rebuild css --- css/reveal.css | 52 ++--------------------------------------- css/theme/beige.css | 12 +++++----- css/theme/black.css | 12 +++++----- css/theme/blood.css | 12 +++++----- css/theme/league.css | 12 +++++----- css/theme/moon.css | 12 +++++----- css/theme/night.css | 12 +++++----- css/theme/serif.css | 12 +++++----- css/theme/simple.css | 12 +++++----- css/theme/sky.css | 12 +++++----- css/theme/solarized.css | 12 +++++----- css/theme/white.css | 12 +++++----- 12 files changed, 68 insertions(+), 116 deletions(-) diff --git a/css/reveal.css b/css/reveal.css index fc16f5b..3a31fa4 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -59,8 +59,8 @@ html:-moz-full-screen-ancestor { .reveal .slides section .fragment { opacity: 0; visibility: hidden; - -webkit-transition: all 0.2s ease; - transition: all 0.2s ease; } + -webkit-transition: all .2s ease; + transition: all .2s ease; } .reveal .slides section .fragment.visible { opacity: 1; visibility: visible; } @@ -70,7 +70,6 @@ html:-moz-full-screen-ancestor { visibility: visible; } .reveal .slides section .fragment.grow.visible { -webkit-transform: scale(1.3); - -ms-transform: scale(1.3); transform: scale(1.3); } .reveal .slides section .fragment.shrink { @@ -78,16 +77,13 @@ html:-moz-full-screen-ancestor { visibility: visible; } .reveal .slides section .fragment.shrink.visible { -webkit-transform: scale(0.7); - -ms-transform: scale(0.7); transform: scale(0.7); } .reveal .slides section .fragment.zoom-in { -webkit-transform: scale(0.1); - -ms-transform: scale(0.1); transform: scale(0.1); } .reveal .slides section .fragment.zoom-in.visible { -webkit-transform: none; - -ms-transform: none; transform: none; } .reveal .slides section .fragment.fade-out { @@ -112,38 +108,30 @@ html:-moz-full-screen-ancestor { .reveal .slides section .fragment.fade-up { -webkit-transform: translate(0, 20%); - -ms-transform: translate(0, 20%); transform: translate(0, 20%); } .reveal .slides section .fragment.fade-up.visible { -webkit-transform: translate(0, 0); - -ms-transform: translate(0, 0); transform: translate(0, 0); } .reveal .slides section .fragment.fade-down { -webkit-transform: translate(0, -20%); - -ms-transform: translate(0, -20%); transform: translate(0, -20%); } .reveal .slides section .fragment.fade-down.visible { -webkit-transform: translate(0, 0); - -ms-transform: translate(0, 0); transform: translate(0, 0); } .reveal .slides section .fragment.fade-right { -webkit-transform: translate(-20%, 0); - -ms-transform: translate(-20%, 0); transform: translate(-20%, 0); } .reveal .slides section .fragment.fade-right.visible { -webkit-transform: translate(0, 0); - -ms-transform: translate(0, 0); transform: translate(0, 0); } .reveal .slides section .fragment.fade-left { -webkit-transform: translate(20%, 0); - -ms-transform: translate(20%, 0); transform: translate(20%, 0); } .reveal .slides section .fragment.fade-left.visible { -webkit-transform: translate(0, 0); - -ms-transform: translate(0, 0); transform: translate(0, 0); } .reveal .slides section .fragment.current-visible { @@ -226,7 +214,6 @@ html:-moz-full-screen-ancestor { background-color: transparent; border: 12px solid transparent; -webkit-transform: scale(0.9999); - -ms-transform: scale(0.9999); transform: scale(0.9999); -webkit-transition: all 0.2s ease; transition: all 0.2s ease; @@ -363,7 +350,6 @@ html:-moz-full-screen-ancestor { -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transition: -webkit-transform-origin 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), -webkit-transform 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), visibility 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), opacity 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); - transition: -ms-transform-origin 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), transform 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), visibility 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), opacity 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); transition: transform-origin 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), transform 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), visibility 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985), opacity 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } /* Global transition speed settings */ @@ -431,28 +417,24 @@ html:-moz-full-screen-ancestor { .reveal .slides > section[data-transition~=slide-out].past, .reveal.slide .slides > section:not([data-transition]).past { -webkit-transform: translate(-150%, 0); - -ms-transform: translate(-150%, 0); transform: translate(-150%, 0); } .reveal .slides > section[data-transition=slide].future, .reveal .slides > section[data-transition~=slide-in].future, .reveal.slide .slides > section:not([data-transition]).future { -webkit-transform: translate(150%, 0); - -ms-transform: translate(150%, 0); transform: translate(150%, 0); } .reveal .slides > section > section[data-transition=slide].past, .reveal .slides > section > section[data-transition~=slide-out].past, .reveal.slide .slides > section > section:not([data-transition]).past { -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); transform: translate(0, -150%); } .reveal .slides > section > section[data-transition=slide].future, .reveal .slides > section > section[data-transition~=slide-in].future, .reveal.slide .slides > section > section:not([data-transition]).future { -webkit-transform: translate(0, 150%); - -ms-transform: translate(0, 150%); transform: translate(0, 150%); } .reveal.linear section { @@ -463,28 +445,24 @@ html:-moz-full-screen-ancestor { .reveal .slides > section[data-transition~=linear-out].past, .reveal.linear .slides > section:not([data-transition]).past { -webkit-transform: translate(-150%, 0); - -ms-transform: translate(-150%, 0); transform: translate(-150%, 0); } .reveal .slides > section[data-transition=linear].future, .reveal .slides > section[data-transition~=linear-in].future, .reveal.linear .slides > section:not([data-transition]).future { -webkit-transform: translate(150%, 0); - -ms-transform: translate(150%, 0); transform: translate(150%, 0); } .reveal .slides > section > section[data-transition=linear].past, .reveal .slides > section > section[data-transition~=linear-out].past, .reveal.linear .slides > section > section:not([data-transition]).past { -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); transform: translate(0, -150%); } .reveal .slides > section > section[data-transition=linear].future, .reveal .slides > section > section[data-transition~=linear-in].future, .reveal.linear .slides > section > section:not([data-transition]).future { -webkit-transform: translate(0, 150%); - -ms-transform: translate(0, 150%); transform: translate(0, 150%); } /********************************************* @@ -579,7 +557,6 @@ html:-moz-full-screen-ancestor { .reveal.zoom .slides > section:not([data-transition]).past { visibility: hidden; -webkit-transform: scale(16); - -ms-transform: scale(16); transform: scale(16); } .reveal .slides > section[data-transition=zoom].future, @@ -587,21 +564,18 @@ html:-moz-full-screen-ancestor { .reveal.zoom .slides > section:not([data-transition]).future { visibility: hidden; -webkit-transform: scale(0.2); - -ms-transform: scale(0.2); transform: scale(0.2); } .reveal .slides > section > section[data-transition=zoom].past, .reveal .slides > section > section[data-transition~=zoom-out].past, .reveal.zoom .slides > section > section:not([data-transition]).past { -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); transform: translate(0, -150%); } .reveal .slides > section > section[data-transition=zoom].future, .reveal .slides > section > section[data-transition~=zoom-in].future, .reveal.zoom .slides > section > section:not([data-transition]).future { -webkit-transform: translate(0, 150%); - -ms-transform: translate(0, 150%); transform: translate(0, 150%); } /********************************************* @@ -655,28 +629,24 @@ html:-moz-full-screen-ancestor { .reveal.cube .slides > section.past { -webkit-transform-origin: 100% 0%; - -ms-transform-origin: 100% 0%; transform-origin: 100% 0%; -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg); transform: translate3d(-100%, 0, 0) rotateY(-90deg); } .reveal.cube .slides > section.future { -webkit-transform-origin: 0% 0%; - -ms-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: translate3d(100%, 0, 0) rotateY(90deg); transform: translate3d(100%, 0, 0) rotateY(90deg); } .reveal.cube .slides > section > section.past { -webkit-transform-origin: 0% 100%; - -ms-transform-origin: 0% 100%; transform-origin: 0% 100%; -webkit-transform: translate3d(0, -100%, 0) rotateX(90deg); transform: translate3d(0, -100%, 0) rotateX(90deg); } .reveal.cube .slides > section > section.future { -webkit-transform-origin: 0% 0%; - -ms-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: translate3d(0, 100%, 0) rotateX(-90deg); transform: translate3d(0, 100%, 0) rotateX(-90deg); } @@ -730,28 +700,24 @@ html:-moz-full-screen-ancestor { .reveal.page .slides > section.past { -webkit-transform-origin: 0% 0%; - -ms-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: translate3d(-40%, 0, 0) rotateY(-80deg); transform: translate3d(-40%, 0, 0) rotateY(-80deg); } .reveal.page .slides > section.future { -webkit-transform-origin: 100% 0%; - -ms-transform-origin: 100% 0%; transform-origin: 100% 0%; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .reveal.page .slides > section > section.past { -webkit-transform-origin: 0% 0%; - -ms-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: translate3d(0, -40%, 0) rotateX(80deg); transform: translate3d(0, -40%, 0) rotateX(80deg); } .reveal.page .slides > section > section.future { -webkit-transform-origin: 0% 100%; - -ms-transform-origin: 0% 100%; transform-origin: 0% 100%; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } @@ -763,7 +729,6 @@ html:-moz-full-screen-ancestor { .reveal.fade .slides section:not([data-transition]), .reveal.fade .slides > section > section:not([data-transition]) { -webkit-transform: none; - -ms-transform: none; transform: none; -webkit-transition: opacity 0.5s; transition: opacity 0.5s; } @@ -779,7 +744,6 @@ html:-moz-full-screen-ancestor { .reveal .slides section[data-transition=none], .reveal.none .slides section:not([data-transition]) { -webkit-transform: none; - -ms-transform: none; transform: none; -webkit-transition: none; transition: none; } @@ -833,7 +797,6 @@ html:-moz-full-screen-ancestor { left: -50%; margin: 70px 0; -webkit-transform: none; - -ms-transform: none; transform: none; } .no-transforms .reveal .slides section section { @@ -907,25 +870,21 @@ html:-moz-full-screen-ancestor { .reveal[data-background-transition=slide] > .backgrounds .slide-background.past, .reveal > .backgrounds .slide-background.past[data-background-transition=slide] { -webkit-transform: translate(-100%, 0); - -ms-transform: translate(-100%, 0); transform: translate(-100%, 0); } .reveal[data-background-transition=slide] > .backgrounds .slide-background.future, .reveal > .backgrounds .slide-background.future[data-background-transition=slide] { -webkit-transform: translate(100%, 0); - -ms-transform: translate(100%, 0); transform: translate(100%, 0); } .reveal[data-background-transition=slide] > .backgrounds .slide-background > .slide-background.past, .reveal > .backgrounds .slide-background > .slide-background.past[data-background-transition=slide] { -webkit-transform: translate(0, -100%); - -ms-transform: translate(0, -100%); transform: translate(0, -100%); } .reveal[data-background-transition=slide] > .backgrounds .slide-background > .slide-background.future, .reveal > .backgrounds .slide-background > .slide-background.future[data-background-transition=slide] { -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); transform: translate(0, 100%); } /* Convex */ @@ -989,7 +948,6 @@ html:-moz-full-screen-ancestor { opacity: 0; visibility: hidden; -webkit-transform: scale(16); - -ms-transform: scale(16); transform: scale(16); } .reveal[data-background-transition=zoom] > .backgrounds .slide-background.future, @@ -997,7 +955,6 @@ html:-moz-full-screen-ancestor { opacity: 0; visibility: hidden; -webkit-transform: scale(0.2); - -ms-transform: scale(0.2); transform: scale(0.2); } .reveal[data-background-transition=zoom] > .backgrounds .slide-background > .slide-background.past, @@ -1005,7 +962,6 @@ html:-moz-full-screen-ancestor { opacity: 0; visibility: hidden; -webkit-transform: scale(16); - -ms-transform: scale(16); transform: scale(16); } .reveal[data-background-transition=zoom] > .backgrounds .slide-background > .slide-background.future, @@ -1013,7 +969,6 @@ html:-moz-full-screen-ancestor { opacity: 0; visibility: hidden; -webkit-transform: scale(0.2); - -ms-transform: scale(0.2); transform: scale(0.2); } /* Global transition speed settings */ @@ -1220,7 +1175,6 @@ html:-moz-full-screen-ancestor { opacity: 0; visibility: hidden; -webkit-transform: scale(0.2); - -ms-transform: scale(0.2); transform: scale(0.2); } .reveal .overlay.overlay-help .viewport { @@ -1294,7 +1248,6 @@ html:-moz-full-screen-ancestor { -webkit-transition: all 400ms ease; transition: all 400ms ease; -webkit-transform-origin: 50% 0%; - -ms-transform-origin: 50% 0%; transform-origin: 50% 0%; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; @@ -1316,7 +1269,6 @@ html:-moz-full-screen-ancestor { -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform-origin: 50% 0%; - -ms-transform-origin: 50% 0%; transform-origin: 50% 0%; -webkit-transform: translate3d(0px, 110%, 0px) rotateX(-90deg); transform: translate3d(0px, 110%, 0px) rotateX(-90deg); } diff --git a/css/theme/beige.css b/css/theme/beige.css index be18733..9d29bd5 100644 --- a/css/theme/beige.css +++ b/css/theme/beige.css @@ -210,9 +210,9 @@ body { .reveal a { color: #8b743d; text-decoration: none; - -webkit-transition: color 0.15s ease; - -moz-transition: color 0.15s ease; - transition: color 0.15s ease; } + -webkit-transition: color .15s ease; + -moz-transition: color .15s ease; + transition: color .15s ease; } .reveal a:hover { color: #c0a86e; @@ -237,9 +237,9 @@ body { box-shadow: none; } .reveal a img { - -webkit-transition: all 0.15s linear; - -moz-transition: all 0.15s linear; - transition: all 0.15s linear; } + -webkit-transition: all .15s linear; + -moz-transition: all .15s linear; + transition: all .15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); diff --git a/css/theme/black.css b/css/theme/black.css index deccc46..f0a265f 100644 --- a/css/theme/black.css +++ b/css/theme/black.css @@ -206,9 +206,9 @@ body { .reveal a { color: #42affa; text-decoration: none; - -webkit-transition: color 0.15s ease; - -moz-transition: color 0.15s ease; - transition: color 0.15s ease; } + -webkit-transition: color .15s ease; + -moz-transition: color .15s ease; + transition: color .15s ease; } .reveal a:hover { color: #8dcffc; @@ -233,9 +233,9 @@ body { box-shadow: none; } .reveal a img { - -webkit-transition: all 0.15s linear; - -moz-transition: all 0.15s linear; - transition: all 0.15s linear; } + -webkit-transition: all .15s linear; + -moz-transition: all .15s linear; + transition: all .15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); diff --git a/css/theme/blood.css b/css/theme/blood.css index e035ab6..0d44848 100644 --- a/css/theme/blood.css +++ b/css/theme/blood.css @@ -209,9 +209,9 @@ body { .reveal a { color: #a23; text-decoration: none; - -webkit-transition: color 0.15s ease; - -moz-transition: color 0.15s ease; - transition: color 0.15s ease; } + -webkit-transition: color .15s ease; + -moz-transition: color .15s ease; + transition: color .15s ease; } .reveal a:hover { color: #dd5566; @@ -236,9 +236,9 @@ body { box-shadow: none; } .reveal a img { - -webkit-transition: all 0.15s linear; - -moz-transition: all 0.15s linear; - transition: all 0.15s linear; } + -webkit-transition: all .15s linear; + -moz-transition: all .15s linear; + transition: all .15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); diff --git a/css/theme/league.css b/css/theme/league.css index fa9f53c..1f7ad4c 100644 --- a/css/theme/league.css +++ b/css/theme/league.css @@ -212,9 +212,9 @@ body { .reveal a { color: #13DAEC; text-decoration: none; - -webkit-transition: color 0.15s ease; - -moz-transition: color 0.15s ease; - transition: color 0.15s ease; } + -webkit-transition: color .15s ease; + -moz-transition: color .15s ease; + transition: color .15s ease; } .reveal a:hover { color: #71e9f4; @@ -239,9 +239,9 @@ body { box-shadow: none; } .reveal a img { - -webkit-transition: all 0.15s linear; - -moz-transition: all 0.15s linear; - transition: all 0.15s linear; } + -webkit-transition: all .15s linear; + -moz-transition: all .15s linear; + transition: all .15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); diff --git a/css/theme/moon.css b/css/theme/moon.css index b119576..4e5532a 100644 --- a/css/theme/moon.css +++ b/css/theme/moon.css @@ -210,9 +210,9 @@ body { .reveal a { color: #268bd2; text-decoration: none; - -webkit-transition: color 0.15s ease; - -moz-transition: color 0.15s ease; - transition: color 0.15s ease; } + -webkit-transition: color .15s ease; + -moz-transition: color .15s ease; + transition: color .15s ease; } .reveal a:hover { color: #78b9e6; @@ -237,9 +237,9 @@ body { box-shadow: none; } .reveal a img { - -webkit-transition: all 0.15s linear; - -moz-transition: all 0.15s linear; - transition: all 0.15s linear; } + -webkit-transition: all .15s linear; + -moz-transition: all .15s linear; + transition: all .15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); diff --git a/css/theme/night.css b/css/theme/night.css index 3d0e3c5..d2fc296 100644 --- a/css/theme/night.css +++ b/css/theme/night.css @@ -204,9 +204,9 @@ body { .reveal a { color: #e7ad52; text-decoration: none; - -webkit-transition: color 0.15s ease; - -moz-transition: color 0.15s ease; - transition: color 0.15s ease; } + -webkit-transition: color .15s ease; + -moz-transition: color .15s ease; + transition: color .15s ease; } .reveal a:hover { color: #f3d7ac; @@ -231,9 +231,9 @@ body { box-shadow: none; } .reveal a img { - -webkit-transition: all 0.15s linear; - -moz-transition: all 0.15s linear; - transition: all 0.15s linear; } + -webkit-transition: all .15s linear; + -moz-transition: all .15s linear; + transition: all .15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); diff --git a/css/theme/serif.css b/css/theme/serif.css index 736c0b5..7d5c35e 100644 --- a/css/theme/serif.css +++ b/css/theme/serif.css @@ -206,9 +206,9 @@ body { .reveal a { color: #51483D; text-decoration: none; - -webkit-transition: color 0.15s ease; - -moz-transition: color 0.15s ease; - transition: color 0.15s ease; } + -webkit-transition: color .15s ease; + -moz-transition: color .15s ease; + transition: color .15s ease; } .reveal a:hover { color: #8b7c69; @@ -233,9 +233,9 @@ body { box-shadow: none; } .reveal a img { - -webkit-transition: all 0.15s linear; - -moz-transition: all 0.15s linear; - transition: all 0.15s linear; } + -webkit-transition: all .15s linear; + -moz-transition: all .15s linear; + transition: all .15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); diff --git a/css/theme/simple.css b/css/theme/simple.css index 20d919d..9123043 100644 --- a/css/theme/simple.css +++ b/css/theme/simple.css @@ -206,9 +206,9 @@ body { .reveal a { color: #00008B; text-decoration: none; - -webkit-transition: color 0.15s ease; - -moz-transition: color 0.15s ease; - transition: color 0.15s ease; } + -webkit-transition: color .15s ease; + -moz-transition: color .15s ease; + transition: color .15s ease; } .reveal a:hover { color: #0000f1; @@ -233,9 +233,9 @@ body { box-shadow: none; } .reveal a img { - -webkit-transition: all 0.15s linear; - -moz-transition: all 0.15s linear; - transition: all 0.15s linear; } + -webkit-transition: all .15s linear; + -moz-transition: all .15s linear; + transition: all .15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); diff --git a/css/theme/sky.css b/css/theme/sky.css index e762a50..2b1e439 100644 --- a/css/theme/sky.css +++ b/css/theme/sky.css @@ -213,9 +213,9 @@ body { .reveal a { color: #3b759e; text-decoration: none; - -webkit-transition: color 0.15s ease; - -moz-transition: color 0.15s ease; - transition: color 0.15s ease; } + -webkit-transition: color .15s ease; + -moz-transition: color .15s ease; + transition: color .15s ease; } .reveal a:hover { color: #74a7cb; @@ -240,9 +240,9 @@ body { box-shadow: none; } .reveal a img { - -webkit-transition: all 0.15s linear; - -moz-transition: all 0.15s linear; - transition: all 0.15s linear; } + -webkit-transition: all .15s linear; + -moz-transition: all .15s linear; + transition: all .15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); diff --git a/css/theme/solarized.css b/css/theme/solarized.css index bf2f651..9a17ca8 100644 --- a/css/theme/solarized.css +++ b/css/theme/solarized.css @@ -210,9 +210,9 @@ body { .reveal a { color: #268bd2; text-decoration: none; - -webkit-transition: color 0.15s ease; - -moz-transition: color 0.15s ease; - transition: color 0.15s ease; } + -webkit-transition: color .15s ease; + -moz-transition: color .15s ease; + transition: color .15s ease; } .reveal a:hover { color: #78b9e6; @@ -237,9 +237,9 @@ body { box-shadow: none; } .reveal a img { - -webkit-transition: all 0.15s linear; - -moz-transition: all 0.15s linear; - transition: all 0.15s linear; } + -webkit-transition: all .15s linear; + -moz-transition: all .15s linear; + transition: all .15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); diff --git a/css/theme/white.css b/css/theme/white.css index 14e1703..f55e094 100644 --- a/css/theme/white.css +++ b/css/theme/white.css @@ -206,9 +206,9 @@ body { .reveal a { color: #2a76dd; text-decoration: none; - -webkit-transition: color 0.15s ease; - -moz-transition: color 0.15s ease; - transition: color 0.15s ease; } + -webkit-transition: color .15s ease; + -moz-transition: color .15s ease; + transition: color .15s ease; } .reveal a:hover { color: #6ca0e8; @@ -233,9 +233,9 @@ body { box-shadow: none; } .reveal a img { - -webkit-transition: all 0.15s linear; - -moz-transition: all 0.15s linear; - transition: all 0.15s linear; } + -webkit-transition: all .15s linear; + -moz-transition: all .15s linear; + transition: all .15s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); From c0ea2cd98010d16ea90123e26578e19656d6c2dc Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Fri, 8 Jan 2016 14:02:16 +0100 Subject: [PATCH 033/228] same code format --- plugin/markdown/markdown.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/plugin/markdown/markdown.js b/plugin/markdown/markdown.js index f40e2b6..ab8f2e9 100755 --- a/plugin/markdown/markdown.js +++ b/plugin/markdown/markdown.js @@ -10,8 +10,7 @@ root.RevealMarkdown.initialize(); } else if( typeof exports === 'object' ) { module.exports = factory( require( './marked' ) ); - } - else { + } else { // Browser globals (root is window) root.RevealMarkdown = factory( root.marked ); root.RevealMarkdown.initialize(); From 993526ff67a46ff3d7749014b7b0841a00831ad5 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Fri, 8 Jan 2016 14:18:53 +0100 Subject: [PATCH 034/228] fix broken iframe in backgrounds example --- test/examples/slide-backgrounds.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/examples/slide-backgrounds.html b/test/examples/slide-backgrounds.html index 4e5e406..316c92a 100644 --- a/test/examples/slide-backgrounds.html +++ b/test/examples/slide-backgrounds.html @@ -93,7 +93,7 @@

    Video background

    -
    +

    Iframe background

    From 19a69b2c899eea4d1d71f55e04be2153e93701b1 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Fri, 8 Jan 2016 14:33:34 +0100 Subject: [PATCH 035/228] code format --- plugin/notes/notes.js | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/plugin/notes/notes.js b/plugin/notes/notes.js index 4299034..88f98d6 100644 --- a/plugin/notes/notes.js +++ b/plugin/notes/notes.js @@ -11,14 +11,15 @@ */ var RevealNotes = (function() { - function openNotes(notes_html_file_path) { - if (!notes_html_file_path) { + function openNotes( notesFilePath ) { + + if( !notesFilePath ) { var jsFileLocation = document.querySelector('script[src$="notes.js"]').src; // this js file path jsFileLocation = jsFileLocation.replace(/notes\.js(\?.*)?$/, ''); // the js folder path - notes_html_file_path = jsFileLocation + 'notes.html'; + notesFilePath = jsFileLocation + 'notes.html'; } - - var notesPopup = window.open(notes_html_file_path, 'reveal.js - Notes', 'width=1100,height=700' ); + + var notesPopup = window.open( notesFilePath, 'reveal.js - Notes', 'width=1100,height=700' ); /** * Connect to the notes window through a postmessage handshake. @@ -100,6 +101,7 @@ var RevealNotes = (function() { } connect(); + } if( !/receiver/i.test( window.location.search ) ) { From 7eca84254ea5a38829a145a86807a93e50c45ce4 Mon Sep 17 00:00:00 2001 From: Prateek Saxena Date: Mon, 11 Jan 2016 05:19:28 +0530 Subject: [PATCH 036/228] Remove rebase conflict in README.md --- README.md | 3 --- 1 file changed, 3 deletions(-) diff --git a/README.md b/README.md index d2ba20b..c804108 100644 --- a/README.md +++ b/README.md @@ -590,9 +590,6 @@ Reveal.addEventListener( 'fragmenthidden', function( event ) { ### Code syntax highlighting -<<<<<<< HEAD -By default, Reveal is configured with [highlight.js](https://highlightjs.org/) for code syntax highlighting. Below is an example with clojure code that will be syntax highlighted. When the `data-trim` attribute is present surrounding whitespace is automatically removed. -======= By default, Reveal is configured with [highlight.js](https://highlightjs.org/) for code syntax highlighting. Below is an example with clojure code that will be syntax highlighted. When the `data-trim` attribute is present, surrounding whitespace is automatically removed. HTML will be escaped by default. To avoid this, for example if you are using `` to call out a line of code, add the `data-noescape` attribute to the `` element. ```html From 8a40bb481e376539f7a307c0fffcf2da4e87cbeb Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Mon, 11 Jan 2016 10:33:40 +0100 Subject: [PATCH 037/228] note about showNotes in PDF exports --- README.md | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index c804108..c406960 100644 --- a/README.md +++ b/README.md @@ -758,8 +758,6 @@ When used locally, this feature requires that reveal.js [runs from a local web s
    ``` -Notes are only visible to you in the speaker view. If you wish to share your notes with the audience initialize reveal.js with the `showNotes` config value set to `true`. - If you're using the external Markdown plugin, you can add notes with the help of a special delimiter: ```html @@ -774,6 +772,12 @@ Note: This will only display in the notes window. ``` +#### Share and Print Speaker Notes + +Notes are only visible to the speaker inside of the speaker view. If you wish to share your notes with others you can initialize reveal.js with the `showNotes` config value set to `true`. Notes will appear along the bottom of the presentations. + +When `showNotes` is enabled notes are also included when you [export to PDF](https://github.com/hakimel/reveal.js#pdf-export). + ## Server Side Speaker Notes In some cases it can be desirable to run notes on a separate device from the one you're presenting on. The Node.js-based notes plugin lets you do this using the same note definitions as its client side counterpart. Include the required scripts by adding the following dependencies: From 6af739f81c263f44235bb83a7ec6a346386d4efa Mon Sep 17 00:00:00 2001 From: omer727 Date: Sun, 17 Jan 2016 14:42:56 +0200 Subject: [PATCH 038/228] Fixing spelling typo and GitHub proper camelcase for brand name --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index c406960..b1e985e 100644 --- a/README.md +++ b/README.md @@ -39,7 +39,7 @@ Markup hierarchy needs to be ``
    ``` elements and wrap the contents in a ``` + + + +``` + +Markup hierarchy needs to be `.reveal > .slides > section` where the `section` represents one slide and can be repeated indefinitely. If you place multiple `section`'s inside of another `section` they will be shown as vertical slides. The first of the vertical slides is the "root" of the others (at the top), and will be included in the horizontal sequence. For example: ```html
    From c93fbf1ddcb0db76d34e558cab2e35cb8823702d Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Fri, 22 Jan 2016 11:02:05 +0100 Subject: [PATCH 040/228] readme tweak --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index accb4fe..565606b 100644 --- a/README.md +++ b/README.md @@ -43,7 +43,7 @@ Here's a barebones example of a fully working reveal.js presentation: ``` -Markup hierarchy needs to be `.reveal > .slides > section` where the `section` represents one slide and can be repeated indefinitely. If you place multiple `section`'s inside of another `section` they will be shown as vertical slides. The first of the vertical slides is the "root" of the others (at the top), and will be included in the horizontal sequence. For example: +The presentation markup hierarchy needs to be `.reveal > .slides > section` where the `section` represents one slide and can be repeated indefinitely. If you place multiple `section` elements inside of another `section` they will be shown as vertical slides. The first of the vertical slides is the "root" of the others (at the top), and will be included in the horizontal sequence. For example: ```html
    From 219a60053a908cba54fdbdaa2cbb28ae596dfe93 Mon Sep 17 00:00:00 2001 From: LaurentTreguier Date: Wed, 17 Feb 2016 20:07:53 +0100 Subject: [PATCH 041/228] Change ".video" to ".reveal .video" I don't know if this is supposed to be this way ? --- css/reveal.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/css/reveal.scss b/css/reveal.scss index eb600ac..ad6be67 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -23,7 +23,7 @@ html, body, .reveal div, .reveal span, .reveal applet, .reveal object, .reveal i .reveal article, .reveal aside, .reveal canvas, .reveal details, .reveal embed, .reveal figure, .reveal figcaption, .reveal footer, .reveal header, .reveal hgroup, .reveal menu, .reveal nav, .reveal output, .reveal ruby, .reveal section, .reveal summary, -.reveal time, .reveal mark, .reveal audio, video { +.reveal time, .reveal mark, .reveal audio, .reveal video { margin: 0; padding: 0; border: 0; From acc40095d552039b45660279c9c9ede9bbd856c9 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Mon, 29 Feb 2016 11:31:00 +0100 Subject: [PATCH 042/228] use css to scale slides up in safari --- js/reveal.js | 42 ++++++++++++++++++++++++------------------ 1 file changed, 24 insertions(+), 18 deletions(-) diff --git a/js/reveal.js b/js/reveal.js index e1d80b9..7454535 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -298,30 +298,36 @@ */ function checkCapabilities() { - features.transforms3d = 'WebkitPerspective' in document.body.style || - 'MozPerspective' in document.body.style || - 'msPerspective' in document.body.style || - 'OPerspective' in document.body.style || - 'perspective' in document.body.style; + isMobileDevice = /(iphone|ipod|ipad|android)/gi.test( navigator.userAgent ); - features.transforms2d = 'WebkitTransform' in document.body.style || - 'MozTransform' in document.body.style || - 'msTransform' in document.body.style || - 'OTransform' in document.body.style || - 'transform' in document.body.style; + var testElement = document.createElement( 'div' ); + + features.transforms3d = 'WebkitPerspective' in testElement.style || + 'MozPerspective' in testElement.style || + 'msPerspective' in testElement.style || + 'OPerspective' in testElement.style || + 'perspective' in testElement.style; + + features.transforms2d = 'WebkitTransform' in testElement.style || + 'MozTransform' in testElement.style || + 'msTransform' in testElement.style || + 'OTransform' in testElement.style || + 'transform' in testElement.style; features.requestAnimationFrameMethod = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame; features.requestAnimationFrame = typeof features.requestAnimationFrameMethod === 'function'; features.canvas = !!document.createElement( 'canvas' ).getContext; - features.touch = !!( 'ontouchstart' in window ); - // Transitions in the overview are disabled in desktop and - // mobile Safari due to lag + // Safari due to lag features.overviewTransitions = !/Version\/[\d\.]+.*Safari/.test( navigator.userAgent ); - isMobileDevice = /(iphone|ipod|ipad|android)/gi.test( navigator.userAgent ); + // Flags if we should use zoom instead of transform to scale + // up slides. Zoom produces crisper results but has a lot of + // xbrowser quirks so we only use it in whitelsited browsers. + features.zoom = 'zoom' in testElement.style && !isMobileDevice && + ( /chrome/i.test( navigator.userAgent ) || /Version\/[\d\.]+.*Safari/.test( navigator.userAgent ) ); } @@ -1592,10 +1598,10 @@ transformSlides( { layout: '' } ); } else { - // Use zoom to scale up in desktop Chrome so that content - // remains crisp. We don't use zoom to scale down since that - // can lead to shifts in text layout/line breaks. - if( scale > 1 && !isMobileDevice && /chrome/i.test( navigator.userAgent ) && typeof dom.slides.style.zoom !== 'undefined' ) { + // Prefer zoom for scaling up so that content remains crisp. + // Don't use zoom to scale down since that can lead to shifts + // in text layout/line breaks. + if( scale > 1 && features.zoom ) { dom.slides.style.zoom = scale; dom.slides.style.left = ''; dom.slides.style.top = ''; From 9eb56f8146e9d4d57e579fcc1a40ae370b036e5b Mon Sep 17 00:00:00 2001 From: Benjamin Tan Date: Sun, 6 Mar 2016 16:52:02 +0800 Subject: [PATCH 043/228] Remove unused dependencies. --- package.json | 15 +++++++-------- plugin/notes-server/index.js | 3 +-- 2 files changed, 8 insertions(+), 10 deletions(-) diff --git a/package.json b/package.json index 652bbed..043eac1 100644 --- a/package.json +++ b/package.json @@ -23,22 +23,21 @@ }, "dependencies": { "express": "~4.13.3", - "grunt-cli": "^0.1.13", + "grunt-cli": "~0.1.13", "mustache": "~2.2.1", - "socket.io": "~1.3.7", - "underscore": "~1.8.3" + "socket.io": "~1.3.7" }, "devDependencies": { - "grunt-contrib-qunit": "~0.7.0", - "grunt-contrib-jshint": "~0.11.3", + "grunt": "~0.4.5", + "grunt-autoprefixer": "~3.0.3", + "grunt-contrib-connect": "~0.11.2", "grunt-contrib-cssmin": "~0.14.0", + "grunt-contrib-jshint": "~0.11.3", + "grunt-contrib-qunit": "~0.7.0", "grunt-contrib-uglify": "~0.9.2", "grunt-contrib-watch": "~0.6.1", "grunt-sass": "~1.1.0-beta", - "grunt-contrib-connect": "~0.11.2", - "grunt-autoprefixer": "~3.0.3", "grunt-zip": "~0.17.1", - "grunt": "~0.4.5", "node-sass": "~3.3.3" }, "license": "MIT" diff --git a/plugin/notes-server/index.js b/plugin/notes-server/index.js index 683f064..fc66a26 100644 --- a/plugin/notes-server/index.js +++ b/plugin/notes-server/index.js @@ -2,7 +2,6 @@ var http = require('http'); var express = require('express'); var fs = require('fs'); var io = require('socket.io'); -var _ = require('underscore'); var Mustache = require('mustache'); var app = express(); @@ -64,5 +63,5 @@ var slidesLocation = 'http://localhost' + ( opts.port ? ( ':' + opts.port ) : '' console.log( brown + 'reveal.js - Speaker Notes' + reset ); console.log( '1. Open the slides at ' + green + slidesLocation + reset ); -console.log( '2. Click on the link your JS console to go to the notes page' ); +console.log( '2. Click on the link in your JS console to go to the notes page' ); console.log( '3. Advance through your slides and your notes will advance automatically' ); From 6d0b52026a773559407a452b94f8ab60d80aac1e Mon Sep 17 00:00:00 2001 From: Benjamin Tan Date: Sun, 6 Mar 2016 18:28:08 +0800 Subject: [PATCH 044/228] Fix query parameter issue in notes plugin. Closes #1392. --- plugin/notes/notes.html | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/plugin/notes/notes.html b/plugin/notes/notes.html index 75f1b9b..d0d88dc 100644 --- a/plugin/notes/notes.html +++ b/plugin/notes/notes.html @@ -288,9 +288,10 @@ 'backgroundTransition=none' ].join( '&' ); + var urlSeparator = /?/.test(data.url) ? '&' : '?'; var hash = '#/' + data.state.indexh + '/' + data.state.indexv; - var currentURL = data.url + '?' + params + '&postMessageEvents=true' + hash; - var upcomingURL = data.url + '?' + params + '&controls=false' + hash; + var currentURL = data.url + urlSeparator + params + '&postMessageEvents=true' + hash; + var upcomingURL = data.url + urlSeparator + params + '&controls=false' + hash; currentSlide = document.createElement( 'iframe' ); currentSlide.setAttribute( 'width', 1280 ); From ac2a3fff75c2c4e1a3d33d7998d4e3e6c39d4ef0 Mon Sep 17 00:00:00 2001 From: Benjamin Tan Date: Mon, 7 Mar 2016 19:15:59 +0800 Subject: [PATCH 045/228] Make PDF export section less OS X specific. Closes #1073. --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index eae40fd..1deb1b3 100644 --- a/README.md +++ b/README.md @@ -732,7 +732,7 @@ Presentations can be exported to PDF via a special print stylesheet. This featur Here's an example of an exported presentation that's been uploaded to SlideShare: http://www.slideshare.net/hakimel/revealjs-300. 1. Open your presentation with `print-pdf` included anywhere in the query string. This triggers the default index HTML to load the PDF print stylesheet ([css/print/pdf.css](https://github.com/hakimel/reveal.js/blob/master/css/print/pdf.css)). You can test this with [lab.hakim.se/reveal-js?print-pdf](http://lab.hakim.se/reveal-js?print-pdf). -2. Open the in-browser print dialog (CMD+P). +2. Open the in-browser print dialog (CTRL/CMD+P). 3. Change the **Destination** setting to **Save as PDF**. 4. Change the **Layout** to **Landscape**. 5. Change the **Margins** to **None**. From 922677ac66d6a40eba23e5f9ac3fc10d9145b203 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Wed, 9 Mar 2016 09:37:10 +0100 Subject: [PATCH 046/228] fix notes regex #1522 #1392 --- plugin/notes/notes.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugin/notes/notes.html b/plugin/notes/notes.html index d0d88dc..8523e98 100644 --- a/plugin/notes/notes.html +++ b/plugin/notes/notes.html @@ -288,7 +288,7 @@ 'backgroundTransition=none' ].join( '&' ); - var urlSeparator = /?/.test(data.url) ? '&' : '?'; + var urlSeparator = /\?/.test(data.url) ? '&' : '?'; var hash = '#/' + data.state.indexh + '/' + data.state.indexv; var currentURL = data.url + urlSeparator + params + '&postMessageEvents=true' + hash; var upcomingURL = data.url + urlSeparator + params + '&controls=false' + hash; From 8e3a7f03d189391f88f56b8ac7c96db709d7cba7 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Wed, 9 Mar 2016 09:57:58 +0100 Subject: [PATCH 047/228] notes plugin no longer syncs overview mode #1446 --- plugin/notes/notes.html | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/plugin/notes/notes.html b/plugin/notes/notes.html index 8523e98..c80e77f 100644 --- a/plugin/notes/notes.html +++ b/plugin/notes/notes.html @@ -188,6 +188,10 @@ var data = JSON.parse( event.data ); + // The overview mode is only useful to the reveal.js instance + // where navigation occurs so we don't sync it + if( data.state ) delete data.state.overview; + // Messages sent by the notes plugin inside of the main window if( data && data.namespace === 'reveal-notes' ) { if( data.type === 'connect' ) { @@ -203,8 +207,10 @@ // Send a message back to notify that the handshake is complete window.opener.postMessage( JSON.stringify({ namespace: 'reveal-notes', type: 'connected'} ), '*' ); } - else if( /slidechanged|fragmentshown|fragmenthidden|overviewshown|overviewhidden|paused|resumed/.test( data.eventName ) && currentState !== JSON.stringify( data.state ) ) { + else if( /slidechanged|fragmentshown|fragmenthidden|paused|resumed/.test( data.eventName ) && currentState !== JSON.stringify( data.state ) ) { + window.opener.postMessage( JSON.stringify({ method: 'setState', args: [ data.state ]} ), '*' ); + } } From ef137fd01f228c50027c356084a2e69e938e2511 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Wed, 9 Mar 2016 10:02:25 +0100 Subject: [PATCH 048/228] server notes plugin no longer syncs overview mode #1446 --- plugin/notes-server/index.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/plugin/notes-server/index.js b/plugin/notes-server/index.js index fc66a26..b95f071 100644 --- a/plugin/notes-server/index.js +++ b/plugin/notes-server/index.js @@ -22,10 +22,12 @@ io.on( 'connection', function( socket ) { }); socket.on( 'statechanged', function( data ) { + delete data.state.overview; socket.broadcast.emit( 'statechanged', data ); }); socket.on( 'statechanged-speaker', function( data ) { + delete data.state.overview; socket.broadcast.emit( 'statechanged-speaker', data ); }); From de2ab07334766e6df2e3e69cd58a820e40d6349e Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 10 Mar 2016 16:02:36 +0100 Subject: [PATCH 049/228] slides link --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index d3c5b1e..d29d0ee 100644 --- a/README.md +++ b/README.md @@ -14,7 +14,7 @@ reveal.js comes with a broad range of features including [nested slides](https:/ ## Online Editor -Presentations are written using HTML or Markdown but there's also an online editor for those of you who prefer a graphical interface. Give it a try at [http://slides.com](http://slides.com). +Presentations are written using HTML or Markdown but there's also an online editor for those of you who prefer a graphical interface. Give it a try at [http://slides.com](http://slides.com?ref=github). ## Instructions From 587d16ceef9e8f11230d6f183b483388075d3609 Mon Sep 17 00:00:00 2001 From: Dhyego Fernando Date: Thu, 10 Mar 2016 13:50:35 -0400 Subject: [PATCH 050/228] fix(PDF Export): Mark as important `width`, `height` and add `zoom` properties to fix CSS rules which were overrided by inline styles --- css/print/pdf.css | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/css/print/pdf.css b/css/print/pdf.css index 9ed90d6..e4a1b7d 100644 --- a/css/print/pdf.css +++ b/css/print/pdf.css @@ -60,8 +60,9 @@ ul, ol, div, p { } .reveal .slides { position: static; - width: 100%; - height: auto; + width: 100% !important; + height: auto !important; + zoom: 1 !important; left: auto; top: auto; @@ -157,4 +158,3 @@ ul, ol, div, p { position: absolute; font-size: 14px; } - From 1a5f299599ae0a53b107194b4118f3f86b683309 Mon Sep 17 00:00:00 2001 From: Brandon Ooi Date: Wed, 16 Mar 2016 13:57:15 -0700 Subject: [PATCH 051/228] update headjs to v1.0.3 --- lib/js/head.min.js | 17 +++++++++-------- 1 file changed, 9 insertions(+), 8 deletions(-) diff --git a/lib/js/head.min.js b/lib/js/head.min.js index 6242b0f..d9f87ba 100644 --- a/lib/js/head.min.js +++ b/lib/js/head.min.js @@ -1,8 +1,9 @@ -/** - Head JS The only script in your - Copyright Tero Piirainen (tipiirai) - License MIT / http://bit.ly/mit-license - Version 0.96 - - http://headjs.com -*/(function(a){function z(){d||(d=!0,s(e,function(a){p(a)}))}function y(c,d){var e=a.createElement("script");e.type="text/"+(c.type||"javascript"),e.src=c.src||c,e.async=!1,e.onreadystatechange=e.onload=function(){var a=e.readyState;!d.done&&(!a||/loaded|complete/.test(a))&&(d.done=!0,d())},(a.body||b).appendChild(e)}function x(a,b){if(a.state==o)return b&&b();if(a.state==n)return k.ready(a.name,b);if(a.state==m)return a.onpreload.push(function(){x(a,b)});a.state=n,y(a.url,function(){a.state=o,b&&b(),s(g[a.name],function(a){p(a)}),u()&&d&&s(g.ALL,function(a){p(a)})})}function w(a,b){a.state===undefined&&(a.state=m,a.onpreload=[],y({src:a.url,type:"cache"},function(){v(a)}))}function v(a){a.state=l,s(a.onpreload,function(a){a.call()})}function u(a){a=a||h;var b;for(var c in a){if(a.hasOwnProperty(c)&&a[c].state!=o)return!1;b=!0}return b}function t(a){return Object.prototype.toString.call(a)=="[object Function]"}function s(a,b){if(!!a){typeof a=="object"&&(a=[].slice.call(a));for(var c=0;cn?(i.screensCss.gt&&r("gt-"+n),i.screensCss.gte&&r("gte-"+n)):tt);u.feature("landscape",fe?(i.browserCss.gt&&r("gt-"+f+e),i.browserCss.gte&&r("gte-"+f+e)):h2&&this[u+1]!==t)u&&r(this.slice(u,u+1).join("-").toLowerCase()+i.section);else{var f=n||"index",e=f.indexOf(".");e>0&&(f=f.substring(0,e));c.id=f.toLowerCase()+i.page;u||r("root"+i.section)}});u.screen={height:n.screen.height,width:n.screen.width};tt();b=0;n.addEventListener?n.addEventListener("resize",it,!1):n.attachEvent("onresize",it)})(window); +/*! head.css3 - v1.0.0 */ +(function(n,t){"use strict";function a(n){for(var r in n)if(i[n[r]]!==t)return!0;return!1}function r(n){var t=n.charAt(0).toUpperCase()+n.substr(1),i=(n+" "+c.join(t+" ")+t).split(" ");return!!a(i)}var h=n.document,o=h.createElement("i"),i=o.style,s=" -o- -moz- -ms- -webkit- -khtml- ".split(" "),c="Webkit Moz O ms Khtml".split(" "),l=n.head_conf&&n.head_conf.head||"head",u=n[l],f={gradient:function(){var n="background-image:";return i.cssText=(n+s.join("gradient(linear,left top,right bottom,from(#9f9),to(#fff));"+n)+s.join("linear-gradient(left top,#eee,#fff);"+n)).slice(0,-n.length),!!i.backgroundImage},rgba:function(){return i.cssText="background-color:rgba(0,0,0,0.5)",!!i.backgroundColor},opacity:function(){return o.style.opacity===""},textshadow:function(){return i.textShadow===""},multiplebgs:function(){i.cssText="background:url(https://),url(https://),red url(https://)";var n=(i.background||"").match(/url/g);return Object.prototype.toString.call(n)==="[object Array]"&&n.length===3},boxshadow:function(){return r("boxShadow")},borderimage:function(){return r("borderImage")},borderradius:function(){return r("borderRadius")},cssreflections:function(){return r("boxReflect")},csstransforms:function(){return r("transform")},csstransitions:function(){return r("transition")},touch:function(){return"ontouchstart"in n},retina:function(){return n.devicePixelRatio>1},fontface:function(){var t=u.browser.name,n=u.browser.version;switch(t){case"ie":return n>=9;case"chrome":return n>=13;case"ff":return n>=6;case"ios":return n>=5;case"android":return!1;case"webkit":return n>=5.1;case"opera":return n>=10;default:return!1}}};for(var e in f)f[e]&&u.feature(e,f[e].call(),!0);u.feature()})(window); +/*! head.load - v1.0.3 */ +(function(n,t){"use strict";function w(){}function u(n,t){if(n){typeof n=="object"&&(n=[].slice.call(n));for(var i=0,r=n.length;i Date: Sun, 20 Mar 2016 17:57:52 +0100 Subject: [PATCH 052/228] add 'shuffle' config value and API method #1506 #1089 --- README.md | 6 ++++++ js/reveal.js | 27 +++++++++++++++++++++++++++ 2 files changed, 33 insertions(+) diff --git a/README.md b/README.md index 80bf31d..af1d6d7 100644 --- a/README.md +++ b/README.md @@ -152,6 +152,9 @@ Reveal.initialize({ // Change the presentation direction to be RTL rtl: false, + // Randomizes the order of slides each time the presentation loads + shuffle: false, + // Turns fragments on and off globally fragments: true, @@ -382,6 +385,9 @@ Reveal.next(); Reveal.prevFragment(); Reveal.nextFragment(); +// Randomize the order of slides +Reveal.shuffle(); + // Toggle presentation states, optionally pass true/false to force on/off Reveal.toggleOverview(); Reveal.togglePause(); diff --git a/js/reveal.js b/js/reveal.js index 7454535..575214e 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -81,6 +81,9 @@ // Change the presentation direction to be RTL rtl: false, + // Randomizes the order of slides each time the presentation loads + shuffle: false, + // Turns fragments on and off globally fragments: true, @@ -898,6 +901,10 @@ dom.progress.style.display = config.progress ? 'block' : 'none'; dom.slideNumber.style.display = config.slideNumber && !isPrintingPDF() ? 'block' : 'none'; + if( config.shuffle ) { + shuffle(); + } + if( config.rtl ) { dom.wrapper.classList.add( 'rtl' ); } @@ -2329,6 +2336,23 @@ } + /** + * Randomly shuffles all slides in the deck. + */ + function shuffle() { + + var slides = toArray( dom.wrapper.querySelectorAll( HORIZONTAL_SLIDES_SELECTOR ) ); + + slides.forEach( function( slide ) { + + // Insert this slide next to another random slide. This may + // cause the slide to insert before itself but that's fine. + dom.slides.insertBefore( slide, slides[ Math.floor( Math.random() * slides.length ) ] ); + + } ); + + } + /** * Updates one dimension of slides by showing the slide * with the specified index. @@ -4579,6 +4603,9 @@ // Forces an update in slide layout layout: layout, + // Randomizes the order of slides + shuffle: shuffle, + // Returns an object with the available routes as booleans (left/right/top/bottom) availableRoutes: availableRoutes, From 3d0969166f5838df844d81d1926e761905cecc1f Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Sun, 20 Mar 2016 18:50:14 +0100 Subject: [PATCH 053/228] new empty template at index.html, move old index to demo.html #1526 --- demo.html | 431 +++++++++++++++++++++++++++++++++++++++++++ index.html | 384 ++------------------------------------ lab.html | 526 +++++++++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 969 insertions(+), 372 deletions(-) create mode 100644 demo.html create mode 100644 lab.html diff --git a/demo.html b/demo.html new file mode 100644 index 0000000..17dfb35 --- /dev/null +++ b/demo.html @@ -0,0 +1,431 @@ + + + + + + + reveal.js – The HTML Presentation Framework + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    +
    +

    Reveal.js

    +

    The HTML Presentation Framework

    +

    + Created by Hakim El Hattab / @hakimel +

    +
    + +
    +

    Hello There

    +

    + reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. +

    +

    + reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. +

    +

    + reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. +

    +

    + reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. +

    +

    + reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. +

    +

    + reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. +

    +

    + reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. +

    +

    + reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. --- +

    +
    + + +
    +
    +

    Vertical Slides

    +

    Slides can be nested inside of each other.

    +

    Use the Space key to navigate through all slides.

    +
    + + Down arrow + +
    +
    +

    Basement Level 1

    +

    Nested slides are useful for adding additional detail underneath a high level horizontal slide.

    +
    +
    +

    Basement Level 2

    +

    That's it, time to go back up.

    +
    + + Up arrow + +
    +
    + +
    +

    Slides

    +

    + Not a coder? Not a problem. There's a fully-featured visual editor for authoring these, try it out at http://slides.com. +

    +
    + +
    +

    Point of View

    +

    + Press ESC to enter the slide overview. +

    +

    + Hold down alt and click on any element to zoom in on it using zoom.js. Alt + click anywhere to zoom back out. +

    +
    + +
    +

    Touch Optimized

    +

    + Presentations look great on touch devices, like mobile phones and tablets. Simply swipe through your slides. +

    +
    + +
    + +
    + +
    +
    +

    Fragments

    +

    Hit the next arrow...

    +

    ... to step through ...

    +

    ... a fragmented slide.

    + + +
    +
    +

    Fragment Styles

    +

    There's different types of fragments, like:

    +

    grow

    +

    shrink

    +

    fade-out

    +

    fade-up (also down, left and right!)

    +

    current-visible

    +

    Highlight red blue green

    +
    +
    + +
    +

    Transition Styles

    +

    + You can select from different transitions, like:
    + None - + Fade - + Slide - + Convex - + Concave - + Zoom +

    +
    + +
    +

    Themes

    +

    + reveal.js comes with a few themes built in:
    + + Black (default) - + White - + League - + Sky - + Beige - + Simple
    + Serif - + Blood - + Night - + Moon - + Solarized +

    +
    + +
    +
    +

    Slide Backgrounds

    +

    + Set data-background="#dddddd" on a slide to change the background color. All CSS color formats are supported. +

    + + Down arrow + +
    +
    +

    Image Backgrounds

    +
    <section data-background="image.png">
    +
    +
    +

    Tiled Backgrounds

    +
    <section data-background="image.png" data-background-repeat="repeat" data-background-size="100px">
    +
    +
    +
    +

    Video Backgrounds

    +
    <section data-background-video="video.mp4,video.webm">
    +
    +
    +
    +

    ... and GIFs!

    +
    +
    + +
    +

    Background Transitions

    +

    + Different background transitions are available via the backgroundTransition option. This one's called "zoom". +

    +
    Reveal.configure({ backgroundTransition: 'zoom' })
    +
    + +
    +

    Background Transitions

    +

    + You can override background transitions per-slide. +

    +
    <section data-background-transition="zoom">
    +
    + +
    +

    Pretty Code

    +
    
    +function linkify( selector ) {
    +  if( supports3DTransforms ) {
    +
    +    var nodes = document.querySelectorAll( selector );
    +
    +    for( var i = 0, len = nodes.length; i < len; i++ ) {
    +      var node = nodes[i];
    +
    +      if( !node.className ) {
    +        node.className += ' roll';
    +      }
    +    }
    +  }
    +}
    +					
    +

    Code syntax highlighting courtesy of highlight.js.

    +
    + +
    +

    Marvelous List

    +
      +
    • No order here
    • +
    • Or here
    • +
    • Or here
    • +
    • Or here
    • +
    +
    + +
    +

    Fantastic Ordered List

    +
      +
    1. One is smaller than...
    2. +
    3. Two is smaller than...
    4. +
    5. Three!
    6. +
    +
    + +
    +

    Tabular Tables

    + + + + + + + + + + + + + + + + + + + + + + + + + +
    ItemValueQuantity
    Apples$17
    Lemonade$218
    Bread$32
    +
    + +
    +

    Clever Quotes

    +

    + These guys come in two forms, inline: + “The nice thing about standards is that there are so many to choose from” and block: +

    +
    + “For years there has been a theory that millions of monkeys typing at random on millions of typewriters would + reproduce the entire works of Shakespeare. The Internet has proven this theory to be untrue.” +
    +
    + +
    +

    Intergalactic Interconnections

    +

    + You can link between slides internally, + like this. +

    +
    + +
    +

    Speaker View

    +

    There's a speaker view. It includes a timer, preview of the upcoming slide as well as your speaker notes.

    +

    Press the S key to try it out.

    + + +
    + +
    +

    Export to PDF

    +

    Presentations can be exported to PDF, here's an example:

    + +
    + +
    +

    Global State

    +

    + Set data-state="something" on a slide and "something" + will be added as a class to the document element when the slide is open. This lets you + apply broader style changes, like switching the page background. +

    +
    + +
    +

    State Events

    +

    + Additionally custom events can be triggered on a per slide basis by binding to the data-state name. +

    +
    
    +Reveal.addEventListener( 'customevent', function() {
    +	console.log( '"customevent" has fired' );
    +} );
    +					
    +
    + +
    +

    Take a Moment

    +

    + Press B or . on your keyboard to pause the presentation. This is helpful when you're on stage and want to take distracting slides off the screen. +

    +
    + +
    +

    Much more

    + +
    + +
    +

    THE END

    +

    + - Try the online editor
    + - Source code & documentation +

    +
    + +
    + +
    + + + + + + + + diff --git a/index.html b/index.html index 37b65e2..d278354 100644 --- a/index.html +++ b/index.html @@ -1,21 +1,14 @@ - - + - reveal.js – The HTML Presentation Framework + reveal.js - - - - - - - + - + @@ -28,384 +21,31 @@ link.href = window.location.search.match( /print-pdf/gi ) ? 'css/print/pdf.css' : 'css/print/paper.css'; document.getElementsByTagName( 'head' )[0].appendChild( link ); - - - -
    - -
    -
    -

    Reveal.js

    -

    The HTML Presentation Framework

    -

    - Created by Hakim El Hattab / @hakimel -

    -
    - -
    -

    Hello There

    -

    - reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. -

    -
    - - -
    -
    -

    Vertical Slides

    -

    Slides can be nested inside of each other.

    -

    Use the Space key to navigate through all slides.

    -
    - - Down arrow - -
    -
    -

    Basement Level 1

    -

    Nested slides are useful for adding additional detail underneath a high level horizontal slide.

    -
    -
    -

    Basement Level 2

    -

    That's it, time to go back up.

    -
    - - Up arrow - -
    -
    - -
    -

    Slides

    -

    - Not a coder? Not a problem. There's a fully-featured visual editor for authoring these, try it out at http://slides.com. -

    -
    - -
    -

    Point of View

    -

    - Press ESC to enter the slide overview. -

    -

    - Hold down alt and click on any element to zoom in on it using zoom.js. Alt + click anywhere to zoom back out. -

    -
    - -
    -

    Touch Optimized

    -

    - Presentations look great on touch devices, like mobile phones and tablets. Simply swipe through your slides. -

    -
    - -
    - -
    - -
    -
    -

    Fragments

    -

    Hit the next arrow...

    -

    ... to step through ...

    -

    ... a fragmented slide.

    - - -
    -
    -

    Fragment Styles

    -

    There's different types of fragments, like:

    -

    grow

    -

    shrink

    -

    fade-out

    -

    fade-up (also down, left and right!)

    -

    current-visible

    -

    Highlight red blue green

    -
    -
    - -
    -

    Transition Styles

    -

    - You can select from different transitions, like:
    - None - - Fade - - Slide - - Convex - - Concave - - Zoom -

    -
    - -
    -

    Themes

    -

    - reveal.js comes with a few themes built in:
    - - Black (default) - - White - - League - - Sky - - Beige - - Simple
    - Serif - - Blood - - Night - - Moon - - Solarized -

    -
    - -
    -
    -

    Slide Backgrounds

    -

    - Set data-background="#dddddd" on a slide to change the background color. All CSS color formats are supported. -

    - - Down arrow - -
    -
    -

    Image Backgrounds

    -
    <section data-background="image.png">
    -
    -
    -

    Tiled Backgrounds

    -
    <section data-background="image.png" data-background-repeat="repeat" data-background-size="100px">
    -
    -
    -
    -

    Video Backgrounds

    -
    <section data-background-video="video.mp4,video.webm">
    -
    -
    -
    -

    ... and GIFs!

    -
    -
    - -
    -

    Background Transitions

    -

    - Different background transitions are available via the backgroundTransition option. This one's called "zoom". -

    -
    Reveal.configure({ backgroundTransition: 'zoom' })
    -
    - -
    -

    Background Transitions

    -

    - You can override background transitions per-slide. -

    -
    <section data-background-transition="zoom">
    -
    - -
    -

    Pretty Code

    -
    
    -function linkify( selector ) {
    -  if( supports3DTransforms ) {
    -
    -    var nodes = document.querySelectorAll( selector );
    -
    -    for( var i = 0, len = nodes.length; i < len; i++ ) {
    -      var node = nodes[i];
    -
    -      if( !node.className ) {
    -        node.className += ' roll';
    -      }
    -    }
    -  }
    -}
    -					
    -

    Code syntax highlighting courtesy of highlight.js.

    -
    - -
    -

    Marvelous List

    -
      -
    • No order here
    • -
    • Or here
    • -
    • Or here
    • -
    • Or here
    • -
    -
    - -
    -

    Fantastic Ordered List

    -
      -
    1. One is smaller than...
    2. -
    3. Two is smaller than...
    4. -
    5. Three!
    6. -
    -
    - -
    -

    Tabular Tables

    - - - - - - - - - - - - - - - - - - - - - - - - - -
    ItemValueQuantity
    Apples$17
    Lemonade$218
    Bread$32
    -
    - -
    -

    Clever Quotes

    -

    - These guys come in two forms, inline: - “The nice thing about standards is that there are so many to choose from” and block: -

    -
    - “For years there has been a theory that millions of monkeys typing at random on millions of typewriters would - reproduce the entire works of Shakespeare. The Internet has proven this theory to be untrue.” -
    -
    - -
    -

    Intergalactic Interconnections

    -

    - You can link between slides internally, - like this. -

    -
    - -
    -

    Speaker View

    -

    There's a speaker view. It includes a timer, preview of the upcoming slide as well as your speaker notes.

    -

    Press the S key to try it out.

    - - -
    - -
    -

    Export to PDF

    -

    Presentations can be exported to PDF, here's an example:

    - -
    - -
    -

    Global State

    -

    - Set data-state="something" on a slide and "something" - will be added as a class to the document element when the slide is open. This lets you - apply broader style changes, like switching the page background. -

    -
    - -
    -

    State Events

    -

    - Additionally custom events can be triggered on a per slide basis by binding to the data-state name. -

    -
    
    -Reveal.addEventListener( 'customevent', function() {
    -	console.log( '"customevent" has fired' );
    -} );
    -					
    -
    - -
    -

    Take a Moment

    -

    - Press B or . on your keyboard to pause the presentation. This is helpful when you're on stage and want to take distracting slides off the screen. -

    -
    - -
    -

    Much more

    - -
    - -
    -

    THE END

    -

    - - Try the online editor
    - - Source code & documentation -

    -
    - +
    Slide 1
    +
    Slide 2
    -
    - diff --git a/lab.html b/lab.html new file mode 100644 index 0000000..0e1ae6b --- /dev/null +++ b/lab.html @@ -0,0 +1,526 @@ + + + + + + + reveal.js – The HTML Presentation Framework + + + + + + + + + + + + + + + + + + + + + + + +
    + + +
    +
    +

    Reveal.js

    +

    The HTML Presentation Framework

    + +
    + +
    +

    Hello There

    +

    + reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. +

    +
    + + +
    +
    +

    Vertical Slides

    +

    Slides can be nested inside of each other.

    +

    Use the Space key to navigate through all slides.

    +
    + + Down arrow + +
    +
    +

    Basement Level 1

    +

    Nested slides are useful for adding additional detail underneath a high level horizontal slide.

    +
    +
    +

    Basement Level 2

    +

    That's it, time to go back up.

    +
    + + Up arrow + +
    +
    + +
    +

    Slides

    +

    + Not a coder? Not a problem. There's a fully-featured visual editor for authoring these, try it out at http://slides.com. +

    +
    + +
    +

    Point of View

    +

    + Press ESC to enter the slide overview. +

    +

    + Hold down alt and click on any element to zoom in on it using zoom.js. Alt + click anywhere to zoom back out. +

    +
    + +
    +

    Touch Optimized

    +

    + Presentations look great on touch devices, like mobile phones and tablets. Simply swipe through your slides. +

    +
    + +
    + +
    + +
    +
    +

    Fragments

    +

    Hit the next arrow...

    +

    ... to step through ...

    +

    ... a fragmented slide.

    + + +
    +
    +

    Fragment Styles

    +

    There's different types of fragments, like:

    +

    grow

    +

    shrink

    +

    fade-out

    +

    fade-up (also down, left and right!)

    +

    current-visible

    +

    Highlight red blue green

    +
    +
    + +
    +

    Transition Styles

    +

    + You can select from different transitions, like:
    + None - + Fade - + Slide - + Convex - + Concave - + Zoom +

    +
    + +
    +

    Themes

    +

    + reveal.js comes with a few themes built in:
    + + Black (default) - + White - + League - + Sky - + Beige - + Simple
    + Serif - + Blood - + Night - + Moon - + Solarized +

    +
    + +
    +
    +

    Slide Backgrounds

    +

    + Set data-background="#dddddd" on a slide to change the background color. All CSS color formats are supported. +

    + + Down arrow + +
    +
    +

    Image Backgrounds

    +
    <section data-background="image.png">
    +
    +
    +

    Tiled Backgrounds

    +
    <section data-background="image.png" data-background-repeat="repeat" data-background-size="100px">
    +
    +
    +
    +

    Video Backgrounds

    +
    <section data-background-video="video.mp4,video.webm">
    +
    +
    +
    +

    ... and GIFs!

    +
    +
    + +
    +

    Background Transitions

    +

    + Different background transitions are available via the backgroundTransition option. This one's called "zoom". +

    +
    Reveal.configure({ backgroundTransition: 'zoom' })
    +
    + +
    +

    Background Transitions

    +

    + You can override background transitions per-slide. +

    +
    <section data-background-transition="zoom">
    +
    + +
    +

    Pretty Code

    +
    
    +function linkify( selector ) {
    +  if( supports3DTransforms ) {
    +
    +    var nodes = document.querySelectorAll( selector );
    +
    +    for( var i = 0, len = nodes.length; i < len; i++ ) {
    +      var node = nodes[i];
    +
    +      if( !node.className ) {
    +        node.className += ' roll';
    +      }
    +    }
    +  }
    +}
    +					
    +

    Code syntax highlighting courtesy of highlight.js.

    +
    + +
    +

    Marvelous List

    +
      +
    • No order here
    • +
    • Or here
    • +
    • Or here
    • +
    • Or here
    • +
    +
    + +
    +

    Fantastic Ordered List

    +
      +
    1. One is smaller than...
    2. +
    3. Two is smaller than...
    4. +
    5. Three!
    6. +
    +
    + +
    +

    Tabular Tables

    + + + + + + + + + + + + + + + + + + + + + + + + + +
    ItemValueQuantity
    Apples$17
    Lemonade$218
    Bread$32
    +
    + +
    +

    Clever Quotes

    +

    + These guys come in two forms, inline: + “The nice thing about standards is that there are so many to choose from” and block: +

    +
    + “For years there has been a theory that millions of monkeys typing at random on millions of typewriters would + reproduce the entire works of Shakespeare. The Internet has proven this theory to be untrue.” +
    +
    + +
    +

    Intergalactic Interconnections

    +

    + You can link between slides internally, + like this. +

    +
    + +
    +

    Speaker View

    +

    There's a speaker view. It includes a timer, preview of the upcoming slide as well as your speaker notes.

    +

    Press the S key to try it out.

    + + +
    + +
    +

    Export to PDF

    +

    Presentations can be exported to PDF, here's an example:

    + +
    + +
    +

    Global State

    +

    + Set data-state="something" on a slide and "something" + will be added as a class to the document element when the slide is open. This lets you + apply broader style changes, like switching the page background. +

    +
    + +
    +

    State Events

    +

    + Additionally custom events can be triggered on a per slide basis by binding to the data-state name. +

    +
    
    +Reveal.addEventListener( 'customevent', function() {
    +	console.log( '"customevent" has fired' );
    +} );
    +					
    +
    + +
    +

    Take a Moment

    +

    + Press B or . on your keyboard to pause the presentation. This is helpful when you're on stage and want to take distracting slides off the screen. +

    +
    + +
    +

    Much more

    + +
    + +
    +

    THE END

    +

    + - Try the online editor
    + - Source code & documentation +

    +
    + +
    + +
    + + + + + + + + + + + + + + + + + + + + From 4e416fdc58685986059df745dfa78b8bb77447bb Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Sun, 20 Mar 2016 18:52:12 +0100 Subject: [PATCH 054/228] remove unintentionally added file --- lab.html | 526 ------------------------------------------------------- 1 file changed, 526 deletions(-) delete mode 100644 lab.html diff --git a/lab.html b/lab.html deleted file mode 100644 index 0e1ae6b..0000000 --- a/lab.html +++ /dev/null @@ -1,526 +0,0 @@ - - - - - - - reveal.js – The HTML Presentation Framework - - - - - - - - - - - - - - - - - - - - - - - -
    - - -
    -
    -

    Reveal.js

    -

    The HTML Presentation Framework

    - -
    - -
    -

    Hello There

    -

    - reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. -

    -
    - - -
    -
    -

    Vertical Slides

    -

    Slides can be nested inside of each other.

    -

    Use the Space key to navigate through all slides.

    -
    - - Down arrow - -
    -
    -

    Basement Level 1

    -

    Nested slides are useful for adding additional detail underneath a high level horizontal slide.

    -
    -
    -

    Basement Level 2

    -

    That's it, time to go back up.

    -
    - - Up arrow - -
    -
    - -
    -

    Slides

    -

    - Not a coder? Not a problem. There's a fully-featured visual editor for authoring these, try it out at http://slides.com. -

    -
    - -
    -

    Point of View

    -

    - Press ESC to enter the slide overview. -

    -

    - Hold down alt and click on any element to zoom in on it using zoom.js. Alt + click anywhere to zoom back out. -

    -
    - -
    -

    Touch Optimized

    -

    - Presentations look great on touch devices, like mobile phones and tablets. Simply swipe through your slides. -

    -
    - -
    - -
    - -
    -
    -

    Fragments

    -

    Hit the next arrow...

    -

    ... to step through ...

    -

    ... a fragmented slide.

    - - -
    -
    -

    Fragment Styles

    -

    There's different types of fragments, like:

    -

    grow

    -

    shrink

    -

    fade-out

    -

    fade-up (also down, left and right!)

    -

    current-visible

    -

    Highlight red blue green

    -
    -
    - -
    -

    Transition Styles

    -

    - You can select from different transitions, like:
    - None - - Fade - - Slide - - Convex - - Concave - - Zoom -

    -
    - -
    -

    Themes

    -

    - reveal.js comes with a few themes built in:
    - - Black (default) - - White - - League - - Sky - - Beige - - Simple
    - Serif - - Blood - - Night - - Moon - - Solarized -

    -
    - -
    -
    -

    Slide Backgrounds

    -

    - Set data-background="#dddddd" on a slide to change the background color. All CSS color formats are supported. -

    - - Down arrow - -
    -
    -

    Image Backgrounds

    -
    <section data-background="image.png">
    -
    -
    -

    Tiled Backgrounds

    -
    <section data-background="image.png" data-background-repeat="repeat" data-background-size="100px">
    -
    -
    -
    -

    Video Backgrounds

    -
    <section data-background-video="video.mp4,video.webm">
    -
    -
    -
    -

    ... and GIFs!

    -
    -
    - -
    -

    Background Transitions

    -

    - Different background transitions are available via the backgroundTransition option. This one's called "zoom". -

    -
    Reveal.configure({ backgroundTransition: 'zoom' })
    -
    - -
    -

    Background Transitions

    -

    - You can override background transitions per-slide. -

    -
    <section data-background-transition="zoom">
    -
    - -
    -

    Pretty Code

    -
    
    -function linkify( selector ) {
    -  if( supports3DTransforms ) {
    -
    -    var nodes = document.querySelectorAll( selector );
    -
    -    for( var i = 0, len = nodes.length; i < len; i++ ) {
    -      var node = nodes[i];
    -
    -      if( !node.className ) {
    -        node.className += ' roll';
    -      }
    -    }
    -  }
    -}
    -					
    -

    Code syntax highlighting courtesy of highlight.js.

    -
    - -
    -

    Marvelous List

    -
      -
    • No order here
    • -
    • Or here
    • -
    • Or here
    • -
    • Or here
    • -
    -
    - -
    -

    Fantastic Ordered List

    -
      -
    1. One is smaller than...
    2. -
    3. Two is smaller than...
    4. -
    5. Three!
    6. -
    -
    - -
    -

    Tabular Tables

    - - - - - - - - - - - - - - - - - - - - - - - - - -
    ItemValueQuantity
    Apples$17
    Lemonade$218
    Bread$32
    -
    - -
    -

    Clever Quotes

    -

    - These guys come in two forms, inline: - “The nice thing about standards is that there are so many to choose from” and block: -

    -
    - “For years there has been a theory that millions of monkeys typing at random on millions of typewriters would - reproduce the entire works of Shakespeare. The Internet has proven this theory to be untrue.” -
    -
    - -
    -

    Intergalactic Interconnections

    -

    - You can link between slides internally, - like this. -

    -
    - -
    -

    Speaker View

    -

    There's a speaker view. It includes a timer, preview of the upcoming slide as well as your speaker notes.

    -

    Press the S key to try it out.

    - - -
    - -
    -

    Export to PDF

    -

    Presentations can be exported to PDF, here's an example:

    - -
    - -
    -

    Global State

    -

    - Set data-state="something" on a slide and "something" - will be added as a class to the document element when the slide is open. This lets you - apply broader style changes, like switching the page background. -

    -
    - -
    -

    State Events

    -

    - Additionally custom events can be triggered on a per slide basis by binding to the data-state name. -

    -
    
    -Reveal.addEventListener( 'customevent', function() {
    -	console.log( '"customevent" has fired' );
    -} );
    -					
    -
    - -
    -

    Take a Moment

    -

    - Press B or . on your keyboard to pause the presentation. This is helpful when you're on stage and want to take distracting slides off the screen. -

    -
    - -
    -

    Much more

    - -
    - -
    -

    THE END

    -

    - - Try the online editor
    - - Source code & documentation -

    -
    - -
    - -
    - - - - - - - - - - - - - - - - - - - - From 00b9c2b929dd46303696326c9b4bcbf3362578ac Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Sun, 20 Mar 2016 18:57:30 +0100 Subject: [PATCH 055/228] minor tweaks --- demo.html | 2 +- index.html | 5 ++--- 2 files changed, 3 insertions(+), 4 deletions(-) diff --git a/demo.html b/demo.html index 17dfb35..ed777cf 100644 --- a/demo.html +++ b/demo.html @@ -17,7 +17,7 @@ - + diff --git a/index.html b/index.html index d278354..0c7a672 100644 --- a/index.html +++ b/index.html @@ -2,15 +2,14 @@ + reveal.js - - - + From a9566dfbd48741b4566b4bdbe07c1222dd48771f Mon Sep 17 00:00:00 2001 From: Vincent Bernat Date: Thu, 24 Mar 2016 16:23:12 +0100 Subject: [PATCH 056/228] make theme "simple" use white titles on dark backgrounds This is similar to what is done in the "white" theme. --- css/theme/simple.css | 3 +++ css/theme/source/simple.scss | 5 +++++ 2 files changed, 8 insertions(+) diff --git a/css/theme/simple.css b/css/theme/simple.css index b17fa5c..8b48be1 100644 --- a/css/theme/simple.css +++ b/css/theme/simple.css @@ -7,6 +7,9 @@ */ @import url(https://fonts.googleapis.com/css?family=News+Cycle:400,700); @import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic); +section.has-dark-background, section.has-dark-background h1, section.has-dark-background h2, section.has-dark-background h3, section.has-dark-background h4, section.has-dark-background h5, section.has-dark-background h6 { + color: #fff; } + /********************************************* * GLOBAL STYLES *********************************************/ diff --git a/css/theme/source/simple.scss b/css/theme/source/simple.scss index 84c7d9b..394c9cd 100644 --- a/css/theme/source/simple.scss +++ b/css/theme/source/simple.scss @@ -31,6 +31,11 @@ $linkColor: #00008B; $linkColorHover: lighten( $linkColor, 20% ); $selectionBackgroundColor: rgba(0, 0, 0, 0.99); +section.has-dark-background { + &, h1, h2, h3, h4, h5, h6 { + color: #fff; + } +} // Theme template ------------------------------ From 37ac67dba55b331e07c18c0edc781ff6290338fe Mon Sep 17 00:00:00 2001 From: Tomasz Ducin Date: Sat, 2 Apr 2016 19:43:15 +0200 Subject: [PATCH 057/228] Table of contents added in README.md --- README.md | 57 +++++++++++++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 55 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index d29d0ee..f37a04c 100644 --- a/README.md +++ b/README.md @@ -1,11 +1,64 @@ -# reveal.js [![Build Status](https://travis-ci.org/hakimel/reveal.js.svg?branch=master)](https://travis-ci.org/hakimel/reveal.js) +# reveal.js + +[![Build Status](https://travis-ci.org/hakimel/reveal.js.svg?branch=master)](https://travis-ci.org/hakimel/reveal.js) A framework for easily creating beautiful presentations using HTML. [Check out the live demo](http://lab.hakim.se/reveal-js/). reveal.js comes with a broad range of features including [nested slides](https://github.com/hakimel/reveal.js#markup), [Markdown contents](https://github.com/hakimel/reveal.js#markdown), [PDF export](https://github.com/hakimel/reveal.js#pdf-export), [speaker notes](https://github.com/hakimel/reveal.js#speaker-notes) and a [JavaScript API](https://github.com/hakimel/reveal.js#api). It's best viewed in a modern browser but [fallbacks](https://github.com/hakimel/reveal.js/wiki/Browser-Support) are available to make sure your presentation can still be viewed elsewhere. +# Table of contents +- [reveal.js](#revealjs) + - [More reading](#more-reading) + - [Online Editor](#online-editor) + - [Instructions](#instructions) + - [Markup](#markup) + - [Markdown](#markdown) + - [External Markdown](#external-markdown) + - [Element Attributes](#element-attributes) + - [Slide Attributes](#slide-attributes) + - [Configuration](#configuration) + - [Presentation Size](#presentation-size) + - [Dependencies](#dependencies) + - [Ready Event](#ready-event) + - [Auto-sliding](#auto-sliding) + - [Keyboard Bindings](#keyboard-bindings) + - [Touch Navigation](#touch-navigation) + - [Lazy Loading](#lazy-loading) + - [API](#api) + - [Slide Changed Event](#slide-changed-event) + - [Presentation State](#presentation-state) + - [Slide States](#slide-states) + - [Slide Backgrounds](#slide-backgrounds) + - [Parallax Background](#parallax-background) + - [Slide Transitions](#slide-transitions) + - [Internal links](#internal-links) + - [Fragments](#fragments) + - [Fragment events](#fragment-events) + - [Code syntax highlighting](#code-syntax-highlighting) + - [Slide number](#slide-number) + - [Overview mode](#overview-mode) + - [Fullscreen mode](#fullscreen-mode) + - [Embedded media](#embedded-media) + - [Stretching elements](#stretching-elements) + - [postMessage API](#postmessage-api) + - [PDF Export](#pdf-export) + - [Theming](#theming) + - [Speaker Notes](#speaker-notes) + - [Share and Print Speaker Notes](#share-and-print-speaker-notes) + - [Server Side Speaker Notes](#server-side-speaker-notes) + - [Multiplexing](#multiplexing) + - [Master presentation](#master-presentation) + - [Client presentation](#client-presentation) + - [Socket.io server](#socketio-server) + - [socket.io server as file static server](#socketio-server-as-file-static-server) + - [MathJax](#mathjax) + - [Installation](#installation) + - [Basic setup](#basic-setup) + - [Full setup](#full-setup) + - [Folder Structure](#folder-structure) + - [License](#license) -#### More reading: +#### More reading - [Installation](#installation): Step-by-step instructions for getting reveal.js running on your computer. - [Changelog](https://github.com/hakimel/reveal.js/releases): Up-to-date version history. - [Examples](https://github.com/hakimel/reveal.js/wiki/Example-Presentations): Presentations created with reveal.js, add your own! From 520fa4986eba954cba5d3a0ffa6f3697edba5047 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 7 Apr 2016 09:07:19 +0200 Subject: [PATCH 058/228] generalize scroll offset prevention --- js/reveal.js | 30 +++++++++++++++--------------- 1 file changed, 15 insertions(+), 15 deletions(-) diff --git a/js/reveal.js b/js/reveal.js index 575214e..0b1cad7 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -410,8 +410,8 @@ // Listen to messages posted to this window setupPostMessage(); - // Prevent iframes from scrolling the slides out of view - setupIframeScrollPrevention(); + // Prevent the slides from being scrolled out of view + setupScrollPrevention(); // Resets all vertical slides so that only the first is visible resetVerticalSlides(); @@ -642,22 +642,22 @@ } /** - * This is an unfortunate necessity. Iframes can trigger the - * parent window to scroll, for example by focusing an input. + * This is an unfortunate necessity. Some actions – such as + * an input field being focused in an iframe or using the + * keyboard to expand text selection beyond the bounds of + * a slide – can trigger our content to be pushed out of view. * This scrolling can not be prevented by hiding overflow in - * CSS so we have to resort to repeatedly checking if the - * browser has decided to offset our slides :( + * CSS (we already do) so we have to resort to repeatedly + * checking if the slides have been offset :( */ - function setupIframeScrollPrevention() { + function setupScrollPrevention() { - if( dom.slides.querySelector( 'iframe' ) ) { - setInterval( function() { - if( dom.wrapper.scrollTop !== 0 || dom.wrapper.scrollLeft !== 0 ) { - dom.wrapper.scrollTop = 0; - dom.wrapper.scrollLeft = 0; - } - }, 500 ); - } + setInterval( function() { + if( dom.wrapper.scrollTop !== 0 || dom.wrapper.scrollLeft !== 0 ) { + dom.wrapper.scrollTop = 0; + dom.wrapper.scrollLeft = 0; + } + }, 1000 ); } From f98b5ccdcaee8106662151da3eeb9cd0b64761bf Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 7 Apr 2016 09:55:04 +0200 Subject: [PATCH 059/228] Update README.md readme tweaks --- README.md | 104 +++++++++++++++++++++++++----------------------------- 1 file changed, 49 insertions(+), 55 deletions(-) diff --git a/README.md b/README.md index f37a04c..9e6cbe4 100644 --- a/README.md +++ b/README.md @@ -1,65 +1,59 @@ -# reveal.js - -[![Build Status](https://travis-ci.org/hakimel/reveal.js.svg?branch=master)](https://travis-ci.org/hakimel/reveal.js) +# reveal.js [![Build Status](https://travis-ci.org/hakimel/reveal.js.svg?branch=master)](https://travis-ci.org/hakimel/reveal.js) A framework for easily creating beautiful presentations using HTML. [Check out the live demo](http://lab.hakim.se/reveal-js/). reveal.js comes with a broad range of features including [nested slides](https://github.com/hakimel/reveal.js#markup), [Markdown contents](https://github.com/hakimel/reveal.js#markdown), [PDF export](https://github.com/hakimel/reveal.js#pdf-export), [speaker notes](https://github.com/hakimel/reveal.js#speaker-notes) and a [JavaScript API](https://github.com/hakimel/reveal.js#api). It's best viewed in a modern browser but [fallbacks](https://github.com/hakimel/reveal.js/wiki/Browser-Support) are available to make sure your presentation can still be viewed elsewhere. -# Table of contents -- [reveal.js](#revealjs) - - [More reading](#more-reading) - - [Online Editor](#online-editor) - - [Instructions](#instructions) - - [Markup](#markup) - - [Markdown](#markdown) - - [External Markdown](#external-markdown) - - [Element Attributes](#element-attributes) - - [Slide Attributes](#slide-attributes) - - [Configuration](#configuration) - - [Presentation Size](#presentation-size) - - [Dependencies](#dependencies) - - [Ready Event](#ready-event) - - [Auto-sliding](#auto-sliding) - - [Keyboard Bindings](#keyboard-bindings) - - [Touch Navigation](#touch-navigation) - - [Lazy Loading](#lazy-loading) - - [API](#api) - - [Slide Changed Event](#slide-changed-event) - - [Presentation State](#presentation-state) - - [Slide States](#slide-states) - - [Slide Backgrounds](#slide-backgrounds) - - [Parallax Background](#parallax-background) - - [Slide Transitions](#slide-transitions) - - [Internal links](#internal-links) - - [Fragments](#fragments) - - [Fragment events](#fragment-events) - - [Code syntax highlighting](#code-syntax-highlighting) - - [Slide number](#slide-number) - - [Overview mode](#overview-mode) - - [Fullscreen mode](#fullscreen-mode) - - [Embedded media](#embedded-media) - - [Stretching elements](#stretching-elements) - - [postMessage API](#postmessage-api) - - [PDF Export](#pdf-export) - - [Theming](#theming) - - [Speaker Notes](#speaker-notes) - - [Share and Print Speaker Notes](#share-and-print-speaker-notes) - - [Server Side Speaker Notes](#server-side-speaker-notes) - - [Multiplexing](#multiplexing) - - [Master presentation](#master-presentation) - - [Client presentation](#client-presentation) - - [Socket.io server](#socketio-server) - - [socket.io server as file static server](#socketio-server-as-file-static-server) - - [MathJax](#mathjax) - - [Installation](#installation) - - [Basic setup](#basic-setup) - - [Full setup](#full-setup) - - [Folder Structure](#folder-structure) - - [License](#license) +## Table of contents +- [Online Editor](#online-editor) +- [Instructions](#instructions) + - [Markup](#markup) + - [Markdown](#markdown) + - [External Markdown](#external-markdown) + - [Element Attributes](#element-attributes) + - [Slide Attributes](#slide-attributes) +- [Configuration](#configuration) +- [Presentation Size](#presentation-size) +- [Dependencies](#dependencies) +- [Ready Event](#ready-event) +- [Auto-sliding](#auto-sliding) +- [Keyboard Bindings](#keyboard-bindings) +- [Touch Navigation](#touch-navigation) +- [Lazy Loading](#lazy-loading) +- [API](#api) + - [Slide Changed Event](#slide-changed-event) + - [Presentation State](#presentation-state) + - [Slide States](#slide-states) + - [Slide Backgrounds](#slide-backgrounds) + - [Parallax Background](#parallax-background) + - [Slide Transitions](#slide-transitions) + - [Internal links](#internal-links) + - [Fragments](#fragments) + - [Fragment events](#fragment-events) + - [Code syntax highlighting](#code-syntax-highlighting) + - [Slide number](#slide-number) + - [Overview mode](#overview-mode) + - [Fullscreen mode](#fullscreen-mode) + - [Embedded media](#embedded-media) + - [Stretching elements](#stretching-elements) + - [postMessage API](#postmessage-api) +- [PDF Export](#pdf-export) +- [Theming](#theming) +- [Speaker Notes](#speaker-notes) + - [Share and Print Speaker Notes](#share-and-print-speaker-notes) + - [Server Side Speaker Notes](#server-side-speaker-notes) +- [Multiplexing](#multiplexing) + - [Master presentation](#master-presentation) + - [Client presentation](#client-presentation) + - [Socket.io server](#socketio-server) +- [MathJax](#mathjax) +- [Installation](#installation) + - [Basic setup](#basic-setup) + - [Full setup](#full-setup) + - [Folder Structure](#folder-structure) +- [License](#license) #### More reading -- [Installation](#installation): Step-by-step instructions for getting reveal.js running on your computer. - [Changelog](https://github.com/hakimel/reveal.js/releases): Up-to-date version history. - [Examples](https://github.com/hakimel/reveal.js/wiki/Example-Presentations): Presentations created with reveal.js, add your own! - [Browser Support](https://github.com/hakimel/reveal.js/wiki/Browser-Support): Explanation of browser support and fallbacks. From eca7113f5944c69a2fdf3279779d80229279e5de Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 7 Apr 2016 09:55:44 +0200 Subject: [PATCH 060/228] Update README.md --- README.md | 1 - 1 file changed, 1 deletion(-) diff --git a/README.md b/README.md index 9e6cbe4..dcab23e 100644 --- a/README.md +++ b/README.md @@ -9,7 +9,6 @@ reveal.js comes with a broad range of features including [nested slides](https:/ - [Instructions](#instructions) - [Markup](#markup) - [Markdown](#markdown) - - [External Markdown](#external-markdown) - [Element Attributes](#element-attributes) - [Slide Attributes](#slide-attributes) - [Configuration](#configuration) From 07c2355604ad52103ff95d481252c1ef8086241e Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 7 Apr 2016 10:24:44 +0200 Subject: [PATCH 061/228] support for standalone multiplexing --- plugin/multiplex/index.js | 10 +++++++++- plugin/multiplex/package.json | 19 +++++++++++++++++++ 2 files changed, 28 insertions(+), 1 deletion(-) create mode 100644 plugin/multiplex/package.json diff --git a/plugin/multiplex/index.js b/plugin/multiplex/index.js index 40c1661..8195f04 100644 --- a/plugin/multiplex/index.js +++ b/plugin/multiplex/index.js @@ -31,7 +31,15 @@ io.on( 'connection', function( socket ) { app.get("/", function(req, res) { res.writeHead(200, {'Content-Type': 'text/html'}); - fs.createReadStream(opts.baseDir + '/index.html').pipe(res); + + var stream = fs.createReadStream(opts.baseDir + '/index.html'); + stream.on('error', function( error ) { + res.write('

    reveal.js multiplex server.

    Generate token'); + res.end(); + }); + stream.on('readable', function() { + stream.pipe(res); + }); }); app.get("/token", function(req,res) { diff --git a/plugin/multiplex/package.json b/plugin/multiplex/package.json new file mode 100644 index 0000000..368bfd6 --- /dev/null +++ b/plugin/multiplex/package.json @@ -0,0 +1,19 @@ +{ + "name": "reveal-js-multiplex", + "version": "1.0.0", + "description": "reveal.js multiplex server", + "homepage": "http://lab.hakim.se/reveal-js", + "scripts": { + "start": "node index.js" + }, + "engines": { + "node": "~4.1.1" + }, + "dependencies": { + "express": "~4.13.3", + "grunt-cli": "~0.1.13", + "mustache": "~2.2.1", + "socket.io": "~1.3.7" + }, + "license": "MIT" +} From f85a1e9f1ac6c075b3128f8e5070681bc97eeb5b Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 7 Apr 2016 10:25:10 +0200 Subject: [PATCH 062/228] remove test content --- demo.html | 23 +---------------------- 1 file changed, 1 insertion(+), 22 deletions(-) diff --git a/demo.html b/demo.html index ed777cf..980bc6f 100644 --- a/demo.html +++ b/demo.html @@ -48,32 +48,11 @@

    -
    +

    Hello There

    reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do.

    -

    - reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. -

    -

    - reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. -

    -

    - reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. -

    -

    - reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. -

    -

    - reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. -

    -

    - reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. -

    -

    - reveal.js enables you to create beautiful interactive slide decks using HTML. This presentation will show you examples of what it can do. --- -

    From d6406e433e94a6755bf8ef5214c71503aa1668e9 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 7 Apr 2016 10:31:41 +0200 Subject: [PATCH 063/228] new multiplex server courtesy of now.sh (closes #1377) --- README.md | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/README.md b/README.md index dcab23e..46655eb 100644 --- a/README.md +++ b/README.md @@ -870,7 +870,7 @@ Then: ## Multiplexing -The multiplex plugin allows your audience to view the slides of the presentation you are controlling on their own phone, tablet or laptop. As the master presentation navigates the slides, all client presentations will update in real time. See a demo at [http://revealjs-51546.onmodulus.net/](http://revealjs-51546.onmodulus.net/). +The multiplex plugin allows your audience to view the slides of the presentation you are controlling on their own phone, tablet or laptop. As the master presentation navigates the slides, all client presentations will update in real time. See a demo at [https://reveal-js-multiplex-ccjbegmaii.now.sh/](https://reveal-js-multiplex-ccjbegmaii.now.sh/). The multiplex plugin needs the following 3 things to operate: @@ -899,7 +899,7 @@ Reveal.initialize({ // Example values. To generate your own, see the socket.io server instructions. secret: '13652805320794272084', // Obtained from the socket.io server. Gives this (the master) control of the presentation id: '1ea875674b17ca76', // Obtained from socket.io server - url: 'revealjs-51546.onmodulus.net:80' // Location of socket.io server + url: 'https://reveal-js-multiplex-ccjbegmaii.now.sh' // Location of socket.io server }, // Don't forget to add the dependencies @@ -927,7 +927,7 @@ Reveal.initialize({ // Example values. To generate your own, see the socket.io server instructions. secret: null, // null so the clients do not have control of the master presentation id: '1ea875674b17ca76', // id, obtained from socket.io server - url: 'revealjs-51546.onmodulus.net:80' // Location of socket.io server + url: 'https://reveal-js-multiplex-ccjbegmaii.now.sh' // Location of socket.io server }, // Don't forget to add the dependencies @@ -946,15 +946,15 @@ Server that receives the slideChanged events from the master presentation and br 1. ```npm install``` 2. ```node plugin/multiplex``` -Or you use the socket.io server at [http://revealjs-51546.onmodulus.net/](http://revealjs-51546.onmodulus.net/). +Or you use the socket.io server at [https://reveal-js-multiplex-ccjbegmaii.now.sh/](https://reveal-js-multiplex-ccjbegmaii.now.sh/). -You'll need to generate a unique secret and token pair for your master and client presentations. To do so, visit ```http://example.com/token```, where ```http://example.com``` is the location of your socket.io server. Or if you're going to use the socket.io server at [http://revealjs-51546.onmodulus.net/](http://revealjs-51546.onmodulus.net/), visit [http://revealjs-51546.onmodulus.net/token](http://revealjs-51546.onmodulus.net/token). +You'll need to generate a unique secret and token pair for your master and client presentations. To do so, visit ```http://example.com/token```, where ```http://example.com``` is the location of your socket.io server. Or if you're going to use the socket.io server at [https://reveal-js-multiplex-ccjbegmaii.now.sh/](https://reveal-js-multiplex-ccjbegmaii.now.sh/), visit [https://reveal-js-multiplex-ccjbegmaii.now.sh/token](https://reveal-js-multiplex-ccjbegmaii.now.sh/token). -You are very welcome to point your presentations at the Socket.io server running at [http://revealjs-51546.onmodulus.net/](http://revealjs-51546.onmodulus.net/), but availability and stability are not guaranteed. For anything mission critical I recommend you run your own server. It is simple to deploy to nodejitsu, heroku, your own environment, etc. +You are very welcome to point your presentations at the Socket.io server running at [https://reveal-js-multiplex-ccjbegmaii.now.sh/](https://reveal-js-multiplex-ccjbegmaii.now.sh/), but availability and stability are not guaranteed. For anything mission critical I recommend you run your own server. It is simple to deploy to nodejitsu, heroku, your own environment, etc. ##### socket.io server as file static server -The socket.io server can play the role of static file server for your client presentation, as in the example at [http://revealjs-51546.onmodulus.net/](http://revealjs-51546.onmodulus.net/). (Open [http://revealjs-51546.onmodulus.net/](http://revealjs-51546.onmodulus.net/) in two browsers. Navigate through the slides on one, and the other will update to match.) +The socket.io server can play the role of static file server for your client presentation, as in the example at [https://reveal-js-multiplex-ccjbegmaii.now.sh/](https://reveal-js-multiplex-ccjbegmaii.now.sh/). (Open [https://reveal-js-multiplex-ccjbegmaii.now.sh/](https://reveal-js-multiplex-ccjbegmaii.now.sh/) in two browsers. Navigate through the slides on one, and the other will update to match.) Example configuration: ```javascript @@ -977,7 +977,7 @@ Reveal.initialize({ ] ``` -It can also play the role of static file server for your master presentation and client presentations at the same time (as long as you don't want to use speaker notes). (Open [http://revealjs-51546.onmodulus.net/](http://revealjs-51546.onmodulus.net/) in two browsers. Navigate through the slides on one, and the other will update to match. Navigate through the slides on the second, and the first will update to match.) This is probably not desirable, because you don't want your audience to mess with your slides while you're presenting. ;) +It can also play the role of static file server for your master presentation and client presentations at the same time (as long as you don't want to use speaker notes). (Open [https://reveal-js-multiplex-ccjbegmaii.now.sh/](https://reveal-js-multiplex-ccjbegmaii.now.sh/) in two browsers. Navigate through the slides on one, and the other will update to match. Navigate through the slides on the second, and the first will update to match.) This is probably not desirable, because you don't want your audience to mess with your slides while you're presenting. ;) Example configuration: ```javascript From a63c8cab92932dfb71097b40092d3c7c7c5429c1 Mon Sep 17 00:00:00 2001 From: Markku Roponen Date: Fri, 8 Apr 2016 15:47:27 +0300 Subject: [PATCH 064/228] Fixes #1549, now UA match is limiting out MS Edge and Chrome detection is improved. Also improved UserAgent access by storing it in to a local variable, it was accessed so many times in different places. --- js/reveal.js | 15 ++++++++++----- 1 file changed, 10 insertions(+), 5 deletions(-) diff --git a/js/reveal.js b/js/reveal.js index 0b1cad7..d224e96 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -32,6 +32,7 @@ HORIZONTAL_SLIDES_SELECTOR = '.slides>section', VERTICAL_SLIDES_SELECTOR = '.slides>section.present>section', HOME_SLIDE_SELECTOR = '.slides>section:first-of-type', + UA = navigator.userAgent, // Configuration defaults, can be overridden at initialization time config = { @@ -197,6 +198,9 @@ // Client is a mobile device, see #checkCapabilities() isMobileDevice, + // Client is a desktop Chrome, see #checkCapabilities() + isChrome, + // Throttles mouse wheel navigation lastMouseWheelStep = 0, @@ -301,7 +305,8 @@ */ function checkCapabilities() { - isMobileDevice = /(iphone|ipod|ipad|android)/gi.test( navigator.userAgent ); + isMobileDevice = /(iphone|ipod|ipad|android)/gi.test( UA ); + isChrome = /chrome/i.test( UA ) && !/edge/i.test( UA ); var testElement = document.createElement( 'div' ); @@ -324,13 +329,13 @@ // Transitions in the overview are disabled in desktop and // Safari due to lag - features.overviewTransitions = !/Version\/[\d\.]+.*Safari/.test( navigator.userAgent ); + features.overviewTransitions = !/Version\/[\d\.]+.*Safari/.test( UA ); // Flags if we should use zoom instead of transform to scale // up slides. Zoom produces crisper results but has a lot of // xbrowser quirks so we only use it in whitelsited browsers. features.zoom = 'zoom' in testElement.style && !isMobileDevice && - ( /chrome/i.test( navigator.userAgent ) || /Version\/[\d\.]+.*Safari/.test( navigator.userAgent ) ); + ( isChrome || /Version\/[\d\.]+.*Safari/.test( UA ) ); } @@ -1048,7 +1053,7 @@ // Only support touch for Android, fixes double navigations in // stock browser - if( navigator.userAgent.match( /android/gi ) ) { + if( UA.match( /android/gi ) ) { pointerEvents = [ 'touchstart' ]; } @@ -4183,7 +4188,7 @@ } // There's a bug with swiping on some Android devices unless // the default action is always prevented - else if( navigator.userAgent.match( /android/gi ) ) { + else if( UA.match( /android/gi ) ) { event.preventDefault(); } From 2dc546f5ba001a074296485ea17dd5d95c0c4d89 Mon Sep 17 00:00:00 2001 From: Ruben Oostinga <0xR@users.noreply.github.com> Date: Sat, 9 Apr 2016 12:33:46 +0200 Subject: [PATCH 065/228] Fix watching for markdown files `./*.md` didn't work `*.md` does work --- Gruntfile.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Gruntfile.js b/Gruntfile.js index 675adff..b8919bd 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -132,7 +132,7 @@ module.exports = function(grunt) { files: [ 'index.html'] }, markdown: { - files: [ './*.md' ] + files: [ '*.md' ] } } From 5a7ac78d4b7a75c29f8aedb00f66028d16bef729 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Sun, 10 Apr 2016 11:57:38 +0200 Subject: [PATCH 066/228] lazy load iframe in demo --- demo.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/demo.html b/demo.html index 980bc6f..36ad224 100644 --- a/demo.html +++ b/demo.html @@ -325,7 +325,7 @@ function linkify( selector ) {

    Export to PDF

    Presentations can be exported to PDF, here's an example:

    - +
    From a6507afcb4cb4245d8ac23b5be247b1c780163ed Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Sun, 10 Apr 2016 12:07:49 +0200 Subject: [PATCH 067/228] widen watch for html files, required for updates to demo.html --- Gruntfile.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Gruntfile.js b/Gruntfile.js index 09e797f..87630d5 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -126,7 +126,7 @@ module.exports = function(grunt) { tasks: 'css-core' }, html: { - files: [ 'index.html'] + files: [ '*.html'] }, markdown: { files: [ '*.md' ] From 5dd90671507f8f56b27fe9d8a2fd25c1adb08d6b Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Wed, 13 Apr 2016 15:21:30 +0200 Subject: [PATCH 068/228] overview now works with percentage based width/height #1247 --- css/reveal.css | 5 +++-- css/reveal.scss | 3 ++- js/reveal.js | 45 +++++++++++++++++++++------------------------ 3 files changed, 26 insertions(+), 27 deletions(-) diff --git a/css/reveal.css b/css/reveal.css index 3a31fa4..b203074 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -20,7 +20,7 @@ html, body, .reveal div, .reveal span, .reveal applet, .reveal object, .reveal i .reveal article, .reveal aside, .reveal canvas, .reveal details, .reveal embed, .reveal figure, .reveal figcaption, .reveal footer, .reveal header, .reveal hgroup, .reveal menu, .reveal nav, .reveal output, .reveal ruby, .reveal section, .reveal summary, -.reveal time, .reveal mark, .reveal audio, video { +.reveal time, .reveal mark, .reveal audio, .reveal video { margin: 0; padding: 0; border: 0; @@ -989,7 +989,8 @@ html:-moz-full-screen-ancestor { -webkit-perspective: 700px; perspective: 700px; } .reveal.overview .slides section { - height: 700px; + height: 100%; + top: 0 !important; opacity: 1 !important; overflow: hidden; visibility: visible !important; diff --git a/css/reveal.scss b/css/reveal.scss index 8cf8cda..f8d6904 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -1022,7 +1022,8 @@ html:-moz-full-screen-ancestor { perspective: 700px; .slides section { - height: 700px; + height: 100%; + top: 0 !important; opacity: 1 !important; overflow: hidden; visibility: visible !important; diff --git a/js/reveal.js b/js/reveal.js index 0b1cad7..96a6359 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -166,6 +166,10 @@ // Flags if the overview mode is currently active overview = false, + // Holds the dimensions of our overview slides, including margins + overviewSlideWidth = null, + overviewSlideHeight = null, + // The horizontal and vertical index of the currently active slide indexh, indexv, @@ -1798,6 +1802,17 @@ } } ); + // Calculate slide sizes + var margin = 70; + var slideSize = getComputedSlideSize(); + overviewSlideWidth = slideSize.width + margin; + overviewSlideHeight = slideSize.height + margin; + + // Reverse in RTL mode + if( config.rtl ) { + overviewSlideWidth = -overviewSlideWidth; + } + updateSlidesVisibility(); layoutOverview(); updateOverview(); @@ -1821,19 +1836,10 @@ */ function layoutOverview() { - var margin = 70; - var slideWidth = config.width + margin, - slideHeight = config.height + margin; - - // Reverse in RTL mode - if( config.rtl ) { - slideWidth = -slideWidth; - } - // Layout slides toArray( dom.wrapper.querySelectorAll( HORIZONTAL_SLIDES_SELECTOR ) ).forEach( function( hslide, h ) { hslide.setAttribute( 'data-index-h', h ); - transformElement( hslide, 'translate3d(' + ( h * slideWidth ) + 'px, 0, 0)' ); + transformElement( hslide, 'translate3d(' + ( h * overviewSlideWidth ) + 'px, 0, 0)' ); if( hslide.classList.contains( 'stack' ) ) { @@ -1841,7 +1847,7 @@ vslide.setAttribute( 'data-index-h', h ); vslide.setAttribute( 'data-index-v', v ); - transformElement( vslide, 'translate3d(0, ' + ( v * slideHeight ) + 'px, 0)' ); + transformElement( vslide, 'translate3d(0, ' + ( v * overviewSlideHeight ) + 'px, 0)' ); } ); } @@ -1849,10 +1855,10 @@ // Layout slide backgrounds toArray( dom.background.childNodes ).forEach( function( hbackground, h ) { - transformElement( hbackground, 'translate3d(' + ( h * slideWidth ) + 'px, 0, 0)' ); + transformElement( hbackground, 'translate3d(' + ( h * overviewSlideWidth ) + 'px, 0, 0)' ); toArray( hbackground.querySelectorAll( '.slide-background' ) ).forEach( function( vbackground, v ) { - transformElement( vbackground, 'translate3d(0, ' + ( v * slideHeight ) + 'px, 0)' ); + transformElement( vbackground, 'translate3d(0, ' + ( v * overviewSlideHeight ) + 'px, 0)' ); } ); } ); @@ -1864,19 +1870,10 @@ */ function updateOverview() { - var margin = 70; - var slideWidth = config.width + margin, - slideHeight = config.height + margin; - - // Reverse in RTL mode - if( config.rtl ) { - slideWidth = -slideWidth; - } - transformSlides( { overview: [ - 'translateX('+ ( -indexh * slideWidth ) +'px)', - 'translateY('+ ( -indexv * slideHeight ) +'px)', + 'translateX('+ ( -indexh * overviewSlideWidth ) +'px)', + 'translateY('+ ( -indexv * overviewSlideHeight ) +'px)', 'translateZ('+ ( window.innerWidth < 400 ? -1000 : -2500 ) +'px)' ].join( ' ' ) } ); From 1efa52486c8712507b8a343b26b227e834da5fe6 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Wed, 13 Apr 2016 15:37:04 +0200 Subject: [PATCH 069/228] readme tweak for #1535 --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 9208ee1..b181bc0 100644 --- a/README.md +++ b/README.md @@ -875,7 +875,7 @@ Reveal.initialize({ Then: -1. Install [Node.js](http://nodejs.org/) +1. Install [Node.js](http://nodejs.org/) (1.0.0 or later) 2. Run ```npm install``` 3. Run ```node plugin/notes-server``` @@ -1061,7 +1061,7 @@ The core of reveal.js is very easy to install. You'll simply need to download a Some reveal.js features, like external Markdown and speaker notes, require that presentations run from a local web server. The following instructions will set up such a server as well as all of the development tasks needed to make edits to the reveal.js source code. -1. Install [Node.js](http://nodejs.org/) +1. Install [Node.js](http://nodejs.org/) (1.0.0 or later) 2. Install [Grunt](http://gruntjs.com/getting-started#installing-the-cli) From fc3e4d7f2392f6e406067021df180acda7a9085c Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Mon, 18 Apr 2016 14:50:36 +0200 Subject: [PATCH 070/228] change introduction --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index b181bc0..13bf457 100644 --- a/README.md +++ b/README.md @@ -2,7 +2,7 @@ A framework for easily creating beautiful presentations using HTML. [Check out the live demo](http://lab.hakim.se/reveal-js/). -reveal.js comes with a broad range of features including [nested slides](https://github.com/hakimel/reveal.js#markup), [Markdown contents](https://github.com/hakimel/reveal.js#markdown), [PDF export](https://github.com/hakimel/reveal.js#pdf-export), [speaker notes](https://github.com/hakimel/reveal.js#speaker-notes) and a [JavaScript API](https://github.com/hakimel/reveal.js#api). It's best viewed in a modern browser but [fallbacks](https://github.com/hakimel/reveal.js/wiki/Browser-Support) are available to make sure your presentation can still be viewed elsewhere. +reveal.js comes with a broad range of features including [nested slides](https://github.com/hakimel/reveal.js#markup), [Markdown contents](https://github.com/hakimel/reveal.js#markdown), [PDF export](https://github.com/hakimel/reveal.js#pdf-export), [speaker notes](https://github.com/hakimel/reveal.js#speaker-notes) and a [JavaScript API](https://github.com/hakimel/reveal.js#api). There's also a fully featured visual editor and platform for sharing reveal.js presentations at [slides.com](https://slides.com). ## Table of contents - [Online Editor](#online-editor) From 539e774d31f91676bcc3f75e28168921cd27d819 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Mon, 18 Apr 2016 15:29:51 +0200 Subject: [PATCH 071/228] 3.3.0 --- bower.json | 2 +- js/reveal.js | 2 +- package.json | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/bower.json b/bower.json index 5561820..a42ca8d 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "reveal.js", - "version": "3.2.0", + "version": "3.3.0", "main": [ "js/reveal.js", "css/reveal.css" diff --git a/js/reveal.js b/js/reveal.js index dbb227b..10c609e 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -26,7 +26,7 @@ var Reveal; // The reveal.js version - var VERSION = '3.2.0'; + var VERSION = '3.3.0'; var SLIDES_SELECTOR = '.slides section', HORIZONTAL_SLIDES_SELECTOR = '.slides>section', diff --git a/package.json b/package.json index 043eac1..3135f35 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "reveal.js", - "version": "3.2.0", + "version": "3.3.0", "description": "The HTML Presentation Framework", "homepage": "http://lab.hakim.se/reveal-js", "subdomain": "revealjs", From 87b082340febab46326a55416fbd83fb591bb812 Mon Sep 17 00:00:00 2001 From: Adrian Sieber Date: Sun, 24 Apr 2016 09:39:23 +0000 Subject: [PATCH 072/228] Simplify full setup --- README.md | 16 +++++++--------- 1 file changed, 7 insertions(+), 9 deletions(-) diff --git a/README.md b/README.md index 13bf457..e229f1e 100644 --- a/README.md +++ b/README.md @@ -1063,31 +1063,29 @@ Some reveal.js features, like external Markdown and speaker notes, require that 1. Install [Node.js](http://nodejs.org/) (1.0.0 or later) -2. Install [Grunt](http://gruntjs.com/getting-started#installing-the-cli) - -4. Clone the reveal.js repository +1. Clone the reveal.js repository ```sh $ git clone https://github.com/hakimel/reveal.js.git ``` -5. Navigate to the reveal.js folder +1. Navigate to the reveal.js folder ```sh $ cd reveal.js ``` -6. Install dependencies +1. Install dependencies ```sh $ npm install ``` -7. Serve the presentation and monitor source files for changes +1. Serve the presentation and monitor source files for changes ```sh - $ grunt serve + $ npm start ``` -8. Open to view your presentation +1. Open to view your presentation - You can change the port by using `grunt serve --port 8001`. + You can change the port by using `npm start -- --port 8001`. ### Folder Structure From a0e6da6a9cf4372c20230e1c7e076375539bd8d5 Mon Sep 17 00:00:00 2001 From: Jess Telford Date: Fri, 22 Apr 2016 08:18:20 +1000 Subject: [PATCH 073/228] More natural zooming on block level elements Switching a `display: block` element to `display: inline-block` allows calculating the bounds based on the contents of the div rather than the entire container (which is often `width: 100%`). This provides a much more natural zoom, especially for paragraphs and code examples. --- plugin/zoom-js/zoom.js | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/plugin/zoom-js/zoom.js b/plugin/zoom-js/zoom.js index 95093e0..efccad6 100644 --- a/plugin/zoom-js/zoom.js +++ b/plugin/zoom-js/zoom.js @@ -11,7 +11,17 @@ if( event[ modifier ] && isEnabled ) { event.preventDefault(); - var bounds = event.target.getBoundingClientRect(); + var bounds; + var originalDisplay = event.target.style.display; + + // Get the bounding rect of the contents, not the containing box + if (window.getComputedStyle(event.target).display === 'block') { + event.target.style.display = 'inline-block'; + bounds = event.target.getBoundingClientRect(); + event.target.style.display = originalDisplay; + } else { + bounds = event.target.getBoundingClientRect(); + } zoom.to({ x: ( bounds.left * revealScale ) - zoomPadding, From 66c4e6a77fed49cf970ac306b50320f409abbc6b Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Wed, 27 Apr 2016 11:12:16 +0200 Subject: [PATCH 074/228] use scrollHeight instead of custom measurement --- js/reveal.js | 45 ++++----------------------------------------- 1 file changed, 4 insertions(+), 41 deletions(-) diff --git a/js/reveal.js b/js/reveal.js index 10c609e..8975504 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -589,7 +589,7 @@ var left = ( pageWidth - slideWidth ) / 2, top = ( pageHeight - slideHeight ) / 2; - var contentHeight = getAbsoluteHeight( slide ); + var contentHeight = slide.scrollHeight; var numberOfPages = Math.max( Math.ceil( contentHeight / pageHeight ), 1 ); // Center slides vertically @@ -1290,41 +1290,6 @@ } - /** - * Retrieves the height of the given element by looking - * at the position and height of its immediate children. - */ - function getAbsoluteHeight( element ) { - - var height = 0; - - if( element ) { - var absoluteChildren = 0; - - toArray( element.childNodes ).forEach( function( child ) { - - if( typeof child.offsetTop === 'number' && child.style ) { - // Count # of abs children - if( window.getComputedStyle( child ).position === 'absolute' ) { - absoluteChildren += 1; - } - - height = Math.max( height, child.offsetTop + child.offsetHeight ); - } - - } ); - - // If there are no absolute children, use offsetHeight - if( absoluteChildren === 0 ) { - height = element.offsetHeight; - } - - } - - return height; - - } - /** * Returns the remaining height within the parent of the * target element. @@ -1589,10 +1554,8 @@ var size = getComputedSlideSize(); - var slidePadding = 20; // TODO Dig this out of DOM - // Layout the contents of the slides - layoutSlideContents( config.width, config.height, slidePadding ); + layoutSlideContents( config.width, config.height ); dom.slides.style.width = size.width + 'px'; dom.slides.style.height = size.height + 'px'; @@ -1654,7 +1617,7 @@ slide.style.top = 0; } else { - slide.style.top = Math.max( ( ( size.height - getAbsoluteHeight( slide ) ) / 2 ) - slidePadding, 0 ) + 'px'; + slide.style.top = Math.max( ( size.height - slide.scrollHeight ) / 2, 0 ) + 'px'; } } else { @@ -1674,7 +1637,7 @@ * Applies layout logic to the contents of all slides in * the presentation. */ - function layoutSlideContents( width, height, padding ) { + function layoutSlideContents( width, height ) { // Handle sizing of elements with the 'stretch' class toArray( dom.slides.querySelectorAll( 'section > .stretch' ) ).forEach( function( element ) { From d1a3656108ef0872f2a1179bcb87aa035d60b378 Mon Sep 17 00:00:00 2001 From: Aniqah Mair Date: Wed, 27 Apr 2016 14:50:03 -0400 Subject: [PATCH 075/228] Add selection colour for Mozilla Firefox Defines the highlight colour when selecting slide content using Mozilla Firefox to match other browsers, instead of being the default colour. --- css/theme/beige.css | 5 +++++ css/theme/black.css | 5 +++++ css/theme/blood.css | 5 +++++ css/theme/league.css | 5 +++++ css/theme/moon.css | 5 +++++ css/theme/night.css | 5 +++++ css/theme/serif.css | 5 +++++ css/theme/simple.css | 5 +++++ css/theme/sky.css | 5 +++++ css/theme/solarized.css | 5 +++++ css/theme/white.css | 5 +++++ 11 files changed, 55 insertions(+) diff --git a/css/theme/beige.css b/css/theme/beige.css index 5bbda4b..7f71dd9 100644 --- a/css/theme/beige.css +++ b/css/theme/beige.css @@ -29,6 +29,11 @@ body { background: rgba(79, 64, 28, 0.99); text-shadow: none; } +::-moz-selection { + color: #fff; + background: rgba(79, 64, 28, 0.99); + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/black.css b/css/theme/black.css index 511fa79..9228c46 100644 --- a/css/theme/black.css +++ b/css/theme/black.css @@ -25,6 +25,11 @@ body { background: #bee4fd; text-shadow: none; } +::-moz-selection { + color: #fff; + background: #bee4fd; + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/blood.css b/css/theme/blood.css index 6fe3d67..2da8d68 100644 --- a/css/theme/blood.css +++ b/css/theme/blood.css @@ -28,6 +28,11 @@ body { background: #a23; text-shadow: none; } +::-moz-selection { + color: #fff; + background: #a23; + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/league.css b/css/theme/league.css index 03c44ce..aa5bee5 100644 --- a/css/theme/league.css +++ b/css/theme/league.css @@ -31,6 +31,11 @@ body { background: #FF5E99; text-shadow: none; } +::-moz-selection { + color: #fff; + background: #FF5E99; + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/moon.css b/css/theme/moon.css index 5e5d6e4..5cb1176 100644 --- a/css/theme/moon.css +++ b/css/theme/moon.css @@ -29,6 +29,11 @@ body { background: #d33682; text-shadow: none; } +::-moz-selection { + color: #fff; + background: #d33682; + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/night.css b/css/theme/night.css index a439cdc..cf2c7a7 100644 --- a/css/theme/night.css +++ b/css/theme/night.css @@ -23,6 +23,11 @@ body { background: #e7ad52; text-shadow: none; } +::-moz-selection { + color: #fff; + background: #e7ad52; + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/serif.css b/css/theme/serif.css index 40ccb39..bbb9f7e 100644 --- a/css/theme/serif.css +++ b/css/theme/serif.css @@ -25,6 +25,11 @@ body { background: #26351C; text-shadow: none; } +::-moz-selection { + color: #fff; + background: #26351C; + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/simple.css b/css/theme/simple.css index b17fa5c..33809ec 100644 --- a/css/theme/simple.css +++ b/css/theme/simple.css @@ -25,6 +25,11 @@ body { background: rgba(0, 0, 0, 0.99); text-shadow: none; } +::-moz-selection { + color: #fff; + background: rgba(0, 0, 0, 0.99); + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/sky.css b/css/theme/sky.css index 99f1cfd..202ade8 100644 --- a/css/theme/sky.css +++ b/css/theme/sky.css @@ -32,6 +32,11 @@ body { background: #134674; text-shadow: none; } +::-moz-selection { + color: #fff; + background: #134674; + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/solarized.css b/css/theme/solarized.css index b4d4d4b..44771dc 100644 --- a/css/theme/solarized.css +++ b/css/theme/solarized.css @@ -29,6 +29,11 @@ body { background: #d33682; text-shadow: none; } +::-moz-selection { + color: #fff; + background: #d33682; + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; diff --git a/css/theme/white.css b/css/theme/white.css index b10dd0e..16a1d23 100644 --- a/css/theme/white.css +++ b/css/theme/white.css @@ -25,6 +25,11 @@ body { background: #98bdef; text-shadow: none; } +::-moz-selection { + color: #fff; + background: #98bdef; + text-shadow: none; } + .reveal .slides > section, .reveal .slides > section > section { line-height: 1.3; From fcb6ea8385487194f257b9d556f9c98d0ec73301 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 28 Apr 2016 11:16:36 +0200 Subject: [PATCH 076/228] prevent pages from overflowing when printing to pdf --- js/reveal.js | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/js/reveal.js b/js/reveal.js index 8975504..bbe2ca4 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -597,6 +597,15 @@ top = Math.max( ( pageHeight - contentHeight ) / 2, 0 ); } + // Wrap the slide in a page element and hide its overflow + // so that no page ever flows onto another + var page = document.createElement( 'div' ); + page.className = 'page'; + page.style.overflow = 'hidden'; + page.style.height = ( pageHeight * numberOfPages ) + 'px'; + slide.parentNode.insertBefore( page, slide ); + page.appendChild( slide ); + // Position the slide inside of the page slide.style.left = left + 'px'; slide.style.top = top + 'px'; From 55581035228aba9a0d061a6969797327c626b0bf Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 28 Apr 2016 11:31:11 +0200 Subject: [PATCH 077/228] make max pages per slide limit configurable --- README.md | 2 ++ js/reveal.js | 7 +++++++ 2 files changed, 9 insertions(+) diff --git a/README.md b/README.md index 13bf457..e858216 100644 --- a/README.md +++ b/README.md @@ -783,6 +783,8 @@ Reveal.initialize({ Presentations can be exported to PDF via a special print stylesheet. This feature requires that you use [Google Chrome](http://google.com/chrome) or [Chromium](https://www.chromium.org/Home). Here's an example of an exported presentation that's been uploaded to SlideShare: http://www.slideshare.net/hakimel/revealjs-300. +Export dimensions are inferred from the configured [presentation size](#presentation-size). Slides that are too tall to fit within a single page will expand onto multiple pages. You can limit how many pages a slide may expand onto using the `pdfMaxPagesPerSlide` config option, for example: `Reveal.configure({ pdfMaxPagesPerSlide: 1 })`. + 1. Open your presentation with `print-pdf` included anywhere in the query string. This triggers the default index HTML to load the PDF print stylesheet ([css/print/pdf.css](https://github.com/hakimel/reveal.js/blob/master/css/print/pdf.css)). You can test this with [lab.hakim.se/reveal-js?print-pdf](http://lab.hakim.se/reveal-js?print-pdf). 2. Open the in-browser print dialog (CTRL/CMD+P). 3. Change the **Destination** setting to **Save as PDF**. diff --git a/js/reveal.js b/js/reveal.js index bbe2ca4..628c0b9 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -153,6 +153,10 @@ parallaxBackgroundHorizontal: null, parallaxBackgroundVertical: null, + // The maximum number of pages a single slide can expand onto when printing + // to PDF, unlimited by default + pdfMaxPagesPerSlide: Number.POSITIVE_INFINITY, + // Number of slides away from the current that are visible viewDistance: 3, @@ -592,6 +596,9 @@ var contentHeight = slide.scrollHeight; var numberOfPages = Math.max( Math.ceil( contentHeight / pageHeight ), 1 ); + // Adhere to configured pages per slide limit + numberOfPages = Math.min( numberOfPages, config.pdfMaxPagesPerSlide ); + // Center slides vertically if( numberOfPages === 1 && config.center || slide.classList.contains( 'center' ) ) { top = Math.max( ( pageHeight - contentHeight ) / 2, 0 ); From 9b11915c3a409aa456c64e9d386ac15598a4fa6b Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 28 Apr 2016 17:07:26 +0200 Subject: [PATCH 078/228] fix pdf bg layering, simplify code --- css/print/pdf.css | 14 +++++++------- js/reveal.js | 38 +++++++++----------------------------- 2 files changed, 16 insertions(+), 36 deletions(-) diff --git a/css/print/pdf.css b/css/print/pdf.css index 9ed90d6..9ae0dfe 100644 --- a/css/print/pdf.css +++ b/css/print/pdf.css @@ -82,6 +82,12 @@ ul, ol, div, p { perspective-origin: 50% 50%; } +.reveal .slides .pdf-page { + position: relative; + overflow: hidden; + z-index: 1; +} + .reveal .slides section { page-break-after: always !important; @@ -132,13 +138,7 @@ ul, ol, div, p { top: 0; left: 0; width: 100%; - z-index: -1; -} - -/* All elements should be above the slide-background */ -.reveal section>* { - position: relative; - z-index: 1; + height: 100%; } /* Display slide speaker notes when 'showNotes' is enabled */ diff --git a/js/reveal.js b/js/reveal.js index 628c0b9..47b4f01 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -607,8 +607,7 @@ // Wrap the slide in a page element and hide its overflow // so that no page ever flows onto another var page = document.createElement( 'div' ); - page.className = 'page'; - page.style.overflow = 'hidden'; + page.className = 'pdf-page'; page.style.height = ( pageHeight * numberOfPages ) + 'px'; slide.parentNode.insertBefore( page, slide ); page.appendChild( slide ); @@ -618,14 +617,8 @@ slide.style.top = top + 'px'; slide.style.width = slideWidth + 'px'; - // TODO Backgrounds need to be multiplied when the slide - // stretches over multiple pages - var background = slide.querySelector( '.slide-background' ); - if( background ) { - background.style.width = pageWidth + 'px'; - background.style.height = ( pageHeight * numberOfPages ) + 'px'; - background.style.top = -top + 'px'; - background.style.left = -left + 'px'; + if( slide.slideBackgroundElement ) { + page.insertBefore( slide.slideBackgroundElement, slide ); } // Inject notes if `showNotes` is enabled @@ -653,7 +646,7 @@ numberElement.classList.add( 'slide-number' ); numberElement.classList.add( 'slide-number-pdf' ); numberElement.innerHTML = formatSlideNumber( slideNumberH, '.', slideNumberV ); - background.appendChild( numberElement ); + page.appendChild( numberElement ); } } @@ -733,24 +726,12 @@ // Iterate over all horizontal slides toArray( dom.wrapper.querySelectorAll( HORIZONTAL_SLIDES_SELECTOR ) ).forEach( function( slideh ) { - var backgroundStack; - - if( printMode ) { - backgroundStack = createBackground( slideh, slideh ); - } - else { - backgroundStack = createBackground( slideh, dom.background ); - } + var backgroundStack = createBackground( slideh, dom.background ); // Iterate over all vertical slides toArray( slideh.querySelectorAll( 'section' ) ).forEach( function( slidev ) { - if( printMode ) { - createBackground( slidev, slidev ); - } - else { - createBackground( slidev, backgroundStack ); - } + createBackground( slidev, backgroundStack ); backgroundStack.classList.add( 'stack' ); @@ -846,6 +827,8 @@ slide.classList.remove( 'has-dark-background' ); slide.classList.remove( 'has-light-background' ); + slide.slideBackgroundElement = element; + // If this slide has a background color, add a class that // signals if it is light or dark. If the slide has no background // color, no class will be set @@ -3406,10 +3389,7 @@ if( isPrintingPDF() ) { var slide = getSlide( x, y ); if( slide ) { - var background = slide.querySelector( '.slide-background' ); - if( background && background.parentNode === slide ) { - return background; - } + return slide.slideBackgroundElement; } return undefined; From ce7d494ae9f6516af82d597ed00e3cabd1a1ad55 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Fri, 29 Apr 2016 09:25:05 +0200 Subject: [PATCH 079/228] tweak formatting to match rest of slide --- plugin/zoom-js/zoom.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugin/zoom-js/zoom.js b/plugin/zoom-js/zoom.js index efccad6..8738083 100644 --- a/plugin/zoom-js/zoom.js +++ b/plugin/zoom-js/zoom.js @@ -15,7 +15,7 @@ var originalDisplay = event.target.style.display; // Get the bounding rect of the contents, not the containing box - if (window.getComputedStyle(event.target).display === 'block') { + if( window.getComputedStyle( event.target ).display === 'block' ) { event.target.style.display = 'inline-block'; bounds = event.target.getBoundingClientRect(); event.target.style.display = originalDisplay; From e2a863405782709e8cd30227f8b1157acc30fa19 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=BB=84=E7=8E=84?= Date: Mon, 2 May 2016 01:42:11 +0800 Subject: [PATCH 080/228] add refused-to-display tips in link-preview-overlay --- css/reveal.scss | 10 ++++++++++ js/reveal.js | 3 +++ 2 files changed, 13 insertions(+) diff --git a/css/reveal.scss b/css/reveal.scss index f8d6904..c360fe6 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -1229,6 +1229,16 @@ html:-moz-full-screen-ancestor { visibility: visible; } + .reveal .overlay.overlay-preview.loaded .viewport-inner { + position: absolute; + z-index: -1; + left: 0; + top: 60px; + width: 100%; + text-align: center; + letter-spacing: normal; + } + .reveal .overlay.overlay-preview.loaded .spinner { opacity: 0; visibility: hidden; diff --git a/js/reveal.js b/js/reveal.js index 10c609e..e772516 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -1500,6 +1500,9 @@ '
    ', '
    ', '', + '', + 'This link is refused to display in a frame due to its policy', + '', '
    ' ].join(''); From fb8bbaac00e1fa7e9259acfc2b88a14e83a59707 Mon Sep 17 00:00:00 2001 From: Jason Kiss Date: Tue, 10 May 2016 10:03:05 +1200 Subject: [PATCH 081/228] set/remove @disabled on navigation buttons MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Keeps disabled buttons out of kbd tab order and indicates to assistive tech like screen readers that button is disabled. Otherwise buttons that aren’t enabled remain in kbd Tab order and screen readers announce them as buttons, but they don’t work. --- js/reveal.js | 28 +++++++++++++++------------- 1 file changed, 15 insertions(+), 13 deletions(-) diff --git a/js/reveal.js b/js/reveal.js index 10c609e..b3a91b3 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -2652,34 +2652,36 @@ .concat( dom.controlsNext ).forEach( function( node ) { node.classList.remove( 'enabled' ); node.classList.remove( 'fragmented' ); + // Set 'disabled' attribute on all directions + node.setAttribute('disabled', 'disabled'); } ); - // Add the 'enabled' class to the available routes - if( routes.left ) dom.controlsLeft.forEach( function( el ) { el.classList.add( 'enabled' ); } ); - if( routes.right ) dom.controlsRight.forEach( function( el ) { el.classList.add( 'enabled' ); } ); - if( routes.up ) dom.controlsUp.forEach( function( el ) { el.classList.add( 'enabled' ); } ); - if( routes.down ) dom.controlsDown.forEach( function( el ) { el.classList.add( 'enabled' ); } ); + // Add the 'enabled' class to the available routes; remove 'disabled' attribute to enable buttons + if( routes.left ) dom.controlsLeft.forEach( function( el ) { el.classList.add( 'enabled' ); el.removeAttribute('disabled'); } ); + if( routes.right ) dom.controlsRight.forEach( function( el ) { el.classList.add( 'enabled' ); el.removeAttribute('disabled'); } ); + if( routes.up ) dom.controlsUp.forEach( function( el ) { el.classList.add( 'enabled' ); el.removeAttribute('disabled'); } ); + if( routes.down ) dom.controlsDown.forEach( function( el ) { el.classList.add( 'enabled' ); el.removeAttribute('disabled'); } ); // Prev/next buttons - if( routes.left || routes.up ) dom.controlsPrev.forEach( function( el ) { el.classList.add( 'enabled' ); } ); - if( routes.right || routes.down ) dom.controlsNext.forEach( function( el ) { el.classList.add( 'enabled' ); } ); + if( routes.left || routes.up ) dom.controlsPrev.forEach( function( el ) { el.classList.add( 'enabled' ); el.removeAttribute('disabled'); } ); + if( routes.right || routes.down ) dom.controlsNext.forEach( function( el ) { el.classList.add( 'enabled' ); el.removeAttribute('disabled'); } ); // Highlight fragment directions if( currentSlide ) { // Always apply fragment decorator to prev/next buttons - if( fragments.prev ) dom.controlsPrev.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); } ); - if( fragments.next ) dom.controlsNext.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); } ); + if( fragments.prev ) dom.controlsPrev.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); el.removeAttribute('disabled'); } ); + if( fragments.next ) dom.controlsNext.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); el.removeAttribute('disabled'); } ); // Apply fragment decorators to directional buttons based on // what slide axis they are in if( isVerticalSlide( currentSlide ) ) { - if( fragments.prev ) dom.controlsUp.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); } ); - if( fragments.next ) dom.controlsDown.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); } ); + if( fragments.prev ) dom.controlsUp.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); el.removeAttribute('disabled'); } ); + if( fragments.next ) dom.controlsDown.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); el.removeAttribute('disabled'); } ); } else { - if( fragments.prev ) dom.controlsLeft.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); } ); - if( fragments.next ) dom.controlsRight.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); } ); + if( fragments.prev ) dom.controlsLeft.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); el.removeAttribute('disabled'); } ); + if( fragments.next ) dom.controlsRight.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); el.removeAttribute('disabled'); } ); } } From dec6d1745b780e67960afe20a5a0d86f23ba0733 Mon Sep 17 00:00:00 2001 From: Jason Kiss Date: Tue, 10 May 2016 11:02:45 +1200 Subject: [PATCH 082/228] make speaker notes keyboard accessible Places div.speaker-notes in default kbd Tab order, and when focused, prevent slide navigation with up/down arrows, allowing up/down arrow keys to scroll div.speaker-notes. --- js/reveal.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/js/reveal.js b/js/reveal.js index 10c609e..3ff1f85 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -495,6 +495,7 @@ // Element containing notes that are visible to the audience dom.speakerNotes = createSingletonNode( dom.wrapper, 'div', 'speaker-notes', null ); dom.speakerNotes.setAttribute( 'data-prevent-swipe', '' ); + dom.speakerNotes.setAttribute( 'tabindex', '0'); // Overlay graphic which is displayed during the paused mode createSingletonNode( dom.wrapper, 'div', 'pause-overlay', null ); @@ -3963,10 +3964,11 @@ // the keyboard var activeElementIsCE = document.activeElement && document.activeElement.contentEditable !== 'inherit'; var activeElementIsInput = document.activeElement && document.activeElement.tagName && /input|textarea/i.test( document.activeElement.tagName ); + var activeElementIsNotes = document.activeElement && document.activeElement.className && /speaker-notes/i.test( document.activeElement.className); // Disregard the event if there's a focused element or a // keyboard modifier key is present - if( activeElementIsCE || activeElementIsInput || (event.shiftKey && event.keyCode !== 32) || event.altKey || event.ctrlKey || event.metaKey ) return; + if( activeElementIsCE || activeElementIsInput || activeElementIsNotes || (event.shiftKey && event.keyCode !== 32) || event.altKey || event.ctrlKey || event.metaKey ) return; // While paused only allow resume keyboard events; 'b', '.'' var resumeKeyCodes = [66,190,191]; From b79f1fac132569158ceec752eb21c6ac4a00b656 Mon Sep 17 00:00:00 2001 From: Tristan Sokol Date: Thu, 19 May 2016 16:47:25 -0700 Subject: [PATCH 083/228] Add minor imporovements to the PDF export instructions --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index e229f1e..c10a465 100644 --- a/README.md +++ b/README.md @@ -780,10 +780,10 @@ Reveal.initialize({ ## PDF Export -Presentations can be exported to PDF via a special print stylesheet. This feature requires that you use [Google Chrome](http://google.com/chrome) or [Chromium](https://www.chromium.org/Home). +Presentations can be exported to PDF via a special print stylesheet. This feature requires that you use [Google Chrome](http://google.com/chrome) or [Chromium](https://www.chromium.org/Home) and to be serving the presention from a webserver. Here's an example of an exported presentation that's been uploaded to SlideShare: http://www.slideshare.net/hakimel/revealjs-300. -1. Open your presentation with `print-pdf` included anywhere in the query string. This triggers the default index HTML to load the PDF print stylesheet ([css/print/pdf.css](https://github.com/hakimel/reveal.js/blob/master/css/print/pdf.css)). You can test this with [lab.hakim.se/reveal-js?print-pdf](http://lab.hakim.se/reveal-js?print-pdf). +1. Open your presentation with `print-pdf` included in the query string i.e. http://localhost:8000/?print-pdf#/. This triggers the default index HTML to load the PDF print stylesheet ([css/print/pdf.css](https://github.com/hakimel/reveal.js/blob/master/css/print/pdf.css)). You can test this with [lab.hakim.se/reveal-js?print-pdf](http://lab.hakim.se/reveal-js?print-pdf). 2. Open the in-browser print dialog (CTRL/CMD+P). 3. Change the **Destination** setting to **Save as PDF**. 4. Change the **Layout** to **Landscape**. From 187114f47224b4628350a6046c6f758bce83f6c1 Mon Sep 17 00:00:00 2001 From: Tiago Garcia Date: Sat, 21 May 2016 11:36:49 -0700 Subject: [PATCH 084/228] Removing duplicated "position" property at pdf.css Found that by running css-lint on the code --- css/print/pdf.css | 1 - 1 file changed, 1 deletion(-) diff --git a/css/print/pdf.css b/css/print/pdf.css index 9ed90d6..3dc577d 100644 --- a/css/print/pdf.css +++ b/css/print/pdf.css @@ -86,7 +86,6 @@ ul, ol, div, p { page-break-after: always !important; visibility: visible !important; - position: relative !important; display: block !important; position: relative !important; From 6593ac3d5f83ec49b168d49d7963146e67fd0e79 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Mon, 23 May 2016 10:38:46 +0200 Subject: [PATCH 085/228] moz selection color in theme template #1575 --- css/theme/template/theme.scss | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/css/theme/template/theme.scss b/css/theme/template/theme.scss index 101a567..bcbaf0c 100644 --- a/css/theme/template/theme.scss +++ b/css/theme/template/theme.scss @@ -22,6 +22,12 @@ body { text-shadow: none; } +::-moz-selection { + color: $selectionColor; + background: $selectionBackgroundColor; + text-shadow: none; +} + .reveal .slides>section, .reveal .slides>section>section { line-height: 1.3; From e2fa1d966c66098d69f5212636d4d620977521db Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Mon, 23 May 2016 10:50:39 +0200 Subject: [PATCH 086/228] ocd --- js/reveal.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/reveal.js b/js/reveal.js index d2b93bb..708bef5 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -499,7 +499,7 @@ // Element containing notes that are visible to the audience dom.speakerNotes = createSingletonNode( dom.wrapper, 'div', 'speaker-notes', null ); dom.speakerNotes.setAttribute( 'data-prevent-swipe', '' ); - dom.speakerNotes.setAttribute( 'tabindex', '0'); + dom.speakerNotes.setAttribute( 'tabindex', '0' ); // Overlay graphic which is displayed during the paused mode createSingletonNode( dom.wrapper, 'div', 'pause-overlay', null ); From 9cd7f3f37b564808a77e8a2448f9c92f8aae0aaf Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Mon, 23 May 2016 10:54:40 +0200 Subject: [PATCH 087/228] code format --- js/reveal.js | 27 ++++++++++++++------------- 1 file changed, 14 insertions(+), 13 deletions(-) diff --git a/js/reveal.js b/js/reveal.js index d5cba0e..656ed10 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -2615,36 +2615,37 @@ .concat( dom.controlsNext ).forEach( function( node ) { node.classList.remove( 'enabled' ); node.classList.remove( 'fragmented' ); + // Set 'disabled' attribute on all directions - node.setAttribute('disabled', 'disabled'); + node.setAttribute( 'disabled', 'disabled' ); } ); // Add the 'enabled' class to the available routes; remove 'disabled' attribute to enable buttons - if( routes.left ) dom.controlsLeft.forEach( function( el ) { el.classList.add( 'enabled' ); el.removeAttribute('disabled'); } ); - if( routes.right ) dom.controlsRight.forEach( function( el ) { el.classList.add( 'enabled' ); el.removeAttribute('disabled'); } ); - if( routes.up ) dom.controlsUp.forEach( function( el ) { el.classList.add( 'enabled' ); el.removeAttribute('disabled'); } ); - if( routes.down ) dom.controlsDown.forEach( function( el ) { el.classList.add( 'enabled' ); el.removeAttribute('disabled'); } ); + if( routes.left ) dom.controlsLeft.forEach( function( el ) { el.classList.add( 'enabled' ); el.removeAttribute( 'disabled' ); } ); + if( routes.right ) dom.controlsRight.forEach( function( el ) { el.classList.add( 'enabled' ); el.removeAttribute( 'disabled' ); } ); + if( routes.up ) dom.controlsUp.forEach( function( el ) { el.classList.add( 'enabled' ); el.removeAttribute( 'disabled' ); } ); + if( routes.down ) dom.controlsDown.forEach( function( el ) { el.classList.add( 'enabled' ); el.removeAttribute( 'disabled' ); } ); // Prev/next buttons - if( routes.left || routes.up ) dom.controlsPrev.forEach( function( el ) { el.classList.add( 'enabled' ); el.removeAttribute('disabled'); } ); - if( routes.right || routes.down ) dom.controlsNext.forEach( function( el ) { el.classList.add( 'enabled' ); el.removeAttribute('disabled'); } ); + if( routes.left || routes.up ) dom.controlsPrev.forEach( function( el ) { el.classList.add( 'enabled' ); el.removeAttribute( 'disabled' ); } ); + if( routes.right || routes.down ) dom.controlsNext.forEach( function( el ) { el.classList.add( 'enabled' ); el.removeAttribute( 'disabled' ); } ); // Highlight fragment directions if( currentSlide ) { // Always apply fragment decorator to prev/next buttons - if( fragments.prev ) dom.controlsPrev.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); el.removeAttribute('disabled'); } ); - if( fragments.next ) dom.controlsNext.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); el.removeAttribute('disabled'); } ); + if( fragments.prev ) dom.controlsPrev.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); el.removeAttribute( 'disabled' ); } ); + if( fragments.next ) dom.controlsNext.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); el.removeAttribute( 'disabled' ); } ); // Apply fragment decorators to directional buttons based on // what slide axis they are in if( isVerticalSlide( currentSlide ) ) { - if( fragments.prev ) dom.controlsUp.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); el.removeAttribute('disabled'); } ); - if( fragments.next ) dom.controlsDown.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); el.removeAttribute('disabled'); } ); + if( fragments.prev ) dom.controlsUp.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); el.removeAttribute( 'disabled' ); } ); + if( fragments.next ) dom.controlsDown.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); el.removeAttribute( 'disabled' ); } ); } else { - if( fragments.prev ) dom.controlsLeft.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); el.removeAttribute('disabled'); } ); - if( fragments.next ) dom.controlsRight.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); el.removeAttribute('disabled'); } ); + if( fragments.prev ) dom.controlsLeft.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); el.removeAttribute( 'disabled' ); } ); + if( fragments.next ) dom.controlsRight.forEach( function( el ) { el.classList.add( 'fragmented', 'enabled' ); el.removeAttribute( 'disabled' ); } ); } } From a8c41092449822d55e2c97e9357c4699447ca7aa Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Mon, 23 May 2016 11:59:29 +0200 Subject: [PATCH 088/228] Update README.md more in-depth documentation of slide backgrounds #1542 --- README.md | 62 +++++++++++++++++++++++++++++++++++++++++-------------- 1 file changed, 47 insertions(+), 15 deletions(-) diff --git a/README.md b/README.md index e229f1e..b01279b 100644 --- a/README.md +++ b/README.md @@ -510,26 +510,58 @@ Reveal.addEventListener( 'somestate', function() { ### Slide Backgrounds -Slides are contained within a limited portion of the screen by default to allow them to fit any display and scale uniformly. You can apply full page backgrounds outside of the slide area by adding a ```data-background``` attribute to your ```
    ``` elements. Four different types of backgrounds are supported: color, image, video and iframe. Below are a few examples. +Slides are contained within a limited portion of the screen by default to allow them to fit any display and scale uniformly. You can apply full page backgrounds outside of the slide area by adding a ```data-background``` attribute to your ```
    ``` elements. Four different types of backgrounds are supported: color, image, video and iframe. +##### Color Backgrounds +All CSS color formats are supported, like rgba() or hsl(). ```html -
    -

    All CSS color formats are supported, like rgba() or hsl().

    -
    -
    -

    This slide will have a full-size background image.

    -
    -
    -

    This background image will be sized to 100px and repeated.

    -
    -
    -

    Video. Multiple sources can be defined using a comma separated list. Video will loop when the data-background-video-loop attribute is provided and can be muted with the data-background-video-muted attribute.

    -
    -
    -

    Embeds a web page as a background. Note that the page won't be interactive.

    +
    +

    Color

    ``` +##### Image Backgrounds +By default, background images are resized to cover the full page. Available options: + +| Attribute | Default | Description | +| :--------------------------- | :--------- | :---------- | +| data-background-image | | URL of the image to show. GIFs restart when the slide opens. | +| data-background-size | cover | See [background-size](https://developer.mozilla.org/docs/Web/CSS/background-size) on MDN. | +| data-background-position | center | See [background-position](https://developer.mozilla.org/docs/Web/CSS/background-position) on MDN. | +| data-background-repeat | no-repeat | See [background-repeat](https://developer.mozilla.org/docs/Web/CSS/background-repeat) on MDN. | +```html +
    +

    Image

    +
    +
    +

    This background image will be sized to 100px and repeated

    +
    +``` + +##### Video Backgrounds +Automatically plays a full size video behind the slide. + +| Attribute | Default | Description | +| :--------------------------- | :------ | :---------- | +| data-background-video | | A single video source, or a comma separated list of video sources. | +| data-background-video-loop | false | Flags if the video should play repeatedly. | +| data-background-video-muted | false | Flags if the audio should be muted. | + +```html +
    +

    Video

    +
    +``` + +##### Iframe Backgrounds +Embeds a web page as a background. Note that since the iframe is in the background layer, behind your slides, it is not possible to interact with the embedded page. +```html +
    +

    Iframe

    +
    +``` + +##### Background Transitions Backgrounds transition using a fade animation by default. This can be changed to a linear sliding transition by passing ```backgroundTransition: 'slide'``` to the ```Reveal.initialize()``` call. Alternatively you can set ```data-background-transition``` on any section with a background to override that specific transition. From 3111d3b1ae12af2580cb45a18da208146701a6fd Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 26 May 2016 09:57:19 +0200 Subject: [PATCH 089/228] support for 'separate-page' layout for notes in PDF exports #1518 --- README.md | 2 +- css/print/pdf.css | 13 ++++++++++++- js/reveal.js | 21 +++++++++++++++++---- 3 files changed, 30 insertions(+), 6 deletions(-) diff --git a/README.md b/README.md index 56dad41..b275846 100644 --- a/README.md +++ b/README.md @@ -890,7 +890,7 @@ This will only display in the notes window. Notes are only visible to the speaker inside of the speaker view. If you wish to share your notes with others you can initialize reveal.js with the `showNotes` config value set to `true`. Notes will appear along the bottom of the presentations. -When `showNotes` is enabled notes are also included when you [export to PDF](https://github.com/hakimel/reveal.js#pdf-export). +When `showNotes` is enabled notes are also included when you [export to PDF](https://github.com/hakimel/reveal.js#pdf-export). By default, notes are printed in a semi-transparent box on top of slide. If you'd rather print them on a separate page after the slide, set `showNotes: "separate-page"`. ## Server Side Speaker Notes diff --git a/css/print/pdf.css b/css/print/pdf.css index 406f125..fb56129 100644 --- a/css/print/pdf.css +++ b/css/print/pdf.css @@ -145,11 +145,22 @@ ul, ol, div, p { display: block; width: 100%; max-height: none; - left: auto; top: auto; + right: auto; + bottom: auto; + left: auto; z-index: 100; } +/* Layout option which makes notes appear on a separate page */ +.reveal .speaker-notes-pdf[data-layout="separate-page"] { + position: relative; + color: inherit; + background-color: transparent; + padding: 20px; + page-break-after: always; +} + /* Display slide numbers when 'slideNumber' is enabled */ .reveal .slide-number-pdf { display: block; diff --git a/js/reveal.js b/js/reveal.js index 656ed10..f43e0aa 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -624,18 +624,31 @@ // Inject notes if `showNotes` is enabled if( config.showNotes ) { + + // Are there notes for this slide? var notes = getSlideNotes( slide ); if( notes ) { + var notesSpacing = 8; + var notesLayout = typeof config.showNotes === 'string' ? config.showNotes : 'inline'; var notesElement = document.createElement( 'div' ); notesElement.classList.add( 'speaker-notes' ); notesElement.classList.add( 'speaker-notes-pdf' ); + notesElement.setAttribute( 'data-layout', notesLayout ); notesElement.innerHTML = notes; - notesElement.style.left = ( notesSpacing - left ) + 'px'; - notesElement.style.bottom = ( notesSpacing - top ) + 'px'; - notesElement.style.width = ( pageWidth - notesSpacing*2 ) + 'px'; - slide.appendChild( notesElement ); + + if( notesLayout === 'separate-page' ) { + page.parentNode.insertBefore( notesElement, page.nextSibling ); + } + else { + notesElement.style.left = ( notesSpacing - left ) + 'px'; + notesElement.style.bottom = ( notesSpacing - top ) + 'px'; + notesElement.style.width = ( pageWidth - notesSpacing*2 ) + 'px'; + slide.appendChild( notesElement ); + } + } + } // Inject slide numbers if `slideNumbers` are enabled From 43212662767129f85973b82f8d1799fa446b3267 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 26 May 2016 10:09:09 +0200 Subject: [PATCH 090/228] include layout for notes outside of pdf exports --- js/reveal.js | 1 + 1 file changed, 1 insertion(+) diff --git a/js/reveal.js b/js/reveal.js index f43e0aa..3c750af 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -948,6 +948,7 @@ if( config.showNotes ) { dom.speakerNotes.classList.add( 'visible' ); + dom.speakerNotes.setAttribute( 'data-layout', typeof config.showNotes === 'string' ? config.showNotes : 'inline' ); } else { dom.speakerNotes.classList.remove( 'visible' ); From 904f9878d3a9a1052d8550271a184caf68772f70 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Fri, 3 Jun 2016 10:15:26 +0200 Subject: [PATCH 091/228] slides banner --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index b01279b..0225c84 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -# reveal.js [![Build Status](https://travis-ci.org/hakimel/reveal.js.svg?branch=master)](https://travis-ci.org/hakimel/reveal.js) +# reveal.js [![Build Status](https://travis-ci.org/hakimel/reveal.js.svg?branch=master)](https://travis-ci.org/hakimel/reveal.js) [![Slides](http://static.slid.es.s3.amazonaws.com/images/slides-github-banner-160x20.png)](https://slides.com) A framework for easily creating beautiful presentations using HTML. [Check out the live demo](http://lab.hakim.se/reveal-js/). From 6b4bdd2c909c0acbb73746f683e211da6d9ae6fc Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Fri, 3 Jun 2016 13:54:42 +0200 Subject: [PATCH 092/228] hdpi slides banner --- README.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 0225c84..bc74c64 100644 --- a/README.md +++ b/README.md @@ -1,8 +1,8 @@ -# reveal.js [![Build Status](https://travis-ci.org/hakimel/reveal.js.svg?branch=master)](https://travis-ci.org/hakimel/reveal.js) [![Slides](http://static.slid.es.s3.amazonaws.com/images/slides-github-banner-160x20.png)](https://slides.com) +# reveal.js [![Build Status](https://travis-ci.org/hakimel/reveal.js.svg?branch=master)](https://travis-ci.org/hakimel/reveal.js) Slides A framework for easily creating beautiful presentations using HTML. [Check out the live demo](http://lab.hakim.se/reveal-js/). -reveal.js comes with a broad range of features including [nested slides](https://github.com/hakimel/reveal.js#markup), [Markdown contents](https://github.com/hakimel/reveal.js#markdown), [PDF export](https://github.com/hakimel/reveal.js#pdf-export), [speaker notes](https://github.com/hakimel/reveal.js#speaker-notes) and a [JavaScript API](https://github.com/hakimel/reveal.js#api). There's also a fully featured visual editor and platform for sharing reveal.js presentations at [slides.com](https://slides.com). +reveal.js comes with a broad range of features including [nested slides](https://github.com/hakimel/reveal.js#markup), [Markdown contents](https://github.com/hakimel/reveal.js#markdown), [PDF export](https://github.com/hakimel/reveal.js#pdf-export), [speaker notes](https://github.com/hakimel/reveal.js#speaker-notes) and a [JavaScript API](https://github.com/hakimel/reveal.js#api). There's also a fully featured visual editor and platform for sharing reveal.js presentations at [slides.com](https://slides.com?ref=github). ## Table of contents - [Online Editor](#online-editor) @@ -60,7 +60,7 @@ reveal.js comes with a broad range of features including [nested slides](https:/ ## Online Editor -Presentations are written using HTML or Markdown but there's also an online editor for those of you who prefer a graphical interface. Give it a try at [http://slides.com](http://slides.com?ref=github). +Presentations are written using HTML or Markdown but there's also an online editor for those of you who prefer a graphical interface. Give it a try at [https://slides.com](https://slides.com?ref=github). ## Instructions From c2997c605d969ae46180f0a714802511bb89dbc7 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Fri, 3 Jun 2016 13:56:52 +0200 Subject: [PATCH 093/228] text alignment --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index bc74c64..8d92b14 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -# reveal.js [![Build Status](https://travis-ci.org/hakimel/reveal.js.svg?branch=master)](https://travis-ci.org/hakimel/reveal.js) Slides +# reveal.js [![Build Status](https://travis-ci.org/hakimel/reveal.js.svg?branch=master)](https://travis-ci.org/hakimel/reveal.js) Slides A framework for easily creating beautiful presentations using HTML. [Check out the live demo](http://lab.hakim.se/reveal-js/). From ca92d22adcf2a5a6c960b2d4a6bdadd13b12385b Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Fri, 10 Jun 2016 10:04:54 +0200 Subject: [PATCH 094/228] add showHelp to api #1611 --- README.md | 3 +++ js/reveal.js | 3 +++ 2 files changed, 6 insertions(+) diff --git a/README.md b/README.md index 211ee98..48311ab 100644 --- a/README.md +++ b/README.md @@ -434,6 +434,9 @@ Reveal.nextFragment(); // Randomize the order of slides Reveal.shuffle(); +// Shows a help overlay with keyboard shortcuts +Reveal.showHelp(); + // Toggle presentation states, optionally pass true/false to force on/off Reveal.toggleOverview(); Reveal.togglePause(); diff --git a/js/reveal.js b/js/reveal.js index 3c750af..ed4d769 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -4580,6 +4580,9 @@ navigatePrev: navigatePrev, navigateNext: navigateNext, + // Shows a help overlay with keyboard shortcuts + showHelp: showHelp, + // Forces an update in slide layout layout: layout, From 02123205a0995b41580c357f4b20c1473af69e63 Mon Sep 17 00:00:00 2001 From: Timothep Date: Wed, 9 Mar 2016 11:38:29 +0100 Subject: [PATCH 095/228] Added a description of the undocumented timer-reset feature --- README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/README.md b/README.md index 13bf457..41bf077 100644 --- a/README.md +++ b/README.md @@ -822,6 +822,8 @@ If you want to add a theme of your own see the instructions here: [/css/theme/RE reveal.js comes with a speaker notes plugin which can be used to present per-slide notes in a separate browser window. The notes window also gives you a preview of the next upcoming slide so it may be helpful even if you haven't written any notes. Press the 's' key on your keyboard to open the notes window. +A speaker timer starts as soon as the speaker view is opened. You can reset it to 00:00:00 at any time by simply clicking/tapping on it. + Notes are defined by appending an ```
    ``` -#### Configuring `marked` +#### Configuring *marked* We use [marked](https://github.com/chjj/marked) to parse Markdown. To customise marked's rendering, you can pass in options when [configuring Reveal](#configuration): @@ -172,6 +172,7 @@ Reveal.initialize({ smartypants: true } }); +``` ### Configuration From 4afd854037d72b7528ee8844970c2c644b880ba0 Mon Sep 17 00:00:00 2001 From: Piotr Kubowicz Date: Sun, 15 Jan 2017 16:35:31 +0100 Subject: [PATCH 159/228] Remove 'history: true' from index.html Readme says the default is 'history: false', so it may be surprising for users - it's easy to miss the contradicting setting in index.html --- index.html | 2 -- 1 file changed, 2 deletions(-) diff --git a/index.html b/index.html index 0c7a672..039b1c3 100644 --- a/index.html +++ b/index.html @@ -35,8 +35,6 @@ +
    ``` From 7daa0e04de7d0ab2bae3159faae0b18d4eb3c8d3 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Tue, 31 Jan 2017 16:24:06 +0100 Subject: [PATCH 180/228] make background videos work on ipad #1778 --- js/reveal.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/js/reveal.js b/js/reveal.js index 9b0768a..c2888e8 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -3212,6 +3212,9 @@ else { el.removeEventListener( 'loadeddata', startEmbeddedMedia ); // remove first to avoid dupes el.addEventListener( 'loadeddata', startEmbeddedMedia ); + + // `loadeddata` never fires unless we start playing on iPad + if( /ipad/gi.test( UA ) ) el.play(); } } From f496613dd3309a3066642adf1261e9da0578cdda Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Tue, 31 Jan 2017 17:08:08 +0100 Subject: [PATCH 181/228] improved fragment notes support #1636 --- plugin/notes/notes.js | 29 ++++++++++++++++++----------- 1 file changed, 18 insertions(+), 11 deletions(-) diff --git a/plugin/notes/notes.js b/plugin/notes/notes.js index 46bf5de..44efe15 100644 --- a/plugin/notes/notes.js +++ b/plugin/notes/notes.js @@ -50,10 +50,11 @@ var RevealNotes = (function() { /** * Posts the current slide data to the notes window */ - function post(event) { + function post( event ) { var slideElement = Reveal.getCurrentSlide(), - notesElement = slideElement.querySelector( 'aside.notes' ); + notesElement = slideElement.querySelector( 'aside.notes' ), + fragmentElement = slideElement.querySelector( '.current-fragment' ); var messageData = { namespace: 'reveal-notes', @@ -64,21 +65,27 @@ var RevealNotes = (function() { state: Reveal.getState() }; - // Look for notes defined in a fragment, if it is a fragmentshown event - if (event && event.hasOwnProperty('fragment')) { - var innerNotes = event.fragment.querySelector( 'aside.notes' ); - - if ( innerNotes) { - notesElement = innerNotes; - } - } - // Look for notes defined in a slide attribute if( slideElement.hasAttribute( 'data-notes' ) ) { messageData.notes = slideElement.getAttribute( 'data-notes' ); messageData.whitespace = 'pre-wrap'; } + // Look for notes defined in a fragment + if( fragmentElement ) { + var fragmentNotes = fragmentElement.querySelector( 'aside.notes' ); + if( fragmentNotes ) { + notesElement = fragmentNotes; + } + else if( fragmentElement.hasAttribute( 'data-notes' ) ) { + messageData.notes = fragmentElement.getAttribute( 'data-notes' ); + messageData.whitespace = 'pre-wrap'; + + // In case there are slide notes + notesElement = null; + } + } + // Look for notes defined in an aside element if( notesElement ) { messageData.notes = notesElement.innerHTML; From 2c9e226fab51763d830754d72e1a92cc839ceacc Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Wed, 1 Feb 2017 10:33:43 +0100 Subject: [PATCH 182/228] warning about cube/page being deprecated #1774 --- css/reveal.css | 8 ++++++++ css/reveal.scss | 8 ++++++++ 2 files changed, 16 insertions(+) diff --git a/css/reveal.css b/css/reveal.css index 296c8e9..cde184a 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -595,6 +595,10 @@ body { /********************************************* * CUBE TRANSITION + * + * WARNING: + * this is deprecated and will be removed in a + * future version. *********************************************/ .reveal.cube .slides { -webkit-perspective: 1300px; @@ -670,6 +674,10 @@ body { /********************************************* * PAGE TRANSITION + * + * WARNING: + * this is deprecated and will be removed in a + * future version. *********************************************/ .reveal.page .slides { -webkit-perspective-origin: 0% 50%; diff --git a/css/reveal.scss b/css/reveal.scss index ee3c440..1972183 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -617,6 +617,10 @@ body { /********************************************* * CUBE TRANSITION + * + * WARNING: + * this is deprecated and will be removed in a + * future version. *********************************************/ .reveal.cube .slides { @@ -689,6 +693,10 @@ body { /********************************************* * PAGE TRANSITION + * + * WARNING: + * this is deprecated and will be removed in a + * future version. *********************************************/ .reveal.page .slides { From 9f99ac8b849aa26df98232bfa04db50eb2baa5ee Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 2 Feb 2017 10:46:44 +0100 Subject: [PATCH 183/228] adjust comment for display config value #1325 --- README.md | 5 ++++- js/reveal.js | 6 +++--- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index 0aa0f29..bfd5c9f 100644 --- a/README.md +++ b/README.md @@ -270,7 +270,10 @@ Reveal.initialize({ // - Calculated automatically unless specified // - Set to 0 to disable movement along an axis parallaxBackgroundHorizontal: null, - parallaxBackgroundVertical: null + parallaxBackgroundVertical: null, + + // The display mode that will be used to show slides + display: 'block' }); ``` diff --git a/js/reveal.js b/js/reveal.js index 6c349e7..125a7b6 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -49,9 +49,6 @@ minScale: 0.2, maxScale: 2.0, - // Value of the display CSS property applied to current slide to make it visible - display: 'block', - // Display controls in the bottom right corner controls: true, @@ -163,6 +160,9 @@ // Number of slides away from the current that are visible viewDistance: 3, + // The display mode that will be used to show slides + display: 'block', + // Script dependencies to load dependencies: [] From bede9a22e86bb1c8debb945ccdfb22265393297d Mon Sep 17 00:00:00 2001 From: Frazer Kirkman Date: Sun, 5 Feb 2017 18:42:59 +0100 Subject: [PATCH 184/228] added toggleHelp function this way a key can be given ability to toggleHelp on and off. Previously Reveal.showHelp could open the help screen, but no way to close it. --- js/reveal.js | 20 ++++++++++++++------ 1 file changed, 14 insertions(+), 6 deletions(-) diff --git a/js/reveal.js b/js/reveal.js index 9251dc0..290097f 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -1628,6 +1628,18 @@ } + /** + * Open or close help overlay window. + */ + function toggleHelp(){ + if( dom.overlay ) { + closeOverlay(); + } + else { + showHelp( true ); + } + } + /** * Opens an overlay window with help material. */ @@ -4113,12 +4125,7 @@ // Check if the pressed key is question mark if( event.shiftKey && event.charCode === 63 ) { - if( dom.overlay ) { - closeOverlay(); - } - else { - showHelp( true ); - } + toggleHelp(); } } @@ -4818,6 +4825,7 @@ // Shows a help overlay with keyboard shortcuts showHelp: showHelp, + toggleHelp: toggleHelp, // Forces an update in slide layout layout: layout, From bcfb65658fec94e5aac6bd53b9e294bef4fd95d4 Mon Sep 17 00:00:00 2001 From: gilxa1226 Date: Tue, 7 Feb 2017 07:43:41 -0500 Subject: [PATCH 185/228] Update README.md --- README.md | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/README.md b/README.md index 8797a07..2e08853 100644 --- a/README.md +++ b/README.md @@ -847,6 +847,19 @@ Reveal.initialize({ Presentations can be exported to PDF via a special print stylesheet. This feature requires that you use [Google Chrome](http://google.com/chrome) or [Chromium](https://www.chromium.org/Home) and to be serving the presention from a webserver. Here's an example of an exported presentation that's been uploaded to SlideShare: http://www.slideshare.net/hakimel/revealjs-300. +In order to enable PDF print capability in your presentation, the following code must be inserted in the HEAD section of your HTML document. + +'''html + + +''' + Export dimensions are inferred from the configured [presentation size](#presentation-size). Slides that are too tall to fit within a single page will expand onto multiple pages. You can limit how many pages a slide may expand onto using the `pdfMaxPagesPerSlide` config option, for example `Reveal.configure({ pdfMaxPagesPerSlide: 1 })` ensures that no slide ever grows to more than one printed page. 1. Open your presentation with `print-pdf` included in the query string i.e. http://localhost:8000/?print-pdf#/. This triggers the default index HTML to load the PDF print stylesheet ([css/print/pdf.css](https://github.com/hakimel/reveal.js/blob/master/css/print/pdf.css)). You can test this with [lab.hakim.se/reveal-js?print-pdf](http://lab.hakim.se/reveal-js?print-pdf). From d7b34b6e0fc715aec0c2d7cf1cd971fade83440b Mon Sep 17 00:00:00 2001 From: gilxa1226 Date: Tue, 7 Feb 2017 07:44:52 -0500 Subject: [PATCH 186/228] Update README.md to include block for pdf printing --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 2e08853..cb102d7 100644 --- a/README.md +++ b/README.md @@ -849,7 +849,7 @@ Here's an example of an exported presentation that's been uploaded to SlideShare In order to enable PDF print capability in your presentation, the following code must be inserted in the HEAD section of your HTML document. -'''html +```html -''' +``` Export dimensions are inferred from the configured [presentation size](#presentation-size). Slides that are too tall to fit within a single page will expand onto multiple pages. You can limit how many pages a slide may expand onto using the `pdfMaxPagesPerSlide` config option, for example `Reveal.configure({ pdfMaxPagesPerSlide: 1 })` ensures that no slide ever grows to more than one printed page. From 2a1303f3c1861d12ff27f401c0f5d421f7c5133b Mon Sep 17 00:00:00 2001 From: Frazer Kirkman Date: Tue, 7 Feb 2017 19:53:58 +0100 Subject: [PATCH 187/228] added override parameter to toggleHelp function --- js/reveal.js | 21 ++++++++++++++++----- 1 file changed, 16 insertions(+), 5 deletions(-) diff --git a/js/reveal.js b/js/reveal.js index 290097f..2e4e978 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -1630,15 +1630,26 @@ /** * Open or close help overlay window. + * + * @param {Boolean} [override] Flag which overrides the + * toggle logic and forcibly sets the desired state. True means + * help is open, false means it's closed. */ - function toggleHelp(){ - if( dom.overlay ) { - closeOverlay(); + function toggleHelp( override ){ + + if( typeof override === 'boolean' ) { + override ? showHelp( true ) : closeOverlay(); } - else { - showHelp( true ); + else { + if( dom.overlay ) { + closeOverlay(); + } + else { + showHelp( true ); + } } } + /** * Opens an overlay window with help material. From adc326139a51079c2b8908a13f5d6a474ca4ee9f Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Wed, 8 Feb 2017 12:56:51 +0100 Subject: [PATCH 188/228] update deserialize regex to work with decimals --- js/reveal.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/reveal.js b/js/reveal.js index 125a7b6..4502919 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -1230,7 +1230,7 @@ if( value === 'null' ) return null; else if( value === 'true' ) return true; else if( value === 'false' ) return false; - else if( value.match( /^\d+$/ ) ) return parseFloat( value ); + else if( value.match( /^[\d\.]+$/ ) ) return parseFloat( value ); } return value; From 5ad66f3779a7b26e43f899753a26ef5e3fe9667f Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 9 Feb 2017 11:37:47 +0100 Subject: [PATCH 189/228] docs for #1816 and remove showHelp --- README.md | 7 ++++--- js/reveal.js | 16 +++++++--------- 2 files changed, 11 insertions(+), 12 deletions(-) diff --git a/README.md b/README.md index bfd5c9f..288de99 100644 --- a/README.md +++ b/README.md @@ -466,14 +466,15 @@ Reveal.nextFragment(); // Randomize the order of slides Reveal.shuffle(); -// Shows a help overlay with keyboard shortcuts -Reveal.showHelp(); - // Toggle presentation states, optionally pass true/false to force on/off Reveal.toggleOverview(); Reveal.togglePause(); Reveal.toggleAutoSlide(); +// Shows a help overlay with keyboard shortcuts, optionally pass true/false +// to force on/off +Reveal.toggleHelp(); + // Change a config value at runtime Reveal.configure({ controls: true }); diff --git a/js/reveal.js b/js/reveal.js index a5783e0..882149e 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -1641,21 +1641,20 @@ * help is open, false means it's closed. */ function toggleHelp( override ){ - + if( typeof override === 'boolean' ) { - override ? showHelp( true ) : closeOverlay(); + override ? showHelp() : closeOverlay(); } - else { + else { if( dom.overlay ) { closeOverlay(); } else { - showHelp( true ); + showHelp(); } } } - /** * Opens an overlay window with help material. */ @@ -4878,10 +4877,6 @@ navigatePrev: navigatePrev, navigateNext: navigateNext, - // Shows a help overlay with keyboard shortcuts - showHelp: showHelp, - toggleHelp: toggleHelp, - // Forces an update in slide layout layout: layout, @@ -4894,6 +4889,9 @@ // Returns an object with the available fragments as booleans (prev/next) availableFragments: availableFragments, + // Toggles a help overlay with keyboard shortcuts + toggleHelp: toggleHelp, + // Toggles the overview mode on/off toggleOverview: toggleOverview, From 2f54af4614a195f31f20f66a849bf33f42130318 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Tue, 14 Feb 2017 14:38:57 +0100 Subject: [PATCH 190/228] update readme re: pdf exports #1823 --- README.md | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index cb102d7..9d88beb 100644 --- a/README.md +++ b/README.md @@ -847,10 +847,13 @@ Reveal.initialize({ Presentations can be exported to PDF via a special print stylesheet. This feature requires that you use [Google Chrome](http://google.com/chrome) or [Chromium](https://www.chromium.org/Home) and to be serving the presention from a webserver. Here's an example of an exported presentation that's been uploaded to SlideShare: http://www.slideshare.net/hakimel/revealjs-300. -In order to enable PDF print capability in your presentation, the following code must be inserted in the HEAD section of your HTML document. +### Page size +Export dimensions are inferred from the configured [presentation size](#presentation-size). Slides that are too tall to fit within a single page will expand onto multiple pages. You can limit how many pages a slide may expand onto using the `pdfMaxPagesPerSlide` config option, for example `Reveal.configure({ pdfMaxPagesPerSlide: 1 })` ensures that no slide ever grows to more than one printed page. + +### Instructions +To enable the PDF print capability in your presentation, the special print stylesheet at [/css/print/pdf.css](https://github.com/hakimel/reveal.js/blob/master/css/print/pdf.css) must be loaded. The default index.html file handles this for you when `print-pdf` is included in the query string. If you're using a different HTML template, you can add this to your HEAD: ```html - ``` -Export dimensions are inferred from the configured [presentation size](#presentation-size). Slides that are too tall to fit within a single page will expand onto multiple pages. You can limit how many pages a slide may expand onto using the `pdfMaxPagesPerSlide` config option, for example `Reveal.configure({ pdfMaxPagesPerSlide: 1 })` ensures that no slide ever grows to more than one printed page. - -1. Open your presentation with `print-pdf` included in the query string i.e. http://localhost:8000/?print-pdf#/. This triggers the default index HTML to load the PDF print stylesheet ([css/print/pdf.css](https://github.com/hakimel/reveal.js/blob/master/css/print/pdf.css)). You can test this with [lab.hakim.se/reveal-js?print-pdf](http://lab.hakim.se/reveal-js?print-pdf). +1. Open your presentation with `print-pdf` included in the query string i.e. http://localhost:8000/?print-pdf. You can test this with [lab.hakim.se/reveal-js?print-pdf](http://lab.hakim.se/reveal-js?print-pdf). 2. Open the in-browser print dialog (CTRL/CMD+P). 3. Change the **Destination** setting to **Save as PDF**. 4. Change the **Layout** to **Landscape**. From bc1ca1a58a0233f2540ebfc3f71748ce8fffc1f9 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Tue, 14 Feb 2017 14:40:12 +0100 Subject: [PATCH 191/228] updated pdf docs --- README.md | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 9d88beb..76ca321 100644 --- a/README.md +++ b/README.md @@ -850,7 +850,7 @@ Here's an example of an exported presentation that's been uploaded to SlideShare ### Page size Export dimensions are inferred from the configured [presentation size](#presentation-size). Slides that are too tall to fit within a single page will expand onto multiple pages. You can limit how many pages a slide may expand onto using the `pdfMaxPagesPerSlide` config option, for example `Reveal.configure({ pdfMaxPagesPerSlide: 1 })` ensures that no slide ever grows to more than one printed page. -### Instructions +### Print stylesheet To enable the PDF print capability in your presentation, the special print stylesheet at [/css/print/pdf.css](https://github.com/hakimel/reveal.js/blob/master/css/print/pdf.css) must be loaded. The default index.html file handles this for you when `print-pdf` is included in the query string. If you're using a different HTML template, you can add this to your HEAD: ```html @@ -863,6 +863,7 @@ To enable the PDF print capability in your presentation, the special print style ``` +### Instructions 1. Open your presentation with `print-pdf` included in the query string i.e. http://localhost:8000/?print-pdf. You can test this with [lab.hakim.se/reveal-js?print-pdf](http://lab.hakim.se/reveal-js?print-pdf). 2. Open the in-browser print dialog (CTRL/CMD+P). 3. Change the **Destination** setting to **Save as PDF**. From a349ff43c58c23f9c837b8ea9b5fc7d4761b8de3 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Wed, 15 Feb 2017 11:18:54 +0100 Subject: [PATCH 192/228] new phantom pdf export script that works with 3.4.0 #1815 --- plugin/print-pdf/print-pdf.js | 55 ++++++++++++++++++----------------- 1 file changed, 29 insertions(+), 26 deletions(-) diff --git a/plugin/print-pdf/print-pdf.js b/plugin/print-pdf/print-pdf.js index 38a698d..c3c5d94 100644 --- a/plugin/print-pdf/print-pdf.js +++ b/plugin/print-pdf/print-pdf.js @@ -4,30 +4,15 @@ * Example: * phantomjs print-pdf.js "http://lab.hakim.se/reveal-js?print-pdf" reveal-demo.pdf * - * By Manuel Bieh (https://github.com/manuelbieh) + * @author Manuel Bieh (https://github.com/manuelbieh) + * @author Hakim El Hattab (https://github.com/hakimel) */ // html2pdf.js -var page = new WebPage(); var system = require( 'system' ); -var slideWidth = system.args[3] ? system.args[3].split( 'x' )[0] : 960; -var slideHeight = system.args[3] ? system.args[3].split( 'x' )[1] : 700; - -page.viewportSize = { - width: slideWidth, - height: slideHeight -}; - -// TODO -// Something is wrong with these config values. An input -// paper width of 1920px actually results in a 756px wide -// PDF. -page.paperSize = { - width: Math.round( slideWidth * 2 ), - height: Math.round( slideHeight * 2 ), - border: 0 -}; +var probePage = new WebPage(); +var printPage = new WebPage(); var inputFile = system.args[1] || 'index.html?print-pdf'; var outputFile = system.args[2] || 'slides.pdf'; @@ -36,13 +21,31 @@ if( outputFile.match( /\.pdf$/gi ) === null ) { outputFile += '.pdf'; } -console.log( 'Printing PDF (Paper size: '+ page.paperSize.width + 'x' + page.paperSize.height +')' ); +console.log( 'Export PDF: Reading reveal.js config [1/3]' ); + +probePage.open( inputFile, function( status ) { + + console.log( 'Export PDF: Preparing print layout [2/3]' ); + + var config = probePage.evaluate( function() { + return Reveal.getConfig(); + } ); + + printPage.paperSize = { + width: config.width * ( 1 + config.margin ), + height: config.height * ( 1 + config.margin ), + border: 0 + }; + + printPage.open( inputFile, function( status ) { + window.setTimeout( function() { + console.log( 'Export PDF: Writing file [3/3]' ); + printPage.render( outputFile ); + console.log( 'Export PDF: Finished successfully!' ); + phantom.exit(); + }, 1000 ); + } ); -page.open( inputFile, function( status ) { - window.setTimeout( function() { - console.log( 'Printed successfully' ); - page.render( outputFile ); - phantom.exit(); - }, 1000 ); } ); + From fa70a7a5174b16b1b4e9ccaf3f36cbb082cc8051 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Wed, 15 Feb 2017 11:43:57 +0100 Subject: [PATCH 193/228] phantom export throws error if reveal.js isn't present --- plugin/print-pdf/print-pdf.js | 36 ++++++++++++++++++++++------------- 1 file changed, 23 insertions(+), 13 deletions(-) diff --git a/plugin/print-pdf/print-pdf.js b/plugin/print-pdf/print-pdf.js index c3c5d94..d1c3251 100644 --- a/plugin/print-pdf/print-pdf.js +++ b/plugin/print-pdf/print-pdf.js @@ -31,20 +31,30 @@ probePage.open( inputFile, function( status ) { return Reveal.getConfig(); } ); - printPage.paperSize = { - width: config.width * ( 1 + config.margin ), - height: config.height * ( 1 + config.margin ), - border: 0 - }; + if( config ) { - printPage.open( inputFile, function( status ) { - window.setTimeout( function() { - console.log( 'Export PDF: Writing file [3/3]' ); - printPage.render( outputFile ); - console.log( 'Export PDF: Finished successfully!' ); - phantom.exit(); - }, 1000 ); - } ); + printPage.paperSize = { + width: Math.floor( config.width * ( 1 + config.margin ) ), + height: Math.floor( config.height * ( 1 + config.margin ) ), + border: 0 + }; + + printPage.open( inputFile, function( status ) { + window.setTimeout( function() { + console.log( 'Export PDF: Writing file [3/3]' ); + printPage.render( outputFile ); + console.log( 'Export PDF: Finished successfully!' ); + phantom.exit(); + }, 1000 ); + } ); + + } + else { + + console.log( 'Export PDF: Unable to read reveal.js config. Make sure the input address points to a reveal.js page.' ); + phantom.exit(1); + + } } ); From 1cee8998a0e423265d7e99feb6a74d627fc306ca Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Fri, 17 Feb 2017 10:50:52 +0100 Subject: [PATCH 194/228] fix overview rendering issues in latest chrome #1649 --- css/reveal.css | 6 ++---- css/reveal.scss | 8 ++++---- js/reveal.js | 11 +++++++++-- 3 files changed, 15 insertions(+), 10 deletions(-) diff --git a/css/reveal.css b/css/reveal.css index cde184a..f675977 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -1059,6 +1059,8 @@ body { visibility: visible; outline: 10px solid rgba(150, 150, 150, 0.1); outline-offset: 10px; } + .reveal.overview .backgrounds .slide-background.stack { + overflow: visible; } .reveal.overview .slides section, .reveal.overview-deactivating .slides section { @@ -1070,10 +1072,6 @@ body { -webkit-transition: none; transition: none; } -.reveal.overview-animated .slides { - -webkit-transition: -webkit-transform 0.4s ease; - transition: transform 0.4s ease; } - /********************************************* * RTL SUPPORT *********************************************/ diff --git a/css/reveal.scss b/css/reveal.scss index 1972183..fba248e 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -1101,6 +1101,10 @@ body { outline: 10px solid rgba(150,150,150,0.1); outline-offset: 10px; } + + .backgrounds .slide-background.stack { + overflow: visible; + } } // Disable transitions transitions while we're activating @@ -1115,10 +1119,6 @@ body { transition: none; } -.reveal.overview-animated .slides { - transition: transform 0.4s ease; -} - /********************************************* * RTL SUPPORT diff --git a/js/reveal.js b/js/reveal.js index d31d591..5325beb 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -1797,6 +1797,10 @@ updateProgress(); updateParallax(); + if( isOverview() ) { + updateOverview(); + } + } } @@ -2012,11 +2016,14 @@ */ function updateOverview() { + var vmin = Math.min( window.innerWidth, window.innerHeight ); + var scale = Math.max( vmin / 5, 150 ) / vmin; + transformSlides( { overview: [ + 'scale('+ scale +')', 'translateX('+ ( -indexh * overviewSlideWidth ) +'px)', - 'translateY('+ ( -indexv * overviewSlideHeight ) +'px)', - 'translateZ('+ ( window.innerWidth < 400 ? -1000 : -2500 ) +'px)' + 'translateY('+ ( -indexv * overviewSlideHeight ) +'px)' ].join( ' ' ) } ); From da23d682c63a4f3ee04a42ae70222950b2888daa Mon Sep 17 00:00:00 2001 From: Malcolm Young Date: Fri, 17 Feb 2017 15:08:57 +0000 Subject: [PATCH 195/228] allow configuration of which view slide number appears on - fixes #1791 --- README.md | 7 ++++++- js/reveal.js | 16 +++++++++++++++- 2 files changed, 21 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 76ca321..3d52092 100644 --- a/README.md +++ b/README.md @@ -749,7 +749,7 @@ By default, Reveal is configured with [highlight.js](https://highlightjs.org/) f ``` ### Slide number -If you would like to display the page number of the current slide you can do so using the ```slideNumber``` configuration value. +If you would like to display the page number of the current slide you can do so using the ```slideNumber``` and ```showSlideNumber``` configuration values. ```javascript // Shows the slide number using default formatting @@ -762,6 +762,11 @@ Reveal.configure({ slideNumber: true }); // "c/t": flattened slide number / total slides Reveal.configure({ slideNumber: 'c/t' }); +// Control which views the slide number displays on using the "showSlideNumber" value. +// "all": show on all views (default) +// "notes": only show slide numbers on speaker notes view +Reveal.configure({ slideNumberFormat: 'notes' }); + ``` diff --git a/js/reveal.js b/js/reveal.js index 9251dc0..574c943 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -57,6 +57,9 @@ // Display the page number of the current slide slideNumber: false, + + // Determine which displays to show the slide number on + showSlideNumber: 'all', // Push each slide change to the browser history history: false, @@ -977,7 +980,18 @@ dom.controls.style.display = config.controls ? 'block' : 'none'; dom.progress.style.display = config.progress ? 'block' : 'none'; - dom.slideNumber.style.display = config.slideNumber && !isPrintingPDF() ? 'block' : 'none'; + + var slideNumberDisplay = 'none'; + if (config.slideNumber && !isPrintingPDF()) { + if (config.showSlideNumber === 'all') { + slideNumberDisplay = 'block'; + } + else if (config.showSlideNumber === 'notes' && isSpeakerNotes()) { + slideNumberDisplay = 'block'; + } + } + + dom.slideNumber.style.display = slideNumberDisplay; if( config.shuffle ) { shuffle(); From 95bca847d6d000fc745660852c70ae5d3c63e9d0 Mon Sep 17 00:00:00 2001 From: Malcolm Young Date: Fri, 17 Feb 2017 15:19:15 +0000 Subject: [PATCH 196/228] correct config name in README --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 3d52092..9a76b93 100644 --- a/README.md +++ b/README.md @@ -765,7 +765,7 @@ Reveal.configure({ slideNumber: 'c/t' }); // Control which views the slide number displays on using the "showSlideNumber" value. // "all": show on all views (default) // "notes": only show slide numbers on speaker notes view -Reveal.configure({ slideNumberFormat: 'notes' }); +Reveal.configure({ showSlideNumber: 'notes' }); ``` From 5565d0861260c62f20f9ad5211aea697b4e8a0cc Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Mon, 20 Feb 2017 11:37:18 +0100 Subject: [PATCH 197/228] note about deploying multiplex server with now #1830 --- README.md | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 6b52390..97ca0c2 100644 --- a/README.md +++ b/README.md @@ -1047,11 +1047,13 @@ Server that receives the slideChanged events from the master presentation and br 1. ```npm install``` 2. ```node plugin/multiplex``` -Or you use the socket.io server at [https://reveal-js-multiplex-ccjbegmaii.now.sh/](https://reveal-js-multiplex-ccjbegmaii.now.sh/). +Or you can use the socket.io server at [https://reveal-js-multiplex-ccjbegmaii.now.sh/](https://reveal-js-multiplex-ccjbegmaii.now.sh/). You'll need to generate a unique secret and token pair for your master and client presentations. To do so, visit ```http://example.com/token```, where ```http://example.com``` is the location of your socket.io server. Or if you're going to use the socket.io server at [https://reveal-js-multiplex-ccjbegmaii.now.sh/](https://reveal-js-multiplex-ccjbegmaii.now.sh/), visit [https://reveal-js-multiplex-ccjbegmaii.now.sh/token](https://reveal-js-multiplex-ccjbegmaii.now.sh/token). -You are very welcome to point your presentations at the Socket.io server running at [https://reveal-js-multiplex-ccjbegmaii.now.sh/](https://reveal-js-multiplex-ccjbegmaii.now.sh/), but availability and stability are not guaranteed. For anything mission critical I recommend you run your own server. It is simple to deploy to nodejitsu, heroku, your own environment, etc. +You are very welcome to point your presentations at the Socket.io server running at [https://reveal-js-multiplex-ccjbegmaii.now.sh/](https://reveal-js-multiplex-ccjbegmaii.now.sh/), but availability and stability are not guaranteed. + +For anything mission critical I recommend you run your own server. The easiest way to do this is by installing [now](https://zeit.co/now). With that installed, deploying your own Multiplex server is as easy running the following command from the reveal.js folder: `now plugin/multiplex`. ##### socket.io server as file static server From b143e5976bd3dbc5445a27052a93ab6f060b361b Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Mon, 20 Feb 2017 11:49:19 +0100 Subject: [PATCH 198/228] tweaks to showSlideNumber config #1833 --- README.md | 9 +++++---- js/reveal.js | 29 +++++++++++++++-------------- 2 files changed, 20 insertions(+), 18 deletions(-) diff --git a/README.md b/README.md index e711dd0..789a8fa 100644 --- a/README.md +++ b/README.md @@ -767,10 +767,11 @@ Reveal.configure({ slideNumber: true }); // "c/t": flattened slide number / total slides Reveal.configure({ slideNumber: 'c/t' }); -// Control which views the slide number displays on using the "showSlideNumber" value. -// "all": show on all views (default) -// "notes": only show slide numbers on speaker notes view -Reveal.configure({ showSlideNumber: 'notes' }); +// Control which views the slide number displays on using the "showSlideNumber" value: +// "all": show on all views (default) +// "speaker": only show slide numbers on speaker notes view +// "print": only show slide numbers when printing to PDF +Reveal.configure({ showSlideNumber: 'speaker' }); ``` diff --git a/js/reveal.js b/js/reveal.js index b48620b..65560a6 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -57,7 +57,7 @@ // Display the page number of the current slide slideNumber: false, - + // Determine which displays to show the slide number on showSlideNumber: 'all', @@ -701,7 +701,7 @@ } // Inject slide numbers if `slideNumbers` are enabled - if( config.slideNumber ) { + if( config.slideNumber && /all|print/i.test( config.showSlideNumber ) ) { var slideNumberH = parseInt( slide.getAttribute( 'data-index-h' ), 10 ) + 1, slideNumberV = parseInt( slide.getAttribute( 'data-index-v' ), 10 ) + 1; @@ -984,18 +984,6 @@ dom.controls.style.display = config.controls ? 'block' : 'none'; dom.progress.style.display = config.progress ? 'block' : 'none'; - - var slideNumberDisplay = 'none'; - if (config.slideNumber && !isPrintingPDF()) { - if (config.showSlideNumber === 'all') { - slideNumberDisplay = 'block'; - } - else if (config.showSlideNumber === 'notes' && isSpeakerNotes()) { - slideNumberDisplay = 'block'; - } - } - - dom.slideNumber.style.display = slideNumberDisplay; if( config.shuffle ) { shuffle(); @@ -1079,6 +1067,19 @@ } ); } + // Slide numbers + var slideNumberDisplay = 'none'; + if( config.slideNumber && !isPrintingPDF() ) { + if( config.showSlideNumber === 'all' ) { + slideNumberDisplay = 'block'; + } + else if( config.showSlideNumber === 'speaker' && isSpeakerNotes() ) { + slideNumberDisplay = 'block'; + } + } + + dom.slideNumber.style.display = slideNumberDisplay; + sync(); } From 7e6fb9ec87f10f4cc379240fc5824925ebf2bff3 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Tue, 14 Mar 2017 09:06:39 +0100 Subject: [PATCH 199/228] avoid npe on iframe postMessage --- js/reveal.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/js/reveal.js b/js/reveal.js index 65560a6..3267465 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -3377,20 +3377,20 @@ // Generic postMessage API for non-lazy loaded iframes toArray( element.querySelectorAll( 'iframe' ) ).forEach( function( el ) { - el.contentWindow.postMessage( 'slide:stop', '*' ); + if( el.contentWindow ) el.contentWindow.postMessage( 'slide:stop', '*' ); el.removeEventListener( 'load', startEmbeddedIframe ); }); // YouTube postMessage API toArray( element.querySelectorAll( 'iframe[src*="youtube.com/embed/"]' ) ).forEach( function( el ) { - if( !el.hasAttribute( 'data-ignore' ) && typeof el.contentWindow.postMessage === 'function' ) { + if( !el.hasAttribute( 'data-ignore' ) && el.contentWindow && typeof el.contentWindow.postMessage === 'function' ) { el.contentWindow.postMessage( '{"event":"command","func":"pauseVideo","args":""}', '*' ); } }); // Vimeo postMessage API toArray( element.querySelectorAll( 'iframe[src*="player.vimeo.com/"]' ) ).forEach( function( el ) { - if( !el.hasAttribute( 'data-ignore' ) && typeof el.contentWindow.postMessage === 'function' ) { + if( !el.hasAttribute( 'data-ignore' ) && el.contentWindow && typeof el.contentWindow.postMessage === 'function' ) { el.contentWindow.postMessage( '{"method":"pause"}', '*' ); } }); From 9a7c7ce93a530cfb8bb85e0670b1ffd171ccbba4 Mon Sep 17 00:00:00 2001 From: Manuel Riezebosch Date: Tue, 14 Mar 2017 14:13:24 +0100 Subject: [PATCH 200/228] print-pdf using callback iso timer Use window.callPhantom icw page. onCallback to wait for pdf-ready event. From: http://stackoverflow.com/a/28925479/129269 --- plugin/print-pdf/print-pdf.js | 24 ++++++++++++++++-------- 1 file changed, 16 insertions(+), 8 deletions(-) diff --git a/plugin/print-pdf/print-pdf.js b/plugin/print-pdf/print-pdf.js index d1c3251..9ffc261 100644 --- a/plugin/print-pdf/print-pdf.js +++ b/plugin/print-pdf/print-pdf.js @@ -6,6 +6,7 @@ * * @author Manuel Bieh (https://github.com/manuelbieh) * @author Hakim El Hattab (https://github.com/hakimel) + * @author Manuel Riezebosch (https://github.com/riezebosch) */ // html2pdf.js @@ -21,11 +22,11 @@ if( outputFile.match( /\.pdf$/gi ) === null ) { outputFile += '.pdf'; } -console.log( 'Export PDF: Reading reveal.js config [1/3]' ); +console.log( 'Export PDF: Reading reveal.js config [1/4]' ); probePage.open( inputFile, function( status ) { - console.log( 'Export PDF: Preparing print layout [2/3]' ); + console.log( 'Export PDF: Preparing print layout [2/4]' ); var config = probePage.evaluate( function() { return Reveal.getConfig(); @@ -40,14 +41,22 @@ probePage.open( inputFile, function( status ) { }; printPage.open( inputFile, function( status ) { - window.setTimeout( function() { - console.log( 'Export PDF: Writing file [3/3]' ); + console.log( 'Export PDF: Preparing pdf [3/4]') + printPage.evaluate(function() { + Reveal.isReady() ? window.callPhantom() : Reveal.addEventListener( 'pdf-ready', window.callPhantom ); + }); + } ); + + printPage.onCallback = function(data) { + // For some reason we need to "jump the queue" for syntax highlighting to work. + // See: http://stackoverflow.com/a/3580132/129269 + setTimeout(function() { + console.log( 'Export PDF: Writing file [4/4]' ); printPage.render( outputFile ); console.log( 'Export PDF: Finished successfully!' ); phantom.exit(); - }, 1000 ); - } ); - + }, 0); + }; } else { @@ -55,7 +64,6 @@ probePage.open( inputFile, function( status ) { phantom.exit(1); } - } ); From 34f3773bf0e09e0300a5fcdf6926b3d4699aa71f Mon Sep 17 00:00:00 2001 From: Manuel Riezebosch Date: Tue, 14 Mar 2017 14:39:31 +0100 Subject: [PATCH 201/228] print-pdf layout slide contents to fit stretch elements layout() and thereby layoutSlideContents() is never invoked when isPrintingPdf() is true so stretch elements are not sized correctly. This is ensured now by invoking the layoutSlideContents from SetupPDF(). There seems no need to scale down like in other PR's is suggested. --- js/reveal.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/js/reveal.js b/js/reveal.js index 3267465..452c6bf 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -620,6 +620,9 @@ document.body.style.width = pageWidth + 'px'; document.body.style.height = pageHeight + 'px'; + // Make sure stretch elements fit on slide + layoutSlideContents(slideWidth, slideHeight); + // Add each slide's index as attributes on itself, we need these // indices to generate slide numbers below toArray( dom.wrapper.querySelectorAll( HORIZONTAL_SLIDES_SELECTOR ) ).forEach( function( hslide, h ) { From d9dd9a92fb5fde644847eb839a3c37ff1860da07 Mon Sep 17 00:00:00 2001 From: ADAM STONE Date: Fri, 17 Mar 2017 22:47:25 -0400 Subject: [PATCH 202/228] Fix video background autoplay on iOS --- js/reveal.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/js/reveal.js b/js/reveal.js index 9251dc0..43c599c 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -1426,7 +1426,7 @@ * target element. * * remaining height = [ configured parent height ] - [ current parent height ] - * + * * @param {HTMLElement} element * @param {number} [height] */ @@ -3058,6 +3058,8 @@ // Videos else if ( backgroundVideo && !isSpeakerNotes() ) { var video = document.createElement( 'video' ); + video.setAttribute( 'autoplay', '' ); + video.setAttribute( 'playsinline', '' ); if( backgroundVideoLoop ) { video.setAttribute( 'loop', '' ); @@ -3900,7 +3902,7 @@ // If there are media elements with data-autoplay, // automatically set the autoSlide duration to the // length of that media. Not applicable if the slide - // is divided up into fragments. + // is divided up into fragments. // playbackRate is accounted for in the duration. if( currentSlide.querySelectorAll( '.fragment' ).length === 0 ) { toArray( currentSlide.querySelectorAll( 'video, audio' ) ).forEach( function( el ) { From a0a3b4f80da716f041ba6ba071ca0c2900404f52 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 23 Mar 2017 11:44:02 +0100 Subject: [PATCH 203/228] add autoPlayMedia config option, overrides individual autoplay settings --- README.md | 18 +++++++++++++++--- js/reveal.js | 41 ++++++++++++++++++++++++++++++----------- 2 files changed, 45 insertions(+), 14 deletions(-) diff --git a/README.md b/README.md index 789a8fa..8e31935 100644 --- a/README.md +++ b/README.md @@ -228,6 +228,12 @@ Reveal.initialize({ // Flags if speaker notes should be visible to all viewers showNotes: false, + // Global override for autolaying embedded media (video/audio/iframe) + // - null: Media will only autoplay if data-autoplay is present + // - true: All media will autoplay, regardless of individual setting + // - false: No media will autoplay, regardless of individual setting + autoPlayMedia: null, + // Number of milliseconds between automatically proceeding to the // next slide, disabled when set to 0, this value can be overwritten // by using a data-autoslide attribute on your slides @@ -789,20 +795,26 @@ Reveal.addEventListener( 'overviewhidden', function( event ) { /* ... */ } ); Reveal.toggleOverview(); ``` + ### Fullscreen mode Just press »F« on your keyboard to show your presentation in fullscreen mode. Press the »ESC« key to exit fullscreen mode. ### Embedded media -Embedded HTML5 `
    + + +
    - +
    From 8e93a1ddf96f36d982a9949d7e4240ba91a123bd Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Wed, 26 Apr 2017 14:21:54 +0200 Subject: [PATCH 224/228] 3.5.0 --- bower.json | 2 +- js/reveal.js | 2 +- package.json | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/bower.json b/bower.json index c7c312d..ff18de4 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "reveal.js", - "version": "3.4.1", + "version": "3.5.0", "main": [ "js/reveal.js", "css/reveal.css" diff --git a/js/reveal.js b/js/reveal.js index 1f288b9..e36cb72 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -26,7 +26,7 @@ var Reveal; // The reveal.js version - var VERSION = '3.4.1'; + var VERSION = '3.5.0'; var SLIDES_SELECTOR = '.slides section', HORIZONTAL_SLIDES_SELECTOR = '.slides>section', diff --git a/package.json b/package.json index 37ffde2..eaec2b2 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "reveal.js", - "version": "3.4.1", + "version": "3.5.0", "description": "The HTML Presentation Framework", "homepage": "http://lab.hakim.se/reveal-js", "subdomain": "revealjs", From b19dc7fc8020491c95f92bf22277746e28da2df9 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 27 Apr 2017 16:36:16 +0200 Subject: [PATCH 225/228] don't autoplay background videos in overview mode --- js/reveal.js | 52 ++++++++++++++++++++++++++++++++++++---------------- 1 file changed, 36 insertions(+), 16 deletions(-) diff --git a/js/reveal.js b/js/reveal.js index e36cb72..f50994f 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -3098,7 +3098,6 @@ // If the background contains media, load it if( background.hasAttribute( 'data-loaded' ) === false ) { - background.setAttribute( 'data-loaded', 'true' ); var backgroundImage = slide.getAttribute( 'data-background-image' ), backgroundVideo = slide.getAttribute( 'data-background-video' ), @@ -3108,31 +3107,43 @@ // Images if( backgroundImage ) { + background.style.backgroundImage = 'url('+ backgroundImage +')'; + background.setAttribute( 'data-loaded', 'true' ); + } // Videos else if ( backgroundVideo && !isSpeakerNotes() ) { - var video = document.createElement( 'video' ); - video.setAttribute( 'autoplay', '' ); - video.setAttribute( 'playsinline', '' ); - if( backgroundVideoLoop ) { - video.setAttribute( 'loop', '' ); + if( !isOverview() ) { + + var video = document.createElement( 'video' ); + video.setAttribute( 'autoplay', '' ); + video.setAttribute( 'playsinline', '' ); + + if( backgroundVideoLoop ) { + video.setAttribute( 'loop', '' ); + } + + if( backgroundVideoMuted ) { + video.muted = true; + } + + // Support comma separated lists of video sources + backgroundVideo.split( ',' ).forEach( function( source ) { + video.innerHTML += ''; + } ); + + background.appendChild( video ); + + background.setAttribute( 'data-loaded', 'true' ); + } - if( backgroundVideoMuted ) { - video.muted = true; - } - - // Support comma separated lists of video sources - backgroundVideo.split( ',' ).forEach( function( source ) { - video.innerHTML += ''; - } ); - - background.appendChild( video ); } // Iframes else if( backgroundIframe ) { + var iframe = document.createElement( 'iframe' ); iframe.setAttribute( 'allowfullscreen', '' ); iframe.setAttribute( 'mozallowfullscreen', '' ); @@ -3153,7 +3164,16 @@ iframe.style.maxWidth = '100%'; background.appendChild( iframe ); + + background.setAttribute( 'data-loaded', 'true' ); + } + else { + + background.setAttribute( 'data-loaded', 'true' ); + + } + } } From caccf67d3a8016c5ca4a735ec2cfcb6b0720e521 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 27 Apr 2017 16:39:49 +0200 Subject: [PATCH 226/228] add for iframe backgrounds --- README.md | 4 ++-- css/reveal.css | 4 +++- css/reveal.scss | 4 +++- 3 files changed, 8 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index f03ae0f..99fc651 100644 --- a/README.md +++ b/README.md @@ -602,9 +602,9 @@ Automatically plays a full size video behind the slide. ``` ##### Iframe Backgrounds -Embeds a web page as a background. Note that since the iframe is in the background layer, behind your slides, it is not possible to interact with the embedded page. +Embeds a web page as a slide background that covers 100% of the reveal.js width and height. The iframe is in the background layer, behind your slides, and as such it's not possible to interact with it by default. To make your background interactive, you can add the `data-background-interactive` attribute. ```html -
    +

    Iframe

    ``` diff --git a/css/reveal.css b/css/reveal.css index f675977..5f501b1 100644 --- a/css/reveal.css +++ b/css/reveal.css @@ -377,7 +377,9 @@ body { opacity: 1; } .reveal .slides > section:empty, -.reveal .slides > section > section:empty { +.reveal .slides > section > section:empty, +.reveal .slides > section[data-background-interactive], +.reveal .slides > section > section[data-background-interactive] { pointer-events: none; } .reveal.center, diff --git a/css/reveal.scss b/css/reveal.scss index fba248e..983e587 100644 --- a/css/reveal.scss +++ b/css/reveal.scss @@ -446,7 +446,9 @@ body { } .reveal .slides>section:empty, -.reveal .slides>section>section:empty { +.reveal .slides>section>section:empty, +.reveal .slides>section[data-background-interactive], +.reveal .slides>section>section[data-background-interactive] { pointer-events: none; } From 9f4ed56bb3a3685c315ac162d4f77f755c2ec4d0 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 27 Apr 2017 16:42:24 +0200 Subject: [PATCH 227/228] larger headings for background sections --- README.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 99fc651..7ec759a 100644 --- a/README.md +++ b/README.md @@ -559,7 +559,7 @@ Reveal.addEventListener( 'somestate', function() { Slides are contained within a limited portion of the screen by default to allow them to fit any display and scale uniformly. You can apply full page backgrounds outside of the slide area by adding a ```data-background``` attribute to your ```
    ``` elements. Four different types of backgrounds are supported: color, image, video and iframe. -##### Color Backgrounds +#### Color Backgrounds All CSS color formats are supported, like rgba() or hsl(). ```html
    @@ -567,7 +567,7 @@ All CSS color formats are supported, like rgba() or hsl().
    ``` -##### Image Backgrounds +#### Image Backgrounds By default, background images are resized to cover the full page. Available options: | Attribute | Default | Description | @@ -585,7 +585,7 @@ By default, background images are resized to cover the full page. Available opti
    ``` -##### Video Backgrounds +#### Video Backgrounds Automatically plays a full size video behind the slide. | Attribute | Default | Description | @@ -601,7 +601,7 @@ Automatically plays a full size video behind the slide.
    ``` -##### Iframe Backgrounds +#### Iframe Backgrounds Embeds a web page as a slide background that covers 100% of the reveal.js width and height. The iframe is in the background layer, behind your slides, and as such it's not possible to interact with it by default. To make your background interactive, you can add the `data-background-interactive` attribute. ```html
    @@ -609,7 +609,7 @@ Embeds a web page as a slide background that covers 100% of the reveal.js width
    ``` -##### Background Transitions +#### Background Transitions Backgrounds transition using a fade animation by default. This can be changed to a linear sliding transition by passing ```backgroundTransition: 'slide'``` to the ```Reveal.initialize()``` call. Alternatively you can set ```data-background-transition``` on any section with a background to override that specific transition. From 360bc940062711db9b8020ce4e848f6c37014481 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Thu, 27 Apr 2017 18:49:20 +0200 Subject: [PATCH 228/228] new fix for prematurely autoplaying background videos --- js/reveal.js | 71 +++++++++++++++++++++++----------------------------- 1 file changed, 32 insertions(+), 39 deletions(-) diff --git a/js/reveal.js b/js/reveal.js index f50994f..d3ba03c 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -3054,6 +3054,13 @@ } + /** + * Called when the given slide is within the configured view + * distance. Shows the slide element and loads any content + * that is set to load lazily (data-src). + * + * @param {HTMLElement} slide Slide to show + */ /** * Called when the given slide is within the configured view * distance. Shows the slide element and loads any content @@ -3098,6 +3105,7 @@ // If the background contains media, load it if( background.hasAttribute( 'data-loaded' ) === false ) { + background.setAttribute( 'data-loaded', 'true' ); var backgroundImage = slide.getAttribute( 'data-background-image' ), backgroundVideo = slide.getAttribute( 'data-background-video' ), @@ -3107,43 +3115,38 @@ // Images if( backgroundImage ) { - background.style.backgroundImage = 'url('+ backgroundImage +')'; - background.setAttribute( 'data-loaded', 'true' ); - } // Videos else if ( backgroundVideo && !isSpeakerNotes() ) { + var video = document.createElement( 'video' ); - if( !isOverview() ) { - - var video = document.createElement( 'video' ); - video.setAttribute( 'autoplay', '' ); - video.setAttribute( 'playsinline', '' ); - - if( backgroundVideoLoop ) { - video.setAttribute( 'loop', '' ); - } - - if( backgroundVideoMuted ) { - video.muted = true; - } - - // Support comma separated lists of video sources - backgroundVideo.split( ',' ).forEach( function( source ) { - video.innerHTML += ''; - } ); - - background.appendChild( video ); - - background.setAttribute( 'data-loaded', 'true' ); - + if( backgroundVideoLoop ) { + video.setAttribute( 'loop', '' ); } + if( backgroundVideoMuted ) { + video.muted = true; + } + + // Inline video playback works (at least in Mobile Safari) as + // long as the video is muted and the `playsinline` attribute is + // present + if( isMobileDevice ) { + video.muted = true; + video.autoplay = true; + video.setAttribute( 'playsinline', '' ); + } + + // Support comma separated lists of video sources + backgroundVideo.split( ',' ).forEach( function( source ) { + video.innerHTML += ''; + } ); + + background.appendChild( video ); } // Iframes else if( backgroundIframe ) { - var iframe = document.createElement( 'iframe' ); iframe.setAttribute( 'allowfullscreen', '' ); iframe.setAttribute( 'mozallowfullscreen', '' ); @@ -3164,17 +3167,9 @@ iframe.style.maxWidth = '100%'; background.appendChild( iframe ); - - background.setAttribute( 'data-loaded', 'true' ); - } - else { - - background.setAttribute( 'data-loaded', 'true' ); - - } - } + } } @@ -3415,10 +3410,8 @@ * the targeted slide. * * @param {HTMLElement} element - * @param {boolean} autoplay Optionally override the - * autoplay setting of media elements */ - function stopEmbeddedContent( element, autoplay ) { + function stopEmbeddedContent( element ) { if( element && element.parentNode ) { // HTML5 media elements