1 // https://github.com/ghiculescu/jekyll-table-of-contents
3 $.fn
.toc = function(options
) {
5 noBackToTopLinks
: false,
6 title
: '<i>Jump to...</i>',
8 headers
: 'h1, h2, h3, h4, h5, h6',
9 listType
: 'ol', // values: [ol|ul]
10 showEffect
: 'show', // values: [show|slideDown|fadeIn|none]
11 showSpeed
: 'slow' // set to 0 to deactivate effect
13 settings
= $.extend(defaults
, options
);
15 var headers
= $(settings
.headers
).filter(function() {
16 // get all headers with an ID
17 var previousSiblingName
= $(this).prev().attr( "name" );
18 if (!this.id
&& previousSiblingName
) {
19 this.id
= $(this).attr( "id", previousSiblingName
.replace(/\./g, "-") );
23 if (!headers
.length
|| headers
.length
< settings
.minimumHeaders
|| !output
.length
) {
27 if (0 === settings
.showSpeed
) {
28 settings
.showEffect
= 'none';
32 show: function() { output
.hide().html(html
).show(settings
.showSpeed
); },
33 slideDown: function() { output
.hide().html(html
).slideDown(settings
.showSpeed
); },
34 fadeIn: function() { output
.hide().html(html
).fadeIn(settings
.showSpeed
); },
35 none: function() { output
.html(html
); }
38 var get_level = function(ele
) { return parseInt(ele
.nodeName
.replace("H", ""), 10); }
39 var highest_level
= headers
.map(function(_
, ele
) { return get_level(ele
); }).get().sort()[0];
40 var return_to_top
= '<i class="icon-arrow-up back-to-top"> </i>';
42 var level
= get_level(headers
[0]),
44 html
= settings
.title
+ " <"+settings
.listType
+">";
45 headers
.on('click', function() {
46 if (!settings
.noBackToTopLinks
) {
47 window
.location
.hash
= this.id
;
50 .addClass('clickable-header')
51 .each(function(_
, header
) {
52 this_level
= get_level(header
);
53 if (!settings
.noBackToTopLinks
&& this_level
=== highest_level
) {
54 $(header
).addClass('top-level-header').after(return_to_top
);
56 if (this_level
=== level
) // same level as before; same indenting
57 html
+= "<li><a href='#" + header
.id
+ "'>" + header
.innerHTML
+ "</a>";
58 else if (this_level
<= level
){ // higher level than before; end parent ol
59 for(i
= this_level
; i
< level
; i
++) {
60 html
+= "</li></"+settings
.listType
+">"
62 html
+= "<li><a href='#" + header
.id
+ "'>" + header
.innerHTML
+ "</a>";
64 else if (this_level
> level
) { // lower level than before; expand the previous to contain a ol
65 for(i
= this_level
; i
> level
; i
--) {
66 html
+= "<"+settings
.listType
+"><li>"
68 html
+= "<a href='#" + header
.id
+ "'>" + header
.innerHTML
+ "</a>";
70 level
= this_level
; // update for the next one
72 html
+= "</"+settings
.listType
+">";
73 if (!settings
.noBackToTopLinks
) {
74 $(document
).on('click', '.back-to-top', function() {
75 $(window
).scrollTop(0);
76 window
.location
.hash
= '';
80 render
[settings
.showEffect
]();