function selectCar(typeId, what) {              
    window.ppWhat = what;
    window.ppTypeId = typeId;
    window.ppSeoId = 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            
            subSeo(what, typeId);
        }
    });
}

function brandsSelected() {
        selectedValues=brandSelector.value();
        if (selectedValues=='') {
            modelGroupsSelector.disable();
            modelsSelector.disable();
        }
        else
        {
            $.getJSON("/metasearch/getModelGroupsByBrands", { brandIds : selectedValues }, function(data) {
                modelGroupsSelector.loadData(data);
                modelGroupsSelector.enable();
                modelGroupsSelector.write();
                modelGroupsSelector.read();
                modelGroupsSelected();
            });
        }
}

function modelGroupsSelected() {
        selectedValues=modelGroupsSelector.value();
        
        if (selectedValues=='')
        {
            modelsSelector.disable();
        }
        else
        {
            $.getJSON("/metasearch/getModelsByModelGroups", { modelIds : selectedValues }, function(data) {
                modelsSelector.loadData(data);
                modelsSelector.enable();
            });
        } 
}

function modelsSelected(selectedValues) {
        //clearModelGroupsSelection();
        //clearModelsSelection();
        //$.getJSON("/metasearch/getModelGroupsByBrands", { brandIds : selectedValues }, refreshModelGroups);
}


function subSeo(action, param) {
    $(":input[name='action']").val(action);
    $(":input[name='param']").val(param);
    $("form").get(0).submit();          
}
function dealer(seoId, what) {
                                  
    window.ppWhat = what;
    window.ppSeoId = seoId;
    $("#ppValidation").text(msgs.postcodeRequired);
    $(":input[name='ppPostcode']").val("");
    $("#popupPostcode").modal({ close: false, onShow: ppAdjust });
    return;
}
function ppAdjust() {
    var wd = 320;
    var ht = 100;
    var mc = $('#modalContainer');
    var lt = ($(document).width() - wd) / 2;
    var tp = 100;
    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}$|^[0-9]{4}$");
        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());
                $("#formSearch :input[name='postcode']").val($("#ppPostcode").val());
                subSeo(window.ppWhat, window.ppSeoId);
            }
        });
    }
}
function submitAndWaitSeo()
{
    pleaseWaitShow();
    $("#formSearch :input[name='actionInput']").val('search');    
    $("#formSearch :input[name='param']").val('');
    $("form").get(1).submit();      
}

function pleaseWaitShow() {
    var cp = $("#pleaseWaitPanel");
    cp.modal({ 
        onShow: function() {
            // center container
            var mc = $("#modalContainer");
            var wd = cp.width();
            var ht = cp.height();
            var lt = ($(document).width() - wd) / 2;
            var tp = 100;
            //var tp = $(window).height() / 3 + $(window).scrollTop();
            mc.css({ position: 'absolute', left: lt + 'px', top: tp + 'px', width: wd + 'px', height: ht + 'px' });
            //animatePleaseWaitAuto();
        }
    });
}

var animationTypes = new Array("swing", "easein", "easeout", "easeinout", "bouncein", "bounceout", "elasin", "elasout", "elasinout", "backin", "backout", "backinout");
var waitAutoLeft = true;

function animatePleaseWaitAuto() {
    var cp = $("#pleaseWaitPanel");                               
    var wd = cp.width();
    var rt = wd - 80;
    var to;
    if (waitAutoLeft) {    
        $("#pleaseWaitAuto").css({ left: '16' });
        $("#pleaseWaitAuto").attr('src', '/gfx/wait_auto1.png');
        to = rt;
    }
    else {
        $("#pleaseWaitAuto").css({ left: rt });
        $("#pleaseWaitAuto").attr('src', '/gfx/wait_auto2.png');
        to = 16;
    }
    waitAutoLeft = !waitAutoLeft;
    // choose animation type
    // var at = animationTypes[new Date().getMilliseconds() % animationTypes.length];        
    $("#pleaseWaitAuto").animate({ left: to }, 8000, 'linear', function() {
           setTimeout('animatePleaseWaitAuto()', 1000);    
    });
}

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

