// <!--



// correctly handle PNG transparency in Win IE 5.5 & 6.



function correctPNG() {

   var arVersion = navigator.appVersion.split("MSIE")

   var version = parseFloat(arVersion[1])

   if ((version >= 5.5) && (document.body.filters)) {

      for(var i=0; i<document.images.length; i++) {

         var img = document.images[i]

         var imgName = img.src.toUpperCase()

         if (imgName.substring(imgName.length-3, imgName.length) == "PNG") {

            var imgID = (img.id) ? "id='" + img.id + "' " : ""

            var imgClass = (img.className) ? "class='" + img.className + "' " : ""

            var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "

            var imgStyle = "display:inline-block;" + img.style.cssText 

            if (img.align == "left") imgStyle = "float:left;" + imgStyle

            if (img.align == "right") imgStyle = "float:right;" + imgStyle

            if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle

            var strNewHTML = "<span " + imgID + imgClass + imgTitle

            + " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"

            + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"

            + "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>" 

            img.outerHTML = strNewHTML

            i = i-1

         }

      }

   }

}



if ($.browser.msie && $.browser.version < 7){

	// alert(parseInt(jQuery.browser.version));

	window.attachEvent("onload", correctPNG);

	correctPNG();

}



function fixPNG(){

	// If we're using IE6, correct all loaded PNGs again

	if ($.browser.msie && $.browser.version < 7 ){

		// alert(parseInt(jQuery.browser.version));

		correctPNG();

	};

}



// Centers the content when the browser is resized

// Not using this since we're living in a static div now

$(window).resize( function(){ 

    // console.log("Resizing content ... ");

    // centercontent(); 

});



function centercontent(){

	var windowWidth = $(window).width();

	var windowWidth2 = $(window).width();

	// console.log("windowWidth: " + windowWidth);

	// $("#customizerContainer").css({ left:windowWidth/2 - 460 } );

    // $("#customizerContainer").css({ top:Number( window.innerHeight / 2 - 350) } );

};



var fadeOutTime = 250;

var animateTime = 250;

var fadeInTime = 250;



// Car Body Paint

