tabsNumber=6;
typeSelection=false;
menuFileCode='cmpcompcar';

//dirty fix;
minCarWidth=300;

targetUrl='/carcomparison/';

$(document).ready(function(){
			//if ($('#CompareWindow').is(':hidden')){
			//logoTopMargin();	    	    
	    	//}
		    
		    //fourth
		    
		    typenamesSelector4=new FancySelector();
		    typenamesSelector4.init('typename4',typenamesSelected4,'typenameIds4','simple',true,2,-1,'right');
		    
		    modelTypesSelector4=new FancySelector();
		    modelTypesSelector4.init('type4',modelTypesSelected4,'typeIds4','simple',true,2,-1,'right');
		    
		    yearSelector4=new FancySelector();		    
		    yearSelector4.init('year4',yearSelected4,'yearIds4','simple',true,1,-1,'right');
		    
		    markModelsSelector4=new FancySelector();
		    markModelsSelector4.init('model4',markModelsSelected4,'modelIds4','simple',true,4,-1,'right');
		    
		    marksSelector4=new FancySelector();		    		    		    
		    marksSelector4.init('mark4',marksSelected4,'markIds4','enhanced',true,4,-1,'right');
		    	    		     
		    var markIds4 = $("#markIds4").val(); 
		    var modelIds4 = $("#modelIds4").val();
		    var yearIds4 = $("#yearIds4").val();
		    var typeIds4 = $("#typeIds4").val();
		    var typenameIds4 = $("#typenameIds4").val();
		    
		    //third
		    
		    typenamesSelector3=new FancySelector();
		    typenamesSelector3.init('typename3',typenamesSelected3,'typenameIds3','simple',true,2);
		    
		    modelTypesSelector3=new FancySelector();
		    modelTypesSelector3.init('type3',modelTypesSelected3,'typeIds3','simple',true,2);
		    
		    yearSelector3=new FancySelector();		    
		    yearSelector3.init('year3',yearSelected3,'yearIds3','simple',true,1);
		    
		    markModelsSelector3=new FancySelector();
		    markModelsSelector3.init('model3',markModelsSelected3,'modelIds3','simple',true);
		    
		    marksSelector3=new FancySelector();		    		    		    
		    marksSelector3.init('mark3',marksSelected3,'markIds3','enhanced',true);
		    		    		     
		    var markIds3 = $("#markIds3").val(); 
		    var modelIds3 = $("#modelIds3").val();
		    var yearIds3 = $("#yearIds3").val();
		    var typeIds3 = $("#typeIds3").val();
		    var typenameIds3 = $("#typenameIds3").val();		    
		    
		    //second
		    
		    typenamesSelector2=new FancySelector();
		    typenamesSelector2.init('typename2',typenamesSelected2,'typenameIds2','simple',true,2);
		    
		    modelTypesSelector2=new FancySelector();
		    modelTypesSelector2.init('type2',modelTypesSelected2,'typeIds2','simple',true,2);
		    
		    yearSelector2=new FancySelector();		    
		    yearSelector2.init('year2',yearSelected2,'yearIds2','simple',true,1);
		    
		    markModelsSelector2=new FancySelector();
		    markModelsSelector2.init('model2',markModelsSelected2,'modelIds2','simple',true);
		    
		    marksSelector2=new FancySelector();		    		    		    
		    marksSelector2.init('mark2',marksSelected2,'markIds2','enhanced',true);
		    		    		     
		    var markIds2 = $("#markIds2").val(); 
		    var modelIds2 = $("#modelIds2").val();
		    var yearIds2 = $("#yearIds2").val();
		    var typeIds2 = $("#typeIds2").val();
		    var typenameIds2 = $("#typenameIds2").val();
		    
		    //first 
		    
		    typenamesSelector=new FancySelector();
		    typenamesSelector.init('typename',typenamesSelected,'typenameIds','simple',true,2);
		    
		    modelTypesSelector=new FancySelector();
		    modelTypesSelector.init('type',modelTypesSelected,'typeIds','simple',true,2);
		    		    		    
		    yearSelector=new FancySelector();		    
		    yearSelector.init('year',yearSelected,'yearIds','simple',true,1);
		    		    
		    markModelsSelector=new FancySelector();
		    markModelsSelector.init('model',markModelsSelected,'modelIds','simple',true);
		    
		    marksSelector=new FancySelector();		    		    		    
		    marksSelector.init('mark',marksSelected,'markIds','enhanced',true);
		    		    		     
		    var markIds = $("markIds").val();		     
		    var modelIds = $("modelIds").val();
		    var yearIds = $("yearIds").val();
		    var typeIds = $("typeIds").val();
		    var typenameIds = $("typenameIds").val();		   
		    marksSelected(markIds);
		    
		    //setup
		    
		    //marksSelected2();
		    marksSelector2.disable();
		    markModelsSelector2.disable();
		    yearSelector2.disable();
		    modelTypesSelector2.disable();
		    typenamesSelector2.disable();
		    
		    //marksSelected3();
		    marksSelector3.disable();
		    markModelsSelector3.disable();
		    yearSelector3.disable();
		    modelTypesSelector3.disable();
		    typenamesSelector3.disable();
		    
		    //marksSelected4();		    
		    marksSelector4.disable();
		    markModelsSelector4.disable();
		    yearSelector4.disable();
		    modelTypesSelector4.disable();
		    typenamesSelector4.disable();
});