function slShow(elem, id) {
    slClear();
    slLoad(id);
    var off = $(elem).offset();
    var w = $(elem).width();
    var h = $(elem).height();
    $("#slider").css({ left: off.left, top: off.top, width: w, height: h, position: 'absolute' });            
    $("#slider").show();
    var x = $("table.seoTable").offset().left + 250;
    var y = $("table.seoTable").offset().top + 3;
    $("#slider").animate({width: "464px", height: "419px", left: x + 'px', top: y + 'px' });
}
function slClose() {
    slClear();
    $("#slider").hide("slow");
}
function slLoad(id) {
    $.getJSON(appUrl + "seo/slider?id=" + id, function(data) {
        slImages = data;
        slIndex = 0;
        slMainIndex = 0;
        slDisplay();
        slMainDisplay();
        slInitialRefresh();
        slRefresh();
        // preload the rest of thumbnails & photos
        pthumbs = new Array(slImages.length - 5);
        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 compareChange() {
    var ch = $(this);
    var inp = $(":input[name='compareIds']");
    if (ch.is(':checked')) { // add id   
        if (inp.val() == '') {
            inp.val(ch.val());
        }
        else { 
            var ids = inp.val().split();
            var i = $(ids).index(ch.val());
            if (i == -1) {
                ids.push(ch.val());
                inp.val(ids.join(','));
            }
        }
    }
    else { // remove id
        if (inp.val() != '') {
            var ids = inp.val().split(',');
            var nids = [];
            $(ids).each(function(index, item) {
                if (item != ch.val())
                    nids.push(item);
            });
            inp.val(nids.join(','));
        }
    }
   
    compareRefresh();
}

function compareRefresh() {
    var len = 0;
    var v = $(":input[name='compareIds']").val();
    if (v != '')
        len = v.split(',').length;
        
    if (len < 1 || len > 4) {
        $("#compareButton").hide();
        $("#compareButtonDisabled").show();
        $("#compareButton").parent().css({ borderColor: 'gray' });
    }
    else {
        $("#compareButtonDisabled").hide();
        $("#compareButton").show();
        $("#compareButton").parent().css({ borderColor: 'black' });
    }
    
    if (len == 4) {
        $(":checkbox[name='comparison']").each(function(index, item) {
            if (!$(item).attr('checked'))
                $(item).attr('disabled', 'disabled');
        });
    }
    else {
        $(":checkbox[name='comparison']").each(function(index, item) {
            $(item).removeAttr('disabled');
        });
    }
}

function compareCenter() {
	var wd = 100;
	var ht = 40;
	var lt = ($(document).width() - wd) / 2;
	var tp = $(window).height() / 3 + $(window).scrollTop();
	$("#modalContainer").css({ position: 'absolute', left: lt + 'px', top: tp + 'px', width: wd + 'px', height: ht + 'px' });
}


function comparePosition() {
	$("#comparePopup").css({ backgroundColor: 'transparent', borderWidth: '0px' });
	// adjust columns' widths
	// find max columns' widths
	var widths = null;
	for (i = 0; i < 5; i++) {
		var dv = $("#cmpPage" + i);
		var tb = $("#cmpPage" + i + " table.compareTable");
		dv.show();
		var cols = tb.children().children().eq(2).children(); // 2nd row
		if (widths == null) { // init array
			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 = widths[0];
	var 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 < 120) // min car column width
		wc = 120;
	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: 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;
	$("#comparePopup").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' });
} 

tabsNumber=5;
typeSelection=false;
menuFileCode='cmpseo';

//dirty fix;
minCarWidth=300;

targetUrl='/seo/';

function compare(ids) {
	
	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;
        }        
        // show modal
		comparePopup=new ComparePopup();		
		comparePopup.init(5,false);
		 
	    $("#comparePopup").css({ backgroundColor: 'white', borderWidth: '1px' });
		$("#comparePopup").modal({ onShow: comparePopup.compareCenter });		
		// request comparison
		$("#comparePopup").load('/seo/compare', { ids: v, mode: 'b' }, comparePopup.comparePosition);		
    }
    
}