用 slide 方式加载树形结构数据项

查找指定容器下所有 a 根据属性决定是否应用 ajax 方式加载内容。

使用层次深度来控制slide的方向。

使用 margin-left/margin-right animation 显示过渡效果。

ZH || (ZH = {});
ZH.TreeSlider = function () {
    if (window.history && window.history.pushState) if ($("#slider").length != 0) if (!navigator.userAgent.match(/(iPod|iPhone|iPad)/)) {
        var a = this;
        a.enabled = true;
        $("#slider a.js-slide-to, .breadcrumb a").live("click", function (d) {
            return a.clickHandler(d)
        });
        $(window).bind("popstate", function (d) {
            a.popStateHandler(d.originalEvent)
        })
    }
};
ZH.TreeSlider.prototype = {
    enabled: false,
    sliding: false,
    slideSpeed: 400,
    frameForPath: function (a) {
        return $('.frame[data-path="' + a + '"]')
    },
    frameForURL: function (a) {
        return this.frameForPath(this.pathFromURL(a))
    },
    pathFromURL: function (a) {
        var d = /\/(tree|blob)\/[^\/]+\//;
        a = a.split(d)[2] || "/";
        if (a.slice(a.length - 1, a.length) != "/") a += "/";
        return unescape(a)
    },
    scrollToBreadcrumb: function () {
        this.visibleInBrowser(".breadcrumb:visible") || $(".breadcrumb:visible").scrollTo(50)
    },
    visibleInBrowser: function (a) {
        var d = $(window).scrollTop(),
            c = d + $(window).height(),
            b = $(a).offset().top;
        a = b + $(a).height();
        return a >= d && b <= c
    },
    clickHandler: function (a) {
        if (a.which == 2 || a.metaKey || a.ctrlKey) return true;
        if (this.sliding) return false;
        a = a.target.href;
        var d = this.pathFromURL(a);
        window.history.pushState({
            path: d
        }, "", a);
        typeof _gaq != "undefined" && _gaq.push(["_trackPageview"]);
        this.slideTo(a);
        return false
    },
    popStateHandler: function () {
        this.slideTo(location.pathname)
    },
    doneSliding: function () {
        $("#slider").trigger("pageUpdate");
        if (this.sliding) {
            this.sliding = false;
            $("#slider .frame-center").nextAll(".frame").hide();
            $("#slider .frame-center").prevAll(".frame").css("visibility", "hidden");
            var a = $(".frame-loading:visible");
            a.length ? a.removeClass("frame-loading") : $("#slider").trigger("slid")
        }
    },
    slideTo: function (a) {
        var d = this.pathFromURL(a),
            c = this.frameForPath(d),
            b = $("#slider .frame-center").attr("data-path") || "";
        c.is(".frame-center") || (b == "/" || d.split("/").length > b.split("/").length ? this.slideForwardTo(a) : this.slideBackTo(a))
    },
    slideForwardTo: function (a) {
        debug("Sliding forward to %s", a);
        var d = this.frameForURL(a);
        if (d.length) this.slideForwardToFrame(d);
        else {
            var c = this.slideForwardToLoading();
            this.loadFrame(a, function (b) {
                c.replaceWith($(b).find(".frame-center"))
            })
        }
    },
    slideForwardToFrame: function (a) {
        if (!this.sliding) {
            this.sliding = true;
            var d = this;
            $("#slider .frame-center").after(a.css("marginLeft", 0)).addClass("frame").removeClass("frame-center").animate({
                marginLeft: "-1200px"
            }, this.slideSpeed, function () {
                d.doneSliding()
            });
            this.makeCenterFrame(a);
            this.setFrameTitle(a);
            this.setFrameCanonicalURL(a)
        }
    },
    slideForwardToLoading: function () {
        var a = $(".frame-loading").clone();
        a.find("img").hide();
        setTimeout(function () {
            a.find("img").show()
        }, 500);
        $(".frames").append(a);
        this.slideForwardToFrame(a);
        return a
    },
    slideBackTo: function (a) {
        debug("Sliding back to %s", a);
        var d = this.frameForURL(a);
        if (d.length) this.slideBackToFrame(d);
        else {
            var c = this.slideBackToLoading(),
                b = this.pathFromURL(a);
            this.loadFrame(a, function (e) {
                c.removeClass("frame-loading").empty().append($(e).find(".frame-center").contents()).attr("data-path", b)
            })
        }
    },
    slideBackToFrame: function (a) {
        if (!this.sliding) {
            this.sliding = true;
            $("#slider .frame-center").before(a.css("marginLeft", "-1200px")).addClass("frame").removeClass("frame-center");
            var d = this;
            a.animate({
                marginLeft: "0"
            }, this.slideSpeed, function () {
                d.doneSliding()
            });
            this.makeCenterFrame(a);
            this.setFrameTitle(a);
            this.setFrameCanonicalURL(a)
        }
    },
    slideBackToLoading: function () {
        var a = $(".frame-loading").clone();
        a.find("img").hide();
        setTimeout(function () {
            a.find("img").show()
        }, 350);
        $(".frames").prepend(a.show());
        slider.slideBackToFrame(a);
        return a
    },
    makeCenterFrame: function (a) {
        a.css("visibility", "visible").show().addClass("frame-center");
        this.scrollToBreadcrumb();
        var d = $('.breadcrumb[data-path="' + a.attr("data-path") + '"]');
        if (d.length > 0) {
            $(".breadcrumb:visible").hide();
            d.show()
        }
        d = $('.announce[data-path="' + a.attr("data-path") + '"]');
        $(".announce").fadeOut();
        d.length > 0 && d.fadeIn();
        a = $(".js-ufo[data-path=" + a.attr("data-path") + "]");
        $(".js-ufo").fadeOut();
        a.length > 0 && a.fadeIn();
        ZH.currentPath = this.pathFromURL(location.pathname).replace(/\/$/, "")
    },
    setFrameTitle: function (a) {
        a = a.attr("data-path");
        if (!(!a || a.length == 0)) {
            var d = unescape(unescape(ZH.currentRef));
            a = unescape(a.slice(0, a.length - 1));
            document.title = a.length > 0 ? a + " at " + d + " from " + ZH.nameWithOwner + " - ZH" : ZH.nameWithOwner + " at " + d + " - ZH"
        }
    },
    setFrameCanonicalURL: function (a) {
        (a = a.attr("data-canonical-url")) && $("link[rel=canonical]").attr("href", a)
    },
    loadFrame: function (a, d) {
        debug("Loading " + a + "?slide=1");
        var c = this;
        $.ajax({
            url: a + "?slide=1",
            cache: false,
            success: function (b) {
                d.call(this, b);
                $("#slider").trigger("slid");
                $("#slider .breadcrumb").hide().last().after($(b).find(".breadcrumb"));
                b = c.frameForURL(a);
                b.trigger("pageUpdate");
                ZH.Tree.rewriteSHAsInLinksWithRef();
                ZH.CachedCommitDataPoller(50, b);
                ZH.Blob.show();
                c.setFrameTitle(b);
                c.setFrameCanonicalURL(b)
            },
            error: function () {
                $("#slider .frame-center").html("<h3>Something went wrong.</h3>")
            },
            complete: function () {
                c.sliding = false
            }
        })
    }
};
$(function () {
    window.slider = new ZH.TreeSlider
});