function set1_load(graphic){

	//console.log('set1_load');

	graphic = Number(graphic);



	switch(graphic){

        case 0:

            $('#v1_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){ $('#v1_overlay1').html(''); }, fadeInTime);

            // setTimeout(function(){$('#v1_overlay1').fadeIn(); }, 1000);

			

			$('#v2_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){ $('#v2_overlay1').html(''); }, fadeInTime);

            // setTimeout(function(){$('#v2_overlay1').fadeIn(); }, 1000);

        break;

        

		// Black Regular

        case 1:

            $('#v1_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){ 

				$('#v1_overlay1').html('<img src="images/audi_paint_black.png" alt=""/>');

				fixPNG();

			}, animateTime);

            setTimeout(function(){ $('#v1_overlay1').fadeIn(); }, fadeInTime);

			

			$('#v2_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){ 

				$('#v2_overlay1').html('<img src="images/audi_v2_paint_black.png" alt=""/>');

				fixPNG();

			}, animateTime);

            setTimeout(function(){ $('#v2_overlay1').fadeIn(); }, fadeInTime);

        break;

		

        // White Regular

        case 2:

            $('#v1_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v1_overlay1').html('<img src="images/audi_paint_white.png" alt=""/>');

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v1_overlay1').fadeIn(); }, fadeInTime);

			

            $('#v2_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v2_overlay1').html('<img src="images/audi_v2_paint_white.png" alt=""/>');

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v2_overlay1').fadeIn(); }, fadeInTime);

        break;

		

		// White Metallic

        case 3:

            $('#v1_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v1_overlay1').html('<img src="images/audi_paint_white_metallic.png" alt=""/>'); 

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v1_overlay1').fadeIn(); }, fadeInTime);

			

            $('#v2_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v2_overlay1').html('<img src="images/audi_v2_paint_white_metallic.png" alt=""/>'); 

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v2_overlay1').fadeIn(); }, fadeInTime);

        break;

		

		// Black Metallic

        case 4:

            $('#v1_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v1_overlay1').html('<img src="images/audi_paint_black_metallic.png" alt=""/>'); 

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v1_overlay1').fadeIn(); }, fadeInTime);

			

            $('#v2_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v2_overlay1').html('<img src="images/audi_v2_paint_black_metallic.png" alt=""/>'); 

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v2_overlay1').fadeIn(); }, fadeInTime);					

        break;

		

		// Grey Metallic

		case 5:

            $('#v1_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v1_overlay1').html('<img src="images/audi_paint_grey_metallic.png" alt=""/>'); 

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v1_overlay1').fadeIn(); }, fadeInTime);

			

            $('#v2_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v2_overlay1').html('<img src="images/audi_v2_paint_grey_metallic.png" alt=""/>'); 

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v2_overlay1').fadeIn(); }, fadeInTime);					

        break;

		

		// Light Blue  Metallic

		case 6:

            $('#v1_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v1_overlay1').html('<img src="images/audi_paint_light_blue_metallic.png" alt=""/>'); 

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v1_overlay1').fadeIn(); }, fadeInTime);

			

            $('#v2_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v2_overlay1').html('<img src="images/audi_v2_paint_light_blue_metallic.png" alt=""/>'); 

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v2_overlay1').fadeIn(); }, fadeInTime);				

        break;

		

		// Green Metallic

		case 7:

            $('#v1_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v1_overlay1').html('<img src="images/audi_paint_green_metallic.png" alt=""/>'); 

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v1_overlay1').fadeIn(); }, fadeInTime);

			

            $('#v2_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v2_overlay1').html('<img src="images/audi_v2_paint_green_metallic.png" alt=""/>'); 

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v2_overlay1').fadeIn(); }, fadeInTime);					

        break;

		

		// Blue Metallic

		case 8:

            $('#v1_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v1_overlay1').html('<img src="images/audi_paint_blue_metallic.png" alt=""/>');

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v1_overlay1').fadeIn(); }, fadeInTime);

			

            $('#v2_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v2_overlay1').html('<img src="images/audi_v2_paint_blue_metallic.png" alt=""/>');

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v2_overlay1').fadeIn(); }, fadeInTime);

        break;

		

		// Silver Metallic

		case 9:

            $('#v1_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v1_overlay1').html('<img src="images/audi_paint_silver_metallic.png" alt=""/>');

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v1_overlay1').fadeIn(); }, fadeInTime);

			

            $('#v2_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v2_overlay1').html('<img src="images/audi_v2_paint_silver_metallic.png" alt=""/>');

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v2_overlay1').fadeIn(); }, fadeInTime);					

        break;

		

		// Red Metallic

		case 10:

            $('#v1_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v1_overlay1').html('<img src="images/audi_paint_red_metallic.png" alt=""/>');

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v1_overlay1').fadeIn(); }, fadeInTime);

			

            $('#v2_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v2_overlay1').html('<img src="images/audi_v2_paint_red_metallic.png" alt=""/>');

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v2_overlay1').fadeIn(); }, fadeInTime);					

        break;		

		

		// Brown Metallic

		case 11:

            $('#v1_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v1_overlay1').html('<img src="images/audi_paint_brown_metallic.png" alt=""/>');

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v1_overlay1').fadeIn(); }, fadeInTime);

			

            $('#v2_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v2_overlay1').html('<img src="images/audi_v2_paint_brown_metallic.png" alt=""/>');

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v2_overlay1').fadeIn(); }, fadeInTime);				

        break;

		

		// Dark Brown Metallic

		case 12:

            $('#v1_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v1_overlay1').html('<img src="images/audi_paint_dark_brown_metallic.png" alt=""/>');

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v1_overlay1').fadeIn(); }, fadeInTime);

			

			$('#v2_overlay1').fadeOut(fadeOutTime);

            setTimeout(function(){

				$('#v2_overlay1').html('<img src="images/audi_v2_paint_dark_brown_metallic.png" alt=""/>');

				fixPNG();

			}, animateTime);

            setTimeout(function(){$('#v2_overlay1').fadeIn(); }, fadeInTime);

        break;

    }

}





var filmArray = new Array(

		'Veuillez sélectionner un film a installer.',

		'Noir',

		'D&eacute;grad&eacute; noir',

		'D&eacute;grad&eacute; gris',

		'D&eacute;grad&eacute; bronze chrome;',

		'D&eacute;grad&eacute; argent',

		'D&eacute;grad&eacute; bleu',

		'D&eacute;grad&eacute; rouge',

		'D&eacute;grad&eacute; vert'

	);



