TNWSC – 2014 – 12/6 – Other Pics

nav.appendTo( 'body' ); nav.on( 'click touchend', function(){ return false; });

var navItems = nav.find( 'button' ); navItems.on( 'click touchend', function() { var $this = $( this ); if( images.eq( $this.index() ).attr( 'href' ) != $( '#imagelightbox' ).attr( 'src' ) ) instance.switchImageLightbox( $this.index() );

navItems.removeClass( 'active' ); navItems.eq( $this.index() ).addClass( 'active' );

return false; }) .on( 'touchend', function(){ return false; }); } }, navigationUpdate = function( selector ) { var items = $( '#imagelightbox-nav button' ); items.removeClass( 'active' ); items.eq( $( selector ).filter( '[href="' + $( '#imagelightbox' ).attr( 'src' ) + '"]' ).index( selector ) ).addClass( 'active' ); }, navigationOff = function() { $( '#imagelightbox-nav' ).remove(); },

// ARROWS

arrowsOn = function( instance, selector ) { var $arrows = $( '' );

$arrows.appendTo( 'body' );

$arrows.on( 'click touchend', function( e ) { e.preventDefault();

var $this = $( this ), $target = $( selector + '[href="' + $( '#imagelightbox' ).attr( 'src' ) + '"]' ), index = $target.index( selector );

if( $this.hasClass( 'imagelightbox-arrow-left' ) ) { index = index - 1; if( !$( selector ).eq( index ).length ) index = $( selector ).length; } else { index = index + 1; if( !$( selector ).eq( index ).length ) index = 0; }

instance.switchImageLightbox( index ); return false; }); }, arrowsOff = function() { $( '.imagelightbox-arrow' ).remove(); };

// WITH ACTIVITY INDICATION

$( 'a[data-imagelightbox="a"]' ).imageLightbox( { onLoadStart: function() { activityIndicatorOn(); }, onLoadEnd: function() { activityIndicatorOff(); }, onEnd: function() { activityIndicatorOff(); } });

// WITH OVERLAY & ACTIVITY INDICATION

$( 'a[data-imagelightbox="b"]' ).imageLightbox( { onStart: function() { overlayOn(); }, onEnd: function() { overlayOff(); activityIndicatorOff(); }, onLoadStart: function() { activityIndicatorOn(); }, onLoadEnd: function() { activityIndicatorOff(); } });

// WITH "CLOSE" BUTTON & ACTIVITY INDICATION

var instanceC = $( 'a[data-imagelightbox="c"]' ).imageLightbox( { quitOnDocClick: false, onStart: function() { closeButtonOn( instanceC ); }, onEnd: function() { closeButtonOff(); activityIndicatorOff(); }, onLoadStart: function() { activityIndicatorOn(); }, onLoadEnd: function() { activityIndicatorOff(); } });

// WITH CAPTION & ACTIVITY INDICATION

$( 'a[data-imagelightbox="d"]' ).imageLightbox( { onLoadStart: function() { captionOff(); activityIndicatorOn(); }, onLoadEnd: function() { captionOn(); activityIndicatorOff(); }, onEnd: function() { captionOff(); activityIndicatorOff(); } });

// WITH ARROWS & ACTIVITY INDICATION

var selectorG = 'a[data-imagelightbox="g"]'; var instanceG = $( selectorG ).imageLightbox( { onStart: function(){ arrowsOn( instanceG, selectorG ); }, onEnd: function(){ arrowsOff(); activityIndicatorOff(); }, onLoadStart: function(){ activityIndicatorOn(); }, onLoadEnd: function(){ $( '.imagelightbox-arrow' ).css( 'display', 'block' ); activityIndicatorOff(); } });

// WITH NAVIGATION & ACTIVITY INDICATION

var selectorE = 'a[data-imagelightbox="e"]'; var instanceE = $( selectorE ).imageLightbox( { onStart: function() { navigationOn( instanceE, selectorE ); }, onEnd: function() { navigationOff(); activityIndicatorOff(); }, onLoadStart: function() { activityIndicatorOn(); }, onLoadEnd: function() { navigationUpdate( selectorE ); activityIndicatorOff(); } });

// ALL COMBINED

var selectorF = 'a[data-imagelightbox="f"]'; var instanceF = $( selectorF ).imageLightbox( { onStart: function() { overlayOn(); closeButtonOn( instanceF ); arrowsOn( instanceF, selectorF ); }, onEnd: function() { overlayOff(); captionOff(); closeButtonOff(); arrowsOff(); activityIndicatorOff(); }, onLoadStart: function() { captionOff(); activityIndicatorOn(); }, onLoadEnd: function() { captionOn(); activityIndicatorOff(); $( '.imagelightbox-arrow' ).css( 'display', 'block' ); } });

});