swipebox 1.3.0.2 → 1.4.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 903e8dac097206db8c9e25caee1086e184c33483
-  data.tar.gz: cf0b6af816942097436dcaaaf3730d294e0cef4b
+  metadata.gz: 828c397530a1e7d9f3b2395f4f0093bcf8adda3b
+  data.tar.gz: c58e50ae61b66228b2d61bdbbb1c13d4ea67b590
 SHA512:
-  metadata.gz: 4916614e27134b439bcc79c56392e37dae49770651382b793401c63339b542582d1dac21e37ef9f74a11004037c8d0d3502db404ae5352453b7d6206fb92f3e5
-  data.tar.gz: 890aa6af31c3f7f59486d708541c25602a3677e4ac591d77563562061087029db27f5e04e7a0b6657e2574e3e12f44875cb53bc848f01a05a24c6f756f69574c
+  metadata.gz: 6ef6ebd4561ce37c615fe353fc63d9bd120be2b40ec07767b124d8f52c3c19efce63144e9284073d432dc92dd0e83526cd2a37b02340a2282bb04a0af1985b58
+  data.tar.gz: 6bc667601a9afad34f722040316d7455247f8e33a3d2e7dbd1b022c59dd516f8a76519e217c06366ae231fc202dd3e428040dbc0e37cfcc72a5c02247544aaf3

data/README.md

