//declarations for image Gallery
var elementCount = 0;
var imageIndex = 0;
var canvasWidth = 1020; 
var contentElementWidth = 980;
var waitTime = 12000;
var animationTime = 12000;
var origin, goToEnd, goToStart, rotateTimeout, contentElementWidth, currentPosition; 

//declarations for boxes
var boxCount, boxHeight, boxIndex, boxTimeout;
var boxWait = 6000;
/*var rotateTimeout, goToEnd, goToStart;*/

$(document).ready(function() {
	
	$('.gallery .item .box').eq(0).css({"height":"310px"});
	$('.gallery .item .box').eq(1).css({"height":"290px"});
	
    $mainGallery = $('#mainGallery');

    $mainGallery.css({
        opacity: 0
    });
    $mainGallery.parent().addClass('gallery-loading');
	
    if($('li', $mainGallery).length > 1) {
        $(window).resize(function() {
            resize = ($(window).width() / 2) - (canvasWidth / 2);
            resizeGallery(resize, $mainGallery.position().left);
        });
    }
    
    /*$('#main .link-prev a').click(function(e) {
        e.preventDefault();
        clearTimeout(boxTimeout);
        $mainGallery.stop(true, true);
    	$('.gallery .item').stop(true, true);
        boxTimeout = setTimeout(function() {
        	moveBoxes(boxIndex);
    	}, boxWait+500);
        moveGallery(currentPosition.left, imageIndex, imageIndex-1);
    });
    
    $('#main .link-next a').click(function(e) {
        e.preventDefault();
        $mainGallery.stop(true, true);
    	$('.gallery .item').stop(true, true);
        clearTimeout(boxTimeout);
        boxTimeout = setTimeout(function() {
        	moveBoxes(boxIndex);
    	}, boxWait+500); 
        moveGallery(currentPosition.left, imageIndex, imageIndex+1);
    });*/
    
    if($('#mainGallery li').length > 1) {
        setTimeout('initGallery();', 1000);
    } else {
        $mainGallery.css({
            'text-align': 'center'
        });
        $('li', $mainGallery).css({
            'float' : 'none'
        });
        $('li img', $mainGallery).css({
            'margin' : '0px auto'
        });
        $('.gallery .link-prev, .gallery .link-next').hide();
        setTimeout(function() {
            $mainGallery.animate({
                opacity : 1
            } , {
                duration : 1000,
                easing: 'easeOutExpo'
            });    
        }, 1000);
    }
});


function initGallery() {
    origin = ($(window).width() / 2) - (canvasWidth / 2);
    galleryChildren = $mainGallery.html();
    elementCount = $mainGallery.children('li').length;
    $('li:eq(0)', $mainGallery).attr('id', 'firstElement');
    $('li:last', $mainGallery).attr('id', 'lastElement');
    $mainGallery.width(((elementCount*3) * contentElementWidth)+980);
    $mainGallery.css({
        'position': 'relative'
    });
    $mainGallery.prepend(galleryChildren);
    $mainGallery.append(galleryChildren);
    $('#mainGallery li:eq('+((elementCount*3)-1)+') img').load(function() {
        setTimeout(function() {
            $('#firstElement').addClass('selected');
            //anchor the gallery to the correct point on the canvas
            firstChildPosition =  $('#firstElement').offset();
            startPosition = firstChildPosition.left - origin ;
            endChildPosition =  $('#lastElement').offset();
            endPosition = endChildPosition.left - origin ;
            $mainGallery.css({
                'right': startPosition+'px'
                });
            showGallery();
        }, 1000);
    });
};

function showGallery() {
    currentPosition = $mainGallery.position();
    $mainGallery.animate({
        opacity: 1
    }, {
        duration: 500,
        queue:false, 
        easing:"easeInOutExpo",
        complete: function() {
            setTimeout('initBoxes();', 2500);
            rotateTimeout = setTimeout(function() {
                $mainGallery.parent().removeClass('gallery-loading');
                $mainGallery.stop(true, true);
                moveGallery(currentPosition.left, imageIndex, imageIndex+1);
            }, 6000);
        }
    });
}