function CompareModels(){			
	if (marksSelector.isOpened()){
		marksSelector.close();
	}			
	if (markModelsSelector.isOpened()){
		markModelsSelector.close();
	}			
	if (yearSelector.isOpened()){
		yearSelector.close();
	}			
	if (modelTypesSelector.isOpened()){
		modelTypesSelector.close();
	}			
	if (typenamesSelector.isOpened()){
		typenamesSelector.close();
	}
	
	if (marksSelector2.isOpened()){
		marksSelector2.close();
	}			
	if (markModelsSelector2.isOpened()){
		markModelsSelector2.close();
	}			
	if (yearSelector2.isOpened()){
		yearSelector2.close();
	}			
	if (modelTypesSelector2.isOpened()){
		modelTypesSelector2.close();
	}			
	if (typenamesSelector2.isOpened()){
		typenamesSelector2.close();
	}
	
	if (marksSelector3.isOpened()){
		marksSelector3.close();
	}			
	if (markModelsSelector3.isOpened()){
		markModelsSelector3.close();
	}			
	if (yearSelector3.isOpened()){
		yearSelector3.close();
	}			
	if (modelTypesSelector3.isOpened()){
		modelTypesSelector3.close();
	}			
	if (typenamesSelector3.isOpened()){
		typenamesSelector3.close();
	}
	
	if (marksSelector4.isOpened()){
		marksSelector4.close();
	}			
	if (markModelsSelector4.isOpened()){
		markModelsSelector4.close();
	}			
	if (yearSelector4.isOpened()){
		yearSelector4.close();
	}			
	if (modelTypesSelector4.isOpened()){
		modelTypesSelector4.close();
	}			
	if (typenamesSelector4.isOpened()){
		typenamesSelector4.close();
	}

	var idsToCompare = ''; 			
	var yearsList = '';			
	
	if ($("input[name='typenameIds']").val()!=''){
		idsToCompare = $("input[name='typenameIds']").val();
		yearsList = $("input[name='yearIds']").val();
	}			
	
	if ($("input[name='typenameIds2']").val()!=''){
		if (idsToCompare == ''){
			idsToCompare = $("input[name='typenameIds2']").val();
			yearsList = $("input[name='yearIds2']").val();
		} else {
			idsToCompare += ','+ $("input[name='typenameIds2']").val();
			yearsList += ','+ $("input[name='yearIds2']").val();
		}				
	}
	
	if ($("input[name='typenameIds3']").val()!=''){
		if (idsToCompare == ''){
			idsToCompare = $("input[name='typenameIds3']").val();
			yearsList = $("input[name='yearIds3']").val();
		} else {
			idsToCompare += ','+ $("input[name='typenameIds3']").val();
			yearsList += ','+ $("input[name='yearIds3']").val();
		}				
	}
	
	if ($("input[name='typenameIds4']").val()!=''){
		if (idsToCompare == ''){
			idsToCompare = $("input[name='typenameIds4']").val();
			yearsList = $("input[name='yearIds4']").val();
		} else {
			idsToCompare += ','+ $("input[name='typenameIds4']").val();
			yearsList += ','+ $("input[name='yearIds4']").val();
		}				
	}
				
	if (idsToCompare != ""){ 
		compare(idsToCompare,yearsList);	
		$("#textInfo").hide();
		$("#tabButtons").show();	    		    	
	    $("#CompareButton span").text('update');
	    				
	} else {
		alert("Please select any type.");
	}
							
	if (!$('#CompareWindow').is(':hidden')){
		$('#TableLogo').css({ marginTop: '8px' });	    	    
	}
	
	
}

