$(document).ready(function() {



	//> DEFAULT SETTINGS:
	var vid = 'alfa-b1-image'; //> DEFAULT ACTIVE IMAGE.
	var bid = 'alfa-b1';       //> DEFAULT ACTIVE BUTTON.
	var loop_init = 0;         //> DELAY LOOP FOR 5 SECONDS WHEN INITIALIZE.
	var lock = 0;              //> LOCK THE LOOP FUNCTION WHEN BUTTON IS CLICKED.
	var unclickable = 0;       //> MAKE BUTTONS UNCLICKABLE OR CLICKABLE.



	//> WINDOW RESIZE FUNCTION:
	function resize_divs() {

		var xscale = $(window).width();
		var yscale = $(window).height();
	
		$('.image-divs').css({ 'width': xscale + 'px', 'height': yscale + 'px' });
		
	}



	function loop_slides() {
	
		if(lock == 0) {

	
			if(loop_init == 1) {
				
				unclickable = 1;
				
				if(vid == 'alfa-b1-image') {
					
					$('#alfa-b1-image').fadeOut(700, function() {
						$('#alfa-b2-image').fadeIn(700);
						unclickable = 0;
					});								
					
					$('#alfa-b2').attr('src', 'images/dot-alfa-active.png');					
					$('#' + bid).attr('src', 'images/dot-not-active.png');	
	
					bid = 'alfa-b2';
					vid = 'alfa-b2-image';
									
				} else if(vid == 'alfa-b2-image') {
					
					$('#alfa-b2-image').fadeOut(700, function() {
						$('#alfa-b3-image').fadeIn(700);
						unclickable = 0;
					});									
					
					$('#alfa-b3').attr('src', 'images/dot-alfa-active.png');					
					$('#' + bid).attr('src', 'images/dot-not-active.png');	
	
					bid = 'alfa-b3';
					vid = 'alfa-b3-image';	
				
				} else if(vid == 'alfa-b3-image') {
					$('#alfa-b3-image').fadeOut(700, function() {
						$('#alfa-b4-image').fadeIn(700);		
						unclickable = 0;
					});					
	
					$('#alfa-b4').attr('src', 'images/dot-alfa-active.png');					
					$('#' + bid).attr('src', 'images/dot-not-active.png');	
	
					bid = 'alfa-b4';				
					vid = 'alfa-b4-image';	
				} else if(vid == 'alfa-b4-image') {
					$('#alfa-b4-image').fadeOut(700, function() {
						$('#vesp-b1-image').fadeIn(700);	
						unclickable = 0;
					});					
	
					$('#vesp-b1').attr('src', 'images/dot-vespa-active.png');					
					$('#' + bid).attr('src', 'images/dot-not-active.png');	
	
					bid = 'vesp-b1';				
					vid = 'vesp-b1-image';	
				} else if(vid == 'vesp-b1-image') {
					$('#vesp-b1-image').fadeOut(700, function() {
						$('#vesp-b2-image').fadeIn(700);	
						unclickable = 0;
					});					
	
					$('#vesp-b2').attr('src', 'images/dot-vespa-active.png');					
					$('#' + bid).attr('src', 'images/dot-not-active.png');	
	
					bid = 'vesp-b2';				
					vid = 'vesp-b2-image';	
				} else if(vid == 'vesp-b2-image') {
					$('#vesp-b2-image').fadeOut(700, function() {
						$('#vesp-b3-image').fadeIn(700);
						unclickable = 0;
					});					
	
					$('#vesp-b3').attr('src', 'images/dot-vespa-active.png');					
					$('#' + bid).attr('src', 'images/dot-not-active.png');	
	
					bid = 'vesp-b3';				
					vid = 'vesp-b3-image';	
				} else if(vid == 'vesp-b3-image') {
					$('#vesp-b3-image').fadeOut(700, function() {
						$('#vesp-b4-image').fadeIn(700);	
						unclickable = 0;
					});					
	
					$('#vesp-b4').attr('src', 'images/dot-vespa-active.png');					
					$('#' + bid).attr('src', 'images/dot-not-active.png');	
	
					bid = 'vesp-b4';				
					vid = 'vesp-b4-image';	
				} else if(vid == 'vesp-b4-image') {
					$('#vesp-b4-image').fadeOut(700, function() {
						$('#fiat-b1-image').fadeIn(700);
						unclickable = 0;
					});					
	
					$('#fiat-b1').attr('src', 'images/dot-fiat-active.png');					
					$('#' + bid).attr('src', 'images/dot-not-active.png');	
	
					bid = 'fiat-b1';				
					vid = 'fiat-b1-image';	
				} else if(vid == 'fiat-b1-image') {
					$('#fiat-b1-image').fadeOut(700, function() {
						$('#fiat-b2-image').fadeIn(700);
						unclickable = 0;
					});					
	
					$('#fiat-b2').attr('src', 'images/dot-fiat-active.png');					
					$('#' + bid).attr('src', 'images/dot-not-active.png');	
	
					bid = 'fiat-b2';				
					vid = 'fiat-b2-image';	
				} else if(vid == 'fiat-b2-image') {
					$('#fiat-b2-image').fadeOut(700, function() {
						$('#fiat-b3-image').fadeIn(700);
						unclickable = 0;
					});					
	
					$('#fiat-b3').attr('src', 'images/dot-fiat-active.png');					
					$('#' + bid).attr('src', 'images/dot-not-active.png');	
	
					bid = 'fiat-b3';				
					vid = 'fiat-b3-image';	
				} else if(vid == 'fiat-b3-image') {
					$('#fiat-b3-image').fadeOut(700, function() {
						$('#fiat-b4-image').fadeIn(700);
						unclickable = 0;
					});					
	
					$('#fiat-b4').attr('src', 'images/dot-fiat-active.png');					
					$('#' + bid).attr('src', 'images/dot-not-active.png');	
	
					bid = 'fiat-b4';				
					vid = 'fiat-b4-image';	
				} else if(vid == 'fiat-b4-image') {
					$('#fiat-b4-image').fadeOut(700, function() {
						$('#alfa-b1-image').fadeIn(700);
						unclickable = 0;
					});					
	
					$('#alfa-b1').attr('src', 'images/dot-alfa-active.png');					
					$('#' + bid).attr('src', 'images/dot-not-active.png');	
	
					bid = 'alfa-b1';				
					vid = 'alfa-b1-image';	
				}
			}
		
			loop_init = 1;

		}

		lock = 0;

		setTimeout(function() {
			loop_slides();
		}, 5000);						
		
	}
	
	

	//> INITIALIZE FUNCTIONS:
	resize_divs();			
	$(window).resize(function() { resize_divs(); });
	$('#alfa-b1').attr('src', 'images/dot-alfa-active.png');		
	loop_slides(); //> LOOP START.



	$('.circle').click(function() {

		if(unclickable == 0) {

			lock = 1;        //> STOP THE LOOP BECAUSE A BUTTON IS CLICKED.
			unclickable = 1; //> MAKE BUTTONS UNCLICKABLE AS LONG THE ANIMATION IS IN PROCESS.
		
			var eid = this.id;
			
			//> FADEIN AND FADEOUT CODE:
			$('#' + vid).fadeOut(700, function() {
				$('#' + eid + '-image').fadeIn(700);
				//> ANIMATION COMPLETED.
				unclickable = 0; //> MAKE BUTTONS CLICKABLE NOW.
			});				
	
			$('#' + bid).attr('src', 'images/dot-not-active.png'); //> SET THE PREVIOUS BUTTON TO INACTIVE.
			
			if(eid == 'alfa-b1' || eid == 'alfa-b2' || eid == 'alfa-b3' || eid == 'alfa-b4') {
				$(this).attr('src', 'images/dot-alfa-active.png');		
			} else if(eid == 'vesp-b1' || eid == 'vesp-b2' || eid == 'vesp-b3' || eid == 'vesp-b4') {
				$(this).attr('src', 'images/dot-vespa-active.png');
			} else if(eid == 'fiat-b1' || eid == 'fiat-b2' || eid == 'fiat-b3' || eid == 'fiat-b4') {
				$(this).attr('src', 'images/dot-fiat-active.png');
			}
	
			//> SET CURRENT ACTIVE IMAGE AND ACTIVE BUTTON:
			bid = eid
			vid = eid + '-image';	
			
		}
		
	});
	
	
	
});