function resizeGallery(resizeWidth, position) {
    clearTimeout(rotateTimeout);
    if(position < 0) {
        position = position*-1; 
    }
    if(resizeWidth > origin) {
        widthDifference = resizeWidth - origin;  
        startPosition = startPosition - widthDifference;
        endPosition = endPosition - widthDifference;
        newPosition = position - widthDifference;
        origin = resizeWidth;
    } else if(resizeWidth < origin) {
        widthDifference = origin - resizeWidth;
        startPosition = startPosition + widthDifference;
        endPosition = endPosition + widthDifference;
        newPosition = position + widthDifference;
        origin = resizeWidth;
    } else {
        newPosition = position;
    }
    $mainGallery.css({'right': newPosition});
    rotateTimeout = setTimeout(function() {
        $mainGallery.stop(true, true);
        moveGallery($mainGallery.position().left, imageIndex, imageIndex+1);
    }, waitTime);
}

function moveGallery(position, currentIndex, newIndex) {
    clearTimeout(rotateTimeout);
    if(position < 0) {
        position = position*-1; 
    }
    if(currentIndex < newIndex) {
        //going forward
        newPosition = position + $('li:eq('+(elementCount+currentIndex)+')', $mainGallery).width();
    } else if(currentIndex > newIndex) {
        //going back
        newPosition = position - $('li:eq('+((elementCount+currentIndex)-1)+')', $mainGallery).width();
    }
    
    //handle being at either  end of the gallery
    $mainGallery.animate({right: newPosition}, {
        duration: animationTime, 
        queue:false, 
        easing:"linear",
        complete: function() {
            if(imageIndex == elementCount) {
                $mainGallery.css({
                    right: startPosition+'px'
                    });
                currentPosition = $mainGallery.position();
                imageIndex = 0;
            } else if(goToEnd == true && imageIndex == elementCount-1) {
                $mainGallery.css({
                    right: endPosition+'px'
                    });
                currentPosition = $mainGallery.position();
            } else {
                currentPosition = $mainGallery.position();
            }
        }
    });

    if(imageIndex == elementCount) {
        newIndex = 1;
        goToEnd = false;
        goToStart = true;
    } else if(currentIndex == 0 && newIndex == -1) {
        goToEnd = true;
        goToStart = false;
        imageIndex = elementCount-1;
    } else {
        imageIndex = newIndex;
        goToStart = false;
        goToEnd = false;
    }
    
    $('li', $mainGallery).removeClass('selected')
    $('li:eq('+(newIndex+elementCount)+')', $mainGallery).addClass('selected');
    
    rotateTimeout = setTimeout(function() {
        $mainGallery.stop(true, true);
        moveGallery(currentPosition.left, imageIndex, imageIndex+1);
    }, waitTime);
}

function initBoxes() {
    boxIndex = 0;
    if($('.item .box').length > 1) {
        $('.item').append('<div class="box">'+$('.item .box:eq(0)').html()+'</div><div class="box">'+$('.item .box:eq(1)').html()+'</div>');
        boxCount = $('.item .box').length;
        boxHeight = $('.item .box:eq(0)').height();
        boxTimeout = setTimeout(function() {
            moveBoxes(0);
        }, boxWait);
    }
}

function moveBoxes(index) {
    boxIndex++;
    $('.gallery .item').animate({
        top: '-'+(index*boxHeight)+'px'
        }, 1000, "easeOutExpo", function(){
        if(index == boxCount-2){
            boxIndex = 1;
            $('.gallery .item').css({
                top: '0px'
            });
        }
    });
    boxTimeout = setTimeout(function() {
        $('.gallery .item').stop(true, true);
        moveBoxes(boxIndex);
    }, boxWait);
}