$(document).ready(function() {
    createDropDown();    
    createDropDown2();
    createDropDown3();
    createDropDown4();
    createPriceToDropDown();
    createTypeDropDown();
    createAreaDropDown();
    
    $(".dropdown1 dt a").click(function() {
        $(".dropdown1 dd ul").toggle();
    });

    $(document).bind('click', function(e) {
        var $clicked = $(e.target);
        if (! $clicked.parents().hasClass("dropdown1"))
            $(".dropdown1 dd ul").hide();
    });
                
    $(".dropdown1 dd ul li a").click(function() {
        var text = $(this).html();
        $(".dropdown1 dt a").html(text);
        $(".dropdown1 dd ul").hide();
        
        var source1 = $("#source1");
        source1.val($(this).find("span.value").html())
    });
    
    //PRICE FROM DROPDOWN
    $(".pricefromdd dt a").click(function() {
        $(".pricefromdd dd ul").toggle();
    });

    $(document).bind('click', function(e) {
        var $clicked = $(e.target);
        if (! $clicked.parents().hasClass("pricefromdd"))
            $(".pricefromdd dd ul").hide();
    });
                
    $(".pricefromdd dd ul li a").click(function() {
        var text = $(this).html();
        $(".pricefromdd dt a").html(text);
        $(".pricefromdd dd ul").hide();
        
        var pricefromid = $("#pricefromid");
        pricefromid.val($(this).find("span.pricefromvalue").html())
    });

    //PRICE TO DROPDOWN
    $(".pricetodd dt a").click(function() {
        $(".pricetodd dd ul").toggle();
    });

    $(document).bind('click', function(e) {
        var $clicked = $(e.target);
        if (! $clicked.parents().hasClass("pricetodd"))
            $(".pricetodd dd ul").hide();
    });
                
    $(".pricetodd dd ul li a").click(function() {
        var text = $(this).html();
        $(".pricetodd dt a").html(text);
        $(".pricetodd dd ul").hide();
        
        var pricetoid = $("#pricetoid");
        pricetoid.val($(this).find("span.pricetovalue").html())
    });  
    
    //TYPE DROPDOWN
    $(".typedd dt a").click(function() {
        $(".typedd dd ul").toggle();
    });

    $(document).bind('click', function(e) {
        var $clicked = $(e.target);
        if (! $clicked.parents().hasClass("typedd"))
            $(".typedd dd ul").hide();
    });
                
    $(".typedd dd ul li a").click(function() {
        var text = $(this).html();
        $(".typedd dt a").html(text);
        $(".typedd dd ul").hide();
        
        var typeid = $("#typeid");
        typeid.val($(this).find("span.typevalue").html())
    });  

    //AREA DROPDOWN
    $(".areadd dt a").click(function() {
        $(".areadd dd ul").toggle();
    });

    $(document).bind('click', function(e) {
        var $clicked = $(e.target);
        if (! $clicked.parents().hasClass("areadd"))
            $(".areadd dd ul").hide();
    });
                
    $(".areadd dd ul li a").click(function() {
        var text = $(this).html();
        $(".areadd dt a").html(text);
        $(".areadd dd ul").hide();
        
        var areaid = $("#areaid");
        areaid.val($(this).find("span.areavalue").html())
    });            
        
    //DROP 3
    $(".dropdown3 dt a").click(function() {
        $(".dropdown3 dd ul").toggle();
    });

    $(document).bind('click', function(e) {
        var $clicked = $(e.target);
        if (! $clicked.parents().hasClass("dropdown3"))
            $(".dropdown3 dd ul").hide();
    });
                
    $(".dropdown3 dd ul li a").click(function() {
        var text = $(this).html();
        $(".dropdown3 dt a").html(text);
        $(".dropdown3 dd ul").hide();
        
        var source3 = $("#source3");
        source3.val($(this).find("span.categoryvalue").html())
    });
    

    //DROP 4
    $(".dropdown4 dt a").click(function() {
        $(".dropdown4 dd ul").toggle();
    });

    $(document).bind('click', function(e) {
        var $clicked = $(e.target);
        if (! $clicked.parents().hasClass("dropdown4"))
            $(".dropdown4 dd ul").hide();
    });
                
    $(".dropdown4 dd ul li a").click(function() {
        var text = $(this).html();
        $(".dropdown4 dt a").html(text);
        $(".dropdown4 dd ul").hide();
        
        var source4 = $("#source4");
        source4.val($(this).find("span.locationvalue").html())
    });
    
    //DROP 5
    $(".dropdown5 dt a").click(function() {
        $(".dropdown5 dd ul").toggle();
    });

    $(document).bind('click', function(e) {
        var $clicked = $(e.target);
        if (! $clicked.parents().hasClass("dropdown5"))
            $(".dropdown5 dd ul").hide();
    });
                
    $(".dropdown5 dd ul li a").click(function() {
        var text = $(this).html();
        $(".dropdown5 dt a").html(text);
        $(".dropdown5 dd ul").hide();
        
        var source5 = $("#source5");
        source5.val($(this).find("span.pricetovalue").html())
    });            
});

