forked from saurabh/orbit4-5
117 lines
4.1 KiB
JavaScript
117 lines
4.1 KiB
JavaScript
(function() {
|
|
"use strict";
|
|
|
|
// Commonly use variables
|
|
var doc = document;
|
|
|
|
var group = {
|
|
// Detect and change the top position of the cycle navs
|
|
cycleFix: function() {
|
|
if (doc.querySelectorAll(".group-show-post-banner-image").length >= 1) {
|
|
var imgs = doc.querySelectorAll(".group-post-banner-image"),
|
|
cycleNav = doc.querySelectorAll(".cycle-nav"),
|
|
len = cycleNav.length,
|
|
i = -1;
|
|
|
|
|
|
// Hide the navs when there's noly one slide
|
|
if (imgs.length <= 1) {
|
|
for (i = 0; i < len; i++) {
|
|
cycleNav[i].classList.add("hide");
|
|
}
|
|
}
|
|
|
|
} else if (doc.querySelectorAll(".group-show-post-banner-image").length === 0 && doc.querySelector(".group-show-post-image-wrap")) {
|
|
doc.querySelector(".group-show-post-image-wrap").classList.add("hide");
|
|
}
|
|
},
|
|
// Create scroll effect (with css)
|
|
scrollEffect: function() {
|
|
if (doc.querySelector(".group-post")) {
|
|
var post = doc.querySelector(".group-post"),
|
|
wrap = doc.querySelector(".group-post-banner-image-wrap"),
|
|
scrollClass = "scroll";
|
|
|
|
// Use pageYOffset to get the Y positoin and add scroll on it, the animation
|
|
// is done by css transition
|
|
window.addEventListener("scroll", function() {
|
|
if (window.pageYOffset > 0) {
|
|
post.classList.add(scrollClass);
|
|
} else {
|
|
post.classList.remove(scrollClass);
|
|
}
|
|
}, false);
|
|
}
|
|
},
|
|
// Equal height for card
|
|
equalHeight: function() {
|
|
var bigbrother = -1,
|
|
$card = $('.group-card-inner');
|
|
|
|
$card.each(function() {
|
|
bigbrother = bigbrother > $(this).height() ? bigbrother : $(this).height();
|
|
});
|
|
|
|
$card.each(function() {
|
|
$(this).height(bigbrother);
|
|
});
|
|
},
|
|
// We want to place a dropdown in group-post-item, but link cannot be nested, hance this fix
|
|
makePostClick: function() {
|
|
var postLink = doc.querySelectorAll('.group-post-link');
|
|
|
|
if (postLink) {
|
|
Array.prototype.forEach.call(postLink, function(item) {
|
|
item.parentNode.classList.add('clickable');
|
|
item.parentNode.addEventListener('click', function(e) {
|
|
window.location.href = item.href;
|
|
});
|
|
});
|
|
}
|
|
},
|
|
// Bootstrap dropdown is too much of a hassle, using this instead
|
|
makeDropdown: function() {
|
|
var $post = $('.group-post'),
|
|
$toggle = $('.group-post-dropdown-toggle'),
|
|
$dropdown = $post.find('.group-post-dropdown'),
|
|
klass = 'open';
|
|
$toggle.click(function() {
|
|
$toggle.removeClass(klass);
|
|
$dropdown.removeClass(klass);
|
|
$(this)
|
|
.addClass(klass)
|
|
.next('.group-post-dropdown')
|
|
.toggleClass(klass)
|
|
return false;
|
|
});
|
|
$post.click(function() {
|
|
$toggle.removeClass(klass)
|
|
$dropdown.removeClass(klass);
|
|
});
|
|
},
|
|
|
|
// Third-party plugin settings
|
|
plugins: function() {
|
|
// WOWjs
|
|
if (typeof window.WOW !== 'undefined') {
|
|
new WOW().init();
|
|
}
|
|
}
|
|
}
|
|
|
|
// When DOM is completely loaded, execute these functions
|
|
document.addEventListener("DOMContentLoaded", function(event) {
|
|
|
|
if (doc.querySelector('.group-post')) {
|
|
group.scrollEffect();
|
|
group.makePostClick();
|
|
group.makeDropdown();
|
|
}
|
|
|
|
group.cycleFix();
|
|
group.equalHeight();
|
|
group.plugins();
|
|
});
|
|
|
|
})();
|