$(document).ready(function() {
    var originalSearchPhrase = $("#ajax-search-results").html();
    var originaltxtSearch = "Enter Search Phrase"

//    $("input.txtSearch").click(function() {
//        if ($(this).val() == originaltxtSearch) {
//            $(this).val("");
//        } else {
//            $(this).select().focus();
//        }
//    });

    $(".txtSearch").keyup(function() {
        //$("#ajax-search-results").toggle();
        if ($(".txtSearch").val().length > 2) {
            refreshSearch($(".txtSearch").val());
            $("#ajax-search-results").show();
        } else {
            $("#ajax-search-results").hide();
            $("#ajax-search-results").html(originalSearchPhrase);
        }
    });
    var theBox = $(".txtSearch");
    var theResults = $("#ajax-search-results");
    $(theBox).attr("focus", "0");
    $(theResults).attr("focus", "0");

    $(theResults).hover(function() {
        $(theResults).attr("focus", "1");
    }, function() {
        $(theResults).attr("focus", "0");
        if ($(theBox).attr("focus") == "0") {
            $("#ajax-search-results").hide();
        }
    });

    $(theBox).focus(function() {
        if (($(this).val() != originaltxtSearch) && $(this).val().length > 2) {
            $("#ajax-search-results").show();
            refreshSearch($(this).val());
        }
        $(theBox).attr("focus", "1");
    });
    $(theBox).blur(function() {
        if ($(theResults).attr("focus") == "0") {
            $("#ajax-search-results").hide();
            $("#ajax-search-results").html(originalSearchPhrase);
        }
        $(theBox).attr("focus", "0");

    });


});

function refreshSearch(phrase) {
    $.ajax(
    {
        type: "GET",
        url: "/webassets/ajaxHandlers/ajaxsearch.aspx",
        //global: false,
        data: "s=" + phrase,
        success:
          function(data) {
              var myData = $(data).find(".ajax");
              $(myData).each(function() {
                  var toReplace = $(this).attr("id");
                  //alert("Data Loaded: " + toReplace);
                  var html = $(this).html();
                  $("#" + toReplace).html(html);
              }); //each
              //alert("Data Loaded: " + $(myData).attr("class"));
          }
    });  //end ajax
}