var selectManu = document.getElementById("selectManufacturer");
var selectModel = document.getElementById("selectModel");
var selectGeneration = document.getElementById("selectGeneration");
var selectYear = document.getElementById("selectYear");
var selectTrim = document.getElementById("selectTrim");

selectModel.disabled = true;
selectGeneration.disabled = true;
selectYear.disabled = true;
selectTrim.disabled = true;
selectManu.disabled = true;

var generations;

var mobile = "<div class=\"form-group mb-2 mt-3 ml-sm-4 m-2\">\n" +
    "\t<label for=\"selectVehicle\">Pojazd</label>\n" +
    "\t<select class=\"form-control\" name=\"vehicle\" id=\"selectVehicle\" size=\"1\">\n" +
    "\t\t<option value=\"0\">wybierz</option>\n" +
    "\t\t<option value=\"A\">samochód</option>\n" +
    "\t\t<option value=\"C\">ciągnik</option>\n" +
    "\t\t<option value=\"M\">motocykl</option>\n" +
    "\t</select>\n" +
    "</div>\n" +
    "<div class=\"form-group mb-2 mt-3 ml-sm-4 m-2 sv_vh\" id=\"sv_manu\">\n" +
    "\t<label for=\"selectManufacturer\">Marka</label>\n" +
    "\t<select class=\"form-control\" name=\"manufacturer\" id=\"selectManufacturer\" size=\"1\">\n" +
    "\t</select>\n" +
    "</div>\n" +
    "<div class=\"form-group mb-2 mt-3 ml-sm-4 m-2 sv_vh\" id=\"sv_model\">\n" +
    "\t<label for=\"selectModel\">Model</label>\n" +
    "\t<select id=\"selectModel\" name=\"model\" size=\"1\" class=\"form-control\">\n" +
    "\t</select>\n" +
    "</div>\n" +
    "<div class=\"form-group mb-2 mt-3 ml-sm-4 m-2 sv_api\" id=\"sv_gen\">\n" +
    "\t<label for=\"selectGeneration\">Generacja</label>\n" +
    "\t<select class=\"form-control\" name=\"generation\" id=\"selectGeneration\" size=\"1\">\n" +
    "\t</select>\n" +
    "</div>\n" +
    "<div class=\"form-group mb-2 mt-3 ml-sm-4 m-2 sv_api\" id=\"sv_year\">\n" +
    "\t<label for=\"selectYear\">Rok</label>\n" +
    "\t<select id=\"selectYear\" name=\"year\" size=\"1\" class=\"form-control\">\n" +
    "\t</select>\n" +
    "</div>\n" +
    "<div class=\"form-group mb-2 mt-3 ml-sm-4 m-2 sv_api\" id=\"sv_trim\">\n" +
    "\t<label for=\"selectTrim\">Silnik</label>\n" +
    "\t<select class=\"form-control\" name=\"trim\" id=\"selectTrim\" size=\"1\">\n" +
    "\t</select>\n" +
    "</div>";

function setColumnsForMobileView(){
    $("#vh_col_left").children().remove();
    $("#vh_col_right").children().remove();

    $("#vh_col_left").append(mobile);
}

if ($(window).width() <= 572){
    setColumnsForMobileView();
}

$('.sv_api,.sv_vh').hide();

$('#selectVehicle').change(function () {
    $('#selectManufacturer').children().remove();
    $('#selectModel').children().remove();
    $('#selectGeneration').children().remove();
    $('#selectYear').children().remove();
    $('#selectTrim').children().remove();

    $("#selectModel").prop("disabled","disabled");
    $("#selectGeneration").prop("disabled","disabled");
    $("#selectYear").prop("disabled","disabled");
    $("#selectTrim").prop("disabled","disabled");
    $("#selectManufacturer").prop("disabled","disabled");

    $('#sv_manu').show(400);
    if($(this).val()==='A')
        whApiSetManufacturers();
    else if($(this).val()==='C' || $(this).val()==='M')
        vehicleSetManufacturers($(this).val());
});


$('#selectManufacturer').change(function () {
    $('#selectModel').children().remove();
    $('#selectGeneration').children().remove();
    $('#selectYear').children().remove();
    $('#selectTrim').children().remove();

    $("#selectModel").prop("disabled","disabled");
    $("#selectGeneration").prop("disabled","disabled");
    $("#selectYear").prop("disabled","disabled");
    $("#selectTrim").prop("disabled","disabled");

    $('#sv_model').show(400);
    if($('#selectVehicle').val()==='A')
        whApiSetModels();
    else if($('#selectVehicle').val()==='C' || $('#selectVehicle').val()==='M')
        vehicleSetModels($('#selectVehicle').val());
});