// Side window tint

function set2_load(graphic){

	//console.log('set2_load');

	graphic = Number(graphic);

	switch(graphic){

		// None

	    case 0:

	        $('#v1_overlay2').fadeOut(fadeOutTime);

	        setTimeout( function(){$('#v1_overlay2').animate({opacity:0.0}) }, animateTime);

	        setTimeout( function(){$('#v1_overlay2').html(''); 

				fixPNG();

			}, animateTime);

	        // $('#v1_overlay2').fadeIn(fadeInTime);

			

			$('#v2_overlay2').fadeOut(fadeOutTime);

	        setTimeout( function(){$('#v2_overlay2').animate({opacity:0.0}) }, animateTime);

	        setTimeout( function(){$('#v2_overlay2').html(''); 

				fixPNG();

			}, animateTime);

	        // $('#v2_overlay2').fadeIn(fadeInTime);

			

	    break;

	    

		// Black

	    case 1:

	        $('#v1_overlay2').fadeOut(fadeOutTime);

	        setTimeout( function(){$('#v1_overlay2').animate({opacity:1}) }, animateTime);

	        setTimeout( function(){

				$('#v1_overlay2').html('<img src="images/audi_tint_black.png" alt=""/>');

				fixPNG();

			}, animateTime);

	        $('#v1_overlay2').fadeIn(fadeInTime);

			

			$('#v2_overlay2').fadeOut(fadeOutTime);

	        setTimeout( function(){$('#v2_overlay2').animate({opacity:1}) }, animateTime);

	        setTimeout( function(){

				$('#v2_overlay2').html('<img src="images/audi_tint_black_v2.png" alt=""/>');

				fixPNG();

			}, animateTime);

	        $('#v2_overlay2').fadeIn(fadeInTime);

	    break;

	    

		// Gradient Black

	    case 2:

	        $('#v1_overlay2').fadeOut(fadeOutTime);

	        setTimeout( function(){$('#v1_overlay2').animate({opacity:1}) }, animateTime);

	        setTimeout( function(){

				$('#v1_overlay2').html('<img src="images/audi_tint_gradient_black.png" alt=""/>');

				fixPNG();

			}, animateTime);

	        $('#v1_overlay2').fadeIn(fadeInTime);

			

			$('#v2_overlay2').fadeOut(fadeOutTime);

	        setTimeout( function(){$('#v2_overlay2').animate({opacity:1}) }, animateTime);

	        setTimeout( function(){

				$('#v2_overlay2').html('<img src="images/audi_tint_gradient_black_v2.png" alt=""/>');

				fixPNG();

			}, animateTime);

	        $('#v2_overlay2').fadeIn(fadeInTime);

	    break;

	

		// Gradient Grey        

	    case 3:

	        $('#v1_overlay2').fadeOut(fadeOutTime);

	        setTimeout( function(){$('#v1_overlay2').animate({opacity:1}) }, animateTime);

	        setTimeout( function(){

				$('#v1_overlay2').html('<img src="images/audi_tint_gradient_grey.png" alt=""/>');

				fixPNG();

			}, animateTime);

	        $('#v1_overlay2').fadeIn(fadeInTime);

			

			$('#v2_overlay2').fadeOut(fadeOutTime);

	        setTimeout( function(){$('#v2_overlay2').animate({opacity:1}) }, animateTime);

	        setTimeout( function(){

				$('#v2_overlay2').html('<img src="images/audi_tint_gradient_grey_v2.png" alt=""/>');

				fixPNG();

			}, animateTime);

	        $('#v2_overlay2').fadeIn(fadeInTime);

	    break;

	    

		// Gradient Bronze

	    case 4:

	        $('#v1_overlay2').fadeOut(fadeOutTime);

	        setTimeout( function(){$('#v1_overlay2').animate({opacity:1}) }, animateTime);

	        setTimeout( function(){

				$('#v1_overlay2').html('<img src="images/audi_tint_bronze.png" alt=""/>');

				fixPNG();

			}, animateTime);

	        $('#v1_overlay2').fadeIn(fadeInTime);

			

			$('#v2_overlay2').fadeOut(fadeOutTime);

	        setTimeout( function(){$('#v2_overlay2').animate({opacity:1}) }, animateTime);

	        setTimeout( function(){

				$('#v2_overlay2').html('<img src="images/audi_tint_bronze_v2.png" alt=""/>');

				fixPNG();

			}, animateTime);

	        $('#v2_overlay2').fadeIn(fadeInTime);

	    break;

	    

		// Gradient Silver

	    case 5:

	        $('#v1_overlay2').fadeOut(fadeOutTime);

	        setTimeout( function(){$('#v1_overlay2').animate({opacity:1}) }, animateTime);

	        setTimeout( function(){

				$('#v1_overlay2').html('<img src="images/audi_tint_gradient_silver.png" alt=""/>');

				fixPNG();

			}, animateTime);

	        $('#v1_overlay2').fadeIn(fadeInTime);

			

			$('#v2_overlay2').fadeOut(fadeOutTime);

	        setTimeout( function(){$('#v2_overlay2').animate({opacity:1}) }, animateTime);

	        setTimeout( function(){

				$('#v2_overlay2').html('<img src="images/audi_tint_gradient_silver_v2.png" alt=""/>');

				fixPNG();

			}, animateTime);

	        $('#v2_overlay2').fadeIn(fadeInTime);

	    break;

		

		// Gradient Blue

	    case 6:

	        $('#v1_overlay2').fadeOut(fadeOutTime);

	        setTimeout( function(){$('#v1_overlay2').animate({opacity:1}) }, animateTime);

	        setTimeout( function(){

				$('#v1_overlay2').html('<img src="images/audi_tint_gradient_blue.png" alt=""/>');

				fixPNG();

			}, animateTime);

	        $('#v1_overlay2').fadeIn(fadeInTime);

			

			$('#v2_overlay2').fadeOut(fadeOutTime);

	        setTimeout( function(){$('#v2_overlay2').animate({opacity:1}) }, animateTime);

	        setTimeout( function(){

				$('#v2_overlay2').html('<img src="images/audi_tint_gradient_blue_v2.png" alt=""/>');

				fixPNG();

			}, animateTime);

	        $('#v2_overlay2').fadeIn(fadeInTime);

	    break;	

				

		// Gradient Red

	    case 7:

	        $('#v1_overlay2').fadeOut(fadeOutTime);

	        setTimeout( function(){$('#v1_overlay2').animate({opacity:1}) }, animateTime);

	        setTimeout( function(){

				$('#v1_overlay2').html('<img src="images/audi_tint_red.png" alt=""/>');

				fixPNG();

			}, animateTime);

	        $('#v1_overlay2').fadeIn(fadeInTime);

			

			$('#v2_overlay2').fadeOut(fadeOutTime);

	        setTimeout( function(){$('#v2_overlay2').animate({opacity:1}) }, animateTime);

	        setTimeout( function(){

				$('#v2_overlay2').html('<img src="images/audi_tint_red_v2.png" alt=""/>');

				fixPNG();

			}, animateTime);

	        $('#v2_overlay2').fadeIn(fadeInTime);

	    break;

		

		// Gradient Green

	    case 8:

	        $('#v1_overlay2').fadeOut(fadeOutTime);

	        setTimeout( function(){$('#v1_overlay2').animate({opacity:1}) }, animateTime);

	        setTimeout( function(){

				$('#v1_overlay2').html('<img src="images/audi_tint_green.png" alt=""/>');

				fixPNG();

			}, animateTime);

	        $('#v1_overlay2').fadeIn(fadeInTime);

			

			$('#v2_overlay2').fadeOut(fadeOutTime);

	        setTimeout( function(){$('#v2_overlay2').animate({opacity:1}) }, animateTime);

	        setTimeout( function(){

				$('#v2_overlay2').html('<img src="images/audi_tint_green_v2.png" alt=""/>');

				fixPNG();

			}, animateTime);

	        $('#v2_overlay2').fadeIn(fadeInTime);

	    break;

	}

}



