Skip to content
Snippets Groups Projects
Commit 87591d95 authored by Hakim El Hattab's avatar Hakim El Hattab
Browse files

cosmetical tweaks to postmessage plugin

parent 42766b1b
Branches
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
plugin/postmessage/example.html 0 → 100644
+ 39
− 0
View file @ 87591d95
<html>
<body>
<iframe id="reveal" src="../../index.html" style="border: 0;" width="500" height="500"></iframe>
<div>
<input id="back" type="button" value="go back"/>
<input id="ahead" type="button" value="go ahead"/>
<input id="slideto" type="button" value="slideto 2-2"/>
</div>
<script>
(function (){
var back = document.getElementById( 'back' ),
ahead = document.getElementById( 'ahead' ),
slideto = document.getElementById( 'slideto' ),
reveal = window.frames[0];
back.addEventListener( 'click', function () {
reveal.postMessage( JSON.stringify({method: 'prev', args: []}), '*' );
}, false );
ahead.addEventListener( 'click', function (){
reveal.postMessage( JSON.stringify({method: 'next', args: []}), '*' );
}, false );
slideto.addEventListener( 'click', function (){
reveal.postMessage( JSON.stringify({method: 'slide', args: [2,2]}), '*' );
}, false );
}());
</script>
</body>
</html>
plugin/postmessage/iframe_example.html deleted 100644 → 0
+ 0
− 34
View file @ 42766b1b
<html>
<body>
<iframe id="reveal" src="reveal.js/index.html" width="500" height="500"></iframe>
<div>
<input id="back" type="button" value="go back"/>
<input id="ahead" type="button" value="go ahead"/>
<input id="slideto" type="button" value="slideto 2-2"/>
</div>
<script>
(function (){
var back = document.getElementById('back'),
ahead = document.getElementById('ahead'),
slideto = document.getElementById('slideto'),
reveal = window.frames[0];
back.addEventListener('click', function (){
reveal.postMessage(JSON.stringify({method: 'prev', args: []}), '*');
},false);
ahead.addEventListener('click', function (){
reveal.postMessage(JSON.stringify({method: 'next', args: []}), '*');
},false);
slideto.addEventListener('click', function (){
reveal.postMessage(JSON.stringify({method: 'slide', args: [2,2]}), '*');
},false);
}());
</script>
</body>
</html>
plugin/postmessage/postmessage.js
+ 26
− 24
View file @ 87591d95
/*
simple postmessage plugin
Useful when a reveal slideshow is inside an iframe.
It allows to call reveal methods from outside.
simple postmessage plugin
Example:
var reveal = window.frames[0];
Useful when a reveal slideshow is inside an iframe.
It allows to call reveal methods from outside.
// Reveal.prev();
reveal.postMessage(JSON.stringify({method: 'prev', args: []}), '*');
// Reveal.next();
reveal.postMessage(JSON.stringify({method: 'next', args: []}), '*');
// Reveal.slide(2, 2);
reveal.postMessage(JSON.stringify({method: 'slide', args: [2,2]}), '*');
Example:
var reveal = window.frames[0];
Add to the slideshow:
// Reveal.prev();
reveal.postMessage(JSON.stringify({method: 'prev', args: []}), '*');
// Reveal.next();
reveal.postMessage(JSON.stringify({method: 'next', args: []}), '*');
// Reveal.slide(2, 2);
reveal.postMessage(JSON.stringify({method: 'slide', args: [2,2]}), '*');
dependencies: [
...
{ src: 'plugin/postmessage/postmessage.js', async: true, condition: function() { return !!document.body.classList; } }
]
Add to the slideshow:
dependencies: [
...
{ src: 'plugin/postmessage/postmessage.js', async: true, condition: function() { return !!document.body.classList; } }
]
*/
(function (){
window.addEventListener("message", function (event){
var data = JSON.parse(event.data),
method = data.method,
args = data.args;
if (Reveal[method]){
Reveal[method].apply(Reveal, data.args);
}
}, false);
window.addEventListener( "message", function ( event ) {
var data = JSON.parse( event.data ),
method = data.method,
args = data.args;
if( typeof Reveal[method] === 'function' ) {
Reveal[method].apply( Reveal, data.args );
}
}, false);
}());
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment