var getValues = '/buying/requestaquote/scripts/GetValues.ashx';
var locateDealer = '/buying/dealers/ws/FindDealers.ashx';
//var locateDealer = '/buying/requestaquote/en/test.xml'
var vehicleParams = {};
var langType = document.getElementsByTagName('html')[0].getAttribute('lang').toUpperCase();
//lang=EN&option=m&series=T

function getQueryString(strQuery){
    strQuery = strQuery.replace('?', '');
    var strQueryFields = strQuery.split(/&/);
    var info = {};
    for (var i = 0; i < strQueryFields.length; i++) {
        var fieldInfo = strQueryFields[i].split(/=/, 2);
        info[fieldInfo[0]] = fieldInfo[1];
    }
    return info;
}

// cb_function is the callback function
function AjaxRequest(url, cb_function, mimeType){
    $.ajax({
        url: url,
        async: false,
        type: 'GET',
        dataType: mimeType,
        cache: false,
        timeout: 30000,
        error: function(){
            alert('data failed to load, please refresh the page')
        },
        success: cb_function //success
    });
};


function FillUpLists(langType, s, m){

    // values are pulled from page
    vehicleParams.lang = langType.toUpperCase();
    vehicleParams.series = s;
    vehicleParams.model = m;
    
    // check query string for model code
    var query = getQueryString(window.location.search);
    
    // backwards compatibility with older aspx code
    // overwrite page values if parameters are passed through the URL
    if (query.modelcode) {
        vehicleParams.model = query.modelcode;
        AjaxRequest(getValues + '?lang=' + vehicleParams.lang + '&option=v&modelcode=' + vehicleParams.model, getSeriesCode);             
		AjaxRequest(getValues + '?lang=' + vehicleParams.lang + '&option=s', getSeries);
		AjaxRequest(getValues + '?lang=' + vehicleParams.lang + '&option=i&modelcode=' + vehicleParams.model, updateCarImage, 'text');
        AjaxRequest(getValues + '?lang=' + vehicleParams.lang + '&option=m&series=' + vehicleParams.series, getModels);
    }
    else if (query.series) {
		vehicleParams.series = query.series; 
		AjaxRequest(getValues + '?lang=' + vehicleParams.lang + '&option=s', getSeries);		
		AjaxRequest(getValues + '?lang=' + vehicleParams.lang + '&option=m&series=' + vehicleParams.series, getModels);
    } else {
		AjaxRequest(getValues + '?lang=' + vehicleParams.lang + '&option=s', getSeries);
	}
    
}

function getSeriesCode(data){      
    jQuery(data).find('series').each(function(){        
        vehicleParams.series = jQuery(this).find('key').text();           
    })	
}

function getSeries(data){
	console.log(data); 
	
    var series = [];
    var i = 0;
    var seriesSelect = $('#ddSeries');
    var modelSelect = $('#ddBaseModelCode');
    var loader = $('.selectCar div.loader');
    $(data).find('series').each(function(){
		if ($(this).find('text').text().indexOf('LEAF') != -1) return; //remove LEAF from dropdown menu
        series[i++] = '<option value="' + $(this).find('key').text() + '">';
        series[i++] = $(this).find('text').text();
		series[i++] ='</option>';
    })
	
	// append series options
    seriesSelect.append(series.join('')).removeAttr('disabled');
	
	// remove loader
    loader.animate({
        opacity: 0
    }, 500, 'swing', function(){
        loader.remove()
    })
	
	// set series value
    // IE6 is slowwwwww... 200ms penalty
    setTimeout(function(){
        seriesSelect.val(vehicleParams.series).removeAttr('disabled');
    }, 200)
}

function getModels(data){
    var models = [];
    var i = 0;
    var modelSelect = $('#ddBaseModelCode');
    modelSelect.empty();
    
    $(data).find('model').each(function(){
        models[i++] = '<option value="' + $(this).find('key').text() + '">';
        models[i++] = $(this).find('text').text();
    })
    modelSelect.append(models.join('')).removeAttr('disabled');
    modelSelect.val(vehicleParams.model)
}

function updateCarImage(data){
    $('#imgVehicle').attr({
        'src': data
    })
}

function updateDealerList(data){
    // Remove dealers
    $('#DealerList').animate({
        'opacity': 0
    }, 400, 'swing', function(){
        $(this).empty();
    });
    
    
    setTimeout(function(){
        if ($(data).find('dealers').attr('error') != 0) {
            alert('An error has occured. Please refresh your browser.')
        }
        else {
            var i = 0;
            var dealers = [];
            var distance = [];
            $(data).find('dealer').each(function(){
                // format distance
                distance = $(this).attr('distance').split('.');
                distance[1] = distance[1].substring(0, 2);
                dealers[i++] = '<li id="' + $(this).attr('code') + '">';
                dealers[i++] = '<p><strong>' + $(this).find('DealerName').text() + '</strong></p>';
                dealers[i++] = '<address>' + $(this).find('Address').text();
                dealers[i++] = ',' + $(this).find('PrimaryCity').text();
                dealers[i++] = ',' + $(this).find('Province').text() + '</address>';
                dealers[i++] = '<p>Distance from Postal Code: ' + distance.join('.') + ' km</p>';
                dealers[i++] = '</li>';
            })
        }
        $('div.loader').css({
            'display': 'none'
        });
        $('#DealerList').css({
            'display': 'block',
            'opacity': 1
        }).append(dealers.join(''));
        // adding css striping to dealer listing
        $('#DealerList li:nth-child(even)').addClass('odd');
    }, 1200)
}