function createDropDown(){
    var source1 = $("#source1");
    var selected = source1.find("option[selected]");
    var options = $("option", source1);
    
    $(".flags").append('<dl id="target1" class="dropdown1"></dl>')
    $("#target1").append('<dt><a>' + selected.text() + 
        '<span class="value">' + selected.val() + 
        '</span></a></dt>')
    $("#target1").append('<dd><ul></ul></dd>')

    options.each(function(){
        $("#target1 dd ul").append('<li><a>' + 
            $(this).text() + '<span class="value">' + 
            $(this).val() + '</span></a></li>');
    });
}


function createDropDown2(){
    var pricefromid = $("#pricefromid");
    var selected = pricefromid.find("option[selected]");
    var options = $("option", pricefromid);
    
    $(".pricefrom").append('<dl id="target2" class="pricefromdd"></dl>')
    $("#target2").append('<dt><a>' + selected.text() + 
        '<span class="pricefromvalue">' + selected.val() + 
        '</span></a></dt>')
    $("#target2").append('<dd><ul></ul></dd>')

    options.each(function(){
        $("#target2 dd ul").append('<li><a>' + 
            $(this).text() + '<span class="pricefromvalue">' + 
            $(this).val() + '</span></a></li>');
    });
} 

function createDropDown3(){
    var source3 = $("#source3");
    var selected3 = source3.find("option[selected]");
    var options = $("option", source3);
    
    $(".category").append('<dl id="target3" class="dropdown3"></dl>')
    $("#target3").append('<dt><a>' + selected3.text() + 
        '<span class="categoryvalue">' + selected3.val() + 
        '</span></a></dt>')
    $("#target3").append('<dd><ul></ul></dd>')

    options.each(function(){
        $("#target3 dd ul").append('<li><a>' + 
            $(this).text() + '<span class="categoryvalue">' + 
            $(this).val() + '</span></a></li>');
    });
}  

function createDropDown4(){
    var source4 = $("#source4");
    var selected = source4.find("option[selected]");
    var options = $("option", source4);
    
    $(".location").append('<dl id="target4" class="dropdown4"></dl>')
    $("#target4").append('<dt><a>' + selected.text() + 
        '<span class="locationvalue">' + selected.val() + 
        '</span></a></dt>')
    $("#target4").append('<dd><ul></ul></dd>')

    options.each(function(){
        $("#target4 dd ul").append('<li><a>' + 
            $(this).text() + '<span class="locationvalue">' + 
            $(this).val() + '</span></a></li>');
    });
} 

function createPriceToDropDown(){
    var pricetoid = $("#pricetoid");
    var selected = pricetoid.find("option[selected]");
    var options = $("option", pricetoid);
    
    $(".priceto").append('<dl id="target5" class="pricetodd"></dl>')
    $("#target5").append('<dt><a>' + selected.text() + 
        '<span class="pricetovalue">' + selected.val() + 
        '</span></a></dt>')
    $("#target5").append('<dd><ul></ul></dd>')

    options.each(function(){
        $("#target5 dd ul").append('<li><a>' + 
            $(this).text() + '<span class="pricetovalue">' + 
            $(this).val() + '</span></a></li>');
    });
} 

function createTypeDropDown(){
    var typeid = $("#typeid");
    var selected = typeid.find("option[selected]");
    var options = $("option", typeid);
    
    $(".type").append('<dl id="target6" class="typedd"></dl>')
    $("#target6").append('<dt><a>' + selected.text() + 
        '<span class="typevalue">' + selected.val() + 
        '</span></a></dt>')
    $("#target6").append('<dd><ul></ul></dd>')

    options.each(function(){
        $("#target6 dd ul").append('<li><a>' + 
            $(this).text() + '<span class="typevalue">' + 
            $(this).val() + '</span></a></li>');
    });
}

function createAreaDropDown(){
    var areaid = $("#areaid");
    var selected = areaid.find("option[selected]");
    var options = $("option", areaid);
    
    $(".area").append('<dl id="target7" class="areadd"></dl>')
    $("#target7").append('<dt><a>' + selected.text() + 
        '<span class="areavalue">' + selected.val() + 
        '</span></a></dt>')
    $("#target7").append('<dd><ul></ul></dd>')

    options.each(function(){
        $("#target7 dd ul").append('<li><a>' + 
            $(this).text() + '<span class="areavalue">' + 
            $(this).val() + '</span></a></li>');
    });
}