@@ -4,6 +4,7 @@
 [![Build Status](http://img.shields.io/travis/mrfoto/swipebox.svg?style=flat-square)](https://travis-ci.org/mrfoto/swipebox)
 [![Code Climate](http://img.shields.io/codeclimate/github/mrfoto/swipebox.svg?style=flat-square)](https://codeclimate.com/github/mrfoto/swipebox)
 [![Dependency Status](http://img.shields.io/gemnasium/mrfoto/swipebox.svg?style=flat-square)](https://gemnasium.com/mrfoto/swipebox)
+[![swipebox API Documentation](https://img.shields.io/badge/omniref-docs-da2b48.svg?style=flat-square)](https://www.omniref.com/ruby/gems/swipebox)
 
 [Swipebox | A touchable jQuery lightbox](http://brutaldesign.github.io/swipebox/) for the Rails asset pipeline
 
@@ -45,19 +46,20 @@ $('.swipebox').swipebox();
 
 ```javascript
 useCSS : true, // false will force the use of jQuery for animations
-initialIndexOnArray: 0, // which image index to init when a array is passed
+useSVG : true, // false to force the use of png for buttons
+initialIndexOnArray : 0, // which image index to init when a array is passed
 hideCloseButtonOnMobile : false, // true will hide the close button on mobile devices
 hideBarsDelay : 3000, // delay before hiding bars on desktop
 videoMaxWidth : 1140, // videos max width
-beforeOpen: function(){} , // called before opening
+beforeOpen: function() {}, // called before opening
 afterOpen: null, // called after opening
-afterClose: function(){}, // called after closing
-loopAtEnd: false // true will return to the first image after the last image is reached
+afterClose: function() {}, // called after closing
+loopAtEnd: false // true will return to the first image after the last image is reached of Bootstrap)
 ```
 
 Look at the original [Swipebox repo](https://github.com/brutaldesign/swipebox#usage) for more.
 
-I have modified source a bit from the 1.3.0.2 version:
+I have modified source a bit from the 1.4.1 version:
 - SCSS instead of CSS because we need the `image-url` helpers
 - .png -> .svg via class not hardcoded image path
 

data/lib/swipebox/version.rb

@@ -1,3 +1,3 @@
 module Swipebox
-  VERSION = '1.3.0.2'
+  VERSION = '1.4.1'
 end

data/vendor/assets/javascripts/swipebox.js

@@ -1,4 +1,4 @@
-/*! Swipebox v1.3.0.2 | Constantin Saguin csag.co | MIT License | github.com/brutaldesign/swipebox */
+/*! Swipebox v1.4.1 | Constantin Saguin csag.co | MIT License | github.com/brutaldesign/swipebox */
 
 ;( function ( window, document, $, undefined ) {
 
@@ -6,48 +6,53 @@
 
 		// Default options
 		var ui,
-		defaults = {
-			useCSS : true,
-			useSVG : true,
-			initialIndexOnArray : 0,
-			hideCloseButtonOnMobile : false,
-			hideBarsDelay : 3000,
-			videoMaxWidth : 1140,
-			vimeoColor : 'cccccc',
-			beforeOpen: null,
-			afterOpen: null,
-			afterClose: null,
-			loopAtEnd: false,
-			autoplayVideos: false
-		},
-
-		plugin = this,
-		elements = [], // slides array [ { href:'...', title:'...' }, ...],
-		$elem,
-		selector = elem.selector,
-		$selector = $( selector ),
-		isMobile = navigator.userAgent.match( /(iPad)|(iPhone)|(iPod)|(Android)|(PlayBook)|(BB10)|(BlackBerry)|(Opera Mini)|(IEMobile)|(webOS)|(MeeGo)/i ),
-		isTouch = isMobile !== null || document.createTouch !== undefined || ( 'ontouchstart' in window ) || ( 'onmsgesturechange' in window ) || navigator.msMaxTouchPoints,
-		supportSVG = !! document.createElementNS && !! document.createElementNS( 'http://www.w3.org/2000/svg', 'svg').createSVGRect,
-		winWidth = window.innerWidth ? window.innerWidth : $( window ).width(),
-		winHeight = window.innerHeight ? window.innerHeight : $( window ).height(),
-		currentX = 0,
-		/* jshint multistr: true */
-		html = '<div id="swipebox-overlay">\
-		<div id="swipebox-container">\
-		<div id="swipebox-slider"></div>\
-		<div id="swipebox-top-bar">\
-		<div id="swipebox-title"></div>\
-		</div>\
-		<div id="swipebox-bottom-bar">\
-		<div id="swipebox-arrows">\
-		<a id="swipebox-prev"></a>\
-		<a id="swipebox-next"></a>\
-		</div>\
-		</div>\
-		<a id="swipebox-close"></a>\
-		</div>\
-		</div>';
+			defaults = {
+				useCSS : true,
+				useSVG : true,
+				initialIndexOnArray : 0,
+				removeBarsOnMobile : true,
+				hideCloseButtonOnMobile : false,
+				hideBarsDelay : 3000,
+				videoMaxWidth : 1140,
+				vimeoColor : 'cccccc',
+				beforeOpen: null,
+				afterOpen: null,
+				afterClose: null,
+				nextSlide: null,
+				prevSlide: null,
+				loopAtEnd: false,
+				autoplayVideos: false,
+				queryStringData: {},
+				toggleClassOnLoad: ''
+			},
+
+			plugin = this,
+			elements = [], // slides array [ { href:'...', title:'...' }, ...],
+			$elem,
+			selector = elem.selector,
+			$selector = $( selector ),
+			isMobile = navigator.userAgent.match( /(iPad)|(iPhone)|(iPod)|(Android)|(PlayBook)|(BB10)|(BlackBerry)|(Opera Mini)|(IEMobile)|(webOS)|(MeeGo)/i ),
+			isTouch = isMobile !== null || document.createTouch !== undefined || ( 'ontouchstart' in window ) || ( 'onmsgesturechange' in window ) || navigator.msMaxTouchPoints,
+			supportSVG = !! document.createElementNS && !! document.createElementNS( 'http://www.w3.org/2000/svg', 'svg').createSVGRect,
+			winWidth = window.innerWidth ? window.innerWidth : $( window ).width(),
+			winHeight = window.innerHeight ? window.innerHeight : $( window ).height(),
+			currentX = 0,
+			/* jshint multistr: true */
+			html = '<div id="swipebox-overlay">\
+					<div id="swipebox-container">\
+						<div id="swipebox-slider"></div>\
+						<div id="swipebox-top-bar">\
+							<div id="swipebox-title"></div>\
+						</div>\
+						<div id="swipebox-bottom-bar">\
+							<div id="swipebox-arrows">\
+								<a id="swipebox-prev"></a>\
+								<a id="swipebox-next"></a>\
+							</div>\
+						</div>\
+						<a id="swipebox-close"></a>\
+					</div>\
+			</div>';
 
 		plugin.settings = {};
 
@@ -109,7 +114,7 @@
 					$elem.each( function() {
 
 						var title = null,
-						href = null;
+							href = null;
 
 						if ( $( this ).attr( 'title' ) ) {
 							title = $( this ).attr( 'title' );
@@ -138,8 +143,8 @@
 		ui = {
 
 			/**
-			* Initiate Swipebox
-			*/
+			 * Initiate Swipebox
+			 */
 			init : function( index ) {
 				if ( plugin.settings.beforeOpen ) {
 					plugin.settings.beforeOpen();
@@ -157,8 +162,8 @@
 			},
 
 			/**
-			* Built HTML containers and fire main functions
-			*/
+			 * Built HTML containers and fire main functions
+			 */
 			build : function () {
 				var $this = this, bg;
 
@@ -168,7 +173,7 @@
 					$('#swipebox-prev, #swipebox-next, #swipebox-close').addClass('svg');
 				}
 
-				if ( isMobile ) {
+				if ( isMobile && plugin.settings.removeBarsOnMobile ) {
 					$( '#swipebox-bottom-bar, #swipebox-top-bar' ).remove();
 				}
 
@@ -192,8 +197,8 @@
 			},
 
 			/**
-			* Set dimensions depending on windows width and height
-			*/
+			 * Set dimensions depending on windows width and height
+			 */
 			setDim : function () {
 
 				var width, height, sliderCss = {};
@@ -228,8 +233,8 @@
 			},
 
 			/**
-			* Reset dimensions on window resize envent
-			*/
+			 * Reset dimensions on window resize envent
+			 */
 			resize : function () {
 				var $this = this;
 
@@ -239,12 +244,12 @@
 			},
 
 			/**
-			* Check if device supports CSS transitions
-			*/
+			 * Check if device supports CSS transitions
+			 */
 			supportTransition : function () {
 
 				var prefixes = 'transition WebkitTransition MozTransition OTransition msTransition KhtmlTransition'.split( ' ' ),
-				i;
+					i;
 
 				for ( i = 0; i < prefixes.length; i++ ) {
 					if ( document.createElement( 'div' ).style[ prefixes[i] ] !== undefined ) {
@@ -255,8 +260,8 @@
 			},
 
 			/**
-			* Check if CSS transitions are allowed (options + devicesupport)
-			*/
+			 * Check if CSS transitions are allowed (options + devicesupport)
+			 */
 			doCssTrans : function () {
 				if ( plugin.settings.useCSS && this.supportTransition() ) {
 					return true;
@@ -264,25 +269,25 @@
 			},
 
 			/**
-			* Touch navigation
-			*/
+			 * Touch navigation
+			 */
 			gesture : function () {
 
 				var $this = this,
-				index,
-				hDistance,
-				vDistance,
-				hDistanceLast,
-				vDistanceLast,
-				hDistancePercent,
-				vSwipe = false,
-				hSwipe = false,
-				hSwipMinDistance = 10,
-				vSwipMinDistance = 50,
-				startCoords = {},
-				endCoords = {},
-				bars = $( '#swipebox-top-bar, #swipebox-bottom-bar' ),
-				slider = $( '#swipebox-slider' );
+					index,
+					hDistance,
+					vDistance,
+					hDistanceLast,
+					vDistanceLast,
+					hDistancePercent,
+					vSwipe = false,
+					hSwipe = false,
+					hSwipMinDistance = 10,
+					vSwipMinDistance = 50,
+					startCoords = {},
+					endCoords = {},
+					bars = $( '#swipebox-top-bar, #swipebox-bottom-bar' ),
+					slider = $( '#swipebox-slider' );
 
 				bars.addClass( 'visible-bars' );
 				$this.setTimeout();
@@ -348,7 +353,7 @@
 									} );
 								}
 
-								// swipe rught
+							// swipe rught
 							} else if ( 0 > hDistance ) {
 
 								// last Slide
@@ -388,10 +393,10 @@
 						if ( Math.abs( vDistance ) >= 2 * vSwipMinDistance && Math.abs( vDistance ) > Math.abs( vDistanceLast ) ) {
 							var vOffset = vDistance > 0 ? slider.height() : - slider.height();
 							slider.animate( { top: vOffset + 'px', 'opacity': 0 },
-							300,
-							function () {
-								$this.closeSlide();
-							} );
+								300,
+								function () {
+									$this.closeSlide();
+								} );
 						} else {
 							slider.animate( { top: 0, 'opacity': 1 }, 300 );
 						}
@@ -405,7 +410,7 @@
 
 							$this.getPrev();
 
-							// swipeRight
+						// swipeRight
 						} else if ( hDistance <= -hSwipMinDistance && hDistance <= hDistanceLast) {
 
 							$this.getNext();
@@ -434,437 +439,508 @@
 			},
 
 			/**
-			* Set timer to hide the action bars
-			*/
+			 * Set timer to hide the action bars
+			 */
 			setTimeout: function () {
 				if ( plugin.settings.hideBarsDelay > 0 ) {
 					var $this = this;
 					$this.clearTimeout();
 					$this.timeout = window.setTimeout( function() {
-						$this.hideBars();
-					},
+							$this.hideBars();
+						},
 
-					plugin.settings.hideBarsDelay
-				);
-			}
-		},
-
-		/**
-		* Clear timer
-		*/
-		clearTimeout: function () {
-			window.clearTimeout( this.timeout );
-			this.timeout = null;
-		},
-
-		/**
-		* Show navigation and title bars
-		*/
-		showBars : function () {
-			var bars = $( '#swipebox-top-bar, #swipebox-bottom-bar' );
-			if ( this.doCssTrans() ) {
-				bars.addClass( 'visible-bars' );
-			} else {
-				$( '#swipebox-top-bar' ).animate( { top : 0 }, 500 );
-				$( '#swipebox-bottom-bar' ).animate( { bottom : 0 }, 500 );
-				setTimeout( function() {
+						plugin.settings.hideBarsDelay
+					);
+				}
+			},
+
+			/**
+			 * Clear timer
+			 */
+			clearTimeout: function () {
+				window.clearTimeout( this.timeout );
+				this.timeout = null;
+			},
+
+			/**
+			 * Show navigation and title bars
+			 */
+			showBars : function () {
+				var bars = $( '#swipebox-top-bar, #swipebox-bottom-bar' );
+				if ( this.doCssTrans() ) {
 					bars.addClass( 'visible-bars' );
-				}, 1000 );
-			}
-		},
-
-		/**
-		* Hide navigation and title bars
-		*/
-		hideBars : function () {
-			var bars = $( '#swipebox-top-bar, #swipebox-bottom-bar' );
-			if ( this.doCssTrans() ) {
-				bars.removeClass( 'visible-bars' );
-			} else {
-				$( '#swipebox-top-bar' ).animate( { top : '-50px' }, 500 );
-				$( '#swipebox-bottom-bar' ).animate( { bottom : '-50px' }, 500 );
-				setTimeout( function() {
+				} else {
+					$( '#swipebox-top-bar' ).animate( { top : 0 }, 500 );
+					$( '#swipebox-bottom-bar' ).animate( { bottom : 0 }, 500 );
+					setTimeout( function() {
+						bars.addClass( 'visible-bars' );
+					}, 1000 );
+				}
+			},
+
+			/**
+			 * Hide navigation and title bars
+			 */
+			hideBars : function () {
+				var bars = $( '#swipebox-top-bar, #swipebox-bottom-bar' );
+				if ( this.doCssTrans() ) {
 					bars.removeClass( 'visible-bars' );
-				}, 1000 );
-			}
-		},
+				} else {
+					$( '#swipebox-top-bar' ).animate( { top : '-50px' }, 500 );
+					$( '#swipebox-bottom-bar' ).animate( { bottom : '-50px' }, 500 );
+					setTimeout( function() {
+						bars.removeClass( 'visible-bars' );
+					}, 1000 );
+				}
+			},
+
+			/**
+			 * Animate navigation and top bars
+			 */
+			animBars : function () {
+				var $this = this,
+					bars = $( '#swipebox-top-bar, #swipebox-bottom-bar' );
 
-		/**
-		* Animate navigation and top bars
-		*/
-		animBars : function () {
-			var $this = this,
-			bars = $( '#swipebox-top-bar, #swipebox-bottom-bar' );
+				bars.addClass( 'visible-bars' );
+				$this.setTimeout();
 
-			bars.addClass( 'visible-bars' );
-			$this.setTimeout();
+				$( '#swipebox-slider' ).click( function() {
+					if ( ! bars.hasClass( 'visible-bars' ) ) {
+						$this.showBars();
+						$this.setTimeout();
+					}
+				} );
 
-			$( '#swipebox-slider' ).click( function() {
-				if ( ! bars.hasClass( 'visible-bars' ) ) {
+				$( '#swipebox-bottom-bar' ).hover( function() {
 					$this.showBars();
-					$this.setTimeout();
-				}
-			} );
+					bars.addClass( 'visible-bars' );
+					$this.clearTimeout();
 
-			$( '#swipebox-bottom-bar' ).hover( function() {
-				$this.showBars();
-				bars.addClass( 'visible-bars' );
-				$this.clearTimeout();
+				}, function() {
+					if ( plugin.settings.hideBarsDelay > 0 ) {
+						bars.removeClass( 'visible-bars' );
+						$this.setTimeout();
+					}
 
-			}, function() {
-				if ( plugin.settings.hideBarsDelay > 0 ) {
-					bars.removeClass( 'visible-bars' );
-					$this.setTimeout();
-				}
+				} );
+			},
 
-			} );
-		},
+			/**
+			 * Keyboard navigation
+			 */
+			keyboard : function () {
+				var $this = this;
+				$( window ).bind( 'keyup', function( event ) {
+					event.preventDefault();
+					event.stopPropagation();
 
-		/**
-		* Keyboard navigation
-		*/
-		keyboard : function () {
-			var $this = this;
-			$( window ).bind( 'keyup', function( event ) {
-				event.preventDefault();
-				event.stopPropagation();
+					if ( event.keyCode === 37 ) {
 
-				if ( event.keyCode === 37 ) {
+						$this.getPrev();
 
-					$this.getPrev();
+					} else if ( event.keyCode === 39 ) {
 
-				} else if ( event.keyCode === 39 ) {
+						$this.getNext();
 
-					$this.getNext();
+					} else if ( event.keyCode === 27 ) {
 
-				} else if ( event.keyCode === 27 ) {
+						$this.closeSlide();
+					}
+				} );
+			},
 
-					$this.closeSlide();
-				}
-			} );
-		},
+			/**
+			 * Navigation events : go to next slide, go to prevous slide and close
+			 */
+			actions : function () {
+				var $this = this,
+					action = 'touchend click'; // Just detect for both event types to allow for multi-input
 
-		/**
-		* Navigation events : go to next slide, go to prevous slide and close
-		*/
-		actions : function () {
-			var $this = this,
-			action = 'touchend click'; // Just detect for both event types to allow for multi-input
+				if ( elements.length < 2 ) {
 
-			if ( elements.length < 2 ) {
+					$( '#swipebox-bottom-bar' ).hide();
 
-				$( '#swipebox-bottom-bar' ).hide();
+					if ( undefined === elements[ 1 ] ) {
+						$( '#swipebox-top-bar' ).hide();
+					}
 
-				if ( undefined === elements[ 1 ] ) {
-					$( '#swipebox-top-bar' ).hide();
+				} else {
+					$( '#swipebox-prev' ).bind( action, function( event ) {
+						event.preventDefault();
+						event.stopPropagation();
+						$this.getPrev();
+						$this.setTimeout();
+					} );
+
+					$( '#swipebox-next' ).bind( action, function( event ) {
+						event.preventDefault();
+						event.stopPropagation();
+						$this.getNext();
+						$this.setTimeout();
+					} );
 				}
 
-			} else {
-				$( '#swipebox-prev' ).bind( action, function( event ) {
-					event.preventDefault();
-					event.stopPropagation();
-					$this.getPrev();
-					$this.setTimeout();
+				$( '#swipebox-close' ).bind( action, function() {
+					$this.closeSlide();
 				} );
+			},
 
-				$( '#swipebox-next' ).bind( action, function( event ) {
-					event.preventDefault();
-					event.stopPropagation();
-					$this.getNext();
-					$this.setTimeout();
-				} );
-			}
+			/**
+			 * Set current slide
+			 */
+			setSlide : function ( index, isFirst ) {
 
-			$( '#swipebox-close' ).bind( action, function() {
-				$this.closeSlide();
-			} );
-		},
+				isFirst = isFirst || false;
 
-		/**
-		* Set current slide
-		*/
-		setSlide : function ( index, isFirst ) {
+				var slider = $( '#swipebox-slider' );
 
-			isFirst = isFirst || false;
+				currentX = -index*100;
 
-			var slider = $( '#swipebox-slider' );
+				if ( this.doCssTrans() ) {
+					slider.css( {
+						'-webkit-transform' : 'translate3d(' + (-index*100)+'%, 0, 0)',
+						'transform' : 'translate3d(' + (-index*100)+'%, 0, 0)'
+					} );
+				} else {
+					slider.animate( { left : ( -index*100 )+'%' } );
+				}
 
-			currentX = -index*100;
+				$( '#swipebox-slider .slide' ).removeClass( 'current' );
+				$( '#swipebox-slider .slide' ).eq( index ).addClass( 'current' );
+				this.setTitle( index );
 
-			if ( this.doCssTrans() ) {
-				slider.css( {
-					'-webkit-transform' : 'translate3d(' + (-index*100)+'%, 0, 0)',
-					'transform' : 'translate3d(' + (-index*100)+'%, 0, 0)'
-				} );
-			} else {
-				slider.animate( { left : ( -index*100 )+'%' } );
-			}
+				if ( isFirst ) {
+					slider.fadeIn();
+				}
 
-			$( '#swipebox-slider .slide' ).removeClass( 'current' );
-			$( '#swipebox-slider .slide' ).eq( index ).addClass( 'current' );
-			this.setTitle( index );
+				$( '#swipebox-prev, #swipebox-next' ).removeClass( 'disabled' );
 
-			if ( isFirst ) {
-				slider.fadeIn();
-			}
+				if ( index === 0 ) {
+					$( '#swipebox-prev' ).addClass( 'disabled' );
+				} else if ( index === elements.length - 1 && plugin.settings.loopAtEnd !== true ) {
+					$( '#swipebox-next' ).addClass( 'disabled' );
+				}
+			},
 
-			$( '#swipebox-prev, #swipebox-next' ).removeClass( 'disabled' );
+			/**
+			 * Open slide
+			 */
+			openSlide : function ( index ) {
+				$( 'html' ).addClass( 'swipebox-html' );
+				if ( isTouch ) {
+					$( 'html' ).addClass( 'swipebox-touch' );
 
-			if ( index === 0 ) {
-				$( '#swipebox-prev' ).addClass( 'disabled' );
-			} else if ( index === elements.length - 1 && plugin.settings.loopAtEnd !== true ) {
-				$( '#swipebox-next' ).addClass( 'disabled' );
-			}
-		},
+					if ( plugin.settings.hideCloseButtonOnMobile ) {
+						$( 'html' ).addClass( 'swipebox-no-close-button' );
+					}
+				} else {
+					$( 'html' ).addClass( 'swipebox-no-touch' );
+				}
+				$( window ).trigger( 'resize' ); // fix scroll bar visibility on desktop
+				this.setSlide( index, true );
+			},
 
-		/**
-		* Open slide
-		*/
-		openSlide : function ( index ) {
-			$( 'html' ).addClass( 'swipebox-html' );
-			if ( isTouch ) {
-				$( 'html' ).addClass( 'swipebox-touch' );
+			/**
+			 * Set a time out if the media is a video
+			 */
+			preloadMedia : function ( index ) {
+				var $this = this,
+					src = null;
 
-				if ( plugin.settings.hideCloseButtonOnMobile ) {
-					$( 'html' ).addClass( 'swipebox-no-close-button' );
+				if ( elements[ index ] !== undefined ) {
+					src = elements[ index ].href;
 				}
-			} else {
-				$( 'html' ).addClass( 'swipebox-no-touch' );
-			}
-			$( window ).trigger( 'resize' ); // fix scroll bar visibility on desktop
-			this.setSlide( index, true );
-		},
-
-		/**
-		* Set a time out if the media is a video
-		*/
-		preloadMedia : function ( index ) {
-			var $this = this,
-			src = null;
-
-			if ( elements[ index ] !== undefined ) {
-				src = elements[ index ].href;
-			}
 
-			if ( ! $this.isVideo( src ) ) {
-				setTimeout( function() {
+				if ( ! $this.isVideo( src ) ) {
+					setTimeout( function() {
+						$this.openMedia( index );
+					}, 1000);
+				} else {
 					$this.openMedia( index );
-				}, 1000);
-			} else {
-				$this.openMedia( index );
-			}
-		},
-
-		/**
-		* Open
-		*/
-		openMedia : function ( index ) {
-			var $this = this,
-			src,
-			slide;
-
-			if ( elements[ index ] !== undefined ) {
-				src = elements[ index ].href;
-			}
+				}
+			},
 
-			if ( index < 0 || index >= elements.length ) {
-				return false;
-			}
+			/**
+			 * Open
+			 */
+			openMedia : function ( index ) {
+				var $this = this,
+					src,
+					slide;
 
-			slide = $( '#swipebox-slider .slide' ).eq( index );
+				if ( elements[ index ] !== undefined ) {
+					src = elements[ index ].href;
+				}
 
-			if ( ! $this.isVideo( src ) ) {
-				slide.addClass( 'slide-loading' );
-				$this.loadMedia( src, function() {
-					slide.removeClass( 'slide-loading' );
-					slide.html( this );
-				} );
-			} else {
-				slide.html( $this.getVideo( src ) );
-			}
+				if ( index < 0 || index >= elements.length ) {
+					return false;
+				}
 
-		},
+				slide = $( '#swipebox-slider .slide' ).eq( index );
 
-		/**
-		* Set link title attribute as caption
-		*/
-		setTitle : function ( index ) {
-			var title = null;
+				if ( ! $this.isVideo( src ) ) {
+					slide.addClass( 'slide-loading' );
+					$this.loadMedia( src, function() {
+						slide.removeClass( 'slide-loading' );
+						slide.html( this );
+					} );
+				} else {
+					slide.html( $this.getVideo( src ) );
+				}
 
-			$( '#swipebox-title' ).empty();
+			},
 
-			if ( elements[ index ] !== undefined ) {
-				title = elements[ index ].title;
-			}
+			/**
+			 * Set link title attribute as caption
+			 */
+			setTitle : function ( index ) {
+				var title = null;
 
-			if ( title ) {
-				$( '#swipebox-top-bar' ).show();
-				$( '#swipebox-title' ).append( title );
-			} else {
-				$( '#swipebox-top-bar' ).hide();
-			}
-		},
+				$( '#swipebox-title' ).empty();
 
-		/**
-		* Check if the URL is a video
-		*/
-		isVideo : function ( src ) {
+				if ( elements[ index ] !== undefined ) {
+					title = elements[ index ].title;
+				}
 
-			if ( src ) {
-				if ( src.match( /youtube\.com\/watch\?v=([a-zA-Z0-9\-_]+)/) || src.match( /vimeo\.com\/([0-9]*)/ ) || src.match( /youtu\.be\/([a-zA-Z0-9\-_]+)/ ) ) {
-					return true;
+				if ( title ) {
+					$( '#swipebox-top-bar' ).show();
+					$( '#swipebox-title' ).append( title );
+				} else {
+					$( '#swipebox-top-bar' ).hide();
 				}
+			},
 
-				if ( src.toLowerCase().indexOf( 'swipeboxvideo=1' ) >= 0 ) {
+			/**
+			 * Check if the URL is a video
+			 */
+			isVideo : function ( src ) {
 
-					return true;
-				}
-			}
+				if ( src ) {
+					if ( src.match( /(youtube\.com|youtube-nocookie\.com)\/watch\?v=([a-zA-Z0-9\-_]+)/) || src.match( /vimeo\.com\/([0-9]*)/ ) || src.match( /youtu\.be\/([a-zA-Z0-9\-_]+)/ ) ) {
+						return true;
+					}
 
-		},
+					if ( src.toLowerCase().indexOf( 'swipeboxvideo=1' ) >= 0 ) {
 
-		/**
-		* Get video iframe code from URL
-		*/
-		getVideo : function( url ) {
-			var iframe = '',
-			youtubeUrl = url.match( /watch\?v=([a-zA-Z0-9\-_]+)/ ),
-			youtubeShortUrl = url.match(/youtu\.be\/([a-zA-Z0-9\-_]+)/),
-			vimeoUrl = url.match( /vimeo\.com\/([0-9]*)/ );
-			if ( youtubeUrl || youtubeShortUrl) {
-				if ( youtubeShortUrl ) {
-					youtubeUrl = youtubeShortUrl;
+						return true;
+					}
 				}
-				iframe = '<iframe width="560" height="315" src="//www.youtube.com/embed/' + youtubeUrl[1] + '?autoplay='+ plugin.settings.autoplayVideos + '" frameborder="0" allowfullscreen></iframe>';
 
-			} else if ( vimeoUrl ) {
+			},
+
+			/**
+			 * Parse URI querystring and:
+			 * - overrides value provided via dictionary
+			 * - rebuild it again returning a string
+			 */
+			parseUri : function (uri, customData) {
+				var a = document.createElement('a'),
+					qs = {};
+
+				// Decode the URI
+				a.href = decodeURIComponent( uri );
+
+				// QueryString to Object
+				if ( a.search ) {
+					qs = JSON.parse( '{"' + a.search.toLowerCase().replace('?','').replace(/&/g,'","').replace(/=/g,'":"') + '"}' );
+				}
 
-				iframe = '<iframe width="560" height="315"  src="//player.vimeo.com/video/' + vimeoUrl[1] + '?byline=0&amp;portrait=0&amp;color=' + plugin.settings.vimeoColor + '&autoplay=' + plugin.settings.autoplayVideos + '" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>';
+				// Extend with custom data
+				if ( $.isPlainObject( customData ) ) {
+					qs = $.extend( qs, customData, plugin.settings.queryStringData ); // The dev has always the final word
+				}
 
-			}
+				// Return querystring as a string
+				return $
+					.map( qs, function (val, key) {
+						if ( val && val > '' ) {
+							return encodeURIComponent( key ) + '=' + encodeURIComponent( val );
+						}
+					})
+					.join('&');
+			},
 
-			if ( youtubeUrl || youtubeShortUrl || vimeoUrl ) {
+			/**
+			 * Get video iframe code from URL
+			 */
+			getVideo : function( url ) {
+				var iframe = '',
+					youtubeUrl = url.match( /((?:www\.)?youtube\.com|(?:www\.)?youtube-nocookie\.com)\/watch\?v=([a-zA-Z0-9\-_]+)/ ),
+					youtubeShortUrl = url.match(/(?:www\.)?youtu\.be\/([a-zA-Z0-9\-_]+)/),
+					vimeoUrl = url.match( /(?:www\.)?vimeo\.com\/([0-9]*)/ ),
+					qs = '';
+				if ( youtubeUrl || youtubeShortUrl) {
+					if ( youtubeShortUrl ) {
+						youtubeUrl = youtubeShortUrl;
+					}
+					qs = ui.parseUri( url, {
+						'autoplay' : ( plugin.settings.autoplayVideos ? '1' : '0' ),
+						'v' : ''
+					});
+					iframe = '<iframe width="560" height="315" src="//' + youtubeUrl[1] + '/embed/' + youtubeUrl[2] + '?' + qs + '" frameborder="0" allowfullscreen></iframe>';
+
+				} else if ( vimeoUrl ) {
+					qs = ui.parseUri( url, {
+						'autoplay' : ( plugin.settings.autoplayVideos ? '1' : '0' ),
+						'byline' : '0',
+						'portrait' : '0',
+						'color': plugin.settings.vimeoColor
+					});
+					iframe = '<iframe width="560" height="315"  src="//player.vimeo.com/video/' + vimeoUrl[1] + '?' + qs + '" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>';
 
-			} else {
-				iframe = '<iframe width="560" height="315" src="' + url + '" frameborder="0" allowfullscreen></iframe>';
-			}
+				} else {
+					iframe = '<iframe width="560" height="315" src="' + url + '" frameborder="0" allowfullscreen></iframe>';
+				}
 
-			return '<div class="swipebox-video-container" style="max-width:' + plugin.settings.videomaxWidth + 'px"><div class="swipebox-video">' + iframe + '</div></div>';
-		},
+				return '<div class="swipebox-video-container" style="max-width:' + plugin.settings.videoMaxWidth + 'px"><div class="swipebox-video">' + iframe + '</div></div>';
+			},
 
-		/**
-		* Load image
-		*/
-		loadMedia : function ( src, callback ) {
-			if ( ! this.isVideo( src ) ) {
-				var img = $( '<img>' ).on( 'load', function() {
-					callback.call( img );
-				} );
+			/**
+			 * Load image
+			 */
+			loadMedia : function ( src, callback ) {
+                // Inline content
+                if ( src.trim().indexOf('#') === 0 ) {
+                    callback.call(
+                    	$('<div>', {
+                    		'class' : 'swipebox-inline-container'
+                    	})
+                    	.append(
+                    		$(src)
+	                    	.clone()
+	                    	.toggleClass( plugin.settings.toggleClassOnLoad )
+	                    )
+                    );
+                }
+                // Everything else
+                else {
+    				if ( ! this.isVideo( src ) ) {
+    					var img = $( '<img>' ).on( 'load', function() {
+    						callback.call( img );
+    					} );
+
+    					img.attr( 'src', src );
+    				}
+                }
+			},
 
-				img.attr( 'src', src );
-			}
-		},
-
-		/**
-		* Get next slide
-		*/
-		getNext : function () {
-			var $this = this,
-			src,
-			index = $( '#swipebox-slider .slide' ).index( $( '#swipebox-slider .slide.current' ) );
-			if ( index + 1 < elements.length ) {
-
-				src = $( '#swipebox-slider .slide' ).eq( index ).contents().find( 'iframe' ).attr( 'src' );
-				$( '#swipebox-slider .slide' ).eq( index ).contents().find( 'iframe' ).attr( 'src', src );
-				index++;
-				$this.setSlide( index );
-				$this.preloadMedia( index+1 );
-			} else {
+			/**
+			 * Get next slide
+			 */
+			getNext : function () {
+				var $this = this,
+					src,
+					index = $( '#swipebox-slider .slide' ).index( $( '#swipebox-slider .slide.current' ) );
+				if ( index + 1 < elements.length ) {
 
-				if ( plugin.settings.loopAtEnd === true ) {
 					src = $( '#swipebox-slider .slide' ).eq( index ).contents().find( 'iframe' ).attr( 'src' );
 					$( '#swipebox-slider .slide' ).eq( index ).contents().find( 'iframe' ).attr( 'src', src );
-					index = 0;
-					$this.preloadMedia( index );
+					index++;
 					$this.setSlide( index );
-					$this.preloadMedia( index + 1 );
+					$this.preloadMedia( index+1 );
+					if ( plugin.settings.nextSlide ) {
+						plugin.settings.nextSlide();
+					}
 				} else {
-					$( '#swipebox-overlay' ).addClass( 'rightSpring' );
+
+					if ( plugin.settings.loopAtEnd === true ) {
+						src = $( '#swipebox-slider .slide' ).eq( index ).contents().find( 'iframe' ).attr( 'src' );
+						$( '#swipebox-slider .slide' ).eq( index ).contents().find( 'iframe' ).attr( 'src', src );
+						index = 0;
+						$this.preloadMedia( index );
+						$this.setSlide( index );
+						$this.preloadMedia( index + 1 );
+						if ( plugin.settings.nextSlide ) {
+							plugin.settings.nextSlide();
+						}
+					} else {
+						$( '#swipebox-overlay' ).addClass( 'rightSpring' );
+						setTimeout( function() {
+							$( '#swipebox-overlay' ).removeClass( 'rightSpring' );
+						}, 500 );
+					}
+				}
+			},
+
+			/**
+			 * Get previous slide
+			 */
+			getPrev : function () {
+				var index = $( '#swipebox-slider .slide' ).index( $( '#swipebox-slider .slide.current' ) ),
+					src;
+				if ( index > 0 ) {
+					src = $( '#swipebox-slider .slide' ).eq( index ).contents().find( 'iframe').attr( 'src' );
+					$( '#swipebox-slider .slide' ).eq( index ).contents().find( 'iframe' ).attr( 'src', src );
+					index--;
+					this.setSlide( index );
+					this.preloadMedia( index-1 );
+					if ( plugin.settings.prevSlide ) {
+						plugin.settings.prevSlide();
+					}
+				} else {
+					$( '#swipebox-overlay' ).addClass( 'leftSpring' );
 					setTimeout( function() {
-						$( '#swipebox-overlay' ).removeClass( 'rightSpring' );
+						$( '#swipebox-overlay' ).removeClass( 'leftSpring' );
 					}, 500 );
 				}
-			}
-		},
-
-		/**
-		* Get previous slide
-		*/
-		getPrev : function () {
-			var index = $( '#swipebox-slider .slide' ).index( $( '#swipebox-slider .slide.current' ) ),
-			src;
-			if ( index > 0 ) {
-				src = $( '#swipebox-slider .slide' ).eq( index ).contents().find( 'iframe').attr( 'src' );
-				$( '#swipebox-slider .slide' ).eq( index ).contents().find( 'iframe' ).attr( 'src', src );
-				index--;
-				this.setSlide( index );
-				this.preloadMedia( index-1 );
-			} else {
-				$( '#swipebox-overlay' ).addClass( 'leftSpring' );
-				setTimeout( function() {
-					$( '#swipebox-overlay' ).removeClass( 'leftSpring' );
-				}, 500 );
-			}
-		},
-
-		/**
-		* Close
-		*/
-		closeSlide : function () {
-			$( 'html' ).removeClass( 'swipebox-html' );
-			$( 'html' ).removeClass( 'swipebox-touch' );
-			$( window ).trigger( 'resize' );
-			this.destroy();
-		},
-
-		/**
-		* Destroy the whole thing
-		*/
-		destroy : function () {
-			$( window ).unbind( 'keyup' );
-			$( 'body' ).unbind( 'touchstart' );
-			$( 'body' ).unbind( 'touchmove' );
-			$( 'body' ).unbind( 'touchend' );
-			$( '#swipebox-slider' ).unbind();
-			$( '#swipebox-overlay' ).remove();
-
-			if ( ! $.isArray( elem ) ) {
-				elem.removeData( '_swipebox' );
-			}
+			},
 
-			if ( this.target ) {
-				this.target.trigger( 'swipebox-destroy' );
-			}
+			nextSlide : function () {
+				// Callback for next slide
+			},
+
+			prevSlide : function () {
+				// Callback for prev slide
+			},
+
+			/**
+			 * Close
+			 */
+			closeSlide : function () {
+				$( 'html' ).removeClass( 'swipebox-html' );
+				$( 'html' ).removeClass( 'swipebox-touch' );
+				$( window ).trigger( 'resize' );
+				this.destroy();
+			},
 
-			$.swipebox.isOpen = false;
+			/**
+			 * Destroy the whole thing
+			 */
+			destroy : function () {
+				$( window ).unbind( 'keyup' );
+				$( 'body' ).unbind( 'touchstart' );
+				$( 'body' ).unbind( 'touchmove' );
+				$( 'body' ).unbind( 'touchend' );
+				$( '#swipebox-slider' ).unbind();
+				$( '#swipebox-overlay' ).remove();
+
+				if ( ! $.isArray( elem ) ) {
+					elem.removeData( '_swipebox' );
+				}
+
+				if ( this.target ) {
+					this.target.trigger( 'swipebox-destroy' );
+				}
+
+				$.swipebox.isOpen = false;
 
-			if ( plugin.settings.afterClose ) {
-				plugin.settings.afterClose();
+				if ( plugin.settings.afterClose ) {
+					plugin.settings.afterClose();
+				}
 			}
-		}
-	};
+		};
 
-	plugin.init();
-};
+		plugin.init();
+	};
 
-$.fn.swipebox = function( options ) {
+	$.fn.swipebox = function( options ) {
 
-	if ( ! $.data( this, '_swipebox' ) ) {
-		var swipebox = new $.swipebox( this, options );
-		this.data( '_swipebox', swipebox );
-	}
-	return this.data( '_swipebox' );
+		if ( ! $.data( this, '_swipebox' ) ) {
+			var swipebox = new $.swipebox( this, options );
+			this.data( '_swipebox', swipebox );
+		}
+		return this.data( '_swipebox' );
 
-};
+	};
 
 }( window, document, jQuery ) );

data/vendor/assets/stylesheets/swipebox.css.scss

@@ -1,4 +1,4 @@
-/*! Swipebox v1.3.0.2 | Constantin Saguin csag.co | MIT License | github.com/brutaldesign/swipebox */
+/*! Swipebox v1.4.1 | Constantin Saguin csag.co | MIT License | github.com/brutaldesign/swipebox */
 
 html.swipebox-html.swipebox-touch {
   overflow: hidden !important;
@@ -51,7 +51,7 @@ html.swipebox-html.swipebox-touch {
       width: 1px;
       margin-right: -1px;
     }
-    img {
+    img, .swipebox-video-container, .swipebox-inline-container {
       display: inline-block;
       max-height: 100%;
       max-width: 100%;
@@ -62,14 +62,6 @@ html.swipebox-html.swipebox-touch {
       vertical-align: middle;
     }
     .swipebox-video-container {
-      display: inline-block;
-      max-height: 100%;
-      max-width: 100%;
-      margin: 0;
-      padding: 0;
-      width: auto;
-      height: auto;
-      vertical-align: middle;
       background: none;
       max-width: 1140px;
       max-height: 100%;
@@ -225,9 +217,11 @@ html.swipebox-html.swipebox-touch {
   0% {
     left: 0;
   }
+
   50% {
     left: -30px;
   }
+
   100% {
     left: 0;
   }
@@ -238,9 +232,11 @@ html.swipebox-html.swipebox-touch {
   0% {
     left: 0;
   }
+
   50% {
     left: -30px;
   }
+
   100% {
     left: 0;
   }
@@ -251,9 +247,11 @@ html.swipebox-html.swipebox-touch {
   0% {
     left: 0;
   }
+
   50% {
     left: 30px;
   }
+
   100% {
     left: 0;
   }
@@ -264,9 +262,11 @@ html.swipebox-html.swipebox-touch {
   0% {
     left: 0;
   }
+
   50% {
     left: 30px;
   }
+
   100% {
     left: 0;
   }

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: swipebox
 version: !ruby/object:Gem::Version
-  version: 1.3.0.2
+  version: 1.4.1
 platform: ruby
 authors:
 - Miha Rekar
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2015-01-02 00:00:00.000000000 Z
+date: 2015-08-22 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -165,7 +165,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
 requirements: []
 rubyforge_project: 
-rubygems_version: 2.2.2
+rubygems_version: 2.4.8
 signing_key: 
 specification_version: 4
 summary: Wrapper for Swipebox by @brutaldesign