You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
237 lines
5.8 KiB
JavaScript
237 lines
5.8 KiB
JavaScript
|
|
|
|
var hashOptions;
|
|
hashOptions = window.location.hash.replace('#filters', '')
|
|
var is_chrome = /chrome/i.test( navigator.userAgent );
|
|
var slideLock = false;
|
|
|
|
|
|
var isMobile = {
|
|
Android: function() {
|
|
return navigator.userAgent.match(/Android/i);
|
|
},
|
|
BlackBerry: function() {
|
|
return navigator.userAgent.match(/BlackBerry/i);
|
|
},
|
|
iOS: function() {
|
|
return navigator.userAgent.match(/iPhone|iPad|iPod/i);
|
|
},
|
|
Opera: function() {
|
|
return navigator.userAgent.match(/Opera Mini/i);
|
|
},
|
|
Windows: function() {
|
|
return navigator.userAgent.match(/IEMobile/i);
|
|
},
|
|
any: function() {
|
|
return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
|
|
}
|
|
};
|
|
|
|
function windowHeightDivs(){
|
|
|
|
if(!isMobile.any()){
|
|
$("#logoWrap").css({"margin-top":$(window).height()-$("#logoWrap").outerHeight()-10+"px"})
|
|
}
|
|
$(".zwartArea").css({
|
|
"min-height": $(window).height()+"px"
|
|
})
|
|
|
|
$(".isotope").css({
|
|
"min-height": $(window).height()+200+"px"
|
|
})
|
|
}
|
|
|
|
|
|
function stickyElements(){
|
|
$('#filter').fixedsticky();
|
|
}
|
|
|
|
|
|
function initIsotope(){
|
|
var $container = $('.isotope').isotope({
|
|
masonry: {
|
|
columnWidth: '.grid-sizer'
|
|
},
|
|
transitionDuration: '0.2s',
|
|
filter: hashOptions,
|
|
|
|
|
|
});
|
|
|
|
}
|
|
|
|
// function sidebarOn(){
|
|
// if($(window).width()>768){
|
|
// // $("#sidebarInner").slideDown(400)
|
|
// // $("#sidebar").addClass("sidebarBorder");
|
|
// // alert('slideDown')
|
|
// // $('#filter').fixedsticky();
|
|
// }
|
|
// }
|
|
|
|
function sidebarOff(){
|
|
if($(window).width()>768){
|
|
$(".closeSidebar").css('display','none')
|
|
// if($(document).scrollTop()>$('#zwartIntro').height()-1 && $(document).scrollTop()<$("#section03").offset().top){
|
|
$("#sidebarInner").slideDown(0)
|
|
// }
|
|
} else {
|
|
$(".closeSidebar").css('display','block')
|
|
}
|
|
}
|
|
|
|
function ifSticky(){
|
|
if (!$("#filter").hasClass('fixedsticky-on')){
|
|
|
|
if($(document).scrollTop()>$('#zwartIntro').height()-1 && $(document).scrollTop()<$("#section03").offset().top){
|
|
|
|
if(is_chrome){$('#filter').css({'position':'fixed'})}
|
|
if($(window).width()<768){
|
|
$(".closeSidebar").css('display','block')
|
|
if(slideLock == false){
|
|
$("#sidebarInner").slideDown(0)
|
|
}
|
|
}else{
|
|
$("#sidebarInner").slideDown(200)
|
|
}
|
|
|
|
|
|
} else{
|
|
if(is_chrome){$('#filter').css({'position':''})}
|
|
if($(window).width()<768){
|
|
$(".closeSidebar").css('display','none')
|
|
|
|
if(slideLock == false){
|
|
$("#sidebarInner").slideUp(0)
|
|
}
|
|
|
|
}else{
|
|
$("#sidebarInner").slideUp(200)
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
$(".closeSidebar").click(function(){
|
|
$("#sidebarInner").slideToggle()
|
|
|
|
if(slideLock == false){
|
|
slideLock = true
|
|
$(".closeSidebar").html('<img src="./arrowUpW.svg"/>')
|
|
}else{
|
|
slideLock = false
|
|
$(".closeSidebar").html('<img src="./arrowDownW.svg"/>')
|
|
}
|
|
|
|
});
|
|
|
|
|
|
function toggleDescInner(){
|
|
$("#sideBarDescInnerToggle").on('click', function(){
|
|
$("#sideBarDescInner").slideToggle()
|
|
})
|
|
}
|
|
|
|
function initUnderlineFilters(){
|
|
startfilter = window.location.hash.replace('#filters', '')
|
|
startfilterArray = startfilter.split(".")
|
|
startfilterArray.shift()
|
|
|
|
startfilterArray.forEach(function(afilter) {
|
|
$('input.'+afilter+'').next("p").toggleClass("underlineFilter")
|
|
moveToSide = $('input.'+afilter+'').next("p").outerWidth()
|
|
$('input.'+afilter+'').parent().next('label').css({"margin-left":moveToSide+"px"})
|
|
$('input.'+afilter+'').prop('checked', $(this).is(':checked'));
|
|
$('input.'+afilter+'').prop( "checked", true )
|
|
|
|
$("#sideBarDesc").find($("."+afilter)).prependTo("#sideBarDescInner").slideDown(50)
|
|
|
|
});
|
|
}
|
|
|
|
|
|
|
|
function filterByInput(){
|
|
var $checkboxes = $('.themes input');
|
|
|
|
$checkboxes.change( function() {
|
|
$(document).scrollTop($('#section02').offset().top);
|
|
$("#sidebarInner").slideDown(400)
|
|
// $('#pageWrap').scrollTop($("#filter").outerHeight()+$('#pageWrap').scrollTop()+$('#section02').offset().top);
|
|
// $(document).scrollTop($(document).scrollTop()+$('#section02').offset().top);
|
|
// setTimeout(function(){
|
|
// if($("#filter:visible").hasClass('fixedBar')){
|
|
// $("#sideBarDesc").slideDown(400)
|
|
// }
|
|
// }, 300);
|
|
$('body').css({"opacity":'0'})
|
|
|
|
var thisSaved = $(this)
|
|
function layoutComplete(par01){
|
|
$('input.'+par01.attr("class")+'').next("p").toggleClass("underlineFilter")
|
|
$('input.'+par01.attr("class")+'').prop('checked', par01.is(':checked'));
|
|
|
|
if ($('input.'+par01.attr("class")+'').next("p").hasClass("underlineFilter")){
|
|
moveToSide = $('input.'+par01.attr("class")+'').next("p").outerWidth()
|
|
foundClass=par01.attr("class")
|
|
$("#sideBarDesc").find($("."+foundClass)).prependTo("#sideBarDescInner").slideDown(50)
|
|
|
|
}else{
|
|
moveToSide = 0
|
|
foundClass=par01.attr("class")
|
|
$("#sideBarDesc").find($("."+foundClass)).slideUp(50)
|
|
}
|
|
$('input.'+par01.attr("class")+'').parent().next('label').css({"margin-left":moveToSide+"px"})
|
|
|
|
|
|
$('body').css({"opacity":'1'})
|
|
}
|
|
|
|
// $('input.'+$(this).attr("class")+'').next("p").toggleClass("underlineFilter")
|
|
// $('input.'+$(this).attr("class")+'').prop('checked', $(this).is(':checked'));
|
|
|
|
|
|
var checkboxesCheck = $('.themes input:checked');
|
|
var exclusives = [];
|
|
$checkboxes.each( function( i, elem ) {
|
|
if ( elem.checked ) {
|
|
exclusives.push( elem.value );
|
|
}
|
|
});
|
|
exclusives = exclusives.join('');
|
|
|
|
var filterValue;
|
|
filterValue = exclusives;
|
|
location.hash = '#filters'+filterValue
|
|
hashOptions = window.location.hash.replace('#filters', '')
|
|
|
|
$container = $('.isotope').isotope({
|
|
filter: hashOptions
|
|
})
|
|
|
|
$container.on('layoutComplete', layoutComplete(thisSaved))
|
|
|
|
});
|
|
}
|
|
|
|
|
|
// RUN THE FUNCTIONS
|
|
|
|
windowHeightDivs()
|
|
initIsotope()
|
|
stickyElements()
|
|
// initUnderlineFilters()
|
|
// filterByInput()
|
|
toggleDescInner()
|
|
sidebarOff()
|
|
|
|
document.onscroll = function() {
|
|
ifSticky()
|
|
};
|
|
|
|
$( window ).resize(function() {
|
|
windowHeightDivs()
|
|
sidebarOff()
|
|
})
|