initial implentation of preview frame, add semi-fade fragment style, data-full-height support
This commit is contained in:
Hakim El Hattab committed
1 parent
b67889049a
commit
de551634c6
4 files changed
+273
-9
No files matched your search
+136
-6
@@ -70,6 +70,9 @@ var Reveal = (function(){
|
||||
// Apply a 3D roll to links on hover
|
||||
rollingLinks: true,
|
||||
|
||||
// Opens links in an iframe preview overlay
|
||||
previewLinks: false,
|
||||
|
||||
// Theme (see /css/theme)
|
||||
theme: null,
|
||||
|
||||
@@ -380,12 +383,21 @@ var Reveal = (function(){
|
||||
document.removeEventListener( 'mousewheel', onDocumentMouseScroll, false );
|
||||
}
|
||||
|
||||
// 3D links
|
||||
// Rolling 3D links
|
||||
if( config.rollingLinks ) {
|
||||
enable3DLinks();
|
||||
enableRollingLinks();
|
||||
}
|
||||
else {
|
||||
disable3DLinks();
|
||||
disableRollingLinks();
|
||||
}
|
||||
|
||||
// Iframe link previews
|
||||
if( config.previewLinks ) {
|
||||
enablePreviewLinks();
|
||||
}
|
||||
else {
|
||||
disablePreviewLinks();
|
||||
enablePreviewLinks( '[data-preview-link]' );
|
||||
}
|
||||
|
||||
// Load the theme in the config, if it's not already loaded
|
||||
@@ -560,7 +572,7 @@ var Reveal = (function(){
|
||||
/**
|
||||
* Wrap all links in 3D goodness.
|
||||
*/
|
||||
function enable3DLinks() {
|
||||
function enableRollingLinks() {
|
||||
|
||||
if( supports3DTransforms && !( 'msPerspective' in document.body.style ) ) {
|
||||
var anchors = document.querySelectorAll( SLIDES_SELECTOR + ' a:not(.image)' );
|
||||
@@ -585,7 +597,7 @@ var Reveal = (function(){
|
||||
/**
|
||||
* Unwrap all 3D links.
|
||||
*/
|
||||
function disable3DLinks() {
|
||||
function disableRollingLinks() {
|
||||
|
||||
var anchors = document.querySelectorAll( SLIDES_SELECTOR + ' a.roll' );
|
||||
|
||||
@@ -601,6 +613,110 @@ var Reveal = (function(){
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* 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 ) {
|
||||
|
||||
toArray( element.childNodes ).forEach( function( child ) {
|
||||
height = Math.max( height, child.offsetTop + child.offsetHeight );
|
||||
} );
|
||||
|
||||
}
|
||||
|
||||
return height;
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Bind preview frame links.
|
||||
*/
|
||||
function enablePreviewLinks( selector ) {
|
||||
|
||||
var anchors = toArray( document.querySelectorAll( selector ? selector : 'a' ) );
|
||||
|
||||
anchors.forEach( function( element ) {
|
||||
if( /^(http|www)/gi.test( element.getAttribute( 'href' ) ) ) {
|
||||
element.addEventListener( 'click', onPreviewLinkClicked, false );
|
||||
}
|
||||
} );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Unbind preview frame links.
|
||||
*/
|
||||
function disablePreviewLinks() {
|
||||
|
||||
var anchors = toArray( document.querySelectorAll( 'a' ) );
|
||||
|
||||
anchors.forEach( function( element ) {
|
||||
if( /^(http|www)/gi.test( element.getAttribute( 'href' ) ) ) {
|
||||
element.removeEventListener( 'click', onPreviewLinkClicked, false );
|
||||
}
|
||||
} );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Opens a preview window for the target URL.
|
||||
*/
|
||||
function openPreview( url ) {
|
||||
|
||||
closePreview();
|
||||
|
||||
dom.preview = document.createElement( 'div' );
|
||||
dom.preview.classList.add( 'preview-link-overlay' );
|
||||
dom.wrapper.appendChild( dom.preview );
|
||||
|
||||
dom.preview.innerHTML = [
|
||||
'<header>',
|
||||
'<a class="close" href="#"><span class="icon"></span></a>',
|
||||
'<a class="external" href="'+ url +'" target="_blank"><span class="icon"></span></a>',
|
||||
'</header>',
|
||||
'<div class="spinner"></div>',
|
||||
'<div class="viewport">',
|
||||
'<iframe src="'+ url +'"></iframe>',
|
||||
'</div>'
|
||||
].join('');
|
||||
|
||||
dom.preview.querySelector( 'iframe' ).addEventListener( 'load', function( event ) {
|
||||
dom.preview.classList.add( 'loaded' );
|
||||
}, false );
|
||||
|
||||
dom.preview.querySelector( '.close' ).addEventListener( 'click', function( event ) {
|
||||
closePreview();
|
||||
event.preventDefault();
|
||||
}, false );
|
||||
|
||||
dom.preview.querySelector( '.external' ).addEventListener( 'click', function( event ) {
|
||||
closePreview();
|
||||
}, false );
|
||||
|
||||
setTimeout( function() {
|
||||
dom.preview.classList.add( 'visible' );
|
||||
}, 1 );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Closes the iframe preview window.
|
||||
*/
|
||||
function closePreview() {
|
||||
|
||||
if( dom.preview ) {
|
||||
dom.preview.setAttribute( 'src', '' );
|
||||
dom.preview.parentNode.removeChild( dom.preview );
|
||||
dom.preview = null;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Return a sorted fragments list, ordered by an increasing
|
||||
* "data-fragment-index" attribute.
|
||||
@@ -707,7 +823,7 @@ var Reveal = (function(){
|
||||
slide.style.top = 0;
|
||||
}
|
||||
else {
|
||||
slide.style.top = Math.max( - ( slide.offsetHeight / 2 ) - 20, -slideHeight / 2 ) + 'px';
|
||||
slide.style.top = Math.max( - ( getAbsoluteHeight( slide ) / 2 ) - 20, -slideHeight / 2 ) + 'px';
|
||||
}
|
||||
}
|
||||
else {
|
||||
@@ -2117,6 +2233,20 @@ var Reveal = (function(){
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Handles clicks on links that are set to preview in the
|
||||
* iframe overlay.
|
||||
*/
|
||||
function onPreviewLinkClicked( event ) {
|
||||
|
||||
var url = event.target.getAttribute( 'href' );
|
||||
if( url ) {
|
||||
openPreview( url );
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
// --------------------------------------------------------------------//
|
||||
// ------------------------------- API --------------------------------//
|
||||
|
||||
Vendored
+2
-2
@@ -1,8 +1,8 @@
|
||||
/*!
|
||||
* reveal.js 2.5.0 (2013-05-12, 09:44)
|
||||
* reveal.js 2.5.0 (2013-05-20, 00:18)
|
||||
* http://lab.hakim.se/reveal-js
|
||||
* MIT licensed
|
||||
*
|
||||
* Copyright (C) 2013 Hakim El Hattab, http://hakim.se
|
||||
*/
|
||||
var Reveal=function(){"use strict";function e(e){return Mt||kt?(window.addEventListener("load",h,!1),c(bt,e),n(),r(),void 0):(document.body.setAttribute("class","no-transforms"),void 0)}function t(){if(Tt.theme=document.querySelector("#theme"),Tt.wrapper=document.querySelector(".reveal"),Tt.slides=document.querySelector(".reveal .slides"),!Tt.wrapper.querySelector(".progress")){var e=document.createElement("div");e.classList.add("progress"),e.innerHTML="<span></span>",Tt.wrapper.appendChild(e)}if(!Tt.wrapper.querySelector(".controls")){var t=document.createElement("aside");t.classList.add("controls"),t.innerHTML='<div class="navigate-left"></div><div class="navigate-right"></div><div class="navigate-up"></div><div class="navigate-down"></div>',Tt.wrapper.appendChild(t)}if(!Tt.wrapper.querySelector(".state-background")){var n=document.createElement("div");n.classList.add("state-background"),Tt.wrapper.appendChild(n)}if(!Tt.wrapper.querySelector(".pause-overlay")){var r=document.createElement("div");r.classList.add("pause-overlay"),Tt.wrapper.appendChild(r)}Tt.progress=document.querySelector(".reveal .progress"),Tt.progressbar=document.querySelector(".reveal .progress span"),bt.controls&&(Tt.controls=document.querySelector(".reveal .controls"),Tt.controlsLeft=l(document.querySelectorAll(".navigate-left")),Tt.controlsRight=l(document.querySelectorAll(".navigate-right")),Tt.controlsUp=l(document.querySelectorAll(".navigate-up")),Tt.controlsDown=l(document.querySelectorAll(".navigate-down")),Tt.controlsPrev=l(document.querySelectorAll(".navigate-prev")),Tt.controlsNext=l(document.querySelectorAll(".navigate-next")))}function n(){/iphone|ipod|android/gi.test(navigator.userAgent)&&!/crios/gi.test(navigator.userAgent)&&(window.addEventListener("load",u,!1),window.addEventListener("orientationchange",u,!1))}function r(){function e(){n.length&&head.js.apply(null,n),o()}for(var t=[],n=[],r=0,a=bt.dependencies.length;a>r;r++){var s=bt.dependencies[r];(!s.condition||s.condition())&&(s.async?n.push(s.src):t.push(s.src),"function"==typeof s.callback&&head.ready(s.src.match(/([\w\d_\-]*)\.?js$|[^\\\/]*$/i)[0],s.callback))}t.length?(head.ready(e),head.js.apply(null,t)):e()}function o(){t(),a(),H(),setTimeout(function(){f("ready",{indexh:St,indexv:At,currentSlide:ht})},1)}function a(e){if(Tt.wrapper.classList.remove(bt.transition),"object"==typeof e&&c(bt,e),kt===!1&&(bt.transition="linear"),Tt.wrapper.classList.add(bt.transition),Tt.wrapper.setAttribute("data-transition-speed",bt.transitionSpeed),Tt.controls&&(Tt.controls.style.display=bt.controls&&Tt.controls?"block":"none"),Tt.progress&&(Tt.progress.style.display=bt.progress&&Tt.progress?"block":"none"),bt.rtl?Tt.wrapper.classList.add("rtl"):Tt.wrapper.classList.remove("rtl"),bt.center?Tt.wrapper.classList.add("center"):Tt.wrapper.classList.remove("center"),bt.mouseWheel?(document.addEventListener("DOMMouseScroll",ot,!1),document.addEventListener("mousewheel",ot,!1)):(document.removeEventListener("DOMMouseScroll",ot,!1),document.removeEventListener("mousewheel",ot,!1)),bt.rollingLinks?v():p(),bt.theme&&Tt.theme){var t=Tt.theme.getAttribute("href"),n=/[^\/]*?(?=\.css)/,r=t.match(n)[0];bt.theme!==r&&(t=t.replace(n,bt.theme),Tt.theme.setAttribute("href",t))}P()}function s(){Yt=!0,window.addEventListener("hashchange",ft,!1),window.addEventListener("resize",vt,!1),bt.touch&&(Tt.wrapper.addEventListener("touchstart",G,!1),Tt.wrapper.addEventListener("touchmove",J,!1),Tt.wrapper.addEventListener("touchend",et,!1),window.navigator.msPointerEnabled&&(Tt.wrapper.addEventListener("MSPointerDown",tt,!1),Tt.wrapper.addEventListener("MSPointerMove",nt,!1),Tt.wrapper.addEventListener("MSPointerUp",rt,!1))),bt.keyboard&&document.addEventListener("keydown",B,!1),bt.progress&&Tt.progress&&Tt.progress.addEventListener("click",at,!1),bt.controls&&Tt.controls&&["touchstart","click"].forEach(function(e){Tt.controlsLeft.forEach(function(t){t.addEventListener(e,st,!1)}),Tt.controlsRight.forEach(function(t){t.addEventListener(e,it,!1)}),Tt.controlsUp.forEach(function(t){t.addEventListener(e,ct,!1)}),Tt.controlsDown.forEach(function(t){t.addEventListener(e,lt,!1)}),Tt.controlsPrev.forEach(function(t){t.addEventListener(e,dt,!1)}),Tt.controlsNext.forEach(function(t){t.addEventListener(e,ut,!1)})})}function i(){Yt=!1,document.removeEventListener("keydown",B,!1),window.removeEventListener("hashchange",ft,!1),window.removeEventListener("resize",vt,!1),Tt.wrapper.removeEventListener("touchstart",G,!1),Tt.wrapper.removeEventListener("touchmove",J,!1),Tt.wrapper.removeEventListener("touchend",et,!1),window.navigator.msPointerEnabled&&(Tt.wrapper.removeEventListener("MSPointerDown",tt,!1),Tt.wrapper.removeEventListener("MSPointerMove",nt,!1),Tt.wrapper.removeEventListener("MSPointerUp",rt,!1)),bt.progress&&Tt.progress&&Tt.progress.removeEventListener("click",at,!1),bt.controls&&Tt.controls&&["touchstart","click"].forEach(function(e){Tt.controlsLeft.forEach(function(t){t.removeEventListener(e,st,!1)}),Tt.Line truncated
|
||||
var Reveal=function(){"use strict";function e(e){return Yt||Ot?(window.addEventListener("load",b,!1),c(kt,e),n(),r(),void 0):(document.body.setAttribute("class","no-transforms"),void 0)}function t(){if(Ct.theme=document.querySelector("#theme"),Ct.wrapper=document.querySelector(".reveal"),Ct.slides=document.querySelector(".reveal .slides"),!Ct.wrapper.querySelector(".progress")){var e=document.createElement("div");e.classList.add("progress"),e.innerHTML="<span></span>",Ct.wrapper.appendChild(e)}if(!Ct.wrapper.querySelector(".controls")){var t=document.createElement("aside");t.classList.add("controls"),t.innerHTML='<div class="navigate-left"></div><div class="navigate-right"></div><div class="navigate-up"></div><div class="navigate-down"></div>',Ct.wrapper.appendChild(t)}if(!Ct.wrapper.querySelector(".state-background")){var n=document.createElement("div");n.classList.add("state-background"),Ct.wrapper.appendChild(n)}if(!Ct.wrapper.querySelector(".pause-overlay")){var r=document.createElement("div");r.classList.add("pause-overlay"),Ct.wrapper.appendChild(r)}Ct.progress=document.querySelector(".reveal .progress"),Ct.progressbar=document.querySelector(".reveal .progress span"),kt.controls&&(Ct.controls=document.querySelector(".reveal .controls"),Ct.controlsLeft=l(document.querySelectorAll(".navigate-left")),Ct.controlsRight=l(document.querySelectorAll(".navigate-right")),Ct.controlsUp=l(document.querySelectorAll(".navigate-up")),Ct.controlsDown=l(document.querySelectorAll(".navigate-down")),Ct.controlsPrev=l(document.querySelectorAll(".navigate-prev")),Ct.controlsNext=l(document.querySelectorAll(".navigate-next")))}function n(){/iphone|ipod|android/gi.test(navigator.userAgent)&&!/crios/gi.test(navigator.userAgent)&&(window.addEventListener("load",u,!1),window.addEventListener("orientationchange",u,!1))}function r(){function e(){n.length&&head.js.apply(null,n),o()}for(var t=[],n=[],r=0,a=kt.dependencies.length;a>r;r++){var i=kt.dependencies[r];(!i.condition||i.condition())&&(i.async?n.push(i.src):t.push(i.src),"function"==typeof i.callback&&head.ready(i.src.match(/([\w\d_\-]*)\.?js$|[^\\\/]*$/i)[0],i.callback))}t.length?(head.ready(e),head.js.apply(null,t)):e()}function o(){t(),a(),F(),setTimeout(function(){f("ready",{indexh:Mt,indexv:Pt,currentSlide:Et})},1)}function a(e){if(Ct.wrapper.classList.remove(kt.transition),"object"==typeof e&&c(kt,e),Ot===!1&&(kt.transition="linear"),Ct.wrapper.classList.add(kt.transition),Ct.wrapper.setAttribute("data-transition-speed",kt.transitionSpeed),Ct.controls&&(Ct.controls.style.display=kt.controls&&Ct.controls?"block":"none"),Ct.progress&&(Ct.progress.style.display=kt.progress&&Ct.progress?"block":"none"),kt.rtl?Ct.wrapper.classList.add("rtl"):Ct.wrapper.classList.remove("rtl"),kt.center?Ct.wrapper.classList.add("center"):Ct.wrapper.classList.remove("center"),kt.mouseWheel?(document.addEventListener("DOMMouseScroll",lt,!1),document.addEventListener("mousewheel",lt,!1)):(document.removeEventListener("DOMMouseScroll",lt,!1),document.removeEventListener("mousewheel",lt,!1)),kt.rollingLinks?v():p(),kt.previewLinks?h():(g(),h("[data-preview-link]")),kt.theme&&Ct.theme){var t=Ct.theme.getAttribute("href"),n=/[^\/]*?(?=\.css)/,r=t.match(n)[0];kt.theme!==r&&(t=t.replace(n,kt.theme),Ct.theme.setAttribute("href",t))}Y()}function i(){Ut=!0,window.addEventListener("hashchange",gt,!1),window.addEventListener("resize",yt,!1),kt.touch&&(Ct.wrapper.addEventListener("touchstart",rt,!1),Ct.wrapper.addEventListener("touchmove",ot,!1),Ct.wrapper.addEventListener("touchend",at,!1),window.navigator.msPointerEnabled&&(Ct.wrapper.addEventListener("MSPointerDown",it,!1),Ct.wrapper.addEventListener("MSPointerMove",st,!1),Ct.wrapper.addEventListener("MSPointerUp",ct,!1))),kt.keyboard&&document.addEventListener("keydown",nt,!1),kt.progress&&Ct.progress&&Ct.progress.addEventListener("click",dt,!1),kt.controls&&Ct.controls&&["touchstart","click"].forEach(function(e){Ct.controlsLeft.forEach(function(t){t.addEventListener(e,ut,!1)}),Ct.controlsRight.forEach(function(t){t.addEventListener(e,ft,!1)}),Ct.controlsUp.forEach(function(t){t.addEventListener(e,vt,!1)}),Ct.controlsDown.forEach(function(t){t.addEventListener(e,pt,!1)}),Ct.controlsPrev.forEach(function(t){t.addEventListener(e,mt,!1)}),Ct.controlsNext.forEach(function(t){t.addEventListener(e,ht,!1)})})}function s(){Ut=!1,document.removeEventListener("keydown",nt,!1),window.removeEventListener("hashchange",gt,!1),window.removeEventListener("resize",yt,!1),Ct.wrapper.removeEventListener("touchstart",rt,!1),Ct.wrapper.removeEventListener("touchmove",ot,!1),Ct.wrapper.removeEventListener("touchend",at,!1),window.navigator.msPointerEnabled&&(Ct.wrapper.removeEventListener("MSPointerDown",it,!1),Ct.wrapper.removeEventListener("MSPointerMove",st,!1),Ct.wrapper.removeEventListener("MSPointerUp",ct,!1)),kt.progress&&Ct.progress&&Ct.progress.removeEventListener("click",dt,!1),kt.controls&&Ct.controls&&["touchstart","click"].forEach(function(e){Ct.controlsLeftLine truncated
|
||||
Reference in new issue
Block a user