$(document).ready(function(){
	/* This code is executed after the DOM has been completely loaded */
	
	var totWidth=0;
	var positions = new Array();
	
	$('#slides .slide').each(function(i){
		
		/* Traverse through all the slides and store their accumulative widths in totWidth */
		
		positions[i]= totWidth;
		totWidth += $(this).width();
		
		/* The positions array contains each slide's commulutative offset from the left part of the container */
		
		if(!$(this).width())
		{
			alert("Please, fill in width & height for all your images!");
			return false;
		}
		
	});
	
	$('#slides').width(totWidth);

	/* Change the cotnainer div's width to the exact width of all the slides combined */

	$('#menu ul li a').click(function(e,keepScroll){

			/* On a thumbnail click */

			$('li.menuItem').removeClass('act').addClass('inact');
			$(this).parent().addClass('act');
			
			var pos = $(this).parent().prevAll('.menuItem').length;
			
			$('#slides').stop().animate({marginLeft:-positions[pos]+'px'},450);
			/* Start the sliding animation */
			
			e.preventDefault();
			/* Prevent the default action of the link */
			
			
			// Stopping the auto-advance if an icon has been clicked:
			if(!keepScroll) clearInterval(itvl);
	});

	$('#menu ul li.menuItem:first').addClass('act').siblings().addClass('inact');
	/* On page load, mark the first thumbnail as active */

    /* On a right side scrolling click */
    $('.gallery-scroll-right a').click(function(e,keepScroll){

            var pos;
            var current;
            var sideClicked = false;
            var minIndex = 0;
            // change this number if number of listed items changes
            var maxIndex = 6;

            //Changes the large gallery pic
            $('#menu ul li a').each(function(index) {

                currentElement = $(this).parent().attr('class');
                if(currentElement == 'menuItem inact act' || currentElement == 'menuItem act'){

                    currentIndex = $(this).attr('id');
                    $('li.menuItem').removeClass('act').addClass('inact');
                    var nextObjectId = parseInt($(this).attr('id')) + 1;

                    if(currentIndex == maxIndex){
                        $('#0').parent().addClass('act');
                        pos = -1;
                    } else {
                        $('#' + nextObjectId).parent().addClass('act');
                        pos = $(this).parent().prevAll('.menuItem').length;
                    }
                    
                    sideClicked = true;
                    
                }

                if(sideClicked){
                    return false;
                }
                
            })

			$('#slides').stop().animate({marginLeft:-positions[pos + 1]+'px'},450);
			/* Start the sliding animation */

			e.preventDefault();
			/* Prevent the default action of the link */


			// Stopping the auto-advance if an icon has been clicked:
			if(!keepScroll) clearInterval(itvl);
	});

    /* On a left side scrolling click */
    $('.gallery-scroll-left a').click(function(e,keepScroll){

            var pos;
            var current;
            var sideClicked = false;
            var minIndex = 0;
            // change this number if number of listed items changes
            var maxIndex = 6;

            //Changes the large gallery pic
            $('#menu ul li a').each(function(index) {

                currentElement = $(this).parent().attr('class');
                if(currentElement == 'menuItem inact act' || currentElement == 'menuItem act'){

                    currentIndex = $(this).attr('id');
                    $('li.menuItem').removeClass('act').addClass('inact');
                    var nextObjectId = parseInt($(this).attr('id')) - 1;

                    if(currentIndex == minIndex){
                        // change this number if number of listed items changes
                        $('#6').parent().addClass('act');
                        // change this number if number of listed items changes
                        pos = 6;
                    } else {
                        $('#' + nextObjectId).parent().addClass('act');
                        pos = $(this).parent().prevAll('.menuItem').length;
                    }

                    sideClicked = true;

                }

                if(sideClicked){
                    return false;
                }

            })

			$('#slides').stop().animate({marginLeft:-positions[pos - 1]+'px'},450);
			/* Start the sliding animation */

			e.preventDefault();
			/* Prevent the default action of the link */


			// Stopping the auto-advance if an icon has been clicked:
			if(!keepScroll) clearInterval(itvl);
	});

	
	
	/*****
	 *
	 *	Enabling auto-advance.
	 *
	 ****/
	 
	var current=1;
	function autoAdvance()
	{
		if(current==-1) return false;
		
		$('#menu ul li a').eq(current%$('#menu ul li a').length).trigger('click',[true]);	// [true] will be passed as the keepScroll parameter of the click function on line 28
		current++;
	}

	// The number of seconds that the slider will auto-advance in:
	
	var changeEvery = 20;

	var itvl = setInterval(function(){autoAdvance()},changeEvery*1000);

	/* End of customizations */
});