///////////////////////////////////////////////////////////////////////
// swGallery (Sliding Website)                                       //
// author: David Faber                                               //
// company: Active Webdezign Ltd ( http://webdezign.co.uk )          //
// version: 0.1 beta                                                 //
///////////////////////////////////////////////////////////////////////
function Options() {
	this.load = new Image();
	this.load.src = '/images/ajax-loader.gif';
	this.load.id = 'loading';
}

var options = new Options();
var thumb;
var next_thumb;

$(document).ready(function swGallery() {
	
	$("#swPanel").hide();
	$("#swSite").show();
	
    $(window).bind('resize', function() {
        var $picture = $("#swImageBig");
        resize($picture);
    });
	
	$("#swPrev").live("click",function(){
		next_thumb = thumb.prev("a.swThumb");
		doItFade();
		return false;
	});
	$("#swNext").live("click",function() {
		next_thumb = thumb.next("a.swThumb");
		doItFade();
		return false;
	});
	$("#swImageBig").live("click",function(){
		$("#swImageBig").unbind();
		$("#swClose").unbind();
		next_thumb = thumb.next("a.swThumb");
		doItFade();
	});
	
	$("#swClose").live("click",function(){
		$("#swImageBig").unbind();
		$("#swClose").unbind();
		doItSw();
	});
	
	$("a.swThumb").click( function() {
		thumb = $(this);
		$("a.swThumb").unbind();
		doItGa();
		return false;
	});
});

function doItGa() {
	thumb.append(options.load);
	
	$("#swImageBig").load(function(){
			$("#swSite").css("z-index", 0);
			$("#swPanel").css("z-index", 100);
            $('#loading').remove();
            var $theImage = $(this);
            /*
            After it's loaded we hide the loading icon
            and resize the image, given the window size;
            then we append the image to the wrapper
            */
            
            resize($theImage);

            $('#swPanel').append($theImage);
            /* make its opacity animate */
            $theImage.fadeIn(800);
			$("#swPrev").show();
			$("#swNext").show();
			
			var title = thumb.attr('title');
            if (title != '') {
				$('#swDescription').html(title).show();
			}
			else {
				$('#swDescription').empty().hide();
			}
			
            if( !(thumb.prev("a.swThumb").length) ) {
				$("#swPrev").hide();
			}
			if( !(thumb.next("a.swThumb").length) ) {
				$("#swNext").hide();
			}
            /* and finally slide up the panel */
			$("#swPanel").show("slide", {direction: "left"}, 1000);
			setTimeout(function(){
				$("#swSite").hide();
			}, 1050);
        }).attr( "src" , thumb.attr("href") );
}

function doItSw() {
	$("#swPanel").css("z-index",0);
	$("#swSite").css("z-index",100);
	$("#swSite").show("slide",{direction: "left" },1000);
	setTimeout( function() {
		$("#swPanel").hide();
	},1050);
	$('a.swThumb').click( function() {
		if ( thumb.attr("href") == $(this).attr("href")) {
			$("a.swThumb").unbind();
			$("#swSite").css("z-index", 0);
			$("#swPanel").css("z-index", 100);
			$("#swPanel").show("slide", {
				direction: "left"
			}, 1000);
			setTimeout(function(){
				$("#swSite").hide();
			}, 1050);
			return false;
		} else {
			thumb = $(this);
			$("a.swThumb").unbind();
			doItGa();
			return false;
		}
	});
}

function doItFade() {
    $("#swPanel").append(options.load);
    $('<img/>').load(function(){
        var $theImage = $(this);
        $('#loading').remove();
        $('#swDescription').empty().fadeOut();
         
        $('#swImageBig').stop().fadeOut(500,function(){
            var $this = $(this);
			
            $this.remove();
            resize($theImage);
            
            $('#swPanel').append($theImage.show());
            $theImage.stop().fadeIn(800);
			
			$("#swPrev").show();
			$("#swNext").show();
			
            var title = next_thumb.attr('title');
            if (title != '') {
				$('#swDescription').html(title).show();
			}
			else {
				$('#swDescription').empty().hide();
			}
			
            if( !(thumb.prev("a.swThumb").length) ) {
				$("#swPrev").hide();
			}
			if( !(thumb.next("a.swThumb").length) ) {
				$("#swNext").hide();
			}
        });
    }).attr('src', next_thumb.attr('href')).attr('id', 'swImageBig');
	
	thumb = next_thumb;
}

/*
resizes an image given the window size,
considering the margin values
 */
function resize($image){
    var windowH      = $(window).height()-100;
    var windowW      = $(window).width()-80;
    var theImage     = new Image();
    theImage.src     = $image.attr("src");
    var imgwidth     = theImage.width;
    var imgheight    = theImage.height;
	
	$("#swControls").css("top", ($(window).height()-32)/2 );

    if((imgwidth > windowW)||(imgheight > windowH)){
        if(imgwidth > imgheight){
            var newwidth = windowW;
            var ratio = imgwidth / windowW;
            var newheight = imgheight / ratio;
            theImage.height = newheight;
            theImage.width= newwidth;
            if(newheight>windowH){
                var newnewheight = windowH;
                var newratio = newheight/windowH;
                var newnewwidth =newwidth/newratio;
                theImage.width = newnewwidth;
                theImage.height= newnewheight;
            }
        }
        else{
            var newheight = windowH;
            var ratio = imgheight / windowH;
            var newwidth = imgwidth / ratio;
            theImage.height = newheight;
            theImage.width= newwidth;
            if(newwidth>windowW){
                var newnewwidth = windowW;
                var newratio = newwidth/windowW;
                var newnewheight =newheight/newratio;
                theImage.height = newnewheight;
                theImage.width= newnewwidth;
            }
        }
    }
    $image.css({'width':theImage.width+'px','height':theImage.height+'px','margin-top': ($(window).height()-theImage.height)/2+'px'});
	$("#swClose").css({'right': ($(window).width() - theImage.width) / 2 - 16 + 'px','top': ($(window).height()-theImage.height)/2 - 16 + 'px'});
}