function sub(action,typeId,modelId,markId){
	$(":input[name='typeId']").val(typeId);
	$(":input[name='modelId']").val(modelId);
	$(":input[name='markId']").val(markId);
	$(":input[name='action']").val(action);
	$("form").get(0).submit();     
}
function subOcc(action,typeId,modelId,markId,columnNumber){
	$(":input[name='typeId']").val(typeId);
	$(":input[name='modelId']").val(modelId);
	$(":input[name='markId']").val(markId);
	$(":input[name='action']").val(action);
	$(":input[name='columnNumber']").val(columnNumber);
	$("form").get(0).submit();     
}
function compare(ids,yearsList) {	
	var len = 0;    
    if (typeof(ids) != 'undefined') {
    	v=ids;
    	len=1;
    }
    else {
    	var inp = $(":input[name='compareIds']");
    	var v = inp.val();
    	ids = v.split(',');
    	len = ids.length;
    }    
    
    if (v != '')
    {
        if (len < 1 || len > 4) {
            alert('Please select 1 t/m 4 cars to compare');
            return;
        }
                       
		$("#CompareWindow").load(targetUrl+'compareCar', { ids: v, years: yearsList , mode: 'b'});											
		$("#CompareWindow").css({display: 'block', height: '300px'});		
    }
}

function comparePosition() {		
	$("#CompareWindow").css({ backgroundColor: 'transparent', borderWidth: '0px' });
		
	var widths = null;
	for (i = 0; i < 6; i++) {
		var dv = $("#cmpPage" + i);
		var tb = $("#cmpPage" + i + " table.compareTable");
		dv.show();
		//var cols = tb.children().children().eq(2).children(); // 2nd row
		var cols = $("#cmpPage" + i + " #column"); // 2nd rows
				
		if (widths == null) { // init array
			var widths = new Array(cols.size());		
			for (j = 0; j < widths.length; j++){
				widths[j] = 0;				
			}
		}
		cols.each(function(index, item) { // find max width
			if ($(item).outerWidth() > widths[index])
				widths[index] = $(item).outerWidth();
		});
		if (i != 0)
			dv.hide();
	}	
	
	var wa = 0;
	if (widths[0]!=undefined){
		wa = widths[0];
	}
	var wb = 0;  
	if (widths[1]!=undefined){
		wb = widths[1];
	}
    
			
	var wc = 0;
	for (i = 2; i < widths.length; i++) // max width for the rest of columns
		if (widths[i] > wc)
			wc = widths[i];
	if (wc < minCarWidth) // min car column width
		wc = minCarWidth;
	var wsum = wa + wb + wc * (widths.length - 2); // 1st + 2nd + (3rd * car_count)		
	if ($('#TabsTable').width() > wsum) {
		wa += $('#TabsTable').width() - wsum;
		wsum = wa + wb + wc * (widths.length - 2);
	}			
    // set columns' widths
	for (i = 0; i < tabsNumber; i++) {		
		var dv = $("#cmpPage" + i);
		var tb = $("#cmpPage" + i + " table.compareTable");		
		dv.width(wsum);
		tb.css({ width: wsum });
		cols = tb.children().children().eq(2).children(); // 2nd row				
		cols.each(function(index, item) {					
			var w = index == 0 ? wa : (index == 1 ? wb : wc);			
			var pl = parseInt($(item).css('paddingLeft'));			
			if (pl == null || isNaN(pl)){
				pl = 0;					
			}	
			var pr = parseInt($(item).css('paddingRight'));
			if (pr == null || isNaN(pr)){
				pr = 0;
			}						
			
    		$(item).css({ width: Math.abs(w - pl - pr) });    		    		
		});		
	}		
    
    $("#cmpPageHeader").width(wsum);
    $("#cmpPageHeader table.compareTable").css({ width: wsum });
    
	// find & set max width
	var wd = wsum;
	var ht = 0;
	var a, b;	
	$("#CompareWindow").css({ width: wd });
	// center
	//var lt = ($(window).width() - wd) / 2;
	//var tp = $(document).scrollTop() + 60; // $(window).height() / 3 + $(window).scrollTop();
    //$("#modalContainer").css({ position: 'absolute' });
    //$("#modalContainer").animate({ left: lt + 'px', top: tp + 'px', width: wd + 'px', height: ht + 'px' }, function() {
	//    wd = $("#cmpPage0 table.compareTable").width();
    //    if ($("#TabsTable").width() > wd)
	//    	wd = $("#TabsTable").width();
    //    if ($("#TabsTable").width() <= wd)
    //        $("#TabsTable").css({ width: wd+'px' });
	    //$("#cmpContainer").animate({ height: ht + 'px', width: wd + 'px' });
    //});
    //lower compare loading 
    //$("#compareReloading").css({ position: 'absolute',top: tp - 100+'px' });
} 

