var id;
var left = 0;
var moving = false;
var move = -1;
var isShoutBox = false;
var galleryWidth = 0;
var temp;
var currentImageInShoutBox = 0;
var bName = navigator.appName;
var unloaded = 0;
var totalImages = 0;

function moveFunc(){
	$('.photo').each(function(){
		temp = (parseInt($(this).css('left')) + move) % galleryWidth;
        if (temp < 0) 
            temp += galleryWidth;
        $(this).css('left', temp);
    });
}

function nextImageFromGallery(num){
    if (currentImageInShoutBox) {
        var image = $('.gallery img').eq(num);
        if ((bName.indexOf("Microsoft", bName)) >= 0) 
            image = document.photo[num];
        var shift;
        if (currentImageInShoutBox > num) {
            shift = parseInt($(image).width() / 2);
            image = $(image).parent().next().find('img');
            shift += parseInt($(image).width() / 2);
            shift = -shift;
        }
        else {
            shift = parseInt($(image).width() / 2);
            image = $(image).parent().prev().find('img');
            shift += parseInt($(image).width() / 2);
        }

        currentImageInShoutBox = num;
        var imageFirst = $('.gallery img:first');
        var imageLast = $('.gallery img:last');
        $('.gallery img').each(function(j){
            $(this).animate({
                left: parseInt($(this).css('left')) - (shift+3)
            }, 300, null, function(){
                var leftShift = parseInt($(imageFirst).css('left'));
                $('.gallery img').each(function(i){
                    leftShift += 3;
                    left = leftShift;
                    $(this).css('left', left + 'px');
                    //if(i==0)
                    //    $(this).css('left', left + 3 + 'px');
                        //alert($(this).attr('src'))
                    leftShift += parseInt($(this).width());
                    leftShift = leftShift % galleryWidth;
                    if (leftShift < -200) 
                        leftShift += galleryWidth;
                });
                
                $(imageFirst).css('left', (parseInt($(imageLast).css('left')) + $(imageLast).width()) + 'px');
                if($('.gallery img').length-1 == j) {
                    //console.log(j + ' : ' + $(imageFirst).attr('src') + ' : ' +  ((parseInt($(imageLast).css('left')) + ($(imageLast).width()) + 3)));
                    $(imageFirst).css('left', (parseInt($(imageFirst).css('left'))) + 3 + 'px');
                }
            });
        });
        //console.log($('.gallery img').length);
    }
    else {
        currentImageInShoutBox = num;
    }
}


function setImages(){
    var leftShift = 0;
    var left = 0;
    var width = 0;
    
	$('.gallery').css('opacity', 0);
	$('.gallery img').each(function(i){
		galleryWidth += $(this).width();
	});
	var shift = galleryWidth/2 - ($('.gallery img:first').width()/2);
	
    $('.gallery img').each(function(i){
        width = $(this).width();
        leftShift += 3;
        left = leftShift;
        $(this).css('left', left + shift + 'px');
        leftShift += width;
    });
    galleryWidth = leftShift;
	$('.gallery').css('left', -(galleryWidth-980)/2);
	$('.gallery').css('width', galleryWidth);
	$('.loading').hide();
	$('.logoImage').css({top: 10, left: 760});
	$('.gallery').animate({
	   opacity: '1'
	}, 500);
	$('.menu').fadeIn(500);
	$('.lang-selector').fadeIn(500);
	//$('#main-content, #main-bg').css('visibility', 'visible');
	$('.bodyBgImage').show();
	//$('.logoImage').show();
}

function loaderStatus() {
	var stat = ((totalImages-unloaded)/totalImages)*100;
	if(stat >= 100) stat = 100;
	$('.load_status').css('width', stat + '%');
}

