1
|
/*! UIkit 2.27.5 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */
|
2
|
(function(UI) {
|
3
|
|
4
|
"use strict";
|
5
|
|
6
|
var $win = UI.$win,
|
7
|
$doc = UI.$doc,
|
8
|
scrollspies = [],
|
9
|
checkScrollSpy = function() {
|
10
|
for(var i=0; i < scrollspies.length; i++) {
|
11
|
window.requestAnimationFrame.apply(window, [scrollspies[i].check]);
|
12
|
}
|
13
|
};
|
14
|
|
15
|
UI.component('scrollspy', {
|
16
|
|
17
|
defaults: {
|
18
|
target : false,
|
19
|
cls : 'uk-scrollspy-inview',
|
20
|
initcls : 'uk-scrollspy-init-inview',
|
21
|
topoffset : 0,
|
22
|
leftoffset : 0,
|
23
|
repeat : false,
|
24
|
delay : 0
|
25
|
},
|
26
|
|
27
|
boot: function() {
|
28
|
|
29
|
// listen to scroll and resize
|
30
|
$doc.on('scrolling.uk.document', checkScrollSpy);
|
31
|
$win.on('load resize orientationchange', UI.Utils.debounce(checkScrollSpy, 50));
|
32
|
|
33
|
// init code
|
34
|
UI.ready(function(context) {
|
35
|
|
36
|
UI.$('[data-uk-scrollspy]', context).each(function() {
|
37
|
|
38
|
var element = UI.$(this);
|
39
|
|
40
|
if (!element.data('scrollspy')) {
|
41
|
var obj = UI.scrollspy(element, UI.Utils.options(element.attr('data-uk-scrollspy')));
|
42
|
}
|
43
|
});
|
44
|
});
|
45
|
},
|
46
|
|
47
|
init: function() {
|
48
|
|
49
|
var $this = this, inviewstate, initinview, togglecls = this.options.cls.split(/,/), fn = function(){
|
50
|
|
51
|
var elements = $this.options.target ? $this.element.find($this.options.target) : $this.element,
|
52
|
delayIdx = elements.length === 1 ? 1 : 0,
|
53
|
toggleclsIdx = 0;
|
54
|
|
55
|
elements.each(function(idx){
|
56
|
|
57
|
var element = UI.$(this),
|
58
|
inviewstate = element.data('inviewstate'),
|
59
|
inview = UI.Utils.isInView(element, $this.options),
|
60
|
toggle = element.attr('data-uk-scrollspy-cls') || togglecls[toggleclsIdx].trim();
|
61
|
|
62
|
if (inview && !inviewstate && !element.data('scrollspy-idle')) {
|
63
|
|
64
|
if (!initinview) {
|
65
|
element.addClass($this.options.initcls);
|
66
|
$this.offset = element.offset();
|
67
|
initinview = true;
|
68
|
|
69
|
element.trigger('init.uk.scrollspy');
|
70
|
}
|
71
|
|
72
|
element.data('scrollspy-idle', setTimeout(function(){
|
73
|
|
74
|
element.addClass('uk-scrollspy-inview').toggleClass(toggle).width();
|
75
|
element.trigger('inview.uk.scrollspy');
|
76
|
|
77
|
element.data('scrollspy-idle', false);
|
78
|
element.data('inviewstate', true);
|
79
|
|
80
|
}, $this.options.delay * delayIdx));
|
81
|
|
82
|
delayIdx++;
|
83
|
}
|
84
|
|
85
|
if (!inview && inviewstate && $this.options.repeat) {
|
86
|
|
87
|
if (element.data('scrollspy-idle')) {
|
88
|
clearTimeout(element.data('scrollspy-idle'));
|
89
|
element.data('scrollspy-idle', false);
|
90
|
}
|
91
|
|
92
|
element.removeClass('uk-scrollspy-inview').toggleClass(toggle);
|
93
|
element.data('inviewstate', false);
|
94
|
|
95
|
element.trigger('outview.uk.scrollspy');
|
96
|
}
|
97
|
|
98
|
toggleclsIdx = togglecls[toggleclsIdx + 1] ? (toggleclsIdx + 1) : 0;
|
99
|
|
100
|
});
|
101
|
};
|
102
|
|
103
|
fn();
|
104
|
|
105
|
this.check = fn;
|
106
|
|
107
|
scrollspies.push(this);
|
108
|
}
|
109
|
});
|
110
|
|
111
|
|
112
|
var scrollspynavs = [],
|
113
|
checkScrollSpyNavs = function() {
|
114
|
for(var i=0; i < scrollspynavs.length; i++) {
|
115
|
window.requestAnimationFrame.apply(window, [scrollspynavs[i].check]);
|
116
|
}
|
117
|
};
|
118
|
|
119
|
UI.component('scrollspynav', {
|
120
|
|
121
|
defaults: {
|
122
|
cls : 'uk-active',
|
123
|
closest : false,
|
124
|
topoffset : 0,
|
125
|
leftoffset : 0,
|
126
|
smoothscroll : false
|
127
|
},
|
128
|
|
129
|
boot: function() {
|
130
|
|
131
|
// listen to scroll and resize
|
132
|
$doc.on('scrolling.uk.document', checkScrollSpyNavs);
|
133
|
$win.on('resize orientationchange', UI.Utils.debounce(checkScrollSpyNavs, 50));
|
134
|
|
135
|
// init code
|
136
|
UI.ready(function(context) {
|
137
|
|
138
|
UI.$('[data-uk-scrollspy-nav]', context).each(function() {
|
139
|
|
140
|
var element = UI.$(this);
|
141
|
|
142
|
if (!element.data('scrollspynav')) {
|
143
|
var obj = UI.scrollspynav(element, UI.Utils.options(element.attr('data-uk-scrollspy-nav')));
|
144
|
}
|
145
|
});
|
146
|
});
|
147
|
},
|
148
|
|
149
|
init: function() {
|
150
|
|
151
|
var ids = [],
|
152
|
links = this.find("a[href^='#']").each(function(){ if(this.getAttribute('href').trim()!=='#') ids.push(this.getAttribute('href')); }),
|
153
|
targets = UI.$(ids.join(",")),
|
154
|
|
155
|
clsActive = this.options.cls,
|
156
|
clsClosest = this.options.closest || this.options.closest;
|
157
|
|
158
|
var $this = this, inviews, fn = function(){
|
159
|
|
160
|
inviews = [];
|
161
|
|
162
|
for (var i=0 ; i < targets.length ; i++) {
|
163
|
if (UI.Utils.isInView(targets.eq(i), $this.options)) {
|
164
|
inviews.push(targets.eq(i));
|
165
|
}
|
166
|
}
|
167
|
|
168
|
if (inviews.length) {
|
169
|
|
170
|
var navitems,
|
171
|
scrollTop = $win.scrollTop(),
|
172
|
target = (function(){
|
173
|
for(var i=0; i< inviews.length;i++){
|
174
|
if (inviews[i].offset().top - $this.options.topoffset >= scrollTop){
|
175
|
return inviews[i];
|
176
|
}
|
177
|
}
|
178
|
})();
|
179
|
|
180
|
if (!target) return;
|
181
|
|
182
|
if ($this.options.closest) {
|
183
|
links.blur().closest(clsClosest).removeClass(clsActive);
|
184
|
navitems = links.filter("a[href='#"+target.attr('id')+"']").closest(clsClosest).addClass(clsActive);
|
185
|
} else {
|
186
|
navitems = links.removeClass(clsActive).filter("a[href='#"+target.attr("id")+"']").addClass(clsActive);
|
187
|
}
|
188
|
|
189
|
$this.element.trigger('inview.uk.scrollspynav', [target, navitems]);
|
190
|
}
|
191
|
};
|
192
|
|
193
|
if (this.options.smoothscroll && UI.smoothScroll) {
|
194
|
links.each(function(){
|
195
|
UI.smoothScroll(this, $this.options.smoothscroll);
|
196
|
});
|
197
|
}
|
198
|
|
199
|
fn();
|
200
|
|
201
|
this.element.data('scrollspynav', this);
|
202
|
|
203
|
this.check = fn;
|
204
|
scrollspynavs.push(this);
|
205
|
|
206
|
}
|
207
|
});
|
208
|
|
209
|
})(UIkit2);
|