$('#selectModel').change(function () {
    if($('#selectVehicle').val()==='A'){
        $('#selectGeneration').children().remove();
        $('#selectYear').children().remove();
        $('#selectTrim').children().remove();

        $("#selectGeneration").prop("disabled","disabled");
        $("#selectYear").prop("disabled","disabled");
        $("#selectTrim").prop("disabled","disabled");

        $('#sv_gen').show(400);
        $.ajax({
            type : 'GET',
            url: 'scripts/wyszukiwarka/whSearchApi.php',
            data: "action=list_of_generations&manufacturer="+$('#selectManufacturer').val()+"&model="+$(this).val(),
            dataType: 'json',
            success: function(data) {
                generations = data;
                $('#selectGeneration').append("<option value=\"0\" selected>wybierz</option>");
                for(var i=0;i<data.length;i++) {
                    $('#selectGeneration').append("<option value=\""+data[i][1]+"\">"+data[i][0]+"</option>");
                }
                $("#selectGeneration").prop("disabled",false);
            }
        });
    }
});

$('#selectGeneration').change(function () {
    $('#selectYear').children().remove();
    $('#selectTrim').children().remove();

    $("#selectTrim").prop("disabled","disabled");
    $('#selectYear').append("<option value=\"0\" selected>wybierz</option>");
    $("#selectYear").prop("disabled",false);

    $('#sv_year').show(400);
    for(var i=0;i<generations.length;i++){
        if($(this).val()==generations[i][1]){
            for(var j=0;j<generations[i][2].length;j++){
                $('#selectYear').append("<option value=\""+generations[i][2][j]+"\">"+generations[i][2][j]+"</option>");
            }
            break;
        }
    }
});

$('#selectYear').change(function () {
    $('#selectTrim').children().remove();
    $('#selectTrim').append("<option value=\"0\" selected>wybierz</option>");
    $("#selectTrim").prop("disabled","disabled");
    $('#sv_trim').show(400);
    $.ajax({
        type : 'GET',
        url: 'scripts/wyszukiwarka/whSearchApi.php',
        data: "action=list_of_trims&manufacturer="+$('#selectManufacturer').val()+"&model="+$('#selectModel').val()+
        "&year="+$(this).val()+"&generation="+$('#selectGeneration').val(),
        dataType: 'json',
        success: function(data) {
            for(var i=0;i<data.length;i++) {
                $('#selectTrim').append("<option value=\""+data[i][2]+"\">"+data[i][0]+"</option>");
            }
            $("#selectTrim").prop("disabled",false);
        }
    });
});

$('#searchVehicleButton').click(function () {
    url = null;
    if($('#selectVehicle').val()==='A')
        url = $('#selectTrim').val();
    else if($('#selectVehicle').val()==='C' || $('#selectVehicle').val()==='M')
        url = $('#selectModel').val();
    if(url!==null && url!='0')
        document.location = url;
});

function whApiSetManufacturers() {
    $.ajax({
        type : 'GET',
        url: 'scripts/wyszukiwarka/whSearchApi.php',
        data: "action=list_of_manufacturers",
        dataType: 'json',
        success: function(data) {
            $('#selectManufacturer').append("<option value=\"0\" selected>wybierz</option>");
            for(var i=0;i<data.length;i++)
                $('#selectManufacturer').append("<option value=\""+data[i][0]+"\">"+data[i][1]+"</option>");
            $("#selectManufacturer").prop("disabled",false);
        }
    });
}

function whApiSetModels() {
    $.ajax({
        type : 'GET',
        url: 'scripts/wyszukiwarka/whSearchApi.php',
        data: "action=list_of_models&manufacturer="+$('#selectManufacturer').val(),
        dataType: 'json',
        success: function(data) {
            $('#selectModel').append("<option value=\"0\" selected>wybierz</option>");
            for(var i=0;i<data.length;i++)
                $('#selectModel').append("<option value=\""+data[i][0]+"\">"+data[i][1]+"</option>");
            $("#selectModel").prop("disabled",false);
        }
    });
}

function vehicleSetManufacturers(typ) {
    action = (typ==='C') ? "tractor_manufacturers" : "motorcycles_manufacturers";
    $.ajax({
        type : 'GET',
        url: 'scripts/wyszukiwarka/vehicleApi.php',
        data: "action="+action,
        dataType: 'json',
        success: function(data) {
            $('#selectManufacturer').append("<option value=\"0\" selected>wybierz</option>");
            for(var i=0;i<data.length;i++)
                $('#selectManufacturer').append("<option value=\""+data[i]+"\">"+data[i]+"</option>")
            $("#selectManufacturer").prop("disabled",false);
        }
    });
}

function vehicleSetModels(typ) {
    action = (typ==='C') ? "tractor_models" : "motorcycle_models";
    $.ajax({
        type : 'GET',
        url: 'scripts/wyszukiwarka/vehicleApi.php',
        data: "action="+action+"&manufacturer="+$('#selectManufacturer').val(),
        dataType: 'json',
        success: function(data) {
            $('#selectModel').append("<option value=\"0\" selected>wybierz</option>");
            for(var i=0;i<data.length;i++)
                $('#selectModel').append("<option value=\""+data[i][1]+"\">"+data[i][0]+"</option>");
            $("#selectModel").prop("disabled",false);
        }
    });
}