function setCompareWindow(i){		
	var h = $("#cmpPage"+i+" table.compareTable").height()+18;			
	$("#CompareWindow").css({height: h+'px'});	
	
	$(".buttonContainer a").attr('class','compareTabButton');		
	$("#tabMapBut"+i).attr('class','compareTabButtonSelected');
}


function marksSelected() {
        selectedValues=marksSelector.value();        
		if (selectedValues=='') {			
	        markModelsSelector.disable();
	        yearSelector.disable();
	        modelTypesSelector.disable();	    
	        modelTypesSelected();       	        	           
        }
        else
        {
            $.getJSON("/carcomparison/getModelsByMarks", { marksIds : selectedValues }, function(data) {
                markModelsSelector.loadData(data);
                markModelsSelector.enable();
                markModelsSelector.write();
                markModelsSelector.read();
                markModelsSelected();
            });
        }
}

function markModelsSelected() {
        selectedValues=markModelsSelector.value();        
		if (selectedValues=='')
        {
            yearSelector.disable();
            modelTypesSelector.disable();       
            modelTypesSelected();     
        }
        else
        {        	
        	yearSelector.clear();
            $.getJSON("/carcomparison/getYearsByModels", { modelsIds : selectedValues }, function(data) {            	
            	yearSelector.loadData(data);            	
                yearSelector.enable();                     
                
                yearSelector.selectFirst();
                yearSelected();
                                                        
            });
        } 
}

function yearSelected(selectedValues) {
		modelsSelectedValues=markModelsSelector.value();
		selectedValues=yearSelector.value();		        
		if (selectedValues=='')
        {        	
            modelTypesSelector.disable();  
            modelTypesSelected();          
        }
        else
        {	
        	modelTypesSelector.clear();
            $.getJSON("/carcomparison/getTypesByModelsAndYear", { modelsIds : modelsSelectedValues , year : selectedValues }, function(data) {            	
            	modelTypesSelector.loadData(data);            	
                modelTypesSelector.enable();     
                typeSelectorTitle=$("#typeDataContainer > tr:first > td:first");
                typeSelectorTitle.html(typeSelectorTitle.text()+' <span>(historische nieuwprijs van-tot)</span>');
                typeSelectorTitle=$("#typeDataContainer > tr:first > td:first > span:first").css({'font-style':'italic','font-weight':'normal'});
                modelTypesSelector.selectFirst();                
                modelTypesSelected();           
            });
        }         
}

function modelTypesSelected(selectedValues) {
		
		modelsSelectedValues=markModelsSelector.value();		
		yearValues=yearSelector.value();				
		selectedValues=modelTypesSelector.value();        
		if (selectedValues=='')
        {        	
            typenamesSelector.disable();  
            typenamesSelected();          
        }
        else
        {	
        	typenamesSelector.clear();
            $.getJSON("/carcomparison/getTypenamesByModelsYearType", { modelsIds : modelsSelectedValues , year : yearValues, type : selectedValues }, function(data) {            	
            	typenamesSelector.loadData(data);            	
                typenamesSelector.enable();
                typenamesSelector.selectFirst();
                typenamesSelected();           
            });
        }         
}

function typenamesSelected(selectedValues) {
		selectedValues=typenamesSelector.value();				
		selectedValues2=marksSelector2.value();		
		if (selectedValues=='' && selectedValues2==''){
			marksSelector2.disable()
			marksSelected2();
		} else {
			marksSelector2.enable()
		}        
}














