$(document).ready(function()
{

    //reset the combo boxes
    $("#reset").click(function()
    {
        var lists = $("select");
        for(i = 0; i < lists.length; i++)
        {
            lists[i].selectedIndex = 0;
        }
        $("#houses-list li.house").each(function()
        {
            $(this).animate({ opacity: 1.0 }, 500);
        });
    });

    //reset cbos when page loads
    $("#reset").click();


    //handles the change of our combo boxes
    $("select").change( updateSearch );


});//end of document.ready()

function updateSearch()
{

    //get the comboboxes
    var cbos = $("select");

    //these are the details currently selected in the combo boxes
    var cboPrice    = cbos[0].value;
    var cboStories  = cbos[1].value;
    var cboBedrooms = cbos[2].value;
    var cboWidth    = cbos[3].value;
    var cboHouse    = cbos[4].value;
    var cboView     = cbos[5].value;
    var cboLiving   = cbos[6].value;

    var houses = $("#houses-list li.house");

    houses.each(function()
    {
        var fade = false;

        //split the values at the comma to generate our search criteria
        var criteria = $(this).attr("id").split("-");        //this is the current houses search criteria


        //we dont use criteria[0] because it is just a string so
        //our markup validates as IDs can not begin with a number

        //choose which option we are filtering by and apply the
        //criteria
        if(cboPrice != 0 && criteria[1] > cboPrice)
        {
            fade = true;
        }
        if(cboStories != 0 && criteria[2] != cboStories)
        {
            fade = true;
        }
        if(cboBedrooms != 0 && criteria[3] != cboBedrooms)
        {
            fade = true;
        }
        if(cboWidth != 0 && (criteria[4] / 1000) > cboWidth)
        {
            fade = true;
        }
        if(cboHouse != 0 && cboHouse != criteria[5])
        {
            fade = true;
        }
        if(cboLiving != 0 && cboLiving != criteria[8])
        {
            fade = true;
        }
        
        //houses can have both front and rear views so we need to check
        //which they are searching for
        if(cboView != 0)
        {
            if(cboView == 1) //they are looking for front view
            {
                 if(criteria[6] == 0)
                 {
                     //No front View
                     fade = true;
                 }
            }
            else if(cboView == 2) //Looking for a rear view
            {
                if(criteria[7] == 0)
                {
                    //no rear view
                    fade = true;
                }
            }
            else if(cboView == 3) //looking for front and rear view
            {
                if(criteria[6] == 0 || criteria[7] == 0)
                {
                    fade = true; //doesn't have both views
                }
            }
        }

        //fade the house
        if(fade)
        {
            $(this).animate({ opacity: 0.2 }, 500);
        }
        else
        {
            $(this).animate({ opacity: 1.0 }, 500);
        }

    });


    return false;
}