$(document).ready(function() {
    $("#StartSearch").click(function() {
        $("#results").fadeIn("slow", GetImageResults);
    });

    $("#SearchTerm").keyup(GetSearchResultsPreview);

    $("#results h5").click(function() {
        $("#results").fadeOut("slow");
    });

});

function GetSearchResultsPreview() {
    var searchTerm = $('#SearchTerm').val();
    $.ajax({
        type: "POST",
        url: "SearchService.asmx/GetSearchResultPreview",
        data: "{'searchTerm': \"" + searchTerm + "\"}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(msg) {
            BuildSearchResultsPreview(msg);
        },
        error: AjaxFailed
    });
}
function BuildSearchResultsPreview(msg) {
    var searchResults = msg.d;
    var results = '<ul>';
    for (var result in searchResults) {
        results += "<li>" + searchResults[result] + "</li>";
    }
    results += "</ul>";
    $("#SearchResultsPreview").html(results);
    $("#SearchResultsPreview li").hover(function() {
        $(this).addClass("hover");
    },
    function() {
        $(this).removeClass("hover");
    });

    $("#SearchResultsPreview li").click(function() {
        $('#SearchTerm').val($(this).html());
        $("#SearchResultsPreview").html("");
    });
}
function GetImageResults() {
    $.ajax({
        type: "POST",
        url: "SearchService.asmx/GetImageResults",
        data: "{'searchTerm': \"" + $('#SearchTerm').val() + "\"}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(msg) {
            BuildImageResultsTable(msg);
        },
        error: AjaxFailed
    });
    sIFR.replaceElement("#results h2", named({ sFlashSrc: "sifr/comfortaa.swf", sColor: "#ffffff", sWmode: "transparent" }));
}
function AjaxFailed(result) {
    alert(result.status + ' ' + result.statusText);
}  
function BuildImageResultsTable(msg) {
    var table = '<table><tbody>';
    //$('#Container').html(msg.d[0].EmployeeID);
    var imageResults = msg.d;
    for (var imageResult in imageResults) {
        var row = '<tr>';
        row += '<td><a class="colorbox" href="Handler.ashx?Image=' +
                                imageResults[imageResult].SmallImageName +
                                '"><img src="Handler.ashx?Image=' +
                                imageResults[imageResult].ThumbnailImageName +
                                '" border="0"/></a>';
        row += '<td><strong>' + imageResults[imageResult].Title + '</strong><br />';
        row += '' + imageResults[imageResult].Description + '</td>';
        row += '</tr>';
        table += row;
    }
    table += '</tbody></table>';
    $('#results-table').html(table);
}