function checkMat() {
    var isMatTypeChecked = 'no';
    var checkBox;
    var mustSelectOption = false;

    var colorError = document.getElementById("colorError");

    if (colorError != null) {

        colorError.innerHTML = "";
    }

    e = document.getElementsByName("mat_type");

    for (i = 0; i < e.length; i++) {
        if (e[i].checked == true) {
            if (document.getElementById('matPattern_' + e[i].value).value != '') {
                isMatTypeChecked = 'yes';
            }
            else {
                mustSelectOption = true;
            }
        }
    }

    if (mustSelectOption) {
        if (colorError != null) {

            colorError.innerHTML = "(Select the option for your mat above)";
        }
    }

    if (isMatTypeChecked != 'yes' || mustSelectOption) {
        e = document.getElementsByName("mat_color");
        if (e != null)
        {
            for (i = 0; i < e.length; i++) {
                e[i].checked = false;
                e[i].disabled = true;
            }
        }
        checkColor();
        return false;
    }
    else {
        e = document.getElementsByName("mat_color");
        if (e != null)
        {
            for (i = 0; i < e.length; i++) {
                e[i].disabled = false;
            }
        }
        return true;
    }
}


function checkColor() {
    var isColorChecked = 'no';
    var isBindingChecked = false;
    var colorDesc = document.getElementById("colorDesc");

    e = document.getElementsByName("mat_color");

    if (e != null && e.length > 0) {
        for (i = 0; i < e.length; i++) {
            if (e[i].checked) {
                isColorChecked = 'yes';
                if(colorDesc != null) {
                    colorDesc.value = e[i].getAttribute("color");
                }
            }
        }
    }
    else {
        return true;
    }

    return (isColorChecked == 'yes')
}

function setMat(matID) {
    var mat = document.getElementById('mat_' + matID);
    var pattern = document.getElementById('matPattern_' + matID);

    if (mat.checked == true) {
        //alert(typeof (pattern));
        if (pattern.type == "select-one") {
            pattern.disabled = false;
        }
        //alert(pattern.type);
    }
    else {
        if (pattern.type == "select-one") {
            pattern[0].selected = true;
            pattern.disabled = true;
        }
    }
}

function validateLloyd() {

    if (!checkMat()) {
        alert('Please select a mat type before continuing.');
        return false;
    }

    if (!checkColor()) {
        alert('Please select mat carpet color before continuing.');
        return false;
    }
}

function validateLloydVehicle() {
    alert('Select your vehicle to continue.');
}

function setMatImage(matID) {
    if (matID.length > 0) {
        var matPatternID = document.getElementById("matPattern_" + matID).value;
        if (matPatternID.length > 0) {
            var matImageURL = document.getElementById("patternImage_" + matPatternID).value;
            var matImage = document.getElementById("matImage_" + matID);

            if (matImage != null && matImageURL.length > 0) {
                matImage.src = matImageURL;
            }
        }
    }
}