// Define default section:
var vsActualSection = 'vsBrand'; // Options: vsBrand, vsBodyStyle, vsSpecialtyVehicle

// Define Animations:
var useFadeAnimations = true; // Options: true, false
if ( $.browser.msie ) {
  if ( $.browser.version == "7.0" || $.browser.version == "8.0" ) useFadeAnimations = false;
}

// Menu & Section Status:
var vsMenuStatus = 'close';
var vsSectionStatus = 'close';
var vsMenuReadyHeight = true;
var vsMenuReadyHeight2 = true;
var vsMenuReadyWidth1 = true;
var vsMenuReadyWidth2 = true;

// Default status for sections animation:
var vsBrand1Animation = false;
var vsBrand2Animation = false;
var vsBrand3Animation = false;
var vsBrand4Animation = false;
var vsBodyStyle1Animation = false;
var vsBodyStyle2Animation = false;
var vsBodyStyle3Animation = false;
var vsBodyStyle4Animation = false;
var vsHideMenuAnimation = false;
var vsHideSectionAnimation = false;

// When DOM ready:
$().ready(function(){
	
	// Fix for content layout:
	$('#vsSpecialtyVehicle').css('height','27px');
	
	// Main menu:
	$('.menu > ul > li > a').click(function(){
		if (vsMenuReadyHeight && vsMenuReadyHeight2 && vsMenuReadyWidth1 && vsMenuReadyWidth2) {
			if (vsMenuStatus == 'close') {
				vsShowMenu($(this).parent().attr('id'));
			}else {
				if (vsSectionStatus == 'open' && $(this).parent().attr('id') == vsActualSection) {
					
					vsHideSection($(this).parent().attr('id'));
				}else {
					
					vsShowSection($(this).parent().attr('id'));
				}
			}
		}
	});
	
	// Arrow/Close button:
	$('.button').click(function(){
		if (vsMenuReadyHeight && vsMenuReadyHeight2 && vsMenuReadyWidth1 && vsMenuReadyWidth2) {
			if ($(this).hasClass('close')) {
				vsSectionStatus = "open";
				vsHideMenu(vsActualSection);
			}else {
				vsShowMenu(vsActualSection);
			}
		}
	});
	
	// X button:
	$('#closeX').click(function(){
		vsSectionStatus = "open";
		vsHideMenu(vsActualSection);
	});
	
	// Hide menu when mouse leave:
	$('#vehicleShowroom').mouseleave(function(){
		if ( vsMenuStatus != 'close' ) {
			vsHideSectionAnimation = false;
			vsSectionStatus = "open";
			vsHideMenu(vsActualSection);
			// console.log ("vsMenuStatus: " +vsMenuStatus);
		}
		
	});
	
	// Hover for Brand:
	$('#vsBrand li[rel=1],#vsBrand li[rel=2],#vsBrand li[rel=3],#vsBrand li[rel=4]').hover(function(){
		if (useFadeAnimations) {
			$('#vsBrand li:not([rel='+$(this).attr('rel')+']) > img.imgUp').fadeOut('normal');
			$('#vsBrand li:not([rel='+$(this).attr('rel')+']) > img.imgDown').fadeIn('normal');
			$('#vsBrand li[rel='+$(this).attr('rel')+'] > img.imgUp').fadeIn('normal');
			$('#vsBrand li[rel='+$(this).attr('rel')+'] > img.imgDown').fadeOut('normal');
		}else {
			$('#vsBrand li:not([rel='+$(this).attr('rel')+']) > img.imgUp').hide();
			$('#vsBrand li:not([rel='+$(this).attr('rel')+']) > img.imgDown').show();
			$('#vsBrand li[rel='+$(this).attr('rel')+'] > img.imgUp').show();
			$('#vsBrand li[rel='+$(this).attr('rel')+'] > img.imgDown').hide();
		}
		
		switch($(this).attr('rel')){
			case "1":
				if (!vsBrand1Animation) {
					vsHideInfo();
		
					vsBrand1Animation = true;
					$('#vsBrand li[rel="1"]').animate({
						left: '3px'
					}, 500, function(){
						vsBrand1Animation = false;
					});
					$('#vsBrand li[rel="2"]').animate({
						left: '298px'
					}, 500);
					$('#vsBrand li[rel="3"]').animate({
						left: '429px'
					}, 500);
					$('#vsBrand li[rel="4"]').animate({
						left: '575px'
					}, 500);
					
					if (useFadeAnimations) {
						$('#vsBrand li[rel="1"] ol li').fadeIn('fast');
					}else {
						$('#vsBrand li[rel="1"] ol li').show();
					}
				}
				break;
			case "2":
				if (!vsBrand2Animation) {
					vsHideInfo();
					
					vsBrand2Animation = true;
					$('#vsBrand li[rel="1"]').animate({
						left: '3px'
					}, 500);
					$('#vsBrand li[rel="2"]').animate({
						left: '126px'
					}, 500, function(){
						vsBrand2Animation = false;
					});
					$('#vsBrand li[rel="3"]').animate({
						left: '429px'
					}, 500);
					$('#vsBrand li[rel="4"]').animate({
						left: '575px'
					}, 500);
					
					if (useFadeAnimations) {
						$('#vsBrand li[rel="2"] ol li').fadeIn('slow');
					}else {
						$('#vsBrand li[rel="2"] ol li').show();
					}
				}
				break;
			case "3":
				if (!vsBrand3Animation) {
					vsHideInfo();
					
					vsBrand3Animation = true;
					$('#vsBrand li[rel="1"]').animate({
						left: '3px'
					}, 500);
					$('#vsBrand li[rel="2"]').animate({
						left: '126px'
					}, 500);
					$('#vsBrand li[rel="3"]').animate({
						left: '257px'
					}, 500, function(){
						vsBrand3Animation = false;
					});
					$('#vsBrand li[rel="4"]').animate({
						left: '575px'
					}, 500);
					
					if (useFadeAnimations) {
						$('#vsBrand li[rel="3"] ol li').fadeIn('slow');
					}else {
						$('#vsBrand li[rel="3"] ol li').show();
					}
				}
				break;
			case "4":
				if (!vsBrand4Animation) {
					vsHideInfo();
					
					vsBrand4Animation = true;
					$('#vsBrand li[rel="1"]').animate({
						left: '3px'
					}, 500);
					$('#vsBrand li[rel="2"]').animate({
						left: '126px'
					}, 500);
					$('#vsBrand li[rel="3"]').animate({
						left: '257px'
					}, 500);
					$('#vsBrand li[rel="4"]').animate({
						left: '405px'
					}, 500, function(){
						vsBrand4Animation = false;
					});
					
					if (useFadeAnimations) {
						$('#vsBrand li[rel="4"] ol li').fadeIn('slow');
					}else {
						$('#vsBrand li[rel="4"] ol li').show();
					}
				}
				break;
		}
	},function(){
		
	});
	
	// Mouse leave for Brand:
	$('#vsBrand #typeMenu > ul').mouseleave(function(){
		vsHideInfo();
		if (useFadeAnimations) {
			$('#vsBrand li[rel] > img.imgDown').fadeOut('normal');
			$('#vsBrand li[rel] > img.imgUp').fadeIn('normal');
		}else {
			$('#vsBrand li[rel] > img.imgDown').hide();
			$('#vsBrand li[rel] > img.imgUp').show();
		}
		$('#vsBrand li[rel="1"]').animate({
			left: '34px'
		}, 500, function(){
			
		});
		$('#vsBrand li[rel="2"]').animate({
			left: '196px'
		}, 500);
		$('#vsBrand li[rel="3"]').animate({
			left: '366px'
		}, 500);
		$('#vsBrand li[rel="4"]').animate({
			left: '550px'
		}, 500);
	});
	
	// Hover for Body Style:
	$('#vsBodyStyle li[rel=1],#vsBodyStyle li[rel=2],#vsBodyStyle li[rel=3],#vsBodyStyle li[rel=4]').hover(function(){
		if (useFadeAnimations) {
			$('#vsBodyStyle li:not([rel='+$(this).attr('rel')+']) > img.imgUp').fadeOut('normal');
			$('#vsBodyStyle li:not([rel='+$(this).attr('rel')+']) > img.imgDown').fadeIn('normal');
			$('#vsBodyStyle li[rel='+$(this).attr('rel')+'] > img.imgUp').fadeIn('normal');
			$('#vsBodyStyle li[rel='+$(this).attr('rel')+'] > img.imgDown').fadeOut('normal');
		}else {
			$('#vsBodyStyle li:not([rel='+$(this).attr('rel')+']) > img.imgUp').hide();
			$('#vsBodyStyle li:not([rel='+$(this).attr('rel')+']) > img.imgDown').show();
			$('#vsBodyStyle li[rel='+$(this).attr('rel')+'] > img.imgUp').show();
			$('#vsBodyStyle li[rel='+$(this).attr('rel')+'] > img.imgDown').hide();
		}
		
		switch($(this).attr('rel')){
			case "1":
				if (!vsBodyStyle1Animation) {
					vsHideInfo();
		
					vsBodyStyle1Animation = true;
					$('#vsBodyStyle li[rel="1"]').animate({
						left: '0px'
					}, 500, function(){
						vsBodyStyle1Animation = false;
					});
					$('#vsBodyStyle li[rel="2"]').animate({
						left: '319px'
					}, 500);
					$('#vsBodyStyle li[rel="3"]').animate({
						left: '466px'
					}, 500);
					$('#vsBodyStyle li[rel="4"]').animate({
						left: '594px'
					}, 500);
					
					if (useFadeAnimations) {
						$('#vsBodyStyle li[rel="1"] ol li').fadeIn('slow');
					}else {
						$('#vsBodyStyle li[rel="1"] ol li').show();
					}
				}
				break;
			case "2":
				if (!vsBodyStyle2Animation) {
					vsHideInfo();
					
					vsBodyStyle2Animation = true;
					$('#vsBodyStyle li[rel="1"]').animate({
						left: '0px'
					}, 500);
					$('#vsBodyStyle li[rel="2"]').animate({
						left: '144px'
					}, 500, function(){
						vsBodyStyle2Animation = false;
					});
					$('#vsBodyStyle li[rel="3"]').animate({
						left: '466px'
					}, 500);
					$('#vsBodyStyle li[rel="4"]').animate({
						left: '594px'
					}, 500);
					
					if (useFadeAnimations) {
						$('#vsBodyStyle li[rel="2"] ol li').fadeIn('slow');
					}else {
						$('#vsBodyStyle li[rel="2"] ol li').show();
					}
				}
				break;
			case "3":
				if (!vsBodyStyle3Animation) {
					vsHideInfo();
					
					vsBodyStyle3Animation = true;
					$('#vsBodyStyle li[rel="1"]').animate({
						left: '0px'
					}, 500);
					$('#vsBodyStyle li[rel="2"]').animate({
						left: '144px'
					}, 500);
					$('#vsBodyStyle li[rel="3"]').animate({
						left: '291px'
					}, 500, function(){
						vsBodyStyle3Animation = false;
					});
					$('#vsBodyStyle li[rel="4"]').animate({
						left: '594px'
					}, 500);
					
					if (useFadeAnimations) {
						$('#vsBodyStyle li[rel="3"] ol li').fadeIn('slow');
					}else {
						$('#vsBodyStyle li[rel="3"] ol li').show();
					}
				}
				break;
			case "4":
				if (!vsBodyStyle1Animation) {
					vsHideInfo();
					
					vsBodyStyle4Animation = true;
					$('#vsBodyStyle li[rel="1"]').animate({
						left: '0px'
					}, 500);
					$('#vsBodyStyle li[rel="2"]').animate({
						left: '144px'
					}, 500);
					$('#vsBodyStyle li[rel="3"]').animate({
						left: '291px'
					}, 500);
					$('#vsBodyStyle li[rel="4"]').animate({
						left: '419px'
					}, 500, function(){
						vsBodyStyle4Animation = false;
					});
					
					if (useFadeAnimations) {
						$('#vsBodyStyle li[rel="4"] ol li').fadeIn('slow');
					}else {
						$('#vsBodyStyle li[rel="4"] ol li').show();
					}
				}
				break;
		}
	},function(){
		
	});
	
	// Mouse leave for Body Style:
	$('#vsBodyStyle #typeMenu > ul').mouseleave(function(){
		vsHideInfo();
		if (useFadeAnimations) {
			$('#vsBodyStyle li[rel] > img.imgUp').fadeIn('normal');
			$('#vsBodyStyle li[rel] > img.imgDown').fadeOut('normal');
		}else {
			$('#vsBodyStyle li[rel] > img.imgUp').show();
			$('#vsBodyStyle li[rel] > img.imgDown').hide();
		}
		$('#vsBodyStyle li[rel="1"]').animate({
			left: '35px'
		}, 500, function(){
			
		});
		$('#vsBodyStyle li[rel="2"]').animate({
			left: '216px'
		}, 500);
		$('#vsBodyStyle li[rel="3"]').animate({
			left: '401px'
		}, 500);
		$('#vsBodyStyle li[rel="4"]').animate({
			left: '565px'
		}, 500);
	});
	
	// Hover for Specialty Vehicle:
	$('#typeSpeciality li').hover(function(){
		if (useFadeAnimations) {
			$('#typeSpeciality li:not([rel='+$(this).attr('rel')+']) img.imgUp').fadeOut('normal');
			$('#typeSpeciality li:not([rel='+$(this).attr('rel')+']) img.imgDown').fadeIn('normal');
			$('#typeSpeciality li[rel='+$(this).attr('rel')+'] img.imgUp').fadeIn('normal');
			$('#typeSpeciality li[rel='+$(this).attr('rel')+'] img.imgDown').fadeOut('normal');
		}else {
			$('#typeSpeciality li:not([rel='+$(this).attr('rel')+']) img.imgUp').hide();
			$('#typeSpeciality li:not([rel='+$(this).attr('rel')+']) img.imgDown').show();
			$('#typeSpeciality li[rel='+$(this).attr('rel')+'] img.imgUp').show();
			$('#typeSpeciality li[rel='+$(this).attr('rel')+'] img.imgDown').hide();
		}
	},function(){
		
	});
	
	// Mouse leave for Specialty Vehicle:
	$('#typeSpeciality').mouseleave(function(){
		if (useFadeAnimations) {
			$('#typeSpeciality li img.imgUp').fadeIn('normal');
			$('#typeSpeciality li img.imgDown').fadeOut('normal');
		}else {
			$('#typeSpeciality li img.imgUp').show();
			$('#typeSpeciality li img.imgDown').hide();
		}
	});
});

