
$.fn.zoomer = function(container) {
	var container = container || "body";
	var zoomEl;
	var zoomImg;
	var closeText = 'klik for at lukke billedet';
	var image = new Image();
	var startPos = {};
	var endPos = {};
	var preloading = false;
	var zooming = false;
	var fluffX = 0;
	var fluffY = 0;

	function zoomIn() {
		//break out functions here
	}
	function zoomOut() {
		//break out functions here
	}
	function preload(el) {
		image = new Image();
		preloading = true;
		image.onload=function(){
			preloading = false;
		}
		image.src = el.href;
	}
	
	function init() {
		zoomEl = $("#zoomEl");
		zoomImg = $("#zoomElImg");
		zoomClose = $("#zoomElClose");


		//fix for IE6: stops select boxes from showing through.
		//a IE6-specific rule in the css is neccessary for the img inside zoomEl:
		//* html #zoomElImg {filter:Alpha(Opacity='100');}
		if(typeof($.fn.bgIframe) == "function")
			$("#zoomEl, #zoomElClose").bgIframe();
		

		zoomClose.click(function(){zoomEl.click()})
		//possible to filter even more on .png, .jpg, .gif?
		$(container + ' a[@rel="zoom"]').each(function(){
			$(this).mouseover(function(){
				preload(this);
			});

			$(this).click(function(){
				if(preloading==true) {
					//alert('hold on... preloading!');
					//return false;
				} else {
					var thumb = null;
					thumb = $(this).children("img:first");
					if (thumb.length==0) thumb = $(this); //not a thumb, but an href!
					startPos = $(thumb).offset();
					aspectRatio = (image.width/image.height);
					startPos.width = thumb.width();
					startPos.height = thumb.height();
					if (aspectRatio > 1) {
						startPos.height = parseInt(startPos.height / aspectRatio)
					} else {
						startPos.width = parseInt(startPos.width / aspectRatio)
					}
					startPos.opacity = 0;
					//fluff: calculate extra padding/border on the zoomEl
					fluffX = (parseInt(zoomEl.css("paddingLeft")) || 0) + (parseInt(zoomEl.css("paddingRight")) || 0) + (parseInt(zoomEl.css("borderLeftWidth")) || 0) + (parseInt(zoomEl.css("borderRightWidth")) || 0);
					fluffY = (parseInt(zoomEl.css("paddingTop")) || 0) + (parseInt(zoomEl.css("paddingBottom")) || 0) + (parseInt(zoomEl.css("borderTopWidth")) || 0) + (parseInt(zoomEl.css("borderBottomWidth")) || 0);
					
					
					var leftPos = ($(window).width() - image.width - fluffX) / 2 + $(window).scrollLeft();
					var topPos = ($(window).height() - image.height - fluffY) / 2 + $(window).scrollTop();

					if(topPos < 10) topPos = 10; //compensating for the close button.
					if(leftPos < 0) leftPos = 0;

					endPos = {width: image.width, height: image.height, top: topPos, left: leftPos, opacity:1};
					// console.log(endPos)
					
					if(zooming) return false;
					$(zoomClose).hide();
					zoomImg.attr("src",image.src);
					zoomEl.css(startPos);
					zooming=true;
					zoomEl.animate(endPos, 300, "easeout", function(){
						zooming = false;
						var off = zoomEl.offset({margin:0, border:0, padding:0, scroll:1});
						//zoomEl.css('overflow','visible');
						$(document).bind('keydown', function(e){
							var key = e.which || e.keyCode || -1;
							if (key == 27) {
								zoomEl.click();
								$(document).unbind('keydown');
							}
						});
						
						zoomClose.css({display:'block',top: off.top-11, left: off.left+zoomEl.width()}).fadeIn(100);
						//a bug in firefox makes the end of the animation shaky if fadeIn() is removed.
					});
				}
				//prevent normal behaviour
				return false;
			});
		});
		
		zoomEl.click(function(){
			if(zooming) return;
			zooming = true;
			$(zoomClose).hide(); 
			//$(zoomClose).hide(10); //delay for safari...
			$(this).animate(startPos, 400, "easeout", function(){
				zooming = false; 
				$(this).hide();
			});
			return false;
		});
	} // end init
	
	//Create zoom container elements
	$("body").append('<div id="zoomElClose">X</div><div id="zoomEl" title="' + closeText + '"><img id="zoomElImg" src="#" width="100%" height="100%" /></div>');
	
	//run initialisation thingy
	init();	
}



//initialize on document.ready...
$(function(){
	//either narrow it down a bit: $().zoomer('#content');
	//It defaults to "body":
	$().zoomer();
});

/* Copyright (c) 2006 Brandon Aaron (http://brandonaaron.net)
 * Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) 
 * and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses.
 *
 * $LastChangedDate: 2007-07-21 18:44:59 -0500 (Sat, 21 Jul 2007) $
 * $Rev: 2446 $
 *
 * Version 2.1.1
 */

(function($){
	$.fn.bgIframe = $.fn.bgiframe = function(s) {
		// This is only for IE6
		if ($.browser.msie && /MSIE\ 6.0/.test(navigator.userAgent) ) {
			s = $.extend({
				top     : 'auto', // auto == .currentStyle.borderTopWidth
				left    : 'auto', // auto == .currentStyle.borderLeftWidth
				width   : 'auto', // auto == offsetWidth
				height  : 'auto', // auto == offsetHeight
				opacity : true,
				src     : 'javascript:false;'
			}, s || {});
			var prop = function(n){return n&&n.constructor==Number?n+'px':n;},
			    html = '<iframe class="bgiframe" frameborder="0" tabindex="-1" src="'+s.src+'"'+
			               'style="display:block;position:absolute;z-index:-1;'+
				               (s.opacity !== false?'filter:Alpha(Opacity=\'0\');':'')+
						       'top:'+(s.top=='auto'?'expression(((parseInt(this.parentNode.currentStyle.borderTopWidth)||0)*-1)+\'px\')':prop(s.top))+';'+
						       'left:'+(s.left=='auto'?'expression(((parseInt(this.parentNode.currentStyle.borderLeftWidth)||0)*-1)+\'px\')':prop(s.left))+';'+
						       'width:'+(s.width=='auto'?'expression(this.parentNode.offsetWidth+\'px\')':prop(s.width))+';'+
						       'height:'+(s.height=='auto'?'expression(this.parentNode.offsetHeight+\'px\')':prop(s.height))+';'+
						'"/>';
			return this.each(function() {
				if ( $('> iframe.bgiframe', this).length == 0 )
					this.insertBefore( document.createElement(html), this.firstChild );
			});
		}
		return this;
	};

})(jQuery);

