https://www.studioparkers.nl/wp-content/themes/parkers/js/general.js?ver=1.0

1
2/*------------------------------------*\
3:    Scrollheader
4:    Hides on scroll down
5:    Shows on scroll up
6\*------------------------------------*/
7
8var didScroll;
9var lastScrollTop = 0;
10var delta = 1;
11var navbarHeight = $('.main-header-content').outerHeight();
12
13
14function hasScrolled() {
15	var st = $(this).scrollTop();
16
17	if(Math.abs(lastScrollTop - st) <= delta)
18		return;
19
20	if (st > lastScrollTop && st > navbarHeight){
21		//$('.main-header').removeClass('header-down').addClass('header-up');
22	} else {
23		if(st + $(window).height() < $(document).height()) {
24			$('.main-header').removeClass('header-up').addClass('header-down');
25		}
26	}
27	if (st >= navbarHeight){
28		$('.main-header').addClass('small-header');
29	} else {
30		$('.main-header').removeClass('small-header');
31	}
32	
33	lastScrollTop = st;
34}
35
36/*------------------------------------*\
37:    Culture - Smooth Scroll
38\*------------------------------------*/
39
40
41
42/*------------------------------------*\
43:    Culture - Guide Into Parallax
44\*------------------------------------*/
45
46var parallaxScrollTop = 0;
47
48$('.parallax').scroll(function(){
49	$(window).scrollTop($('#culture').offset().top + -40);
50	var st = $('.parallax').scrollTop();
51	/*
52	console.log(st);
53	if (st > parallaxScrollTop){
54		return false;
55	} else {
56		if(st === 0){
57			$(window).scrollTop($('#culture').offset().top + -300);
58		}
59	}
60	*/
61	parallaxScrollTop = st;
62});
63
64/*------------------------------------*\
65:    On Load/Resize Functions
66\*------------------------------------*/
67
68$(window).on('load resize', function() {
69
70	/*------------------------------------*\
71	:    Masonry
72	\*------------------------------------*/
73
74	var $board = $('#home-board');
75	$board.packery({
76		itemSelector: '.tile',
77	});
78
79	var $blog = $('#blog-list');
80	$blog.packery({
81		itemSelector: '.item',
82	});
83
84});
85
86/*------------------------------------*\
87:    On Load Functions
88\*------------------------------------*/
89
90$(window).on('load', function(){
91
92	/*------------------------------------*\
93	:    Lazy load for images
94	:    and background images
95	\*------------------------------------*/
96
97	$(".lazy-img").each(function() {
98		var src = $(this).attr("data-img");
99		var alt = $(this).attr("data-alt");
100		$(this).attr('src', src);
101		$(this).removeAttr("data-img");
102		$(this).attr('alt', alt);
103		$(this).removeAttr("data-alt");
104	});
105	$(".lazy-bg").each(function() {
106		var src = $(this).attr("data-img");
107		$(this).css('background-image', 'url("' + src + '")');
108		$(this).removeAttr("data-img");
109	});
110
111});
112
113/*------------------------------------*\
114:    Scroll Functions
115\*------------------------------------*/
116
117$(window).scroll(function(){
118	didScroll = true;
119});
120
121setInterval(function() {
122	if (didScroll) {
123		hasScrolled();
124		didScroll = false;
125	}
126}, 50);
127
128
129
130/*------------------------------------*\
131:    Document Ready Functions
132\*------------------------------------*/
133
134$(document).ready(function(){
135	$('.slider').slick({
136		prevArrow : '<span class="prev-arrow"><span class="icon-arrow-left"></span></span>',
137		nextArrow : '<span class="next-arrow"><span class="icon-arrow-right"></span></span>'
138	});
139	$('.ripple').on('mouseenter', function(){
140		if (!$(this).hasClass('active')){
141			var ripple = $(this);
142			ripple.addClass('active');
143			setTimeout(function() {
144				ripple.removeClass('active');
145			},2000);
146		}
147	});
148
149	/*------------------------------------*\
150    :    Snail or Butterfly
151    \*------------------------------------*/
152    if ($('body').hasClass('single-portfolio')) {
153
154    	var randomnumber = Math.floor(Math.random()*2);
155
156    	if(randomnumber === 0) {
157    		$('body').addClass('butterfly');
158    	}
159    	else {
160    		$('body').addClass('snail');
161    	}
162    }
163
164	/*------------------------------------*\
165	:    Menu Toggle
166	\*------------------------------------*/
167
168	$('#menu-toggle, #fade-filter').on('click', function (e){
169		e.preventDefault();
170		$('#menu-toggle').toggleClass('active');
171		$('.main-nav').toggleClass('active');
172		$('#fade-filter').toggleClass('active');
173	});
174
175	/*------------------------------------*\
176	:    Swipe Actions
177	\*------------------------------------*/
178
179	/*var myElement = document.getElementById('blogdetail');
180	var hammertime = new Hammer(myElement);
181	hammertime.on('swipeleft swiperight', function(ev) {
182		if(ev.type === 'swipeleft' && $('#prev a').length) {
183			$('article').addClass('swiped-right');
184			setTimeout(function(){ 
185				$('#prev a')[0].click();
186			}, 300);
187		}
188		else if(ev.type === 'swiperight' && $('#next a').length) {
189			$('article').addClass('swiped-left');
190			setTimeout(function(){ 
191				$('#next a')[0].click();
192			}, 300);
193		}
194		else {
195			return false;
196		}
197	});*/
198
199});
200
201
202
203function showImages(el) {
204	var windowHeight = jQuery( window ).height();
205	$(el).each(function(){
206		var thisPos = $(this).offset().top;
207
208		var topOfWindow = $(window).scrollTop();

209		if (topOfWindow + windowHeight - 40 > thisPos ) {
210			$(this).addClass("fadeIn");
211		}
212	});
213}
214
215// if the image in the window of browser when the page is loaded, show that image
216$(document).ready(function(){
217	showImages('.img-single');
218});
219
220// if the image in the window of browser when scrolling the page, show that image
221$(window).scroll(function() {
222	showImages('.img-single');
223});
224
225
226/* Handlebars testting 
227  $.ajax({
228       type: 'GET',
229       url: 'http://edgar.studioparkers.nl/studioparkers.nl/wp-json/wp/v2/posts/335',
230       dataType: 'json',
231       success: function(posts){
232          // $.each( posts, function(index, post) {
233               var source = $('#posts').html();
234               var template = Handlebars.compile(source);
235               var html = template(posts);
236               $('.content-container').append(html);
237          // });
238          // $( app.params.mainContainer ).fadeIn();
239          // app.pagination( offset );
240       },
241       error: function(error){
242           console.log(error);
243       }
244 
245   });
246
247   */
248
249
250
251 /* $.getJSON( "http://edgar.studioparkers.nl/studioparkers.nl/wp-json/wp/v2/posts", function( data ) {
252
253     $.each( data, function(index, post) {
254               var source = $('#posts').html();
255               var template = Handlebars.compile(source);
256               var html = template(post);
257               $('.content-placeholder').append(html);
258           });
259
260  });
261  */
262