function marksSelected2() {
        selectedValues=marksSelector2.value();        
		if (selectedValues=='') {			
	        markModelsSelector2.disable();
	        yearSelector2.disable();
	        modelTypesSelector2.disable();	    
	        modelTypesSelected2();       	        	           
        }
        else
        {
            $.getJSON("/carcomparison/getModelsByMarks", { marksIds : selectedValues }, function(data) {
                markModelsSelector2.loadData(data);
                markModelsSelector2.enable();
                markModelsSelector2.write();
                markModelsSelector2.read();
                markModelsSelected2();
            });
        }
}

function markModelsSelected2() {
        selectedValues=markModelsSelector2.value();        
		if (selectedValues=='')
        {
            yearSelector2.disable();
            modelTypesSelector2.disable();       
            modelTypesSelected2();     
        }
        else
        {        	
        	yearSelector2.clear();
            $.getJSON("/carcomparison/getYearsByModels", { modelsIds : selectedValues }, function(data) {            	
            	yearSelector2.loadData(data);            	
                yearSelector2.enable();     
                yearSelector2.selectFirst();
                yearSelected2();                       
            });
        } 
}

function yearSelected2(selectedValues) {
		modelsSelectedValues=markModelsSelector2.value();
		selectedValues=yearSelector2.value();		        
		if (selectedValues=='')
        {        	
            modelTypesSelector2.disable();  
            modelTypesSelected2();          
        }
        else
        {	
        	modelTypesSelector2.clear();
            $.getJSON("/carcomparison/getTypesByModelsAndYear", { modelsIds : modelsSelectedValues , year : selectedValues }, function(data) {            	
            	modelTypesSelector2.loadData(data);            	
                modelTypesSelector2.enable();
                typeSelectorTitle=$("#type2DataContainer > tr:first > td:first");
                typeSelectorTitle.html(typeSelectorTitle.text()+' <span>(historische nieuwprijs van-tot)</span>');
                typeSelectorTitle=$("#type2DataContainer > tr:first > td:first > span:first").css({'font-style':'italic','font-weight':'normal'});     
                modelTypesSelector2.selectFirst();
                modelTypesSelected2();           
            });
        }         
}

function modelTypesSelected2(selectedValues) {
		
		modelsSelectedValues=markModelsSelector2.value();		
		yearValues=yearSelector2.value();				
		selectedValues=modelTypesSelector2.value();        
		if (selectedValues=='')
        {        	
            typenamesSelector2.disable();  
            typenamesSelected2();          
        }
        else
        {	
        	typenamesSelector2.clear();
            $.getJSON("/carcomparison/getTypenamesByModelsYearType", { modelsIds : modelsSelectedValues , year : yearValues, type : selectedValues }, function(data) {            	
            	typenamesSelector2.loadData(data);            	
                typenamesSelector2.enable();    
                typenamesSelector2.selectFirst(); 
                typenamesSelected2();           
            });
        }         
}

function typenamesSelected2(selectedValues) {
		selectedValues=typenamesSelector2.value();				
		selectedValues2=marksSelector3.value();		
		if (selectedValues=='' && selectedValues2==''){
			marksSelector3.disable()
			marksSelected3();
		} else {
			marksSelector3.enable()
		}        
}
















function marksSelected3() {
        selectedValues=marksSelector3.value();        
		if (selectedValues=='') {			
	        markModelsSelector3.disable();
	        yearSelector3.disable();
	        modelTypesSelector3.disable();	    
	        modelTypesSelected3();       	        	           
        }
        else
        {
            $.getJSON("/carcomparison/getModelsByMarks", { marksIds : selectedValues }, function(data) {
                markModelsSelector3.loadData(data);
                markModelsSelector3.enable();
                markModelsSelector3.write();
                markModelsSelector3.read();
                markModelsSelected3();
            });
        }
}

function markModelsSelected3() {
        selectedValues=markModelsSelector3.value();        
		if (selectedValues=='')
        {
            yearSelector3.disable();
            modelTypesSelector3.disable();       
            modelTypesSelected3();     
        }
        else
        {        	
        	yearSelector3.clear();
            $.getJSON("/carcomparison/getYearsByModels", { modelsIds : selectedValues }, function(data) {            	
            	yearSelector3.loadData(data);            	
                yearSelector3.enable();     
                yearSelector3.selectFirst();
                yearSelected3();                       
            });
        } 
}

