/* JavaScript Document */

var marqueeVars = {
	screenSize : '',
	width : 0,
	mobileSize : 600,
	autoPlay : true,
	currentPanel : 1,
	totalPanels : 0,
	timePassed : 0,
	timeToChange : 2,
	duration : 1250,
	inTransition : false,
	oldPanel : 0,
	navClicked : 0,
	coolClick : 0,
	panelDirection : true,
	panelContent : Array
	
};

$(document).ready(function(){
	marqueeGatherData();
	
});

function marqueeGatherData(){
	$('.marquee_data .marquee_panel').each(function(index){
		marqueeVars.totalPanels = index + 1;
		var panel_image_l = $(this).attr('data-image')+'_l.png';
		var panel_image_s = $(this).attr('data-image')+'_s.png';
		var panel_caption = $(this).html();
		marqueeVars.panelContent[index] = '<div class="marquee_panel" data-image-s="'+panel_image_s+'" style="background-image: url('+panel_image_l+');"><div class="overlay"></div><div class= "panel_caption">'+panel_caption+'</div></div>';
		//alert(panel_image_s);
	});
	var marqueeTimer = setInterval(marqueeAdvance, 1000);
}

function marqueeAdvance(){
	var marqueeWidth = $('.marquee').width();
	var currentSize = marqueeVars.screenSize;
	if( marqueeWidth > marqueeVars.mobileSize ){
		var newSize = 'large';
	} else {
		var newSize = 'small';
	}
	marqueeVars.screenSize = newSize;
	
	if( currentSize != newSize ){
		if( marqueeVars.screenSize == 'large' ){
			marqueeMultiPanel();
		} else {
			marqueeSinglePanel();
		}
	}
	
	if( marqueeVars.timePassed == marqueeVars.timeToChange ){
		marqueeVars.timePassed = 0;
		
		if( marqueeVars.autoPlay == true ){
			if( marqueeVars.currentPanel == marqueeVars.totalPanels ){
				$('.marquee_nav div:nth-child(1)').trigger('click');
			} else {
				$('.marquee_nav div:nth-child('+(marqueeVars.currentPanel+1)+')').trigger('click');
			}
		}
		
		
	} else {
		marqueeVars.timePassed += 1;
	}


}

function marqueeMultiPanel(){
	marqueeVars.timePassed = 0;
	marqueeVars.autoPlay = true;
	var newHTML = '<div class="marquee_stage_large"><div class="marquee_container_1 marquee_spos1"></div><div class="marquee_nav"></div><div class="btn prev"></div><div class="btn next"></div></div>';
	$('.marquee').html('').append(newHTML);
	
	for( i=0; i<marqueeVars.totalPanels; i++ ){
		$('.marquee_nav').append('<div id="'+(Number(i)+1)+'"></div>');
	}
	
	$('.marquee').hover(function(){
		marqueeVars.autoPlay = false;
	},function(){
		marqueeVars.autoPlay = true;
		marqueeVars.timePassed = Math.floor(marqueeVars.timeToChange / 3);
		
	});
	
	$('.marquee .btn').on('click', function(){
		
		if( !marqueeVars.inTransition ){
			
			if( $(this).hasClass('next') && marqueeVars.currentPanel == marqueeVars.totalPanels ){
				marqueeVars.currentPanel = 1;
				marqueeVars.panelDirection = true;
			} else if ($(this).hasClass('next') && marqueeVars.currentPanel != marqueeVars.totalPanels ){
				marqueeVars.currentPanel += 1;
				marqueeVars.panelDirection = true;
			} else if ($(this).hasClass('prev') && marqueeVars.currentPanel == 1 ){
				marqueeVars.currentPanel = marqueeVars.totalPanels;
				marqueeVars.panelDirection = false;
			} else {
				marqueeVars.currentPanel -= 1;
				marqueeVars.panelDirection = false;
			}
			
			
			$('.marquee_nav div:nth-child('+marqueeVars.currentPanel+')').trigger('click');
		}	
		
	});
	
	
	$('.marquee_nav div').on('click', function(){
		
		
		if( !marqueeVars.inTransition  ){
			
			
			$('.marquee_nav div').click(function(e) {
			  //e.stopPropagation();
			  marqueeVars.coolClick = Number(e.currentTarget.id);
			 
			  //console.log(marqueeVars.navClicked);
			  //console.log(marqueeVars.coolClick);
			  
			});				
					
			
			marqueeVars.oldPanel = marqueeVars.currentPanel;
		

			marqueeVars.inTransition = true;
			
			marqueeVars.navClicked = $(this).index();
			marqueeVars.currentPanel = marqueeVars.navClicked + 1;

			marqueeAnimate( marqueeVars.navClicked, marqueeVars.coolClick );
			
			
			$('.marquee_nav div').removeClass('selected');
			$(this).removeClass('old');
			$(this).addClass('selected');
			

			


			
			
			$(this).addClass('old');
		}		
	});
	
	$('.marquee_nav div:first').trigger('click');
}