// Function for show Main Menu:
function vsShowMenu(section){
	if ( vsMenuStatus != 'close') {
		return false;
	}
	
	vsMenuReadyWidth1 = false;
	vsMenuReadyWidth2 = false;
	
	$('.button').addClass('close');
	
	vsShowSection(section,1);
	
	$('.menu').animate({
		width: '754px'
	}, 700, function(){
		vsMenuReadyWidth1 = true;
		
		vsMenuStatus = 'open';
	});

	$('#vehicleShowroom .menu ul').css('width','754px');

	$('.title span').animate({
		right: '21px'
	}, 700, function(){
		vsMenuReadyWidth2 = true;
	});
	
	
}

// Function for show Section:
function vsShowSection(section,pass){
	/* if ( vsSectionStatus == 'open') {
		return false;
	} */
	
	vsMenuReadyHeight = false;
	vsMenuReadyHeight2 = false;
	
	if(pass==1){
		if(section == 'vsSpecialtyVehicle') {
			$('#vsSpecialtyVehicle').css('height','auto');
			$('#vehicleShowroom .menu .button').removeClass('on');
			vsMenuReadyHeight2 = true;
		} else {
			$('#vsSpecialtyVehicle').css('height','27px');
			$('#vehicleShowroom .menu .button').addClass('on');
			vsMenuReadyHeight2 = true;
		}
	} else {
		if(section == 'vsSpecialtyVehicle') {
			$('#vsSpecialtyVehicle').css('height','auto');
			$('#vehicleShowroom .menu .button').removeClass('on');
			vsMenuReadyHeight2 = true;
		} else {
			$('#vsSpecialtyVehicle').animate({
				height: '27px'
			}, 700, function(){
				vsMenuReadyHeight2 = true;
			});
			$('#vehicleShowroom .menu .button').addClass('on');
		}
	}
	
	if (section != vsActualSection) vsHideSection(vsActualSection);
	
	
	
	if (section == 'vsSpecialtyVehicle') contentHeight = 220; else contentHeight = 175;
	
	$('#'+section+' > a').addClass('selected');
	
	$('#'+section+' > .type').show().animate({
		height: contentHeight
	}, 700, function(){
		vsMenuReadyHeight = true;
		vsSectionStatus = 'open';
	});
	
	vsActualSection = section;
}

