
(function($) {
	$.fn.oLightBox = function (settings) {
		settings = jQuery.extend({
			poptop	: 100,
			template: 'template_1',
			callClose : null								 	
		},settings);
		
    	var $popupContent = $(this);
		var contenTop = ( $(window).height() - $popupContent.height() )/2 + $(window).scrollTop();
		
		var template_1 = '<div id="lightbox-overlay"></div>'
						+ 	'<div id="lightbox-outter">'
						+ 		'<div id="lightbox-inner">'
						+			'<div class="lightbox-close"></div>'						
						+		'</div>'
						+	'</div>';
		var template_2 = '<div id="lightbox-overlay"></div>'
						+ 	'<div id="lightbox-outter">'
						+ 		'<div id="lightbox-inner">'
						+			/*'<div class="lightbox-close-mbr"></div>'	*/					
						+		'</div>'
						+	'</div>';
						//+ '</div>' ;
		
		/*var template_2 = '<div id="lightbox-overlay"></div>'
						+ 	'<div id="lightbox-outter">'
						+ 		'<div id="lightbox-inner">'
						+			'<div class="lightbox-close orange"></div>'						
						+		'</div>'
						+	'</div>'
						+ '</div>' ;

		var template_3 = '<div id="lightbox-overlay"></div>'
						+ 	'<div id="lightbox-outter">'
						+ 		'<div id="lightbox-inner">'
						+			'<div class="lightbox-close orange popcgu png"></div>'						
						+		'</div>'
						+	'</div>'
						+ '</div>' ;*/
		
		var template = eval(settings.template);		   
    
    function _showOverlay () {
			var bodyWitdh = $('body').width();
			var bodyHeight = $(window).height() < $('body').height() ? $('body').height() : $(window).height() ;
			
			$('#lightbox-overlay').css({width: bodyWitdh + 'px', height: bodyHeight +'px', opacity: 0.2, filter:'Alpha(Opacity=20)'})
		};
		
		function _showLightBox () {
			// Hime some elements to avoid conflict with overlay in IE. These elements appear above the overlay.
			$('embed, object, select', '.page').css({ 'visibility' : 'hidden' });
			$('select', '.page').css({ 'visibility' : 'visible' });
			$('body').append(template);
			
			_showOverlay ();
			
			var contentWidth = $popupContent.innerWidth();
			var contentHeight = $popupContent.innerHeight();
			
			$popupContent
				.appendTo('#lightbox-inner')
				//.css ({ position:'static', top:'auto', left:'auto' });
				.removeClass('popup');
			
			$('#lightbox-inner').css ({ width: contentWidth + 'px', height: contentHeight + 'px'  });
			$('#lightbox-outter').css({ top: contenTop + 'px' });
			
			$('#lightbox-inner	.lightbox-close').click ( function () {               
				_closeLightBox ();
        if (settings.callClose)
          settings.callClose.call (this);             			
			});
			$('#lightbox-inner	.lightbox-close-mbr').click ( function () {               
				_closeLightBox ();
        if (settings.callClose)
          settings.callClose.call (this);             			
			});
			
		}
		
		$popupContent[0]._closeLightBox = _closeLightBox;
				
		function _closeLightBox () {
			//$('#lightbox-inner').find('#' + $popupContent.attr('id'))			
			//.css ({ position:'absolute', left:'-1000px', top:'0px' })
			$popupContent
				.addClass('popup')
				.appendTo('body');
				
			$('#lightbox-outter').remove();
			//$('#lightbox-overlay').fadeOut ( function() { $('#lightbox-overlay').remove(); });
			$('#lightbox-overlay').remove();
			$('embed, object, select', '.page').css({ 'visibility' : 'visible' });
			return false;
		}
		
		_showLightBox ();
	}
})(jQuery); // Call and execute the function immediately passing the jQuery object