// Side window tint

function set3_load(graphic){

    graphic = Number(graphic);

    switch(graphic){

        case 0:

            $('#v1_overlay3').fadeOut(fadeOutTime);

            setTimeout( function(){$('#v1_overlay3').animate({opacity:1}) }, animateTime);

            setTimeout( function(){

				$('#v1_overlay3').html('');

				fixPNG();

			}, animateTime);

            $('#v1_overlay3').fadeIn(fadeInTime);

        break;

        

        case 1:

            $('#v1_overlay3').fadeOut(fadeOutTime);

            setTimeout( function(){$('#v1_overlay3').animate({opacity:1}) }, animateTime);

            setTimeout( function(){

				$('#v1_overlay3').html('<img src="images/audi_tint_side_black.png" alt=""/>');

				fixPNG();

			}, animateTime);

            $('#v1_overlay3').fadeIn(fadeInTime);

        break;

        

        case 2:

            $('#v1_overlay3').fadeOut(fadeOutTime);

            setTimeout( function(){$('#v1_overlay3').animate({opacity:1}) }, animateTime);

            setTimeout( function(){

				$('#v1_overlay3').html('<img src="images/audi_tint_side_black.png" alt=""/>');

				fixPNG();

			}, animateTime);

            $('#v1_overlay3').fadeIn(fadeInTime);

        break;

        

        case 3:

            $('#v1_overlay3').fadeOut(fadeOutTime);

            setTimeout( function(){$('#v1_overlay3').animate({opacity:1}) }, animateTime);

            setTimeout( function(){

				$('#v1_overlay3').html('<img src="images/audi_tint_side_black_gradient.png" alt=""/>');

				fixPNG();

			}, animateTime);

            $('#v1_overlay3').fadeIn(fadeInTime);

        break;

        

        case 4:

            $('#v1_overlay3').fadeOut(fadeOutTime);

            setTimeout( function(){$('#v1_overlay3').animate({opacity:1}) }, animateTime);

            setTimeout( function(){

				$('#v1_overlay3').html('<img src="images/audi_tint_side_wine_chrome.png" alt=""/>');

				fixPNG();

			}, animateTime);

            $('#v1_overlay3').fadeIn(fadeInTime);

        break;

        

        case 5:

            $('#v1_overlay3').fadeOut(fadeOutTime);

            setTimeout( function(){$('#v1_overlay3').animate({opacity:1}) }, animateTime);

            setTimeout( function(){

				$('#v1_overlay3').html('<img src="images/audi_tint_side_black_chrome.png" alt=""/>');

				fixPNG();

			}, animateTime);

            $('#v1_overlay3').fadeIn(fadeInTime);

        break;

	}

}



