lightbox

lightbox.js

var YMVP = {};

jQuery(document).ready(function($) {

	YMVP = {
		$body       : $('body'),
		openPopup   : true,

		triggerAction: function(event, data) {
			data = data || {};
			$.event.trigger(event, data);
		}
	};

	// get url hash
	var hash = window.location.hash;

	// create our overlay
	$('#wrap').append('<div id="overlay"></div>');
	YMVP.$overlay = $('#overlay');

	// screen dimensions
	var sw = 1536;
	var sh = 2048;

	// jQuery universal function to popup a div
	$.popOpen = function( popup, height, width ) {
		if ( ! popup.length ) )
			return;

		$.setPopupDimensions( popup, height, width );

		YMVP.triggerAction('wds_pre_openpopup', popup);
		// Allow the popup opening to be overridden
		if ( ! YMVP.openPopup ) {
			// Reset the override
			YMVP.openPopup = true;
			// And bail
			return;
		}
		// show overlay and move our popup
		YMVP.$overlay.show().after(popup);
		// popup.after(overlay);
		popup.addClass('popup').show();
		resetWindow();
		YMVP.triggerAction('wds_post_openpopup', popup);

	};

	// if width or height is set, will resize and reposition the element
	$.setPopupDimensions = function( popup, height, width, stop ) {
		// set our new width and/or height
		if ( width && height ) {
			popup.css({ width: width, height: height });
			updatePosition( popup );
		}
		if ( width && !height ) {
			popup.css({ width: width });
			updatePosition( popup, 'width' );
		}
		if ( height && !width ) {
			popup.css({ height: height });
			setTimeout(function(){
				updatePosition( popup, 'height' );
			}, 1);
		}

		if ( stop )
			return;

		if ( !height && !width ) {
			width = popup.data('popwidth') ? popup.data('popwidth') : false;
			// check data height attributes (overrides classname height)
			height = popup.data('popheight') ? popup.data('popheight') : false;

			$.setPopupDimensions( popup, height, width, true );
		}

	};

	function updatePosition( obj, dimension ) {
		if ( dimension === 'width' ) {
			genNewl(obj);
			return;
		}
		if ( dimension === 'height' ) {
			genNewT(obj);
			return;
		}

		genNewl(obj);
		genNewT(obj);
	}

	function genNewl( obj ) {
		var newwidth = obj.outerWidth();
		var left = Math.floor( ( sw - newwidth ) / 2 );
		obj.css({ left: left });
	}

	function genNewT( obj ) {
		var newheight = obj.outerHeight();
		var top = Math.floor( ( sh - newheight ) / 2 );
		obj.css({ top: top });
	}

	function popupClickHandler( event ) {

		var $popLink = $(this);
		// check if .pop element is not for expanding
		if ( $popLink.hasClass('no-go') )
			return;
		// get our popup div from the pop link's href
		var popup = $($popLink.attr('href'));
		// check data width attributes
		var width = $popLink.data('popwidth') ? $popLink.data('popwidth') : false;
		// check data height attributes (overrides classname height)
		var height = $popLink.data('popheight') ? $popLink.data('popheight') : false;
		$.popOpen( popup, height, width );
	}

	// Hide popup when hitting the 'escape' key unless explicitly turned off with 'ltd' class
	$(document).keyup(function(e) {
		if ( e.which == 27 ) {
			$.hidePop( true );
		}
	});

	// function to close all popups
	$.hidePop = function( restricted ) {
		// are we checking for 'ltd' class?
		restricted = typeof restricted !== 'undefined' ? true : false;
		// if we're checking for restricted and are restricted, don't hide
		if ( restricted && $('.popup:visible').hasClass('ltd') )
			return;
		YMVP.triggerAction('wds_closepopup', $('.popup:visible'));
		// Ok, let's hide the popup
		$('#overlay, .popup').hide();
	};

	// function to close all popups & opened a specified popup
	$.hideAndShow = function( toshow ) {
		if ( ! toshow.length ) )
			return;
		$.hidePop();
		$.popOpen(toshow);
	};

	function popHash() {
		$.popOpen($(hash));
	}


	// Hide popup when clicking close buttons, or a button that opens another popup
	YMVP.$body
		.on( 'click', '.close-popup, .popup .pop', function(event) {
			event.preventDefault();
			// check if .pop element is not for expanding
			if ( $(this).hasClass('no-go') )
				return;
			$.hidePop();
		} )
		// Hide popup when clicking overlay unless explicitly turned off with 'ltd' class
		.on( 'click', '#overlay', function() { $.hidePop( true ); } )
		.on( 'tap', '#overlay', function() { $.hidePop( true ); } )
		.on( 'click', '.pop', popupClickHandler );

	// check for hashes to display lightboxes
	if ( hash && $(hash).length ) {
		setTimeout(popHash, 500);
	}


});