$(document).ready(function(){
	$('.gallery').css('opacity', 0);
	var bgImage = new Image();
	var logoImage = new Image();
	
	bgImage.src = '../img/bg_white.png';//$('.bodyBgImage').attr('src');
	logoImage.src = '../img/logo.jpg';
	
	if (startPage == 0) {
		if ($('.bodyBgImage').width()) {
			$('.bodyBgImage').show();
		}
		else {
			bgImage.onload = function(){
				$('.bodyBgImage').show();
			}
		}
	}
	
	//if (currentPage == 'about' || currentPage == 'contact' || (currentPage == 'architecture' && startPage == 1)) {
		if ($('.logoImage').width()) {
			$('.logoImage').show();
		}
		else {
			logoImage.onload = function(){
				$('.logoImage').show();
			}
		}
	//}
	
    unloaded = $('.gallery img').length;
    totalImages = unloaded;
    
    $('#main-content, #main-bg').css('marginTop', ($(document).height() - 592) / 2 + 'px');
    $('#main-bg').css('marginLeft', ($(document.body).width() - 972) / 2 + 'px');
	$('#main-content').css('marginLeft', ($(document.body).width() - 960) / 2 + 'px');
	
    $(window).resize(function(){
        $('#main-content, #main-bg').css('marginTop', ($(document).height() - 592) / 2 + 'px');
		$('#main-bg').css('marginLeft', ($(document.body).width() - 972) / 2 + 'px');
        $('#main-content').css('marginLeft', ($(document.body).width() - 960) / 2 + 'px');
		
    });
    
    $('.gallery').mousemove(function(e){
        move = 0;
        
        var xcoords = e.clientX - $('#main-content').offset().left;
        if (xcoords > 480) {
            if (xcoords > 800) 
                move = -4;
            if (xcoords < 800 && xcoords > 650) 
                move = -3;
            if (xcoords < 650 && xcoords > 540) 
                move = -2;
        }
        else {
            if (xcoords > 300 && xcoords < 420) 
                move = 2;
            if (xcoords > 150 && xcoords < 300) 
                move = 3;
            if (xcoords < 150) 
                move = 4;
        }
    });
    
    if (!((bName.indexOf("Microsoft", bName)) >= 0  || (bName.indexOf("Opera", bName)) >= 0 )) {
		$('.gallery img').each(function(i){
			if ($(this).width()) {
				unloaded -= 1;
				loaderStatus();
			}
		});
	}
	
    if (unloaded < 1) {
        setImages();
    }
    
    var primaryWidth = 0;
    var primaryHeight = 0;
    $('.gallery img').click(function(){
        if (!isShoutBox) {
            clearInterval(id);
            isShoutBox = true;
            var shift = parseInt($(this).offset().left) - ($(document.body).width() / 2) + ($(this).width() / 2);
            var imageFirst = $('.gallery img:first');
            var imageLast = $('.gallery img:last');
            $('.gallery img').each(function(j){
                $(this).animate({
                    left: parseInt($(this).css('left')) - shift
                }, 700, function(){
                    var leftShift = parseInt($(imageFirst).css('left'));
                    $('.gallery img').each(function(){
                        leftShift += 3;
                        left = leftShift;
                        $(this).css('left', left);
                        leftShift += parseInt($(this).width());
                        leftShift = leftShift % galleryWidth;
                        if (leftShift < 0) 
                            leftShift += galleryWidth;
                        $(imageFirst).css('left', (parseInt($(imageLast).css('left')) + $(imageLast).width() + 'px'));
                        if($('.gallery img').length-1 == j) {
                            //console.log(j + ' : ' + $(imageFirst).attr('src') + ' : ' +  ((parseInt($(imageLast).css('left')) + ($(imageLast).width()) + 3)));
                            $(imageFirst).css('left', (parseInt($(imageFirst).css('left'))) + 3 + 'px');
                        }
                    });
                });
            });
        }
        else {
            isShoutBox = false;
        }
    });
	if(unloaded > 0) {
        var unloadedInterval = setInterval(function(){
            //console.log(unloaded)
            if(unloaded < 1) {
                clearInterval(id);
                id = setInterval(function(){
                    moveFunc()
                }, 30);
                clearInterval(unloadedInterval);
            }
            //alert(unloaded);
        }, 100);
    } 
    /*
    else {
        id = setInterval(function(){
            moveFunc()
        }, 30);
    }
	*/
    $('.gallery').mouseover(function(){
		clearInterval(id);
        if (!moving && !isShoutBox) {
            id = setInterval(function(){
                moveFunc()
            }, 30);
        }
        moving = true;
    });
    $('.gallery').mouseout(function(){
        moving = false;
        clearInterval(id);
    });
    
	
    $('.menu a').mouseover(function(){
        $(this).animate({
            opacity: '0.5'
        }, 300);
    });
    $('.menu a').mouseout(function(){
        $(this).animate({
            opacity: '1.0'
        }, 300);
    });
    
    
    //if (unloaded) {
    //    alert(unloaded);
    //}
    /*
    
    
    /*
    setTimeout(function(){
    	id = setInterval(function(){
            moveFunc()
        }, 30);
        
    }, 900);
    */
    
    
    //$('.gallery').mouseover();
});