// Function for hide Main Menu:
function vsHideMenu(section){
	if (!vsHideMenuAnimation && vsMenuStatus == 'open') {
		vsHideMenuAnimation = true;
		vsMenuReadyWidth1 = false;
		vsMenuReadyWidth2 = false;
		vsMenuReadyHeight = false;
		
		$('.button').removeClass('close');
		vsHideSection(section);
		
		$('.menu').animate({
			width: '220px'
		}, 700, function(){
			$('.menu ul li a span').css('width','8px');
			$('#vehicleShowroom .menu ul').css('width','220px');
			
			vsMenuReadyWidth1 = true;
			
			vsMenuStatus = 'close';
		});
		
		$('.title span').animate({
			right: '1px'
		}, 700, function(){
			vsMenuReadyWidth2 = true;
			vsHideMenuAnimation = false;
		});
		
		
	}
}

// Function for hide Section:
function vsHideSection(section){
	if (!vsHideSectionAnimation && vsSectionStatus == 'open') {
		vsHideSectionAnimation = true;
		
		vsMenuReadyHeight = false;
		
		
		
		$('#'+section+' > a').removeClass('selected');
		
		$('#'+section+' > div').animate({
			height: '0px'
		}, 700, function(){
			$(this).hide();
			
			vsMenuReadyHeight = true;
			vsHideSectionAnimation = false;
			
			vsSectionStatus = 'close';
		});
	}
}

// Function for hide Section Info:
function vsHideInfo(){
	$('#vsBrand li[rel="1"] ol li').hide();
	$('#vsBrand li[rel="2"] ol li').hide();
	$('#vsBrand li[rel="3"] ol li').hide();
	$('#vsBrand li[rel="4"] ol li').hide();
	$('#vsBodyStyle li[rel="1"] ol li').hide();
	$('#vsBodyStyle li[rel="2"] ol li').hide();
	$('#vsBodyStyle li[rel="3"] ol li').hide();
	$('#vsBodyStyle li[rel="4"] ol li').hide();
}