function setupRequestQuoteForm(){

    // initFormValidator returns the form validation object
    // it contains methods and properties for various validation requests
    var form = initFormValidator();
    
    
    // character limit
    function characterLimit(target, counter){
        target = $(target);
        target.text($.trim(target.text()));
        counter = $(counter);
        counter.text(target.attr('maxlength') - target.val().length);
        target.bind('keyup blur focus', function(){
            counter.text(target.attr('maxlength') - target.val().length)
            if (target.val().length >= target.attr('maxlength')) {
                form.addErrorClass(target, 'li')
            }
        })
    }
    
    characterLimit('#tbComment', '#c_count');
    
    // update model
    $('#ddSeries').change(function(){
        if (this.value.length > 0) {
            AjaxRequest(getValues + '?lang=' + langType + '&option=m&series=' + this.value, getModels)
        }
        else {
            $('#ddBaseModelCode').val('').attr('disabled', 'disabled');
        }
    });
    
    // update model image
    $('#ddBaseModelCode').change(function(){
        if (this.value.length > 0) {
            AjaxRequest(getValues + '?lang=' + langType + '&option=i&modelcode=' + this.value + '&configid=', updateCarImage, 'text')
        }
    });
    
    // search for dealers
    $('#btnSearch, #SearchWrapper, #SearchWrapper_fr ').click(function(){
        var postalCode;
        if (!form.validateFields('#tbDealerPostalCode')) {
            $('div.loader').css({
                'display': 'block'
            });
            postalCode = $('#tbDealerPostalCode').val();
            AjaxRequest(locateDealer + '?postalcode=' + postalCode + '&radius=400&testdealer=1', updateDealerList, 'xml')
        }
        return false;
    });
    
    // set dealer
    $('#DealerList li').live('click', function(){
        $('#DealerList li').removeClass('active');
        $(this).addClass('active');
        $('#dealercode').val($(this).attr('id'));
    });
    
    // get vehicle/model text and submit it with the form
    $('#ddBaseModelCode, #ddSeries').live('change', function(){
        if ($(this).attr('id') == 'ddBaseModelCode') {
            $('input[name="model"]').val($('#ddBaseModelCode option:selected').text());
        }
        else {
            $('input[name="vehicle"]').val($('#ddSeries option:selected').text());
        }
    });
    
    // tranfer postal code to dealer search
    $('#tbPostalCode').blur(function(){
        $('#tbDealerPostalCode').val($(this).val())
    });
    
    // for request quote page
    $('#ddCellCarrier option:eq(0)').val('');
    
    // hide default search button
    $('#btnSearch').hide();
    
    // Submit form
    $('#form1').submit(function(){
        // validate the form
        var hasErrors = form.validate(this)
        if (hasErrors < 1) {
            if ($('#dealercode').val() < 1) {
                DealerAddErrorClass(form, jQuery('#tbDealerPostalCode'), 'li');
                DealerShowErrorText(form, jQuery('#tbDealerPostalCode'), 'li', 'selectDealer');
                hasErrors = false
            }
            return hasErrors;
        }
        else {
            return false
        }
    })
}

$(document).ready(function(){

    // inital setup for request a quote form
    setupRequestQuoteForm();
    
});



/* // DEALER NOT SELECTED CONTROL HANDLER control. This is where the error classes and text are handled // */

// add error classes to input and it's container
DealerAddErrorClass = function (form, input, container) {
    input.addClass(form.error.e_class).closest(container).addClass(form.error.wrapperClass);
    jQuery('label[for="' + input.attr('id') + '"]').addClass(form.error.e_class);
}

// remove error class from input. 
// remove error class from container if a target is set
// Default is form.element.wrapper --> (<li>)
DealerRemoveErrorClass = function (form, input, container) {
    if (container) {
        input.closest(container).removeClass(form.error.wrapperClass);
        input.siblings(form.error.text + '.' + form.error.e_class).remove();
    }
    input.removeClass(form.error.e_class);
    jQuery('label[for="' + input.attr('id') + '"]').removeClass(form.error.e_class);
};
// show relevant error text
DealerShowErrorText = function (form, input, container, pattern) {
    // check whether to use specific or generic error messaging
    if (pattern == 'specifc') {
        form.error.alert = input.attr('title');
    }
    else if (pattern == 'selectDealer') {
        form.error.alert = langType == "EN" ? "Please select a dealer." : "Veuillez s&eacute;lectionner un concessionaire.";
    }
    else {
        form.error.alert = form.error.result[langType].requiredError;
    }
    // add error messaging
    if (input.siblings(form.error.text + '.' + form.error.e_class).length < 1) {
        input.closest(container).append('<' + form.error.text + ' class="' + form.error.e_class + '" for="' + input.attr('id') + '">' + form.error.alert + '</' + form.error.text + '>');
    }
    else {
        input.siblings(form.error.text + '.' + form.error.e_class).text(form.error.alert)
    }
};