function yearSelected3(selectedValues) {
		modelsSelectedValues=markModelsSelector3.value();
		selectedValues=yearSelector3.value();		        
		if (selectedValues=='')
        {        	
            modelTypesSelector3.disable();  
            modelTypesSelected3();          
        }
        else
        {	
        	modelTypesSelector3.clear();
            $.getJSON("/carcomparison/getTypesByModelsAndYear", { modelsIds : modelsSelectedValues , year : selectedValues }, function(data) {            	
            	modelTypesSelector3.loadData(data);            	
                modelTypesSelector3.enable();  
                typeSelectorTitle=$("#type3DataContainer > tr:first > td:first");
                typeSelectorTitle.html(typeSelectorTitle.text()+' <span>(historische nieuwprijs van-tot)</span>');
                typeSelectorTitle=$("#type3DataContainer > tr:first > td:first > span:first").css({'font-style':'italic','font-weight':'normal'});    
                modelTypesSelector3.selectFirst();   
                modelTypesSelected3();           
            });
        }         
}

function modelTypesSelected3(selectedValues) {
		
		modelsSelectedValues=markModelsSelector3.value();		
		yearValues=yearSelector3.value();				
		selectedValues=modelTypesSelector3.value();        
		if (selectedValues=='')
        {        	
            typenamesSelector3.disable();  
            typenamesSelected3();          
        }
        else
        {	
        	typenamesSelector3.clear();
            $.getJSON("/carcomparison/getTypenamesByModelsYearType", { modelsIds : modelsSelectedValues , year : yearValues, type : selectedValues }, function(data) {            	
            	typenamesSelector3.loadData(data);            	
                typenamesSelector3.enable();  
                typenamesSelector3.selectFirst();   
                typenamesSelected3();           
            });
        }         
}

function typenamesSelected3(selectedValues) {
		selectedValues=typenamesSelector3.value();				
		selectedValues2=marksSelector4.value();		
		if (selectedValues=='' && selectedValues2==''){
			marksSelector4.disable()
			marksSelected4();
		} else {
			marksSelector4.enable()
		}        
}






function marksSelected4() {
        selectedValues=marksSelector4.value();        
		if (selectedValues=='') {			
	        markModelsSelector4.disable();
	        yearSelector4.disable();
	        modelTypesSelector4.disable();	    
	        modelTypesSelected4();       	        	           
        }
        else
        {
            $.getJSON("/carcomparison/getModelsByMarks", { marksIds : selectedValues }, function(data) {
                markModelsSelector4.loadData(data);
                markModelsSelector4.enable();
                markModelsSelector4.write();
                markModelsSelector4.read();
                markModelsSelected4();
            });
        }
}

function markModelsSelected4() {
        selectedValues=markModelsSelector4.value();        
		if (selectedValues=='')
        {
            yearSelector4.disable();
            modelTypesSelector4.disable();       
            modelTypesSelected4();     
        }
        else
        {        	
        	yearSelector4.clear();
            $.getJSON("/carcomparison/getYearsByModels", { modelsIds : selectedValues }, function(data) {            	
            	yearSelector4.loadData(data);            	
                yearSelector4.enable();     
                yearSelector4.selectFirst();
                yearSelected4();                       
            });
        } 
}

function yearSelected4(selectedValues) {
		modelsSelectedValues=markModelsSelector4.value();
		selectedValues=yearSelector4.value();		        
		if (selectedValues=='')
        {        	
            modelTypesSelector4.disable();  
            modelTypesSelected4();          
        }
        else
        {	
        	modelTypesSelector4.clear();
            $.getJSON("/carcomparison/getTypesByModelsAndYear", { modelsIds : modelsSelectedValues , year : selectedValues }, function(data) {            	
            	modelTypesSelector4.loadData(data);            	
                modelTypesSelector4.enable();     
                typeSelectorTitle=$("#type4DataContainer > tr:first > td:first");
                typeSelectorTitle.html(typeSelectorTitle.text()+' <span>(historische nieuwprijs van-tot)</span>');
                typeSelectorTitle=$("#type4DataContainer > tr:first > td:first > span:first").css({'font-style':'italic','font-weight':'normal'});    
                modelTypesSelector4.selectFirst();
                modelTypesSelected4();           
            });
        }         
}

