Created
June 13, 2012 15:37
-
-
Save adautoneto/2924830 to your computer and use it in GitHub Desktop.
Slides
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta http-equiv="content-type" content="text/html; charset=UTF-8"> | |
| <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script> | |
| <script type='text/javascript' src="slides-v2.js"></script> | |
| <style type='text/css'> | |
| .slide { display: none; } | |
| </style> | |
| </head> | |
| <body> | |
| <img class="slide" src="http://jsfiddle.net/img/logo.png" /> | |
| <img class="slide" src="http://delicious.com/static/img/logo_delicious_sprite.png" /> | |
| <img class="slide" src="http://www.delicious.com/static/img/profile/honeybadger.png" /> | |
| <video class="slide" src="http://dl.dropbox.com/u/6963935/squirrel_drama.mov" autoplay /> | |
| </body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| $(function(){ | |
| var duration_in_seconds = 9; | |
| var Iterator = (function(items) { | |
| var index = 0; | |
| this.length = items.length; | |
| return { | |
| moveFirst: function() { index = 0; }, | |
| next: function(){ return index++; }, | |
| isLast: function() { return index == this.length; }, | |
| current: function() { return items.eq(index); }, | |
| length: this.length | |
| }; | |
| }); | |
| var SlideShow = (function(slides) { | |
| var self = new Iterator(slides); | |
| var secondsPerContent = duration_in_seconds / self.length; | |
| function rotate() { | |
| if (self.isLast()) self.moveFirst(); | |
| if (isVideo()) { | |
| bindOnEndEvent(); | |
| show(); | |
| reloadVideo(); | |
| } | |
| else { | |
| show(); | |
| setTimeout(function() { rotate(self.next()); }, secondsPerContent * 1000); | |
| } | |
| } | |
| function reloadVideo(){ | |
| var video = self.current().get(0); | |
| video.load(); | |
| video.play(); | |
| } | |
| function bindOnEndEvent(){ | |
| self.current().one("ended", function(e) { | |
| self.next(); | |
| rotate(); | |
| }); | |
| } | |
| function isVideo() { | |
| return self.current().is("video"); | |
| } | |
| function show() { | |
| slides.hide(); | |
| self.current().show(); | |
| } | |
| return { | |
| play: rotate | |
| } | |
| }); | |
| var slideShow = new SlideShow($(".slide")); | |
| slideShow.play(); | |
| }); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| $(function(){ | |
| var duration_in_seconds = 9; | |
| var content = $(".slide"); | |
| var contentIndex = getContentIndexByTime(); | |
| rotate(contentIndex); | |
| function rotate(contentIndex){ | |
| if (contentIndex == content.length) contentIndex = 0; | |
| var secondsPerContent = duration_in_seconds / content.length; | |
| var current = content.eq(contentIndex); | |
| if (isVideo(current)) { | |
| bindOnEndEvent(current, ++contentIndex); | |
| showSlide(current); | |
| reloadVideo(current); | |
| } | |
| else { | |
| showSlide(current); | |
| setTimeout(function() { rotate(++contentIndex); }, secondsPerContent * 1000); | |
| } | |
| } | |
| function getContentIndexByTime() { | |
| var contentIndex = Math.floor(new Date().getSeconds() * content.length / 60); | |
| return contentIndex; | |
| } | |
| function isVideo(element) { | |
| return element.is("video"); | |
| } | |
| function showSlide(element) { | |
| $(".slide").hide(); | |
| element.show(); | |
| } | |
| function bindOnEndEvent(current, nextContentIndex){ | |
| current.one("ended", function(e) { | |
| rotate(nextContentIndex); | |
| }); | |
| } | |
| function reloadVideo(current){ | |
| current.get(0).load(); | |
| current.get(0).play(); | |
| } | |
| }); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment