System = {
	Train: {
		"default": [{"Item": "K586/K587"}, {"Item": "D31"}, {"Item": "T176"}, {"Item": "K9004"}, {"Item": "T201/T204"}, {"Item": "K78/K75"}]
	},
	Station: {
		"default": [{"Item": "北京"}, {"Item": "上海"}, {"Item": "广州"}, {"Item": "深圳"}, {"Item": "杭州"}, {"Item": "武汉"}]
	}
};

var currentInput;
var speed = 300;
var searchType = 3; //1：车次搜索，2：站点搜索，3：站站搜索
$(document).ready(function() {
    $("#SearchStation2Station").attr("checked", true);
    settab(3);
    $("#SearchTrain").click(function(e) { searchType = 1; settab(1); });
    $("#SearchStation").click(function(e) { searchType = 2; settab(2); });
    $("#SearchStation2Station").click(function(e) { searchType = 3; settab(3); });
    $("#stationname").focus(function(event) {
        if ($("#stationname").val().indexOf("输入") > -1)
            $("#stationname").val("");
        $("#stationname").css("color", "#000");
        currentInput = event.target;
        if ($(event.target).val() == "") return;
        if (searchType == 1) {
            getTrainList($(event.target).val(), event);
        }
        if (searchType == 2) {
            getStationList($(event.target).val(), event);
        }
    });
    $("#city1").focus(function(event) {
        if ($("#city1").val().indexOf("输入") > -1)
            $("#city1").val("");
        $("#city1").css("color", "#000");
        if ($(event.target).val() != "")
            getStationList($(event.target).val(), event);
    });
    $("#city2").focus(function(event) {
        if ($("#city2").val().indexOf("输入") > -1)
            $("#city2").val("");
        $("#city2").css("color", "#000");
        if ($(event.target).val() != "")
            getStationList($(event.target).val(), event);
    });
    $("#stationname").bind("blur", hideDiv);
    $("#city1").bind("blur", hideDiv);
    $("#city2").bind("blur", hideDiv);
    $("#stationname").keyup(function(event) {
        var key = window.event ? event.keyCode : event.which;
        if (key != 40 && key != 38) {
            currentInput = event.target;
            if (searchType == 1) {
                getTrainList($(event.target).val(), event);
            }
            if (searchType == 2) {
                getStationList($(event.target).val(), event);
            }
        } else {
            if (key == 40) {
                Move(1);
            }
            if (key == 38) {
                Move(-1);
            }
        }
    });

    $("#city1").keyup(function(event) {
        var key = window.event ? event.keyCode : event.which;
        if (key != 40 && key != 38) {
            currentInput = event.target;
            getStationList($(event.target).val(), event);
        } else {
            if (key == 40) {
                Move(1);
            }
            if (key == 38) {
                Move(-1);
            }
        }
    });

    $("#city2").keyup(function(event) {
        var key = window.event ? event.keyCode : event.which;
        if (key != 40 && key != 38) {
            currentInput = event.target;
            getStationList($(event.target).val(), event);
        } else {
            if (key == 40) {
                Move(1);
            }
            if (key == 38) {
                Move(-1);
            }
        }

    });
    $("#btnSearch1").click(function(e) {
        if (checkInput1()) {
            var url = "";
            if (searchType == 1) {
                url = "/?action=getTrain&tId=" + encodeURI($("#stationname").val());
            }
            if (searchType == 2) {
                url = "/?action=getStation&title=" + encodeURI($("#stationname").val());
            }
            window.location.href = url;
        } else {
            return false;
        }
    });
    $("#btnSearch2").click(function(e) {
        if (checkInput2()) {
            var url = "";
            if (searchType == 3) {
                url = "/?action=getData&start=" + encodeURI($("#city1").val()) + "&end=" + encodeURI($("#city2").val());
            }
            window.location.href = url;
        } else {
            return false;
        }
    });
});

var selectList = function(event) {
    if ($("#divSmartList").find("span").length <1) return;
    var key = event.keyCode || event.which || event.charCode;
    if (key == 40) {
        Move(1);
    }
    if (key == 38) {
        Move(-1);
    }
};


var Move = function(len) {
    if ($("#divSmartList").find("span").length < 1) return;
    var i = 0;
    var $item = $("#divSmartList span.current:eq(0)");
    var obj = new Object();
    obj.data = new Object();
    if ($item.size() > 0) {
        $item.removeClass();
        if (len == 1 && $item.next("span")) {
            obj.data.arg = "#" + $item.next("span").attr("id");
        } else if (len == -1 && $item.prev("span")) {
            obj.data.arg = "#" + $item.prev("span").attr("id");
        }
    } else {
        obj.data.arg = "#" + $("#divSmartList span:eq(0)").attr("id");
    }
    SetColorOver(obj);
    ItemSelected(obj);
}


