//# ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- // //# A FIX FOR THE IOS ORIENTATIONCHANGE ZOOM BUG //# Script by @scottjehl, rebound by @wilto. //# MIT / GPLv2 License. (function(w) { var ua = navigator.userAgent; if ( !( /iPhone|iPad|iPod/.test( navigator.platform ) && /OS [1-5]_[0-9_]* like Mac OS X/i.test(ua) && ua.indexOf( "AppleWebKit" ) > -1 ) ) { return; } var doc = w.document; if ( !doc.querySelector ){ return; } var meta = doc.querySelector( "meta[name=viewport]" ), initialContent = meta && meta.getAttribute( "content" ), disabledZoom = initialContent + ",maximum-scale=1", enabledZoom = initialContent + ",maximum-scale=10", enabled = true, x, y, z, aig; if ( !meta ) { return; } function restoreZoom() { meta.setAttribute( "content", enabledZoom ); enabled = true; } function disableZoom() { meta.setAttribute( "content", disabledZoom ); enabled = false; } function checkTilt( e ) { aig = e.accelerationIncludingGravity; x = Math.abs( aig.x ); y = Math.abs( aig.y ); z = Math.abs( aig.z ); if ( ( !w.orientation || w.orientation === 180 ) && ( x > 7 || ( ( z > 6 && y < 8 || z < 8 && y > 6 ) && x > 5 ) ) ) { if ( enabled ) { disableZoom(); } } else if ( !enabled ) { restoreZoom(); } } w.addEventListener( "orientationchange", restoreZoom, false ); w.addEventListener( "devicemotion", checkTilt, false ); })(this); //# ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- // //# SWIPEBOX //# 1.4.1 //# Constantin Saguin csag.co //# MIT License //# github.com/brutaldesign/swipebox //# MOD BY DW ;( function( window, document, $, undefined ) { $.swipebox = function( elem, options ) { // Default options var ui, defaults = { useCSS : true, useSVG : true, useMousewheel : false, //: NEW useImageBackground : false, //: NEW initialIndexOnArray : 0, removeBarsOnMobile : true, hideCloseButtonOnMobile : false, hideBarsDelay : 3000, mousewheelDelay : 1000, //: NEW 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, html = '
'; plugin.settings = {}; $.swipebox.close = function() { ui.closeSlide(); }; $.swipebox.extend = function() { return ui; }; plugin.init = function() { plugin.settings = $.extend({}, defaults, options ); if ( $.isArray( elem ) ) { elements = elem; ui.target = $(window); ui.init( plugin.settings.initialIndexOnArray ); } else { $( document ).on('click', selector, function( event ) { // consoleLog( isTouch ); if ( event.target.parentNode.className === 'slide current') { return false; } if ( ! $.isArray( elem ) ) { ui.destroy(); $elem = $( selector ); ui.actions(); } elements = []; var index , relType, relVal; // Allow for HTML5 compliant attribute before legacy use of rel if ( ! relVal ) { relType = 'data-rel'; relVal = $(this).attr( relType ); } if ( ! relVal ) { relType = 'rel'; relVal = $(this).attr( relType ); } if ( relVal && relVal !== '' && relVal !== 'nofollow') { $elem = $selector.filter('[' + relType + '="' + relVal + '"]'); } else { $elem = $( selector ); } $elem.each(function() { var href = null, title = null, author = null; share = null; if ( $(this).attr('href') ) { href = $(this).attr('href'); } if ( $(this).attr('data-title') ) { title = $(this).attr('data-title'); } if ( $(this).attr('data-author') ) { author = $(this).attr('data-author'); } if ( $(this).attr('data-share') ) { share = $(this).attr('data-share'); } elements.push({ href : href, title : title, author : author, share : share }); }); index = $elem.index( $(this) ); event.preventDefault(); event.stopPropagation(); ui.target = $( event.target ); ui.init( index ); }); } }; ui = { // Initiate Swipebox init : function( index ) { if ( plugin.settings.beforeOpen ) { plugin.settings.beforeOpen(); } this.target.trigger('swipebox-start'); $.swipebox.isOpen = true; this.build(); this.openSlide( index ); this.openMedia( index ); this.preloadMedia( index+1 ); this.preloadMedia( index-1 ); if ( plugin.settings.afterOpen ) { plugin.settings.afterOpen(); } }, // Built HTML containers and fire main functions build : function() { var $this = this, bg; $('body').append( html ); if ( supportSVG && plugin.settings.useSVG === true ) { bg = $('#swipebox-close').css('background-image'); bg = bg.replace('png', 'svg'); $('#swipebox-prev, #swipebox-next, #swipebox-close').css({ 'background-image' : bg }); } if ( isMobile && plugin.settings.removeBarsOnMobile ) { $('#swipebox-bottom-bar, #swipebox-top-bar').remove(); } $.each(elements, function() { $('#swipebox-slider').append(''); }); $this.setDim(); $this.actions(); if ( isTouch ) { $this.gesture(); } // Devices can have both touch and keyboard input so always allow key events $this.keyboard(); $this.animBars(); $this.resize(); }, // Set dimensions depending on windows width and height setDim : function() { var width, height, sliderCss = {}; // Reset dimensions on mobile orientation change if ( 'onorientationchange' in window ) { window.addEventListener('orientationchange', function() { if ( window.orientation === 0 ) { width = winWidth; height = winHeight; } else if ( window.orientation === 90 || window.orientation === -90 ) { width = winHeight; height = winWidth; } }, false ); } else { width = window.innerWidth ? window.innerWidth : $(window).width(); height = window.innerHeight ? window.innerHeight : $(window).height(); } sliderCss = { width : width, height : height }; $('#swipebox-overlay').css( sliderCss ); }, // Reset dimensions on window resize envent resize : function() { var $this = this; $(window).resize( function() { $this.setDim(); }).resize(); }, // Check if device supports CSS transitions supportTransition : function() { var prefixes = 'transition WebkitTransition MozTransition OTransition msTransition KhtmlTransition'.split(' '), i; for ( i = 0; i < prefixes.length; i++ ) { if ( document.createElement('div').style[ prefixes[i] ] !== undefined ) { return prefixes[i]; } } return false; }, // Check if CSS transitions are allowed (options + devicesupport) doCssTrans : function() { if ( plugin.settings.useCSS && this.supportTransition() ) { return true; } }, // 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'), other = $('#swipebox-share'); bars.addClass('visible-bars'); other.addClass('visible-other'); $this.setTimeout(); $('body').bind('touchstart', function( event ) { $(this).addClass('touching'); index = $('#swipebox-slider .slide').index( $('#swipebox-slider .slide.current') ); endCoords = event.originalEvent.targetTouches[0]; startCoords.pageX = event.originalEvent.targetTouches[0].pageX; startCoords.pageY = event.originalEvent.targetTouches[0].pageY; $('#swipebox-slider').css({ '-webkit-transform': 'translate3d(' + currentX + '%, 0, 0)', 'transform': 'translate3d(' + currentX + '%, 0, 0)' }); $('.touching').bind('touchmove', function( event ) { event.preventDefault(); event.stopPropagation(); endCoords = event.originalEvent.targetTouches[0]; if ( ! hSwipe ) { vDistanceLast = vDistance; vDistance = endCoords.pageY - startCoords.pageY; if ( Math.abs( vDistance ) >= vSwipMinDistance || vSwipe ) { var opacity = 0.75 - Math.abs(vDistance) / slider.height(); slider.css({ 'top': vDistance + 'px' }); slider.css({ 'opacity': opacity }); vSwipe = true; } } hDistanceLast = hDistance; hDistance = endCoords.pageX - startCoords.pageX; hDistancePercent = hDistance * 100 / winWidth; if ( ! hSwipe && ! vSwipe && Math.abs( hDistance ) >= hSwipMinDistance ) { $('#swipebox-slider').css({ '-webkit-transition' : '', 'transition' : '' }); hSwipe = true; } if ( hSwipe ) { // swipe left if ( 0 < hDistance ) { // first slide if ( 0 === index ) { // consoleLog('first'); $('#swipebox-overlay').addClass('leftSpringTouch'); } else { // Follow gesture $('#swipebox-overlay').removeClass('leftSpringTouch').removeClass('rightSpringTouch'); $('#swipebox-slider').css({ '-webkit-transform': 'translate3d(' + (currentX + hDistancePercent) + '%, 0, 0)', 'transform': 'translate3d(' + (currentX + hDistancePercent) + '%, 0, 0)' }); } // swipe rught } else if ( 0 > hDistance ) { // last Slide if ( elements.length === index +1 ) { // consoleLog('last'); $('#swipebox-overlay').addClass('rightSpringTouch'); } else { $('#swipebox-overlay').removeClass('leftSpringTouch').removeClass('rightSpringTouch'); $('#swipebox-slider').css({ '-webkit-transform': 'translate3d(' + (currentX + hDistancePercent) + '%, 0, 0)', 'transform': 'translate3d(' + (currentX + hDistancePercent) + '%, 0, 0)' }); } } } }); return false; }).bind('touchend', function( event ) { event.preventDefault(); event.stopPropagation(); $('#swipebox-slider').css({ '-webkit-transition' : '-webkit-transform 0.4s ease', 'transition' : 'transform 0.4s ease' }); vDistance = endCoords.pageY - startCoords.pageY; hDistance = endCoords.pageX - startCoords.pageX; hDistancePercent = hDistance*100/winWidth; // Swipe to bottom to close if ( vSwipe ) { vSwipe = false; 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(); }); } else { slider.animate({ top: 0, 'opacity': 1 }, 300 ); } } else if ( hSwipe ) { hSwipe = false; // swipeLeft if( hDistance >= hSwipMinDistance && hDistance >= hDistanceLast) { $this.getPrev(); // swipeRight } else if ( hDistance <= -hSwipMinDistance && hDistance <= hDistanceLast) { $this.getNext(); } } else { // Top and bottom bars have been removed on touchable devices // tap if ( ! bars.hasClass('visible-bars') ) { $this.showBars(); $this.setTimeout(); } else { $this.clearTimeout(); $this.hideBars(); } } $('#swipebox-slider').css({ '-webkit-transform': 'translate3d(' + currentX + '%, 0, 0)', 'transform': 'translate3d(' + currentX + '%, 0, 0)' }); $('#swipebox-overlay').removeClass('leftSpringTouch').removeClass('rightSpringTouch'); $('.touching').off('touchmove').removeClass('touching'); }); }, // 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(); }, 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'); var slider = $('#swipebox-slider'); var other = $('#swipebox-share'); if ( this.doCssTrans() ) { bars.addClass('visible-bars'); slider.removeClass('cursor-pointer'); other.addClass('visible-other'); } else { $('#swipebox-top-bar').animate({ top : 0 }, 500 ); $('#swipebox-bottom-bar').animate({ bottom : 0 }, 500 ); $('#swipebox-share').animate({ opacity : 'show' }, 500 ); setTimeout( function() { bars.addClass('visible-bars'); slider.removeClass('cursor-pointer'); other.addClass('visible-other'); }, 1000 ); } }, // Hide navigation and title bars hideBars : function() { var bars = $('#swipebox-top-bar, #swipebox-bottom-bar'); var slider = $('#swipebox-slider'); var other = $('#swipebox-share'); if ( this.doCssTrans() ) { bars.removeClass('visible-bars'); slider.addClass('cursor-pointer'); other.removeClass('visible-other'); } else { $('#swipebox-top-bar').animate({ top : '-50px' }, 500 ); $('#swipebox-bottom-bar').animate({ bottom : '-50px' }, 500 ); $('#swipebox-share').animate({ opacity : 'hide' }, 500 ); setTimeout( function() { bars.removeClass('visible-bars'); slider.addClass('cursor-pointer'); other.removeClass('visible-other'); }, 1000 ); } }, // Animate navigation and top bars animBars : function() { var $this = this, bars = $('#swipebox-top-bar, #swipebox-bottom-bar'); other = $('#swipebox-share'); bars.addClass('visible-bars'); other.addClass('visible-other'); $this.setTimeout(); $('#swipebox-slider').click( function() { if ( !bars.hasClass('visible-bars') ) { $this.showBars(); $this.setTimeout(); } }); $('#swipebox-bottom-bar').hover( function() { $this.showBars(); bars.addClass('visible-bars'); other.addClass('visible-other'); $this.clearTimeout(); }, function() { if ( plugin.settings.hideBarsDelay > 0 ) { bars.removeClass('visible-bars'); other.removeClass('visible-other'); $this.setTimeout(); } }); }, // Keyboard navigation keyboard : function() { var $this = this; $(window).bind('keyup', function( event ) { event.preventDefault(); event.stopPropagation(); if ( event.keyCode === 37 ) { $this.getPrev(); } else if ( event.keyCode === 39 ) { $this.getNext(); } else if ( event.keyCode === 27 ) { $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 if ( elements.length < 2 ) { $('#swipebox-bottom-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(); }); if ( plugin.settings.useMousewheel === true && !isTouchDevice() ) { //: NEW var last = 0; var intervalMs = plugin.settings.mousewheelDelay; $('#swipebox-slider').bind('mousewheel', function(event) { event.preventDefault(); event.stopPropagation(); var now = new Date().getTime(); if ( (last + intervalMs) < now ) { last = now; if ( event.deltaY == 1 ) { $this.getPrev(); } else if ( event.deltaY == -1 ) { $this.getNext(); } } //consoleLog( event.deltaX, ' | ', event.deltaY, ' | ', event.deltaFactor, ' | ', event ); //: Test }); } } $('#swipebox-close').bind(action, function() { $this.closeSlide(); }); }, // Set current slide setSlide : function( index, isFirst ) { isFirst = isFirst || false; var slider = $('#swipebox-slider'); currentX = (-index * 100); //: MOD if ( this.doCssTrans() ) { slider.css({ '-webkit-transform': 'translate3d(' + currentX + '%, 0, 0)', 'transform': 'translate3d(' + currentX + '%, 0, 0)' }); } else { slider.animate({ left : currentX + '%' }, function() { //consoleLog('End'); }); } $('#swipebox-slider .slide').removeClass('current'); $('#swipebox-slider .slide').eq( index ).addClass('current'); this.setTitle( index ); this.setAuthor( index ); this.setShare( index ); if ( isFirst ) { slider.fadeIn(); } $('#swipebox-prev, #swipebox-next').removeClass('disabled'); if ( index === 0 ) { $('#swipebox-prev').addClass('disabled'); } else if ( index === elements.length - 1 && plugin.settings.loopAtEnd !== true ) { $('#swipebox-next').addClass('disabled'); } //consoleLog( index, ' : ', currentX, ' : ', isFirst ); //: Test }, // Open slide openSlide : function( index ) { $('html').addClass('swipebox-html'); if ( isTouch ) { $('html').addClass('swipebox-touch'); 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 ); }, // 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() { $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; } slide = $('#swipebox-slider .slide').eq( index ); if ( ! $this.isVideo( src ) ) { slide.addClass('slide-loading'); $this.loadMedia( src, function() { slide.removeClass('slide-loading'); if ( plugin.settings.useImageBackground ) { slide.html(''); //: NEW } else { slide.html(this); } }); } else { slide.html( $this.getVideo( src ) ); } }, // Set link title attribute as caption setTitle : function( index ) { var title = null; $('#swipebox-title').empty(); if ( elements[ index ] !== undefined ) { title = elements[ index ].title; } if ( title ) { $('#swipebox-top-bar').show(); $('#swipebox-title').append('