var smallImgData = [];
smallImgData["downHover"] = {
    direction: 1,
    target: "last-child",
    className:"downer",
    visible: function () {
		var o = $("#imageMenu");
        if(o.length==1)
        {
            return o.scrollTop() + o.height() == o.get(0).scrollHeight;
        }else{
            return false;
        }
    },
    span: function ($dom) {
        return $dom.position().top;
    },
    scrollSpan: function ($dom) {
        return $dom.scrollTop();
    },
    animateParam: function (move) {
        return { scrollTop: move };
    }
};
smallImgData["upHover"] =
{
    direction: -1,
    target: "first",
    className:"upper",
    visible: function () {
        return $("#imageMenu").scrollTop() == 0;
    },
    span: function ($dom) {
        return $dom.position().top;
    },
    scrollSpan: function ($dom) {
        return $dom.scrollTop();
    },
    animateParam: function (move) {
        return { scrollTop: move };
    }
};

function checkMenuStatus() {
    for (key in smallImgData) {
        if (smallImgData[key]!=undefined && typeof(smallImgData[key].visible)!="undefined" && smallImgData[key].visible()) {
            $("."+key).removeClass(key).addClass(smallImgData[key].className);
        } else {
                $("."+smallImgData[key].className).addClass(key).removeClass(smallImgData[key].className);
        }
    }
}

$(function(){
	$(".smallImgDown,.smallImgUp").live("click", function () {
        var className = $(this).attr("class");
        if(className.indexOf("downHover")>-1)
            className = "downHover";
        if(className.indexOf("upHover") >-1)
            className = "upHover";
        if(className == "downHover" || className == "upHover"){
            var mydata = smallImgData[className];
            var num = 0;
            while (mydata.span($("#imageMenu")) > mydata.span($("#imageMenu li").eq(num))) {
                num++;
            }

            num += 5 * mydata.direction;

            var $li = $("#imageMenu li").eq(num);
            if ($li.length == 0 || num < 0) {
                $li = $("#imageMenu li:" + mydata.target);
            }

            var move = mydata.scrollSpan($("#imageMenu")) + mydata.span($li) - mydata.span($("#imageMenu"));
            $("#imageMenu").animate(mydata.animateParam(move), 500, checkMenuStatus);
        }
	});
})