add automatic extension

3 files changed, 226 insertions, 0 deletions

diff --git a/deck.js/extensions/automatic/VERSION b/deck.js/extensions/automatic/VERSION
new file mode 100644
index 0000000..afaf360
--- /dev/null
+++ b/deck.js/extensions/automatic/VERSION
@@ -0,0 +1 @@
+1.0.0
\ No newline at end of file
diff --git a/deck.js/extensions/automatic/deck.automatic.css b/deck.js/extensions/automatic/deck.automatic.css
new file mode 100644
index 0000000..8977540
--- /dev/null
+++ b/deck.js/extensions/automatic/deck.automatic.css
@@ -0,0 +1,40 @@
+.deck-container .deck-automatic-link {
+	position:absolute;
+	z-index:3;
+	bottom: 0;
+	left:49%;
+	margin-top:-16px;
+	font-size:20px;
+	font-weight:bold;
+	line-height:32px;
+	vertical-align:middle;
+	text-align:center;
+	text-decoration:none;
+	cursor: pointer;
+}
+
+.deck-container .deck-automatic-link.deck-automatic-running {
+	color: green;
+}
+
+.deck-container .deck-automatic-link.deck-automatic-stopped {
+	color: red;
+}
+
+.borderradius .deck-container .deck-automatic-link {
+	border-radius(10px);
+}
+
+.deck-container .deck-automatic-link:hover {
+	background-color: lightgrey;
+}
+
+.deck-container .deck-automatic-link:active {
+	background-color: grey;
+}
+
+@media print {
+	.deck-automatic-link {
+		display:none !important;
+	}
+}
\ No newline at end of file
diff --git a/deck.js/extensions/automatic/deck.automatic.js b/deck.js/extensions/automatic/deck.automatic.js
new file mode 100644
index 0000000..6a32209
--- /dev/null
+++ b/deck.js/extensions/automatic/deck.automatic.js
@@ -0,0 +1,185 @@
+/*!
+Deck JS - deck.navigation
+Copyright (c) 2012 Romain Champourlier
+Dual licensed under the MIT license and GPL license.
+https://github.com/imakewebthings/deck.js/blob/master/MIT-license.txt
+https://github.com/imakewebthings/deck.js/blob/master/GPL-license.txt
+*/
+
+/*
+This module adds automatic control of the deck.
+*/
+(function($, deck, undefined) {
+	var $d = $(document);
+	var running = false;
+	
+	clearAutomaticTimeout = function() {
+		if ($[deck].automatic && $[deck].automatic.timeout) {
+			window.clearTimeout($[deck].automatic.timeout);
+		}
+	};
+	
+	// from and to are set with the values of the slide event calling
+	// this method, not the changes this method should trigger.
+	setTimeoutIfNeeded = function(e, from, to) {
+		// Clear previous timeout (necessary in cases the user generates deck's change
+		// events, for example by changing slides manually).
+		clearAutomaticTimeout();
+		
+		var opts = $[deck]('getOptions');
+
+		if (running) {
+			// Slideshow running.
+
+			var elem = $[deck]('getSlide', to);
+			
+			var duration = opts.automatic.slideDuration;
+
+      // Iterate over element's classes to
+      // match against classdata
+      $.each(elem.attr('class').split(/\s+/), function(idx, cls){
+        $.each(opts.classdata, function(feat_cls, features){
+          if(cls == feat_cls && features.duration){
+            duration = features.duration;
+          }
+        });
+      });
+
+			var customDuration = elem.attr('data-duration');
+			if(customDuration){
+			  duration = customDuration;
+			}
+
+      // If duration is negative, don't set a timeout
+			if(duration >= 0){
+			  if (to == $[deck]('getSlides').length-1) {
+				  // setTimeout... called when going to last slide. 
+				  // If cycling, set a timeout to go to first slide, else don't set a timeout, and set
+				  // state to stopped.
+				  if (opts.automatic.cycle) {
+					  $[deck].automatic = {
+						  timeout: window.setTimeout(function() {
+							  $[deck]('go', 0);
+							  if (e) e.preventDefault();
+						  }, duration)
+					  };
+				  }
+				  else {
+					  $(opts.selectors.automaticLink).removeClass(opts.classes.automaticRunning);
+					  $(opts.selectors.automaticLink).addClass(opts.classes.automaticStopped);
+				  }
+			  }
+			  else {
+				  // Running, not yet on last slide.
+				  $[deck].automatic = {
+					  timeout: window.setTimeout(function() {
+						  $[deck]('next');
+						  if (e) e.preventDefault();
+					  }, duration)
+				  };
+			  }
+      }
+		}
+	};
+	
+	/*
+	Extends defaults/options.
+	
+	options.classes.automaticRunning
+		This class is added to the automatic link when the deck is currently in running
+		state.
+		
+	options.classes.automaticStopped
+		This class is added to the automatic link when the deck is currently in stopped
+		state.
+		
+	options.selectors.automaticLink
+		The elements that match this selector will toggle automatic run of the deck
+		when clicked.
+	*/
+	$.extend(true, $[deck].defaults, {
+		classes: {
+			automaticRunning: 'deck-automatic-running',
+			automaticStopped: 'deck-automatic-stopped'
+		},
+		
+		selectors: {
+			automaticLink: '.deck-automatic-link'
+		},
+		
+		classdata: {
+		/* // Example duration class-feature
+		 * // Sets the duration of all elements with
+		 * // bullet-point-timing class to 500ms.
+		 * 'bullet-point-timing': {
+		 *   duration: 500
+	   * }
+	   */
+		},
+		
+		automatic: {
+			startRunning: true,
+			cycle: true,
+			slideDuration: 3000
+		}
+	});
+
+  // Lets others detect when slideshow is running automatically
+  $[deck]('extend', 'isRunning', function(){
+    return running;
+  });
+
+	$d.bind('deck.init', function() {
+		var opts = $[deck]('getOptions'),
+		slides = $[deck]('getSlides'),
+		$current = $[deck]('getSlide'),
+		ndx;
+		
+		// Extension function to play the slideshow
+		$[deck]('extend', 'play', function(){
+      var slides = $[deck]('getSlides');
+		  if (slides[slides.length-1] == $[deck]('getSlide')) {
+			  // Stopped on last slide. Clicking to play/pause will rewind to first slide, and play.
+			  $.deck('go', 0);
+		  }
+		  running = true;
+		  $(opts.selectors.automaticLink).addClass(opts.classes.automaticRunning);
+		  $(opts.selectors.automaticLink).removeClass(opts.classes.automaticStopped);
+      $d.trigger('deck.onPlayToggle', true);
+		  $d.trigger('deck.onPlay');
+		  setTimeoutIfNeeded(null, slides.length, 0);
+    });
+    
+    // Extension function to pause the slideshow
+    $[deck]('extend', 'pause', function(){
+      running = false;
+		  $(opts.selectors.automaticLink).addClass(opts.classes.automaticStopped);
+      $(opts.selectors.automaticLink).removeClass(opts.classes.automaticRunning);
+      $d.trigger('deck.onPlayToggle', true);
+      $d.trigger('deck.onPause');
+		  clearAutomaticTimeout();
+    });
+		
+		// Setup initial state
+		if (opts.automatic.startRunning) {
+      $[deck]('play');
+		}
+		else {
+		  $[deck]('pause');
+		}
+		setTimeoutIfNeeded(null, ndx, 0);
+		
+		// Setup automatic link toggle events
+		$(opts.selectors.automaticLink)
+		.unbind('click.deckautomatic')
+		.bind('click.deckautomatic', function(e) {
+			if (!running) {
+				$[deck]('play');
+			}
+			else {
+				$[deck]('pause');
+			}
+		});
+	})
+	.bind('deck.change', setTimeoutIfNeeded);
+})(jQuery, 'deck');