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
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
|
;(function ($, window, document, undefined) {
'use strict';
Foundation.libs.magellan = {
name : 'magellan',
version : '5.0.0',
settings : {
active_class: 'active',
threshold: 0
},
init : function (scope, method, options) {
this.fixed_magellan = $("[data-magellan-expedition]");
this.set_threshold();
this.last_destination = $('[data-magellan-destination]').last();
this.events();
},
events : function () {
var self = this;
$(this.scope)
.off('.magellan')
.on('arrival.fndtn.magellan', '[data-magellan-arrival]', function (e) {
var $destination = $(this),
$expedition = $destination.closest('[data-magellan-expedition]'),
active_class = $expedition.attr('data-magellan-active-class')
|| self.settings.active_class;
$destination
.closest('[data-magellan-expedition]')
.find('[data-magellan-arrival]')
.not($destination)
.removeClass(active_class);
$destination.addClass(active_class);
});
this.fixed_magellan
.off('.magellan')
.on('update-position.fndtn.magellan', function() {
var $el = $(this);
})
.trigger('update-position');
$(window)
.off('.magellan')
.on('resize.fndtn.magellan', function() {
this.fixed_magellan.trigger('update-position');
}.bind(this))
.on('scroll.fndtn.magellan', function() {
var windowScrollTop = $(window).scrollTop();
self.fixed_magellan.each(function() {
var $expedition = $(this);
if (typeof $expedition.data('magellan-top-offset') === 'undefined') {
$expedition.data('magellan-top-offset', $expedition.offset().top);
}
if (typeof $expedition.data('magellan-fixed-position') === 'undefined') {
$expedition.data('magellan-fixed-position', false);
}
var fixed_position = (windowScrollTop + self.settings.threshold) > $expedition.data("magellan-top-offset");
var attr = $expedition.attr('data-magellan-top-offset');
if ($expedition.data("magellan-fixed-position") != fixed_position) {
$expedition.data("magellan-fixed-position", fixed_position);
if (fixed_position) {
$expedition.addClass('fixed');
$expedition.css({position:"fixed", top:0});
} else {
$expedition.removeClass('fixed');
$expedition.css({position:"", top:""});
}
if (fixed_position && typeof attr != 'undefined' && attr != false) {
$expedition.css({position:"fixed", top:attr + "px"});
}
}
});
});
if (this.last_destination.length > 0) {
$(window).on('scroll.fndtn.magellan', function (e) {
var windowScrollTop = $(window).scrollTop(),
scrolltopPlusHeight = windowScrollTop + $(window).height(),
lastDestinationTop = Math.ceil(self.last_destination.offset().top);
$('[data-magellan-destination]').each(function () {
var $destination = $(this),
destination_name = $destination.attr('data-magellan-destination'),
topOffset = $destination.offset().top - $destination.outerHeight(true) - windowScrollTop;
if (topOffset <= self.settings.threshold) {
$("[data-magellan-arrival='" + destination_name + "']").trigger('arrival');
}
// In large screens we may hit the bottom of the page and dont reach the top of the last magellan-destination, so lets force it
if (scrolltopPlusHeight >= $(self.scope).height() && lastDestinationTop > windowScrollTop && lastDestinationTop < scrolltopPlusHeight) {
$('[data-magellan-arrival]').last().trigger('arrival');
}
});
});
}
},
set_threshold : function () {
if (typeof this.settings.threshold !== 'number') {
this.settings.threshold = (this.fixed_magellan.length > 0) ?
this.fixed_magellan.outerHeight(true) : 0;
}
},
off : function () {
$(this.scope).off('.fndtn.magellan');
$(window).off('.fndtn.magellan');
},
reflow : function () {}
};
}(jQuery, this, this.document));
|