var checkInput1 = function() {
    var input = $("#stationname").val().trim();
    if (searchType == 1) if (input == "" || input == "请输入列车车次") { alert("请输入列车车次!~"); return false; }
    if (searchType == 2) if (input == "" || input == "请输入站点名称") { alert("请输入站点名称!~"); return false; }
    return true;
};

var checkInput2 = function() {
    var input1 = $("#city1").val().trim();
    var input2 = $("#city2").val().trim();
    if (input1 == "" || input1 == "输入出发站名称") { alert("输入出发站名称!~"); return false; }
    if (input2 == "" || input2 == "输入终点站名称") { alert("输入终点站名称!~"); return false; }
    return true;
};

var hideDiv = function() {
    if (searchType == 1) {
        if ($("#stationname").val().trim() == "") {
            $("#stationname").val("请输入列车车次");
            $("#stationname").css("color", "#888");
        }
    }
    if (searchType == 2) {
        if ($("#stationname").val().trim() == "") {
            $("#stationname").val("请输入站点名称");
            $("#stationname").css("color", "#888");
        }
    }
    if (searchType == 3) {
        if ($("#city1").val().trim() == "") $("#city1").val("输入出发站名称");
        if ($("#city2").val().trim() == "") $("#city2").val("输入终点站名称");
        $("#city1").css("color", "#888");
        $("#city2").css("color", "#888");
    }
    $("#divSmartList").hide(speed);
};

var getTrainList = function(arg, target) {
	arg = $.trim(arg);
	if (arg == '') return initSmartDiv(System.Train['default']);
	if (System.Train[arg]) return initSmartDiv(System.Train[arg]);
    $.getJSON("/", { action: "train", key: arg }, function(json) {
        if (json.length < 1)
            $("#divSmartList").html("<span>没有此车次</span>");
        else {
			System.Train[arg] = json;
            initSmartDiv(json);
        }
        ShowSmartSearch(target);
    });
};

var getStationList = function(arg, target) {
	arg = $.trim(arg);
	if (arg == '') return initSmartDiv(System.Station['default']);
	if (System.Station[arg]) return initSmartDiv(System.Station[arg]);
    $.getJSON("/", { action: "station", key: arg }, function(json) {
        if (json.length < 1) {
            $("#divSmartList").html("<span>没有此站点</span>");
		} else {
			System.Station[arg] = json;
            initSmartDiv(json);
        }
        ShowSmartSearch(target);
    });
};

var initSmartDiv = function(json) {
	$("#divSmartList").html("<div>用鼠标或↑↓选择</div>");
    for (var i = 1; i <= json.length; i++) {
        var item = $("<span></span>");
        item.bind("mousedown", { arg: "#item" + i }, ItemSelected);
        item.bind("mouseover", { arg: "#item" + i }, SetColorOver);
        item.bind("mouseout", { arg: "#item" + i }, SetColorOut);
        item.html(json[i - 1].Item);
        item.attr("id", "item" + i);
        item.attr("title", json[i - 1].Item);
        $("#divSmartList").append(item);
    }
};

var ItemSelected = function(arg) {
    if ($(arg.data.arg).html())
        $(currentInput).val($(arg.data.arg).html());
};

var SetColorOver = function(arg) {
    $("#divSmartList span.current:eq(0)").removeClass();
    $(arg.data.arg).addClass("current");
};

var SetColorOut = function(arg) {
   $(arg.data.arg).removeClass();
}

var settab = function(index) {
    $("#b2").attr("className", index == 3 ? "hc" : "sc");
    $("#b1").attr("className", index == 3 ? "sc" : "hc");
    if (index == 1) {
        $("#stationname").val($("#stationname").val().trim() == "" || $("#stationname").val().trim() == "请输入站点名称" ? "请输入列车车次" : $("#stationname").val());
    }
    if (index == 2) {
        $("#stationname").val($("#stationname").val().trim() == "" || $("#stationname").val().trim() == "请输入列车车次" ? "请输入站点名称" : $("#stationname").val());
    }
    $("#city1").val($("#city1").val().trim() == "" ? "输入出发站名称" : $("#city1").val());
    $("#city2").val($("#city2").val().trim() == "" ? "输入终点站名称" : $("#city2").val());
    for (i = 1; i <=3; i++) {
        if (i == index) { $('#tab' + i).attr("className", "selected"); }
        else { $('#tab' + i).attr("className", ""); }
    }
};

var ShowSmartSearch = function(event) {
    var offset = $(event.target).offset();
    $("#divSmartList").css({ top: offset.top + 8 + $(event.target).height() + "px", left: offset.left });
    $("#divSmartList").css({ width: $(event.target).width() + "px" });
    $("#divSmartList").show(speed);
    $("#divSmartList").css({ "z-index": 0 });
};

//删除字符串两端的空格
String.prototype.trim = function() {
    return this.replace(/(^\s*)|(\s*$)/g, "");
}