﻿var imgObj;
var theImgs = new Array();
var currImg;
var totalImg;
var BrettBox = {

    Gallery : {
        Initialize : function()
        {
            $('.slideshow').click(function(){
                BrettBox.Render.Overlay();
                
                imgObj = new Image();
                imgObj.caption = $(this).attr('title');
                imgObj.index = $('.slideshow').index(this);
                imgObj.onload = BrettBox.Render.Window;
                
                //imgObj.src = $(this).attr('rel');
                theImgs = $(this).attr('rel').split(',');
                totalImg = theImgs.length;
                currImg = 0;
                imgObj.src = theImgs[currImg];
                BrettBox.Settings.CacheImages(imgObj.index);
            });                        
        },
        
        Update : function(index){
            currImg = index;
            imgObj = new Image();
            //imgObj.caption = $('.slideshow:eq('+index+')').attr('title');
            imgObj.index = index;
            //alert(index + " :: " + currImg);
            imgObj.src = theImgs[currImg];//$('.slideshow:eq('+index+')').attr('rel');
            imgObj.onload = BrettBox.Render.UpdateImageContent;
            
            BrettBox.Settings.CacheImages(imgObj.index);
        },
        
        Close : function(){
            $('#window, #overlay').fadeOut(400, function(){
                $(this).remove();
            }); 
        }
    },

    Render : {
        Overlay : function()
        {
            var screenHeight = screen.height;
			$('body').append('<div id="overlay" onclick="BrettBox.Gallery.Close();" style="filter:alpha(opacity=50);height:'+screenHeight+'"></div>');
            $('#overlay').fadeIn(400);            
        }, 
        
        ImageContent : function()
        {
            BrettBox.Settings.AdjustImageDimensions();
        
            $('#window').html('<a href="javascript:;" onclick="BrettBox.Gallery.Close();"><img height="'+imgObj.height+'" src="'+imgObj.src+'" width="'+imgObj.width+'" /></a>');            
            BrettBox.Render.Caption();
            $('#window').css({
                marginLeft: -parseInt((imgObj.width+20)/2)+"px",
                marginTop: -parseInt(($('#window').height()+20)/2)+"px"
            });
        },
        
        UpdateImageContent : function()
        {    
            BrettBox.Settings.AdjustImageDimensions();
            
            $('.hidden').remove();    
            $('body').append('<div class="hidden" style="visibility:hidden;width:'+imgObj.width+'px;">'+imgObj.caption+'</div>');
            $('#window').height($('#window').height());
            $('#window').width($('#window').width());
            $('.caption, .prev, .next').hide();
                
            var hidHeight = $('.hidden').height();    
            var prevHeight = $('.prev').height();
            var paddCapt = parseInt($('.caption').css('padding-top')) * 4;   
            
            $('img', '#window').fadeOut(300, function(){        
                $('#window').animate({
                    height: (imgObj.height + hidHeight + prevHeight + 20) + "px",
                    //marginLeft: -((imgObj.width+20)/2) + "px",
                    //marginTop: -((imgObj.height + hidHeight + prevHeight + 20 + paddCapt)/2) + "px",
                    width: imgObj.width + "px"
                },400, function(){
                    BrettBox.Render.ImageContent();
                    $('img', '#window').fadeIn(250, function(){
                        $('.caption, .prev, .next').show();
                    });  
                });
            });
        },
        
        Caption : function()
        {
            var capt = '<div style="height:14px;padding:5px 0;width:'+imgObj.width+'px;"><a class="next" onclick="BrettBox.Gallery.Update('+(currImg+1)+'); return false;" href="#"> </a><a class="prev" onclick="BrettBox.Gallery.Update('+(currImg-1)+');return false;" href="#"> </a></div>';
            $('#window').append(capt);

            if(!currImg > 0)
                $('.prev').css('visibility','hidden');
            else    
                $('.prev').show();
            if(currImg == totalImg-1)
                $('.next').css('visibility','hidden');
            else
                $('.next').show();            
        },
        
        Window : function()
        {
            $('#overlay').css('backgroundImage', 'none');
            $('body').append('<div id="window"></div>');
            BrettBox.Render.ImageContent();
            $('#window').slideDown(400);                        
        }
    },
    
    Settings : {
        AdjustImageDimensions : function()
        {
            imgObj.ratio = parseInt(imgObj.width) / parseInt(imgObj.height);
            imgObj.winH = $(window).height() - 100;
            
            if (imgObj.winH < imgObj.height)
            {
                imgObj.height = imgObj.winH;
                imgObj.width = parseInt(imgObj.ratio*imgObj.winH);
            }
        },
        
        CacheImages : function(index)
        {
            var p = new Image();
            var n = new Image();
            
            p.src = theImgs[(index-1)];//$('.slideshow:eq('+(index-1)+')').attr('rel');
            n.src = theImgs[(index+1)];//$('.slideshow:eq('+(index+1)+')').attr('rel');    
        }
    }
}

window.onload = BrettBox.Gallery.Initialize;
