var plotRegion = { salary_min: 20, salary_max: 250 };

function scalex(v) {
    var width = $(".chart").width();
    if (v < plotRegion.salary_min)
        v = plotRegion.salary_min;
    if (v > plotRegion.salary_max)
        v = plotRegion.salary_max;
    return parseInt((v - plotRegion.salary_min) * width / (plotRegion.salary_max - plotRegion.salary_min));
}

function construct_xaxis(w, min, max) {
    var render = '<div class="salary_rel">';
    var increment = 50;
    var i;

    for (i = 0; i < min; i += increment)
        ;
    for (; i < max; i += increment)
        render += '<div style="position: absolute; left: '
                    + scalex(i)
                    + 'px; top: -8px;">' + i + 'k</div>';

    render += '</div>';
    return render;
}

function plotSalaries() {
    $('#xaxis').html(construct_xaxis($('#xaxis').width(), plotRegion.salary_min, plotRegion.salary_max));
    $.each($("#searchresults .td_salaries"), function() {
        var id = $(this).parent().attr("id");
        var salaries = eval(salaries_data[id].salaries);
        var h = $(this).height();
        var render = '<div class="salary_rel">';
        var avg = 0;
        for (i = 0; i < salaries.length; i++) {
            //var city = salaries_data[id].cities[i];
            var state = salaries_data[id].states[i];
            avg += salaries[i]
            render += '<div style="position: absolute; left: ' 
                            + scalex(salaries[i]) 
                            + 'px; top:-' + 8 + 'px;" >'
                + '<img src="media/images/bc.png" title="' + salaries[i] + 'K, ' + state + '" /></div>';
        }
        avg /= salaries.length;
        render += '</div>';
        $(this).html(render);
    });
}


function plotFavSalaries() {
    $('#fav_xaxis').html(construct_xaxis($('#fav_xaxis').width(), plotRegion.salary_min, plotRegion.salary_max));
    $.each($("#fav_results .td_salaries"), function() {
        var id = $(this).parent().attr("id");
        var salaries = eval(fav_salaries_data[id].salaries);            
        var h = $(this).height();
        var render = '<div class="salary_rel">';
        var avg = 0;
        for (i = 0; i < salaries.length; i++) {
            //var city = fav_salaries_data[id].cities[i];
            var state = fav_salaries_data[id].states[i];
            avg += salaries[i]
            render += '<div style="position: absolute; left: ' 
                            + scalex(salaries[i]) 
                            + 'px; top:-' + 8 + 'px;" >'
                + '<img src="media/images/bc.png" title="' + salaries[i] + 'K, ' + state + '" /></div>';
        }
        avg /= salaries.length;
        render += '</div>';
        $(this).html(render);
    });
}

function replotSalaries() {
    $('#xaxis').html(construct_xaxis($('#xaxis').width(), plotRegion.salary_min, plotRegion.salary_max));

    $.each($(".td_salaries"), function() {
        var salaries = eval($(this).text());
        var h = $(this).height();
        var render = '<div class="salary_rel">';
        for (i = 0; i < salaries.length; i++) {
            render += '<div style="position: absolute; left: ' 
                            + scalex(salaries[i]) 
                            + 'px; top:-' + 8 + 'px;" ><img src="media/images/bc.png" /></div>';
        }
        render += '</div>';
        $(this).html(render);
    });
}

function favorited() {
    favstring = ''
    $.each($(".favcbox"), function () {
        if ($(this).attr("checked")) {
            p = $(this).parent().parent().attr("id");
            favstring += salaries_data[p].company + ':' + salaries_data[p].title + ';';
        }
    });
    $('#favinput').attr("value", favstring);
}

$(document).ready(function() {
    plotSalaries();
    plotFavSalaries();

    $(".favcbox").change(favorited);
    $("#state_filter").change(plotSalaries);
    $("#fav_state_filter").change(plotFavSalaries);

    $("#state_filter").removeAttr('disabled');
    $("#state_default").attr('selected', 'selected');
    $("#fav_state_filter").removeAttr('disabled');
    $("#fav_state_default").attr('selected', 'selected');

    $("#company").addClass('acfb-input').wrap('<ul class="acfb-holder" id="company-holder"></ul>');
    var cacfb = $("#company-holder").autoCompletefb({urlLookup:"companies", 
        inputId : "#company",
        inputDefault:"All",
        acOptions: {
            minChars: 2,
            max: 20,
            delay: 100,
            autoFill: false,
            mustMatch: false,
            matchContains: true,
            scrollHeight: 220}});

    $("#title").addClass('acfb-input').wrap('<ul class="acfb-holder" id="title-holder"></ul>');
    var tacfb = $("#title-holder").autoCompletefb({urlLookup:"titles", 
        inputId : "#title",
        inputDefault:"All",
        acOptions: {
            minChars: 3,
            max: 20,
            delay: 100,
            autoFill: false,
            mustMatch: false,
            matchContains: true,
            scrollHeight: 220}});

    
    /* Convert company list into facebook style boxes */
    if ($("#company").val() != "All") {
        var clist = $("#company").val().split("|");
        for (var key in clist) {
            cacfb.addData(clist[key]);
        }
    }

    if ($("#title").val() != "All") {
        var tlist = $("#title").val().split("|");
        for (var key in tlist) {
            tacfb.addData(tlist[key]);
        }
    }

    $("#company").focus(function() {
        if ($(this).val() == "All") 
            $(this).select();
    });

    $("#title").focus(function() {
        if ($(this).val() == "All") 
            $(this).select();
    });

    $("#searchb").click(function() {
        var result = cacfb.getData();
        if (result == "All" ||
            result == "") {
            cacfb.addData("All");
            cacfb.getData();            
        }

        result = tacfb.getData();   
        if (result == "All" ||
            result == "") {
            tacfb.addData("All");
            tacfb.getData();            
        }
        
        $("#company").hide();
        $("#title").hide();
    });

    $("#company").focus();
});