
// --------------------------------------------------
//
// Modal Window
//
// USAGE: myModal = new PP2.modalWindow(target, options);
//
// AUTHOR: MC
//
// DEPENDENCIES:
// jQuery 1.6 or later
//
// --------------------------------------------------

PP2.ModalWindow = function(target, options){
	var base = this;

	base.options = $.extend({
		className: 'modal-window',
		fadeInDuration: 400,
		fadeOutDuration: 400,
		controls: false,
		setTopPosition: true,
		onModalOpen: function(){},
		onModalClose: function(){},
		onLoad: function(){}
	}, options || {});

	base.elLink = target;

	base.init();
	base.options.onLoad();
};

PP2.ModalWindow.prototype = {
	init:function(){
		var base = this;

		base.buildModal();
		base.bindEvents();
	},

	bindEvents:function(){
		var base = this;

		$('body').bind('PP2:openModal', function(){
			base.showModal(this);
		});

		if(base.elLink){
			base.elLink.live('click', function(e){
				e.preventDefault();

				base.showModal(this);
			});
		}

		if(base.options.controls){
			$('div#overlay').live('click', function(){
				base.hideModal();
			});

			$('button#btn-modal-close').live('click', function(){
				base.hideModal();
			});

			$(document).keydown(function(e){
				if(e.keyCode === 27){
					base.hideModal();
				}
			});
		}

		$(window).bind('resize', function(){
			base.positionModal();
		});

		$(window).scroll(function(e){
			base.positionModal();
		});
	},

	buildModal:function(){
		var base = this;

		base.elOverlay = $('<div id="overlay" />').addClass(base.options.className);
		base.elModal = $('<div id="modal-window" />').addClass(base.options.className);
		base.elBtnClose = $('<button id="btn-modal-close">Close</button>');

		base.elOverlay.css({
			height: ($(document.viewport).height() > $(document.body).height() ? $(document.viewport).height() : $(document.body).height()) + 'px'
		});
	},

	positionModal:function(){
		var base = this,
			leftPosition = ($(window).width() - base.elModal.width()) / 2 + 'px',
			topPosition = base.options.setTopPosition ? ($(window).height() - base.elModal.height()) / 2 + 'px' : null;

		base.elModal.css({
			'left' : leftPosition,
			'top' : topPosition
		});
	},

	showModal:function(el){
		var base = this,
			targetHref = $(el).attr('href');

		base.iframeContent = $(targetHref).is('iframe') ? true : false;

		base.modalContent = base.iframeContent ? base.elModal.append($(targetHref)) : base.elModal.append($(targetHref).children().clone(true));
		base.options.onModalOpen(base, el, base.modalContent);

		if(base.options.controls){
			base.elModal.append(base.elBtnClose);
		}

		$('body').append(base.elOverlay, base.elModal);

		base.positionModal();

		base.elOverlay.fadeIn(base.options.fadeInDuration);

		base.modalContent.fadeIn(base.options.fadeInDuration);
	},

	hideModal:function(){
		var base = this;

		base.elOverlay.fadeOut(base.options.fadeOutDuration, function(){
			$(this).remove();
		});

		base.elModal.fadeOut(base.options.fadeOutDuration, function(){
			if(base.iframeContent){
				$('body').append($(this).find('iframe'));
			}else{
				$(this).empty().remove();
			}
		});

		base.options.onModalClose();

		$(document).unbind('keydown', base.hideModal);
	}
};
