﻿var highlightindex = -1; //定义高亮显示索引,-1代表不高亮任何行 
var timeOutId = null; //定义延迟时间Id
var delayTime = 0; //默认延迟0.5秒
var minPrefix = 0; //定义最小几个字符开始搜索
var mouseOverCss = { background: "white", cursor: "pointer"}; //mouseover时样式
var mouseOutCss = {background: "white" }; //mouseout时样式
var grayCss = { background: "#D1F9CA", cursor: "pointer"};
var upDownGrayCss = { color:"#FF6600",background: "#D1F9CA" };
var upDownWhiteCss = {color:"black", background: "white" };

var ajaxProcessUrl = "/service/autocomplete.ashx"; //发送ajax请求调用处理url

$(document).ready(function() {
  
    var wordInput = $("#txtKeywords");
    var wordInputOffset = wordInput.offset();
    //隐藏自动补全框,并定义css属性
              //$("#divAutoList").hide()
              //.css("position", "absolute")
              //.css("border", "1px black solid") //边框 黑色
              //.css("top", wordInputOffset.top+wordInput.height()+5+"px")
              $("#divAutoList").css("left", wordInputOffset.left+1+"px");
              //.width(wordInput.width()+2);


    //给文本框添加键盘按下并弹起的事件
    wordInput.keyup(function(event) {
        var myEvent = event || window.event;
        var keyCode = myEvent.keyCode;
        var autoNode = $("#divAutoList"); //可供选择的项
        //        if (keyCode >= 65 && keyCode <= 90 || keyCode == 8 || keyCode == 46) { //输入字母,退格或删除,显示最新的内容
        if (keyCode != 13 && keyCode != 38 && keyCode != 40) { //不是三个特殊键，可以搜索
            highlightindex=-1;
            var wordText = $("#txtKeywords").val();
            if(wordText==""){
                autoNode.hide();
                return;
            }
            if (wordText.length < minPrefix) return;
            //取消上次提交
            //window.clearTimeout(timeOutId);
            timeOutId = setTimeout(function() {
                //ajax请求
                $.post(ajaxProcessUrl, { KeyWord: wordText }, function(data) {
                    var jqueryObj = $(data);
                    var wordNodes = jqueryObj.find("KeyWord"); //xml节点名
                    var countNodes=jqueryObj.find("count");
                    autoNode.html("");
                    wordNodes.each(function(i) {
                        var wrodNode = $(this);
                        var newDivNode = $("<div>").attr("id", i);
                        newDivNode.html("<span>约"+countNodes.eq(i).text()+"个结果</span>"+"<font>"+wrodNode.text()+"</font>").appendTo(autoNode); //xml文本内容( wrodNode.text() )
                        //添加光标进入事件, 高亮节点
                        newDivNode.mouseover(function() {
                            if (highlightindex != -1) {
                                $("#divAutoList").children("div")
                                                            .eq(highlightindex)
                                                            .css(mouseOverCss);
                            }
                            highlightindex = $(this).attr("id");
                            $(this).css(grayCss);
                        });

                        //添加光标移出事件,取消高亮
                        newDivNode.mouseout(function() {
                            $(this).css(mouseOutCss);
                        });

                        //添加光标mousedown事件  点击事件newDivNode.click可能不起作用?
                        newDivNode.mousedown(function() {
                            var comText = $(this).find("font").text();
                            //$("#divAutoList").hide();
                            //highlightindex = -1;
                            $("#txtKeywords").val(comText);
                            go();
                        });
                    });
                    if (wordNodes.length > 0) {
                        autoNode.show();
                    }
                    else {
                        autoNode.hide();
                        highlightindex = -1;
                    }

                }, "xml"); //xml结果集
            }, delayTime);
        }
        else if (keyCode == 38) {//输入向上,选中文字高亮
            var autoNodes = $("#divAutoList").children("div")
            if (highlightindex != -1) {
                autoNodes.eq(highlightindex).css(upDownWhiteCss);
                highlightindex--;
            }
            else {
                highlightindex = autoNodes.length - 1;
            }

            if (highlightindex == -1) {
                highlightindex = autoNodes.length - 1;
            }
            $("#txtKeywords").val(autoNodes.eq(highlightindex).find("font").text());
            autoNodes.eq(highlightindex).css(upDownGrayCss);
        }
        else if (keyCode == 40) {//输入向下,选中文字高亮
            var autoNodes = $("#divAutoList").children("div")
            if (highlightindex != -1) {
                autoNodes.eq(highlightindex).css(upDownWhiteCss);
            }
            highlightindex++;
            if (highlightindex == autoNodes.length) {
                highlightindex = 0;
            }
            $("#txtKeywords").val(autoNodes.eq(highlightindex).find("font").text());
            autoNodes.eq(highlightindex).css(upDownGrayCss);
        }
        else if (keyCode == 13) {//输入回车
           go();
        }
    });

    //给查询框添加blur事件，隐藏提示层
    $("#txtKeywords").blur(function() {
        $("#divAutoList").hide();
    });

});
