//定义全局变量
//表示当前高亮
var highlightindex = -1;
var timeoutId;
//页面装载 隐藏自动补全框
$(document).ready(function () {
	var wordInput = $("#searchKeywords");
	var wordInputOffset = wordInput.offset();
	$("#auto").hide().css({"background":"#fff","text-indent":"10px","z-index":"9"}).css("position", "absolute").css("top", wordInputOffset.top + wordInput.innerHeight()+ "px").css("left", wordInputOffset.left + "px").width(wordInput.innerWidth());
           //给文本框添加键盘建被按下并弹起的事件
	wordInput.keyup(function (event) {
		var myEvent = event || wondow.event;
		var keyCode = myEvent.keyCode;
		//48<=keyCode && keyCode <=57对于键盘  上（0123456789）
		//96<=keyCode && keyCode <=105对于键盘  数字键（0123456789）
		//keyCode >= 65 && keyCode <= 90  a~z
		
		if ( (48<=keyCode && keyCode <=57) ||(96<=keyCode && keyCode <=105)  || (keyCode >= 65 && keyCode <= 90) || (keyCode == 8 || keyCode == 46 || keyCode == 32)) {
            //1.获取
			var wordText = $("#searchKeywords").val();
			var autoNode = $("#auto");
			if (wordText != "" && $.trim(wordText).length >　0) {
				clearTimeout(timeoutId);
                      //延迟
				timeoutId = setTimeout(function () {
                      //2.发给服务器
				$.ajax({
				  type: 'POST',
				  url: "/auto/position.ajax",
				  data: {word:wordText},
				  dataType: "json",
				  cache:false,
				  success:function(wordNodes){
					 autoNode.html("");
					 //遍历word节点
					 $(wordNodes).each(function (i) {
                       //创建div
							var newDivNode = $("<div>").attr("id", i).css({"line-height":"30px","text-align":"left"});
							newDivNode.html(this.name).appendTo(autoNode);
                           //鼠标进入
							newDivNode.mouseover(function () {
								$(this).css("cursor", "pointer");
								if (highlightindex != -1) {
									$("#auto").children("div").eq(highlightindex).css({"background-color":"white","color":"#333"});
								}
								highlightindex = $(this).attr("id");
								$(this).css({"background-color":"#f0f0f0","color":"#333"});
							});
                           //鼠标离开
							newDivNode.mouseout(function () {
								$(this).css({"background-color":"white","color":"#333"});
							});
							newDivNode.click(function () {
                                 //有高亮的情况下
								if (highlightindex != -1) {
									var comText = $(this).text();
									$("#auto").hide();
									highlightindex = -1;
									$("#searchKeywords").val(comText);
									submitSearch();
								} else {
									//alert("\u6587\u672c\u6846\u4e2d\u7684[" + $("#searchKeywords").val() + "]\u88ab\u63d0\u4ea4\u4e86");
									$("#auto").hide();
									//让文本框失去焦点
									$("#searchKeywords").get(0).blur();
									submitSearch();
								}
							});
						});
					 
					 //如果服务器端有数据返回并显示
						if (wordNodes.length > 0) {
							autoNode.show();
						} else {
							autoNode.hide();
							highlightindex = -1;
						}
					  
				  }
				});}, "500");
			} else {
				autoNode.hide();
				highlightindex = -1;
			}

               //如果输入方向建
		} else {
			if (keyCode == 38 || keyCode == 40) {
				if (keyCode == 38) {
                         //向上
					var autoNodes = $("#auto").children("div");
					if (highlightindex != -1) {
						autoNodes.eq(highlightindex).css({"background-color":"white","color":"#333"});
						highlightindex--;
					} else {
						highlightindex = autoNodes.length - 1;
					}
					if (highlightindex <= -1) {
                                //将索引指向最后一个元素
						highlightindex = autoNodes.length - 1;
					}
					autoNodes.eq(highlightindex).css({"background-color":"#f0f0f0","color":"#333"});
					
					//选择下拉值到搜素框
					var selectedVal = $(autoNodes[highlightindex]).html();
					wordInput.val(selectedVal);
				}
				if (keyCode == 40) {
                         //向下
					var autoNodes = $("#auto").children("div");
					if (highlightindex != -1) {
						autoNodes.eq(highlightindex).css({"background-color":"white","color":"#333"});
					}
					highlightindex++;
					console.info("autoNodes.html() = "+autoNodes);
					if (highlightindex >= (autoNodes.length)) {
                                  //将索引指向最后一个元素
						highlightindex = 0;
					}
					autoNodes.eq(highlightindex).css({"background-color":"#f0f0f0","color":"#333"});
					
					//选择下拉值到搜素框
					var selectedVal = $(autoNodes[highlightindex]).html();
					wordInput.val(selectedVal);
				}

             //回车
			} else {
				if (keyCode == 13) {
                   //有高亮的情况下
					if (highlightindex != -1) {
						var comText = $("#auto").hide().children("div").eq(highlightindex).text();
						highlightindex = -1;
						$("#searchKeywords").val(comText);
						submitSearch();
					} else {
						//alert("\u6587\u672c\u6846\u4e2d\u7684[" + $("#searchKeywords").val() + "]\u88ab\u63d0\u4ea4\u4e86");
						$("#auto").hide();
                      //让文本框失去焦点
						$("#searchKeywords").get(0).blur();
						submitSearch();
					}
				}
			}
		}
	});
});