function carColorChange(){

    set1_load( document.getElementById('color_option1').value );

}



function frontTintColorChange(){

    

	set2_load( document.getElementById('color_option2').value );

}



function sideTintColorChange(){

    set3_load( document.getElementById('color_option3').value );

}



// Control display / retract

var controlsActive = 0;

function activatePaintSwatches(controlsActive){

    switch(controlsActive){

        // show the panel

		case 0:

            //console.log('Show Controls: ' + $('#paintPanel1').css('top') );

            $('#paintPanel1').animate({ top: 150 });

			$('#controlsClose').animate({ left:280 });

			$('#controlLabel1').animate({ left:300 });

			$('#controlsBg').animate({ opacity: 0.75 });

			//fixPNG();

            //controlsActive = 1;

        break;



		// hide the panel

        case 1:

            //console.log('Remove Controls: ' + $('#paintPanel1').css('top') );

            $('#paintPanel1').animate({ top: 485 });

			$('#controlsClose').animate({ left:200 });

			$('#controlLabel1').animate({ left:280 });

			$('#controlsBg').animate({ opacity: 1 });

            //controlsActive = 0;

			//fixPNG();

        break;

    }

}



var _currentView = 1;

function viewChange(){

	_currentView = Number(document.getElementById('view_option').value);

	//console.log("_currentView: "+_currentView);

	switch(_currentView){

		case 0:

			// console.log(' Switched to view 0');

			$('#view1').css({top:-512}).animate({top:0, opacity:1});

			$('#view2').animate({top:512, opacity:0})				

		break;

		

		case 1:

			// console.log(' Switched to view 1');				

			$('#view1').animate({top:512, opacity:0});

			$('#view2').css({top:-512}).animate({top:0, opacity:1});

		break;

	}

}

// -->