phaser/docs/scripts/toc.js

(function($) {
    $.fn.toc = function(options) {
        var self = this;
        var opts = $.extend({}, jQuery.fn.toc.defaults, options);

        var container = $(opts.container);
        var headings = $(opts.selectors, container);
        var headingOffsets = [];
        var activeClassName = opts.prefix + '-active';
        var navbarHeight = $('.navbar').height();

        var scrollTo = function(e) {
            if (opts.smoothScrolling) {
                e.preventDefault();
                var elScrollTo = $(e.target).attr('href');
                var $el = $(elScrollTo);
                var offsetTop = $el.offset().top - navbarHeight;

                $('body,html').animate({
                    scrollTop: offsetTop
                }, 400, 'swing', function() {
                    location.hash = elScrollTo;
                });
            }
            $('li', self).removeClass(activeClassName);
            $(e.target).parent().addClass(activeClassName);
        };

        //highlight on scroll
        var timeout;
        var highlightOnScroll = function(e) {
            if (timeout) {
                clearTimeout(timeout);
            }
            timeout = setTimeout(function() {
                var top = $(window).scrollTop(),
                    highlighted;
                for (var i = 0, c = headingOffsets.length; i < c; i++) {
                    if (headingOffsets[i] >= top) {
                        $('li', self).removeClass(activeClassName);
                        if (i > 0) {
                            highlighted = $('li:eq(' + (i - 1) + ')', self).addClass(activeClassName);
                            opts.onHighlight(highlighted);
                        }
                        break;
                    }
                }
            }, 50);
        };
        if (opts.highlightOnScroll) {
            $(window).bind('scroll', highlightOnScroll);
            highlightOnScroll();
        }

        return this.each(function() {
            //build TOC
            var el = $(this);
            var ul = $('<ul/>');
            headings.each(function(i, heading) {
                var $h = $(heading);
                headingOffsets.push($h.offset().top - opts.highlightOffset);

                //add anchor
                var anchor = $('<span/>').attr('id', opts.anchorName(i, heading, opts.prefix)).insertBefore($h);

                //build TOC item
                var a = $('<a/>')
                    .text(opts.headerText(i, heading, $h))
                    .attr('href', '#' + opts.anchorName(i, heading, opts.prefix))
                    .bind('click', function(e) {
                        scrollTo(e);
                        el.trigger('selected', $(this).attr('href'));
                    });

                var li = $('<li/>')
                    .addClass(opts.itemClass(i, heading, $h, opts.prefix))
                    .append(a);

                ul.append(li);
            });
            el.html(ul);
        });
    };


    jQuery.fn.toc.defaults = {
        container: 'body',
        selectors: 'h1,h2,h3',
        smoothScrolling: true,
        prefix: 'toc',
        onHighlight: function() {},
        highlightOnScroll: true,
        highlightOffset: 100,
        anchorName: function(i, heading, prefix) {
            return prefix + i;
        },
        headerText: function(i, heading, $heading) {
            return $heading.text();
        },
        itemClass: function(i, heading, $heading, prefix) {
            return prefix + '-' + $heading[0].tagName.toLowerCase();
        }

    };

})(jQuery);