(function ($) {
    $.fn.rollover = function () {
        var elems = this;
        var nelems = elems.length;
        var off = "_off";
        var on = "_on";
        var preLoadImg = new Object();
        for (var i = 0; i < nelems; i++) {
            preLoadImg[elems[i]] = new Image();
            preLoadImg[elems[i]].src = elems[i].src.replace(off, on);
            elems[i].onmouseover = function () {
                this.src = this.src.replace(off, on);
            }
            elems[i].onmouseout = function () {
                this.src = this.src.replace(on, off);
            }
        }
    }
})(jQuery);

$(function () {

    var timer = setInterval(moveThumb, 100);
    var elems = $("#top-thumb li");
    var nelems = elems.length;
    var index = 0;

    // 全体の高さを取得
    $("#top-thumb").height(Math.ceil(nelems / 3) * 260);

    function moveThumb() {
        var top = Math.floor(index / 3) * 260;
        var left = (index % 3) * 271;
        var options = {
            top: top + "px",
            left: left + "px",
            opacity: "0.6"
        }
        var animateEnd = function () {
                $(this).css("opacity", "");
            }

        elems.eq(index).animate(options, "slow", "easeOutQuint");
        elems.eq(index).animate({
            "opacity": "1"
        }, animateEnd);

        index++;
        if (index >= nelems) {
            clearInterval(timer);
        }
    }

    // header-search
    $("p", "#hdr-search").click(function () {
        var keywords = $("input.search-keywords", "#hdr-search");
        if (keywords.is(":visible") == false) {
            keywords.slideDown('fast').focus();
            return false;
        } else {
            keywords.slideUp('fast').focus();
            return false;
        }

    });

    $("img[src*='_off.'], input[type='image']").rollover();
});


$.event.add(window, "load", function () {
    // detail
    var thumbView = $("#thumb-view");
    var thumbs = $("ul.list-thumb-02", "#thumb-view");
    var allWidth = (thumbs.find("li").length) * 381;
    var defaultHeight = thumbs.find('li:eq(0)').height();
    var arrayHeight = [];
    var arrayMargin = [];

    $("ul.list-thumb-02 li", "#thumb-view").each(function (index) {
        arrayHeight.push($(this).height());
        arrayMargin.push(-381 * index);
    });

    thumbView.css({
        "height": defaultHeight
    });
    thumbs.css({
        "width": allWidth
    });

    $("div.images ul li.next", "#layout-detail").click(function () {
        var current = thumbView.find('.list-thumb-02').css("margin-left").replace("px", "") / -381;
        if (allWidth + arrayMargin[current + 1] > 0 && thumbs.is(":animated") == false) {
            thumbs.animate({
                "margin-left": arrayMargin[current + 1]
            }, function () {
                thumbView.animate({
                    "height": arrayHeight[current + 1]
                });
            });
        }
    });

    $("div.images ul li.prev", "#layout-detail").click(function () {
        var current = thumbView.find('.list-thumb-02').css("margin-left").replace("px", "") / -381;
        var marginLeft = Number(thumbs.css("margin-left").replace("px", "")) + 381;

        if (arrayMargin[current - 1] <= 0 && thumbs.is(":animated") == false) {
            thumbs.animate({
                "margin-left": arrayMargin[current - 1]
            }, function () {
                thumbView.animate({
                    "height": arrayHeight[current - 1]
                });
            });
        }
    });
});