function marqueeSinglePanel(){
	$('.marquee').html('').append('<div class="marquee_stage_small">'+marqueeVars.panelContent[0]+'</div>');
	var panel_image_s = $('.marquee .marquee_stage_small .marquee_panel').attr('data-image-s');
	$('.marquee .marquee_stage_small .marquee_panel').css('background-image', 'url('+panel_image_s+')');
}

function marqueeAnimate(cclick, ppanel){
	
			if (  marqueeVars.autoPlay == true  ||  marqueeVars.panelDirection ) {
				
				//console.log(marqueeVars.coolClick);

				$('.marquee_stage_large').append('<div class="marquee_container_2 marquee_spos3"></div>');		

				$('.marquee_container_1').animate({left:-1100},marqueeVars.duration);
				$('.marquee_container_2').html(marqueeVars.panelContent[marqueeVars.navClicked]).animate({left:0},marqueeVars.duration,function(){
					$('.marquee_container_1').remove();
					$(this).addClass('marquee_container_1').removeClass('marquee_container_2');
					marqueeVars.inTransition = false;
				});	
			
			} else if ( (cclick + 1) < ppanel && marqueeVars.autoPlay == false || !marqueeVars.panelDirection ) {
				
				$('.marquee_container_1').removeClass('marquee_spos1').addClass('marquee_spos2');
				$('.marquee_stage_large').append('<div class="marquee_container_2 marquee_spos1"></div>');
				
				$('.marquee_container_1').animate({left:1100},marqueeVars.duration);
				$('.marquee_container_2').html(marqueeVars.panelContent[marqueeVars.navClicked]).animate({left:0},marqueeVars.duration,function(){
					$('.marquee_container_1').remove();
					$(this).addClass('marquee_container_1').removeClass('marquee_container_2');
					marqueeVars.inTransition = false;
				});	
				
			} else if ( (cclick + 1) == ppanel ) {


				$('.marquee_container_2').html(marqueeVars.panelContent[marqueeVars.navClicked]);
					$(this).addClass('marquee_container_1').removeClass('marquee_container_2');
					marqueeVars.inTransition = false;
										
				
			} else {
				
				$('.marquee_stage_large').append('<div class="marquee_container_2 marquee_spos3"></div>');		

				$('.marquee_container_1').animate({left:-1100},marqueeVars.duration);
				$('.marquee_container_2').html(marqueeVars.panelContent[marqueeVars.navClicked]).animate({left:0},marqueeVars.duration,function(){
					$('.marquee_container_1').remove();
					$(this).addClass('marquee_container_1').removeClass('marquee_container_2');
					marqueeVars.inTransition = false;
				});	
			}
}



//debugger
var debugTimer = setInterval(setDebugger,100);
function setDebugger(){
	$('.var1').html('screenSize = '+marqueeVars.screenSize);
	$('.var2').html('width = '+marqueeVars.width);
	$('.var3').html('mobileSize = '+marqueeVars.mobileSize);
	$('.var4').html('autoPlay = '+marqueeVars.autoPlay);
	$('.var5').html('currentPanel = '+marqueeVars.currentPanel);
	$('.var6').html('totalPanels = '+marqueeVars.totalPanels);
	$('.var7').html('timePassed = '+marqueeVars.timePassed);
	$('.var8').html('timeToChange = '+marqueeVars.timeToChange);
	$('.var9').html('inTransition = '+marqueeVars.inTransition); 
	$('.var10').html('panel comparare = '+marqueeVars.panelCompare); 
	$('.var11').html('old panel = '+marqueeVars.oldPanel); 
	$('.var12').html('cool click = '+marqueeVars.coolClick); 
}

