/**
 * Image zoom
 * Ronan Super
 */
var lastURL = "";
var lastObj;
var closeClass = "imageZoomClose";
var activeImage;
var sx, xy;
var order = new Array();
var maxZ = 1;
var imgWidth	= 640;
var imgHeight	= 480;
var loadingImages = new Array();
$(document).ready(function() {
    $("body").prepend("<div class='"+closeClass+"'></div>");
    
    $("a.imageZoom").click(function() {
        var src = $(this).attr("href");
        loadImage(src, this);
        return false;
    });
    
    $("body").delegate(".bigImage","mousedown",function(e) {
    	sx = e.pageX;
    	sy = e.pageY;
    	var o = $(this).offset();
    	
    	var ox = o.left;
    	var oy = o.top;
    	
    	var obj = this;
    	
    	// z-index sorting
    	maxZ++;
    	$(this).css({zIndex:maxZ});
    	positionClose();
    	
    	$("body").mousemove(function(e) {
    		var nx = e.pageX;
    		var ny = e.pageY;
    		
    		$(obj).css({left: ox - (sx-nx), top: oy - (sy-ny)});
    		positionClose();
    	});
    	
    	$("body").mouseup(function() {
    		$("body").unbind("mousemove");
    	});
    });
    
    $("body").delegate(".bigImage","mouseover",function(e) {
    	activeImage = this;
    	if ($(this).not(":animated").length==1)
    	{
    		positionClose();
    		//$("."+closeClass).css({display:'block'});
    	}
    });
    $("body").delegate(".bigImage","mouseout",function(e) {
    	//$("."+closeClass).css({display:'none'});
    });
    
    $("body").delegate("."+closeClass,"click",function(e) {
    	$(activeImage).fadeOut(250,function(){
    		var src = $(this).attr("src");
    		$(this).remove();
    		for (var i in order)
    			if ($(order[i]).attr("src") == src)
    				order[i] = null;
    		
    	});
    	$("."+closeClass).fadeOut(150);
    });
});

function positionClose()
{
	$("."+closeClass).css({display:'block'});
	var p = $(activeImage).offset();
	var w = $(activeImage).width();
	var z = $(activeImage).css("z-index");
	var cw = $("."+closeClass).width(); // close width
	var ch = $("."+closeClass).height(); // close height
	
	if (p == null)
		p = new Object();
	
	$("."+closeClass).css({left:p.left + w - cw - 5, top:p.top+4, zIndex:maxZ+1});
}

var n = 0;
function loadImage(src, obj) {
    lastURL = src;
    lastObj = obj;

    var img = new Image();
    img.onload = showImage;
    img.src = src;
    img.ref = n;
    
    loadingImages[n] = obj;
    
    var f = false;
    for (var i in order)
    {
    	if (order[i] == null)
			continue;
    	//alert($(order[i]).attr("src") + "\n" + src);
		if ($(order[i]).attr("src").toString().indexOf(src) != -1)
			f = true;
    }
    if (!f)
    	fadeOut(obj);
    //showLoader(obj, n);
    n++;
}
function showLoader(t, n) {
    var w = $(t).width();
    var h = $(t).height();
    var p = $(t).offset();
}

function fadeIn(obj)
{
	$(obj).animate({opacity:.75},1500,function() {fadeOut(obj)});
}
function fadeOut(obj)
{
	$(obj).animate({opacity:.2},1500,function() {fadeIn(obj)});
}

function showImage(e) {
	
    //$(".loader").remove();
	//alert(this.src + "\n" + lastURL)
    //if (this.src.indexOf(escape(lastURL).replace("../","")) != -1) {
    	var ref = $(this).attr("ref");
    	$(loadingImages[ref]).stop().animate({opacity:1},500);
    	loadingImages[ref] = null;
        //$(".bigImage").remove();
    	//var src = "image.php?w="+imgWidth+"&h="+imgHeight+"&image=" + lastURL;
    	var src = this.src;
    	for (var i in order)
    		if ($(order[i]).attr("src") ==src)
    			return;
    	
    	$("body").append("<img src='"+src+"' onselect='return false' class='bigImage img"+(order.length)+"' ondragstart='return false' onselectstart='return false' />");
    	
    	var o =  $(".img"+order.length);
        order.push(o);
        
    	// maximale afmetingen van de grote afbeelding
    	var maxW = 600;//$("body").innerWidth() - 50;
    	var maxH = 600;//$("body").innerHeight() - 50;

		// afmetingen en positie van bronafbeelding ophalen
		var w = $(lastObj).width();
		var h = $(lastObj).height();
		var p = $(lastObj).offset();
		
		// afmetingen van de te openen afbeelding, hier kan ook een vaste grootte opgegeven worden
		//var oW = imgWidth; //this.width;
		//var oH = imgHeight; //this.height;
		var oW = this.width;
		var oH = this.height;
		
		// percentage berekenen zodat het binnen het venster past 
		var pct1 = 100/oW * maxW;
		var pct2 = 100/oH * maxH;
		var pct = Math.min(pct1,pct2);
		if (pct > 100) pct = 100;
		
		// nieuwe berekende afmetingen toepassen
		oW = oW / 100 * pct;
		oH = oH / 100 * pct;
		
		var wW = $(window).width();
		var wH = ($(window).height() / 2) + Math.max($("body").scrollTop(), $("html").scrollTop());
		
		var newX = wW / 2 - oW / 2;
		var newY = wH - oH / 2;
		
		o.css({ width: w, height: h, opacity: 0, display: "block", left: p.left, top: p.top,zIndex:maxZ++ });
		
		//$(o).animate({left: newX, top: newY, width: oW, height: oH, opacity:1});
		$(o).animate({opacity:1, width: oW, height: oH, left: newX, top: newY, opacity: 1 }, 250, function() {
			positionClose();
		});
		var imgObj = o;
		//$(document).click(function() { $(imgObj).fadeOut(); });
    //}
}