Repository navigation
Expand file tree
/
Copy pathjquery.greedy-navigation.js
More file actions
86 lines (67 loc) · 2.24 KB
/
Copy pathjquery.greedy-navigation.js
File metadata and controls
86 lines (67 loc) · 2.24 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
/*
* Greedy Navigation
*
* http://codepen.io/lukejacksonn/pen/PwmwWV
*
*/
var $nav = $('#site-nav');
var $btn = $('#site-nav button');
var $vlinks = $('#site-nav .visible-links');
var $vlinks_persist_tail = $vlinks.children("*.persist.tail");
var $hlinks = $('#site-nav .hidden-links');
var breaks = [];
function updateNav() {
var availableSpace = $btn.hasClass('hidden') ? $nav.width() : $nav.width() - $btn.width() - 30;
// The visible list is overflowing the nav
if ($vlinks.width() > availableSpace) {
while ($vlinks.width() > availableSpace && $vlinks.children("*:not(.persist)").length > 0) {
// Record the width of the list
breaks.push($vlinks.width());
// Move item to the hidden list
$vlinks.children("*:not(.persist)").last().prependTo($hlinks);
availableSpace = $btn.hasClass("hidden") ? $nav.width() : $nav.width() - $btn.width() - 30;
// Show the dropdown btn
$btn.removeClass("hidden");
}
// The visible list is not overflowing
} else {
// There is space for another item in the nav
while (breaks.length > 0 && availableSpace > breaks[breaks.length - 1]) {
// Move the item to the visible list
if ($vlinks_persist_tail.children().length > 0) {
$hlinks.children().first().insertBefore($vlinks_persist_tail);
} else {
$hlinks.children().first().appendTo($vlinks);
}
breaks.pop();
}
// Hide the dropdown btn if hidden list is empty
if (breaks.length < 1) {
$btn.addClass('hidden');
$btn.removeClass('close');
$hlinks.addClass('hidden');
}
}
// Keep counter updated
$btn.attr("count", breaks.length);
// update masthead height and the body/sidebar top padding
var mastheadHeight = $('.masthead').height();
$('body').css('padding-top', mastheadHeight + 'px');
if ($(".author__urls-wrapper button").is(":visible")) {
$(".sidebar").css("padding-top", "");
} else {
$(".sidebar").css("padding-top", mastheadHeight + "px");
}
}
// Window listeners
$(window).on('resize', function () {
updateNav();
});
screen.orientation.addEventListener("change", function () {
updateNav();
});
$btn.on('click', function () {
$hlinks.toggleClass('hidden');
$(this).toggleClass('close');
});
updateNav();