﻿//File contains all code for full Job Search control functionality

//Convert Vacancy Search DropDown Lists to Nice looking ones
//http://www.jankoatwarpspeed.com/post/2009/07/28/reinventing-drop-down-with-css-jquery.aspx

var specialismsId = "target_TopLevelDepartmentToViewName";
var sectorsId = "target_DepartmentToViewName";
var skillsId = "target_SkillSearchString"
var allsectors = " --All Sectors-- <span class=\"value\"></span>";
var allskills = " --All Skills-- <span class=\"value\"></span>";

function ConfigureJobSearchControl() {
    $('#search_box').hide(); 
    $("#search_box label").hide();
 
    MakeNiceDropDown($("#search_box > #SkillSearchString"));
    MakeNiceDropDown($("#search_box > #DepartmentToViewName"));
    MakeNiceDropDown($("#search_box > #TopLevelDepartmentToViewName"));
    MakeNiceDropDown($("#search_box > #RadiusToSearch"));
    MakeNiceDropDown($("#search_box > #VacancyTypeToSearch"));
    MakeNiceDropDown($("#search_box > #MinSalary"));
    MakeNiceDropDown($("#search_box > #MinRate"));
    MakeNiceDropDown($("#search_box .strloc"));


    $('#search_box').show();
    $("#search_box > #VacancyTypeToSearch").hide();
    $('#reset_job_search').show();
}

//Styled dropdowns:
function MakeNiceDropDown(source) {
    var id = "target_" + source.attr("id");
    var selected = source.find("option[selected]");  // get selected <option>
    var options = $("option", source);  // get all <option> elements

    // create <dl> and <dt> with selected value inside it
    source.after('<dl id="' + id + '" class="dropdown"></dl>')
    $("#" + id).append('<dt><a href="#">' + selected.text() +
        '<span class="value" name="' + selected.val() + '"  >' + $(this).val() + '</span></a></dt>')
    $("#" + id).append('<dd><ul></ul></dd>')

    // iterate through all the <option> elements and create UL
    options.each(function() {
        $("#" + id + " dd ul").append('<li><a href="#">' + $(this).text() +
        '<span class="value"  name="' + $(this).val() + '">' + $(this).val() + '</span></a></li>');
    });
    source.hide();

    //Only enable skills and sectors if specialism is selected
    if ((id != sectorsId) && (id != skillsId)) {
        EnableDropDown(id);
    }

    //If were dealing with the linked Specialism's, Sectors, and Skill
    if (id == specialismsId) {
        if (getSelectedValue(specialismsId) == "") {
            DisableDropDown(sectorsId);
            DisableDropDown(skillsId);
        }
        else {
            SetDropDown(sectorsId, getSelectedValue(specialismsId));
            SetDropDown(skillsId, getSelectedValue(specialismsId));
        }
    }

    $(document).bind('click', function(e) {
        var $clicked = $(e.target);
        if (!$clicked.parents().hasClass("dropdown"))
            $("#" + id + " dd ul").hide();
    });

};

function getSelectedValue(id) {
    return $("#" + id).find("dt a span.value").attr("name");
}

function SetDropDown(id, parentsector) {
    DisableDropDown(id);

    if (getSelectedValue(specialismsId) == "") {
        $("#" + id).val("");
        var sid = id.replace("target_", "");
        $("#" + sid).val("");
    }
    else {
        if (id == skillsId) {
            parentsector = parentsector + '$';
        }

        $("#" + id + " dd ul li").addClass("hide");
        $("#" + id + " dd ul li").removeClass("show");

        $("#" + id + " dd ul li:first").addClass("show");
        $("#" + id + " dd ul li:first").removeClass("hide");
        $("#" + id + " dd ul li a span[name^='" + parentsector + "']").parent().parent().addClass("show");
        $("#" + id + " dd ul li a span[name^='" + parentsector + "']").parent().parent().removeClass("hide");

        EnableDropDown(id);
    }
}

function EnableDropDown(id) {
    $("#" + id + " dt a").removeClass("disabled");

    //enable the drop down arrow
    $("#" + id + " dt a").click(function() {
        $(".dropdown").each(function() {
            if ($(this).attr("id") == id) {
                //$("#" + id + " dd ul").toggle();
                if ($(this).find("dd ul").is(":visible") == true) {
                    $(this).find("dd ul").slideUp('fast');
                }
                else {
                    $(this).find("dd ul").slideDown('normal');
                }
            }
            else {
                //$(this).find("dd ul").hide();
                $(this).find("dd ul").slideUp('fast');
            }
        });
    });

    //enable item selection
    $("#" + id + " dd ul li a").click(function() {

        var text = $(this).html();
        $("#" + id + " dt a").html(text);
        // $("#" + id + " dd ul").hide();
        $("#" + id + " dd ul").slideUp();

        //set the hidden select
        var sid = id.replace("target_", "");
        $("#" + sid).val(getSelectedValue(id));


        //if specialism reset sectors and skills
        if (id == specialismsId) {

            //this sets sector dropdown, which trigger skills to be set
            SetDropDown(skillsId, getSelectedValue(specialismsId));
            SetDropDown(sectorsId, getSelectedValue(specialismsId));

            $("#" + sectorsId + " dt a").html(allsectors);
            $("#" + skillsId + " dt a").html(allskills);
        }

        //if sector (not specialism) reset skills
        if (id == sectorsId) {
            if (getSelectedValue(sectorsId) != "") {
                SetDropDown(skillsId, getSelectedValue(sectorsId));
            }
        }
    });
}

function DisableDropDown(id) {
    $("#" + id + " dt a").unbind('click');
    $("#" + id + " dt a").addClass("disabled");
}

function ResetJobSearch() {
    $('#JobIDKeywords').val("");
    $('#SearchLocation').val("");
    $('#SearchLocation').show();
    $("#search_box .strloc").hide();

    $('input[title!=""]').hint();

    $("#target_RadiusToSearch dd ul li:first a").click();
    $("#" + specialismsId + " dd ul li:first a").click();
    $("#target_MinSalary dd ul li:first a").click();
    $("#target_MinRate dd ul li:first a").click();
    $("#target_VacancyTypeToSearch dd ul li:eq(2) a").click();

    DisableDropDown(skillsId);
    DisableDropDown(sectorsId);
}  

