//Variables
var totalw2 = 0;
var totalc2 = 0;
var picw2 = 0;
var totalw = 0;
var totalc = 0;
var picw = 0;
var picp = 0;
var animationSpeed = 1000;

//Run On Load
$(document).ready(function() {
	//Show Controls
	$('#noJsFallback').css('display','none');
	$('#picPrev').css('display','block');
	$('#picNext').css('display','block');
	//Assign Events
	$('#picPrev').click(function(){picPrev(); return false;});
	$('#picNext').click(function(){picNext(); return false;});		
	//Set Pic Holder Width 
    $('#picHolder img').each(function() {
		$('#picLiftHolder').html($('#picLiftHolder').html()+'<div class="picLiftInstance" id="picSpecs'+totalc+'"><div class="isActive"></div><h2>'+$(this).attr('title')+'</h2><p>'+$(this).attr('alt')+'</p></div>');
        totalw = totalw + parseInt($(this).width());
		totalc = totalc + 1;
		picw = parseInt($(this).width());
    });
    $('#picHolder').css('width', totalw+'px');
	//Set Specs Holder Width 
    $('#picLiftHolder .picLiftInstance').each(function() {
        totalw2 = totalw2 + parseInt($(this).width());
		totalc2 = totalc2 + 1;
		picw2 = parseInt($(this).width());
    });
    $('#picLiftHolder').css('width', totalw+'px');
    

//karuselli

$(".carousel").carousel( {         
    autoSlide: true,
    autoSlideInterval: 5000
 } );
   
    
    
    
});

//Go To The Previous Image
function picPrev() {
	var h = $('#picHolder');
	var h2 = $('#picLiftHolder');	
	if ((picw*picp) > 0) {
		$('.isActive').fadeOut(animationSpeed);	
		picp = picp - 1;
		h.animate({left:-(picw*picp)},animationSpeed);
		h2.animate({left:-(picw2*picp)},animationSpeed);		
		$('#picSpecs'+picp+' .isActive').fadeIn(animationSpeed);		
	}	
}

//Go To The Next Image
function picNext() {
	var h = $('#picHolder');
	var h2 = $('#picLiftHolder');
	if ((picw*picp) < (totalw-picw)) {
		$('.isActive').fadeOut(animationSpeed);
		picp = picp + 1;
		h.animate({left:-(picw*picp)},animationSpeed);
		h2.animate({left:-(picw2*picp)},animationSpeed);		
		$('#picSpecs'+picp+' .isActive').fadeIn(animationSpeed);
	}
}