function modelTypesSelected4(selectedValues) {
		
		modelsSelectedValues=markModelsSelector4.value();		
		yearValues=yearSelector4.value();				
		selectedValues=modelTypesSelector4.value();        
		if (selectedValues=='')
        {        	
            typenamesSelector4.disable();  
            typenamesSelected4();          
        }
        else
        {	
        	typenamesSelector4.clear();
            $.getJSON("/carcomparison/getTypenamesByModelsYearType", { modelsIds : modelsSelectedValues , year : yearValues, type : selectedValues }, function(data) {            	
            	typenamesSelector4.loadData(data);            	
                typenamesSelector4.enable();     
                typenamesSelector4.selectFirst();
                typenamesSelected4();           
            });
        }         
}

function typenamesSelected4(selectedValues) {		
}



var slImages = null;
var slIndex = 0;
var slMainIndex = 0;
var slSliderNumber = 0;


function slShow(elem, markId,modelNo) {	
	slClear();	
	slLoad(markId,modelNo);	
	var off = $(elem).offset();
	var w = $(elem).width();
	var h = $(elem).height();
	$("#slider").css({ left: off.left, top: off.top, width: w, height: h });			
	$("#slider").show();	
	var x = $("#cmpContainer").offset().left + 140;
	var y = $("#cmpContainer").offset().top + 40;
	$("#slider").animate({width: "464px", height: "419px", left: x + 'px', top: y + 'px' });	
}
function slClose() {
	slClear();
	$("#slider").hide("slow");
}
function slLoad(markId,modelNo) {			
	$.getJSON(appUrl + "carcomparison/slider?markId=" + markId +"&modelNo="+modelNo, function(data) {					
		slImages = data;
		slIndex = 0;
		slMainIndex = 0;		
		slDisplay();		
		slMainDisplay();		
		slInitialRefresh();		
		slRefresh();		
		// preload the rest of thumbnails & photos		
						
		var pthumbs = new Array(slImages.length - 1);		
		for (i = 5; i < slImages.length; i++) {			
			pthumbs[i - 5] = new Image(10, 10);			
			pthumbs[i - 5].src = thumbUrl + slImages[i];			
		}		
		var pimgs = new Array(slImages.length - 1);
		for (i = 1; i < slImages.length; i++) {
			pimgs[i - 1] = new Image(10, 10);
			pimgs[i - 1].src = photoUrl + slImages[i];
		}		
	}); 	
	slGetCurrentSlider().remove();	
}
function slDisplay() {
	var lst = $("#sliderTable img");	
	for (i = 0, k = slIndex; i < 5 && k < slImages.length; i++, k++)
		lst.eq(i).attr('src', thumbUrl + slImages[k]);	
}
function slMainDisplay(elem) {
	$("#sliderImage").attr('src', photoUrl + slImages[slMainIndex]);
        //$("#sliderImage").attr('alt','test');
}
function slGetCurrentSlider() {
	return $("#slider" + slSliderNumber)
}
function slCreateSlider() {
	var sld = $("<img/>");
	sld.attr('id', 'slider' + (++slSliderNumber));
	$("#sliderTable").after(sld);	
	return sld;
}
function slMain(elem) {
	var slider = $("#slider");
	var el = $(elem);
	var old = slGetCurrentSlider();
	var img = slCreateSlider();
	// start position
	var lt = el.offset().left - slider.offset().left;
	var tp = el.offset().top - slider.offset().top;
	img.css({ position: 'absolute', left: lt, top: tp, width: el.width(), height: el.height(), zIndex: 300 });
	img.attr('src', el.attr('src').replace(thumbUrl, photoUrl));
	img.show();
	el = $("#sliderImage");
	slMainIndex = $("#sliderTable img").index(elem) + slIndex;
	// end position
	lt = el.offset().left - slider.offset().left;
	tp = el.offset().top - slider.offset().top;
	img.animate({left: lt, top: tp, width: el.width(), height: el.height()}, "slow",
		function() {
			old.remove();
			img.css({ zIndex: 299 }); 
			//$("#sliderTransition").hide(); 
			slMainDisplay();
			slRefresh();
		});
}
function slSlide(i) {
	slIndex += i;
	slDisplay();
	slRefresh();
}
function slMainSlide(i) {
	slMainIndex += i;
	// check if the main image is in the slider
	if (slMainIndex < slIndex) {
		slIndex -= slIndex - slMainIndex;
		slDisplay();				
	}
	if (slMainIndex > slIndex + 4) {
		slIndex += slMainIndex - slIndex - 4;
		slDisplay();
	}
	
	slMainDisplay();
	slRefresh();
	slGetCurrentSlider().remove();
}
function slInitialRefresh() {
	var lst = $("#sliderTable img");
	for (i = 0; i <= 4; i++)
		if (i >= slImages.length)
			lst.eq(i).hide();
		else
			lst.eq(i).show();
	if (slImages.length <= 5) {
		$("#sliderLeft").hide();
		$("#sliderRight").hide();
	}
	slRefresh();
}
function slRefresh() {
	if (slIndex == 0)
		$("#sliderLeft").hide();
	else
	{ 
		$("#sliderLeft").show();
	}
	if (slIndex + 5 >= slImages.length)
		$("#sliderRight").hide();
	else
		$("#sliderRight").show();
	if (slMainIndex == 0)
		$("#sliderPrev").hide();
	else
		$("#sliderPrev").show();
	if (slMainIndex >= slImages.length - 1)
		$("#sliderNext").hide();
	else
		$("#sliderNext").show();
}
function slClear() {
	$("#sliderImage").attr('src', '/gfx/transparent.gif');	
	$('#sliderTable img').each(function (index, item) {
		$(item).attr('src', '/gfx/transparent.gif');
	});
}

