/*
	ColorBox v1.2.4 - a full featured, light-weight, customizable lightbox based on jQuery 1.3
	(c) 2009 Jack Moore - www.colorpowered.com - jack@colorpowered.com
	Licensed under the MIT license: http://www.opensource.org/licenses/mit-license.php
*/
(function($){
	
	var open, element, settings, callback, maxWidth, maxHeight, loadedWidth, loadedHeight, interfaceHeight, interfaceWidth, index, $related, ssTimeout, $slideshow, $window, $close, $next, $prev, $current, $title, $modal, $wrap, $loadingOverlay, $loadingGraphic, $overlay, $modalContent, $loaded, $borderTopCenter, $borderMiddleLeft, $borderMiddleRight, $borderBottomCenter;
	
	/* Helper Functions */
	//function for IE6 to set the background overlay
	function IE6Overlay(){
		$overlay.css({"position":"absolute", width:$window.width(), height:$window.height(), top:$window.scrollTop(), left:$window.scrollLeft()});
	}

	function slideshow(){
		var stop;
		function start(){
			$slideshow
			.text(settings.slideshowStop)
			.bind("cbox_complete", function(){
				ssTimeout = setTimeout($.fn.colorbox.next, settings.slideshowSpeed);
			})
			.bind("cbox_load", function(){
				clearTimeout(ssTimeout);	
			}).one("click", function(){
				stop();
				$(this).removeClass('hover');
			});
			$modal.removeClass("cboxSlideshow_off").addClass("cboxSlideshow_on");
		}
		
		stop = function(){
			clearTimeout(ssTimeout);
			$slideshow
			.text(settings.slideshowStart)
			.unbind('cbox_complete cbox_load')
			.one("click", function(){
				start();
				ssTimeout = setTimeout($.fn.colorbox.next, settings.slideshowSpeed);
				$(this).removeClass('hover');
			});
			$modal.removeClass("cboxSlideshow_on").addClass("cboxSlideshow_off");
		};
		
		if(settings.slideshow && $related.length>1){
			if(settings.slideshowAuto){
				start();
			} else {
				stop();
			}
		}
	}

	function clearInline(){
		if($("#cboxInlineTemp").length > 0){
			$loaded.children().insertAfter("#cboxInlineTemp");
		}
	}

	function cbox_key(e) {
		if(e.keyCode == 37){
			e.preventDefault();
			$prev.click();
		} else if(e.keyCode == 39){
			e.preventDefault();
			$next.click();
		}
	}

	// Convert % values to pixels
	function setSize(size, dimension){
		dimension = dimension=='x' ? document.documentElement.clientWidth : document.documentElement.clientHeight;
		return (typeof size == 'string') ? (size.match(/%/) ? (dimension/100)*parseInt(size, 10) : parseInt(size, 10)) : size;
	}

	function isImage(url){
		return settings.photo ? true : url.match(/\.(gif|png|jpg|jpeg|bmp)(?:\?([^#]*))?(?:#(.*))?$/i);
	}

	/* Initializes ColorBox when the DOM has loaded */
	$(function(){
		$.fn.colorbox.init();
	});

	$.fn.colorbox = function(options, custom_callback) {
		
		if(this.length){
			this.each(function(){
				var data = $(this).data("colorbox")
					? $.extend({}, $(this).data("colorbox"), options)
					: $.extend({}, $.fn.colorbox.settings, options);
				
				data.title = data.title ? data.title : this.title;
				data.href = data.href ? data.href : this.href;
				data.rel = data.rel ? data.rel : this.rel;
				$(this).data("colorbox", data).addClass("cboxelement");
			});
		} else {
			$(this).data("colorbox", $.extend({}, $.fn.colorbox.settings, options));
		}
		
		$(this).unbind("click.colorbox").bind("click.colorbox", function (event) {
			
			element = this;
			
			settings = $(this).data('colorbox');
			
			//remove the focus from the anchor to prevent accidentally calling
			//colorbox multiple times (by pressing the 'Enter' key
			//after colorbox has opened, but before the user has clicked on anything else)
			this.blur();
			
			callback = custom_callback ? custom_callback : false;
			
			if (settings.rel && settings.rel != 'nofollow') {
				$related = $('.cboxelement').filter(function(){
					return ($(this).data("colorbox").rel == settings.rel);
				});
				index = $related.index(this);
			} else {
				$related = $(this);
				index = 0;
			}
			if (!open) {
				$.event.trigger('cbox_open');
				$close.html(settings.close);
				$overlay.css({"opacity": settings.opacity}).show();
				open = true;
				$.fn.colorbox.position(setSize(settings.initialWidth, 'x'), setSize(settings.initialHeight, 'y'), 0);
				if ($.browser.msie && $.browser.version < 7) {
					$window.bind("resize scroll", IE6Overlay);
				}
			}
			slideshow();
			$.fn.colorbox.load();
			
			if(settings.overlayClose===true){
				$overlay.css({"cursor":"pointer"}).click($.fn.colorbox.close);
			}
			event.preventDefault();
		});
		
		if(options && options.open){
			$(this).triggerHandler('click.colorbox');
		}
		
		return this;
	};

	$.fn.colorbox.element = function(){
		return element;
	};

	/*
	  Initialize the modal: store common calculations, preload the interface graphics, append the html.
	  This preps colorbox for a speedy open when clicked, and lightens the burdon on the browser by only
	  having to run once, instead of each time colorbox is opened.
	*/
	$.fn.colorbox.init = function(){
		
		$window = $(window);

		$('body').prepend(
			$overlay = $('<div id="cboxOverlay" />').hide(), 
			$overlay.css({"display":"none"}), /* Added CM 26/05/09 */
			$modal = $('<div id="colorbox" />')
		);
		
		$wrap = $('<div id="cboxWrapper" />').appendTo($modal).append(
			$('<div/>').append(
				$('<div id="cboxTopLeft"/>'),
				$borderTopCenter = $('<div id="cboxTopCenter"/>'),
				$('<div id="cboxTopRight"/>')
			),
			$borderMiddleLeft = $('<div id="cboxMiddleLeft" />'),
			$modalContent = $('<div id="cboxContent" />'),
			$borderMiddleRight = $('<div id="cboxMiddleRight" />'),
			$('<div/>').append(
				$('<div id="cboxBottomLeft"/>'),
				$borderBottomCenter = $('<div id="cboxBottomCenter"/>'),
				$('<div id="cboxBottomRight"/>')
			)
		);
		
		$wrap.find("[id]").css({'float':'left'});
		
		$modalContent.append(
			//loaded is filled with temporary HTML to allow the CSS backgrounds for those elements to load before ColorBox is actually called.
			$loaded = $('<div id="cboxLoadedContent" style="width:0; height:0;" />'),
			$loadingOverlay = $('<div id="cboxLoadingOverlay" />'),
			$loadingGraphic = $('<div id="cboxLoadingGraphic" />'),
			$title = $('<div id="cboxTitle" />'),
			$current = $('<div id="cboxCurrent" />'),
			$slideshow = $('<div id="cboxSlideshow" />'),
			$next = $('<div id="cboxNext" />').click($.fn.colorbox.next),
			$prev = $('<div id="cboxPrevious" />').click($.fn.colorbox.prev),
			$close = $('<div id="cboxClose" />').click($.fn.colorbox.close)
		);
		
		$modalContent.children()
			.addClass("hover")
			.mouseover(function(){$(this).addClass("hover");})
			.mouseout(function(){$(this).removeClass("hover");})
			.hide();
		
		//precalculate sizes that will be needed multiple times.
		interfaceHeight = $borderTopCenter.height()+$borderBottomCenter.height()+$modalContent.outerHeight(true) - $modalContent.height();//Subtraction needed for IE6
		interfaceWidth = $borderMiddleLeft.width()+$borderMiddleRight.width()+$modalContent.outerWidth(true) - $modalContent.width();
		loadedHeight = $loaded.outerHeight(true);
		loadedWidth = $loaded.outerWidth(true);
		
		$modal.css({"padding-bottom":interfaceHeight,"padding-right":interfaceWidth}).hide();//the padding removes the need to do size conversions during the animation step.
		
		//Setup button & key events.
		$().bind("keydown.cbox_close", function(e){
			if (e.keyCode == 27) {
				e.preventDefault();
				$close.click();
			}
		});
		
		$modalContent.children().removeClass("hover");
	};
	
	//navigates to the next page/image in a set.
	$.fn.colorbox.next = function(){
		index = index < $related.length-1 ? index+1 : 0;
		$.fn.colorbox.load();
	};
	
	$.fn.colorbox.prev = function(){
		index = index > 0 ? index-1 : $related.length-1;
		$.fn.colorbox.load();
	};
	
	$.fn.colorbox.position = function(mWidth, mHeight, speed, loadedCallback){
		var winHeight = document.documentElement.clientHeight;
		var posTop = winHeight/2 - mHeight/2;
		var posLeft = document.documentElement.clientWidth/2 - mWidth/2;
		//keeps the box from expanding to an inaccessible area offscreen.
		if(mHeight > winHeight){posTop -=(mHeight - winHeight);}
		if(posTop < 0){posTop = 0;} 
		if(posLeft < 0){posLeft = 0;}
		
		posTop+=$window.scrollTop();
		posLeft+=$window.scrollLeft();
		
		mWidth = mWidth - interfaceWidth;
		mHeight = mHeight - interfaceHeight;
		
		//this gives the wrapper plenty of breathing room so it's floated contents can move around smoothly,
		//but it has to be shrank down around the size of div#colorbox when it's done.  If not,
		//it can invoke an obscure IE bug when using iframes.
		$wrap[0].style.width = $wrap[0].style.height = "9999px";

		function modalDimensions(that){
			//loading overlay size has to be sure that IE6 uses the correct height.
			$borderTopCenter[0].style.width = $borderBottomCenter[0].style.width = $modalContent[0].style.width = that.style.width;
			$loadingGraphic[0].style.height = $loadingOverlay[0].style.height = $modalContent[0].style.height = $borderMiddleLeft[0].style.height = $borderMiddleRight[0].style.height = that.style.height;
		}
		
		//setting the speed to 0 to reduce the delay between same-sized content.
		var animate_speed = ($modal.width()===mWidth && $modal.height() === mHeight) ? 0 : speed;
		$modal.dequeue().animate({height:mHeight, width:mWidth, top:posTop, left:posLeft}, {duration: animate_speed,
			complete: function(){
				modalDimensions(this);
				
				//shrink the wrapper down to exactly the size of colorbox to avoid a bug in IE's iframe implementation.
				$wrap[0].style.width = (mWidth+interfaceWidth) + "px";
				$wrap[0].style.height = (mHeight+interfaceHeight) + "px";
				
				if (loadedCallback) {loadedCallback();}
				if ($.browser.msie && $.browser.version < 7) {IE6Overlay();}
			},
			step: function(){
				modalDimensions(this);
			}
		});
	};
	
	$.fn.colorbox.dimensions = function(object){
		if(!open){ return false; }
		
		$window.unbind('resize.cbox_resize');
		
		var speed = settings.transition=="none" ? 0 : settings.speed;
		$loaded.remove();
		$loaded = $(object);
		
		function getWidth(){
			if(settings.width){
				return maxWidth;
			} else {
				return maxWidth && maxWidth < $loaded.width() ? maxWidth : $loaded.width();
			}
		}
		function getHeight(){
			if(settings.height){
				return maxHeight;
			} else {
				return maxHeight && maxHeight < $loaded.height() ? maxHeight : $loaded.height();
			}
		}
		
		$loaded.hide().appendTo('body')
		.attr({id:'cboxLoadedContent'})
		.css({width:getWidth()})
		.css({height:getHeight()})//sets the height independently from the width in case the new width influences the value of height.
		.prependTo($modalContent);
		
		if ($.browser.msie && $.browser.version < 7) {
			$('select').not($('#colorbox select')).css({'visibility':'hidden'});
		}
				
		if($('#cboxPhoto').length > 0 && settings.height){
			var topMargin = ($loaded.height() - parseInt($('#cboxPhoto')[0].style.height, 10))/2;
			$('#cboxPhoto').css({marginTop:(topMargin > 0?topMargin:0)});
		}
		
		function setPosition(s){
			var mWidth = $loaded.width()+loadedWidth+interfaceWidth;
			var mHeight = $loaded.height()+loadedHeight+interfaceHeight;
			$.fn.colorbox.position(mWidth, mHeight, s, function(){
				if(!open){ return false; }
				
				if($.browser.msie){
					//This fadeIn helps the bicubic resampling to kick-in.
					if($('#cboxPhoto').length > 0 ){$loaded.fadeIn(100);}
					//IE adds a filter when ColorBox fades in and out that can cause problems if the loaded content contains transparent pngs.
					$modal.css('filter','');
				}
				
				$modalContent.children().show();
				
				$loadingOverlay.hide();
				$loadingGraphic.hide();
				$slideshow.hide();
				
				if($related.length>1){
					$current.html(settings.current.replace(/\{current\}/, index+1).replace(/\{total\}/, $related.length));
					$next.html(settings.next);
					$prev.html(settings.previous);
					
					$().unbind('keydown', cbox_key).one('keydown', cbox_key);
					
					if(settings.slideshow){
						$slideshow.show();
					}
				} else {
					$current.add($next).add($prev).hide();
				}
				$title.html(settings.title);
				
				$('#cboxIframe').attr('src', $('#cboxIframe').attr('src'));//reloads the iframe now that it is added to the DOM & it is visible, which increases compatability with pages using DOM dependent JavaScript.
				
				$.event.trigger('cbox_complete');
				
				if(callback){
					$(element).each(callback);
				}
				
				if (settings.transition === 'fade'){
					$modal.fadeTo(speed, 1, function(){
						if($.browser.msie){$modal.css('filter','');}
					});
				}
				
				$window.bind('resize.cbox_resize', function(){
					$.fn.colorbox.position(mWidth, mHeight, 0);
				});
				
				return true;
			});
		}
		if (settings.transition == 'fade') {
			$modal.fadeTo(speed, 0, function(){setPosition(0);});
		} else {
			setPosition(speed);
		}
		
		if(settings.preloading && $related.length>1){
			var previous = index > 0 ? $related[index-1] : $related[$related.length-1];
			var next = index < $related.length-1 ? $related[index+1] : $related[0];
			if(isImage($(next).data('colorbox').href)){
				$('<img />').attr('src', next);
			}
			if(isImage($(previous).data('colorbox').href)){
				$('<img />').attr('src', previous);
			}
		}
		
		return true;
	};
	
	$.fn.colorbox.load = function(){
		
		element = $related[index];
		
		settings = $(element).data('colorbox');
		
		$.event.trigger('cbox_load');
		
		$loadingOverlay.show();
		$loadingGraphic.show();
		$close.show();
		clearInline();//puts inline elements back if they are being used
		
		// Evaluate the height based on the optional height and width settings.
		var height = settings.height ? setSize(settings.height, 'y') - loadedHeight - interfaceHeight : false;
		var width = settings.width ? setSize(settings.width, 'x') - loadedWidth - interfaceWidth : false;
		
		//Re-evaluate the maximum dimensions based on the optional maxheight and maxwidth.
		if(settings.maxHeight){
			maxHeight = settings.maxHeight ? setSize(settings.maxHeight, 'y') - loadedHeight - interfaceHeight : false;
			height = height && height < maxHeight ? height : maxHeight;
		}
		if(settings.maxWidth){
			maxWidth = settings.maxWidth ? setSize(settings.maxWidth, 'x') - loadedWidth - interfaceWidth : false;
			width = width && width < maxWidth ? width : maxWidth;
		}
		
		maxHeight = height;
		maxWidth = width;
		
		var href = settings.href;
		
		if (settings.inline) {
			$('<div id="cboxInlineTemp" />').hide().insertBefore($(href)[0]);
			$.fn.colorbox.dimensions($(href).wrapAll('<div/>').parent());
		} else if (settings.iframe) {
			$.fn.colorbox.dimensions(
				$("<div><iframe id='cboxIframe' name='iframe_"+new Date().getTime()+"' frameborder=0 src='"+href+"' /></div>")
			);//timestamp to prevent caching.
		} else if (isImage(href)){
			var loadingElement = new Image();
			loadingElement.onload = function(){
				loadingElement.onload = null;
			
				if((maxHeight || maxWidth) && settings.resize){
					var width = this.width;
					var height = this.height;
					var percent = 0;
					var that = this;
					
					var setResize = function(){
						height += height * percent;
						width += width * percent;
						that.height = height;
						that.width = width;	
					};
					if( maxWidth && width > maxWidth ){
						percent = (maxWidth - width) / width;
						setResize();
					}
					if( maxHeight && height > maxHeight ){
						percent = (maxHeight - height) / height;
						setResize();
					}
				}
				
				$.fn.colorbox.dimensions($("<div />").css({width:this.width, height:this.height}).append($(this).css({width:this.width, height:this.height, display:"block", margin:"auto", border:0}).attr('id', 'cboxPhoto')));
				if($related.length > 1){
					$(this).css({cursor:'pointer'}).click($.fn.colorbox.next);
				}
				if($.browser.msie && $.browser.version == 7){
					this.style.msInterpolationMode='bicubic';
				}
			};
			loadingElement.src = href;
		} else {
			$('<div />').load(href, function(data, textStatus){
				if(textStatus == "success"){
					$.fn.colorbox.dimensions($(this));
				} else {
					$.fn.colorbox.dimensions($("<p>Request unsuccessful.</p>"));
				}
			});
		}	
	};

	//public function for closing colorbox.  To use this within an iframe use the following format: parent.$.fn.colorbox.close();
	$.fn.colorbox.close = function(){
		open = false;
		clearTimeout(ssTimeout);
		$window.unbind('resize.cbox_resize');
		$slideshow.unbind('cbox_complete cbox_load click');
		clearInline();
		$overlay.css({cursor:'auto'}).fadeOut('fast').unbind('click', $.fn.colorbox.close);
		$().unbind('keydown', cbox_key);
		
		if ($.browser.msie && $.browser.version < 7) {
			$('select').css({'visibility':'inherit'});
			$window.unbind('resize scroll', IE6Overlay);
		}
		
		$modalContent.children().hide();
		
		$modal
		.stop(true, false)
		.removeClass()
		.fadeOut('fast', function(){
			$loaded.remove();
			$modal.css({'opacity':1});
			$.event.trigger('cbox_closed');
		});
	};

	/*
		ColorBox Default Settings.
		
		The colorbox() function takes one argument, an object of key/value pairs, that are used to initialize the modal.
		
		Please do not change these settings here, instead overwrite these settings when attaching the colorbox() event to your anchors.
		Example (Global)	: $.fn.colorbox.settings.transition = "fade"; //changes the transition to fade for all colorBox() events proceeding it's declaration.
		Example (Specific)	: $("a[href='http://www.google.com']").colorbox({width:"90%", height:"450px", iframe:true});
		
		See http://colorpowered.com/colorbox for details.
	*/
	$.fn.colorbox.settings = {
		transition : "elastic",
		speed : 350,
		width : false,
		height : false,
		initialWidth : "400",
		initialHeight : "400",
		maxWidth : false,
		maxHeight : false,
		resize : true,
		inline : false,
		iframe : false,
		photo : false,
		href : false,
		title : false,
		rel : false,
		opacity : 0.9,
		preloading : true,
		current : "image {current} of {total}",
		previous : "previous",
		next : "next",
		close : "close",
		open : false,
		overlayClose : true,
		slideshow:false,
		slideshowAuto:true,
		slideshowSpeed: 2500,
		slideshowStart: "start slideshow",
		slideshowStop: "stop slideshow"
	};
})(jQuery);