function selectCar(typeId, what) {  
		$("html").animate({ scrollTop: 0 }, "slow");          
        window.ppWhat = what;
        window.ppTypeId = typeId;
        $(":input[name='autoId']").val(typeId);
        var pc = jQuery.trim($(":input[name='postcode']").val());
        if (pc == '') {
            $("#ppValidation").text(msgs.postcodeRequired);
            $(":input[name='ppPostcode']").val("");
            $("#popupPostcode").modal({ close: false, onShow: ppAdjust });
            return;
        }
        var re = new RegExp("^[0-9]{4}( ?[A-z]{2})?$");
        if (!re.test(pc)) {
            $("#ppValidation").text(msgs.postcodeBestande);
            $("#:input[name='ppPostcode']").val(pc);
            $("#popupPostcode").modal({ close: false, onShow: ppAdjust });
            return;
        }
        jQuery.getJSON('/sneladvies/postcode?postcode=' + pc, function(data) {
            if (!data.result) {
                $("#ppValidation").text(msgs.postcodeGeldig);
                $("#:input[name='ppPostcode']").val(pc);
                $("#popupPostcode").modal({ close: false, onShow: ppAdjust });
            }
            else { // postcode valid
				$(":input[name='postcode']").val($("#ppPostcode").val());   
                $(":input[name='action']").val(what);                   
                $("form").get(0).submit();         
                //sub(what, typeId);
            }
        });
    }

function ppAdjust() {	
    var wd = 320;
    var ht = 100;
    var mc = $('#modalContainer');        
    var lt = ($(window).width() - wd) / 2;
    var tp = ($(window).height() - ht) / 3;        
    mc.css({ position: 'absolute' });
    mc.animate({ width: wd + 'px', height: ht + 'px', left: lt + 'px', top: tp + 'px' });    
    $("#popupPostcode").animate({ top: '0px', left: '0px' });    
    $("#ppPostcode").get(0).focus();     
}
function ppConfirm(ok) {
    if (!ok) {
        $.modal.close();
        return; 
    }
    else {
        var pc = jQuery.trim($("#ppPostcode").val());
        if (pc == '') {
            $("#ppValidation").text(msgs.postcodeRequired);
            $("#ppPostcode").get(0).focus();
            return;
        }
        var re = new RegExp("^[0-9]{4}( ?[A-z]{2})?$");
        if (!re.test(pc)) {
            $("#ppValidation").text(msgs.postcodeBestande);
            $("#ppPostcode").get(0).focus();
            return;
        }
        jQuery.getJSON('/sneladvies/postcode?postcode=' + pc, function(data) {
            if (!data.result) {
                $("#ppValidation").text(msgs.postcodeGeldig);
                $("#ppPostcode").get(0).focus();
            }
            else { // postcode valid
                $(":input[name='postcode']").val($("#ppPostcode").val());   
                $(":input[name='action']").val('proefrit');
                $("form").get(0).submit();
                //sub(window.ppWhat, window.ppTypeId);
            }
        });
    }
}