https://www.pngaaa.com/js/main.js

1/**********************************************************************************
2|
3|	Global vars
4|
5**********************************************************************************/
6
7var _loadingPhotos = false;
8var _photosGrid = false;
9
10/**********************************************************************************
11|
12|	AJAX request fail modal
13|
14**********************************************************************************/
15
16function _showReqFailModal() {
17	$('#ajaxFailModal').modal('show');
18}
19
20/**********************************************************************************
21|
22|	Format form error messages
23|
24**********************************************************************************/
25
26function _formatErrorMsg(errors) {
27	var errorMsgs = '';
28	for (var i = 0; i < errors.length; i++) {
29		errorMsgs += '<div>' + errors[i].msg + '</div>';
30	}
31	return errorMsgs
32}
33
34/**********************************************************************************
35|
36|	Active tab on nav login or sign up
37|
38**********************************************************************************/
39
40$('[data-target="#login-signup-modal"]').on('click',function() {
41	$('#login-signup-modal .tab-pane').removeClass('active');
42	var tab = $(this).attr('data-tab-select');
43	$('#login-signup-modal #' + tab).addClass('active');
44});
45
46/**********************************************************************************
47|
48|	On login form submit
49|
50**********************************************************************************/
51
52$('#login-form').submit(function(e) {
53	$('#login-form .btn-primary').button('loading');
54	$('#login-tab .error-msg').remove();
55	e.preventDefault();
56	loginUser();
57	return false;
58});
59
60function loginUser() {
61
62	if (!navigator.cookieEnabled) {
63		$('#login-tab h3').after('<div class="alert alert-danger error-msg">Please enable browser cookies to log in.</div>');
64		$('#login-form .btn-primary').button('reset');
65		return false;
66	}
67
68	var ajaxPost = $.ajax({
69		type: 'POST',
70		url: '/login',
71		data: $('#login-form').serialize(),
72		dataType: 'json',
73		success:function(ret) {
74			var code = ret.code ;
75			var msg = ret.message ;
76			if(code == '0000') {
77				window.location.href = '/favorites';
78			}else {
79				$('#login-form .btn-primary').button('reset');
80				$('#login-tab h3').after('<div class="alert alert-danger error-msg"><div>' + msg + '</div></div>');			
81			}
82		},
83		error:function(error) {
84			$('#login-form .btn-primary').button('reset');
85			_showReqFailModal();
86		}		
87	});
88}
89
90/**********************************************************************************
91|
92|	On signup form submit
93|
94**********************************************************************************/
95
96$('#signup-form').submit(function(e) {
97	$('#signup-form .btn-primary').button('loading');
98	$('#signup-tab .error-msg').remove();
99	e.preventDefault();
100	signupUser();
101	return false;
102});
103
104function signupUser() {
105
106	if (!navigator.cookieEnabled) {
107		$('#signup-tab h3').after('<div class="alert alert-danger error-msg">Please enable browser cookies to sign up.</div>');
108		$('#signup-form .btn-primary').button('reset');
109		return false;
110	}
111
112	var ajaxPost = $.ajax({
113		type: 'POST',
114		url: '/signup',
115		data: $('#signup-form').serialize(),
116		dataType: 'json',
117		success:function(ret) {
118			var code = ret.code ;
119			var msg = ret.message ;
120			if(code == '0000') {
121				$('#signup-form .btn-primary').button('reset');
122				$('#signup-tab .confirm-email .success-msg').html(msg);
123				$('#signup-tab .create-acct').hide();
124				$('#signup-tab .confirm-email').show();
125			}else {
126				$('#signup-form .btn-primary').button('reset');
127				$('#signup-tab h3').after('<div class="alert alert-danger error-msg"><div>' + msg + '</div></div>');			
128			}
129		},
130		error:function(error) {
131			$('#signup-form .btn-primary').button('reset');
132			_showReqFailModal();
133		}
134	});
135}
136
137/**********************************************************************************
138|
139|	On forgot password form submit
140|
141**********************************************************************************/
142
143$('#forgot-form').submit(function(e) {
144	$('#forgot-form .btn-primary').button('loading');
145	$('#forgot-tab .error-msg').remove();
146	e.preventDefault();
147	forgotPassword();
148	return false;

149});
150
151function forgotPassword() {
152
153	var ajaxPost = $.ajax({
154		type: 'POST',
155		url: '/forgotpassword',
156		data: $('#forgot-form').serialize(),
157		dataType: 'json',
158		success:function(ret) {
159			var code = ret.code ;
160			var msg = ret.message ;
161			if(code == '0000') {
162				$('#forgot-form .btn-primary').button('reset');
163				$('#forgot-tab .reset-holder').hide();
164				$('#forgot-tab .confirm-reset').show();
165			}else {
166				$('#forgot-form .btn-primary').button('reset');
167				$('#forgot-tab h3').after('<div class="alert alert-danger error-msg"><div>' + msg + '</div></div>');			
168			}
169		},
170		error:function(error) {
171			$('#forgot-form .btn-primary').button('reset');
172			_showReqFailModal();
173		}		
174	});
175}
176
177/**********************************************************************************
178|
179|	On close login/signup modal
180|
181**********************************************************************************/
182
183$('#login-signup-modal').on('hidden.bs.modal',function(e) {
184
185	// Hide signup confirmation
186	$('#signup-tab .confirm-email').hide();
187	$('#signup-tab input[name="signupEmail"]').val('');
188	$('#signup-tab input[name="password"]').val('');
189	$('#signup-tab .create-acct').show();
190
191	// Hide forgot password confirmation
192	$('#forgot-tab .confirm-reset').hide();
193	$('#forgot-tab input[name="email"]').val('');
194	$('#forgot-tab .reset-holder').show();
195
196});
197
198
199/**********************************************************************************
200|
201|	Local storage for infinite scroll position
202|
203**********************************************************************************/
204
205function _localStorage() {
206	try {
207		var storage = window.localStorage,
208			x = '__storage_test__';
209		storage.setItem(x, x);
210		storage.removeItem(x);
211		return true;
212	}
213	catch(e) {
214		return false;
215	}
216}
217
218history.scrollRestoration = 'manual';
219
220$(window).bind('pageshow', function(event) {
221	if (event.originalEvent.persisted) {
222		window.location.reload();
223	}
224});
225
226/**********************************************************************************
227|
228|	Search submit
229|
230**********************************************************************************/
231
232$(document).on('submit','#main-search-form',function() {
233	searchPhotos($('input[name="main-search"]').val());
234	return false;
235});
236
237$(document).on('submit','#sidebar-search-form',function() {
238	searchPhotos($('input[name="side-search"]').val());
239	return false;
240});
241
242$(document).on('submit','#header-search-form',function() {
243	searchPhotos($('input[name="header-search"]').val());
244	return false;
245});
246
247/**********************************************************************************
248|
249|	Search function
250|
251**********************************************************************************/
252
253function searchPhotos(searchVal) {
254	searchVal = $.trim(searchVal).replace(/\s+/g, '-').replace(/\\/g, '%5C').replace(/\//g, '%2F');
255	if(searchVal == '') {
256		return false;
257	}
258	window.location.href = '/search/' + searchVal.toLowerCase() + '/';
259}
260
261/**********************************************************************************
262|
263|	On click favorite
264|
265**********************************************************************************/
266
267$(document).on('click','.favo',function(e) {
268	e.preventDefault();
269	if (!navigator.cookieEnabled) {
270		alert('Please enable browser cookies to favorite photos.');
271		return false;
272	}
273	if ($(this).hasClass('loading')) {
274		return false;
275	}
276	var el = $(this);
277	var imgId = $(this).attr('data-imgid');
278	favoritePhoto(el,imgId);
279	return false;
280});
281
282/**********************************************************************************
283|
284|	Favorite function
285|
286**********************************************************************************/
287
288function favoritePhoto(el,imgId) {
289
290	var loadingCircle = setTimeout(function(){
291		el.addClass('loading');
292	}, 500);
293
294	var addFav = true;
295
296	if (el.hasClass('faved')) {
297		addFav = false;
298	}
299
300	var favData = {
301		addAction: addFav,
302		imgId : imgId,
303		_csrf: $('meta[name="ctoken"]').attr('content')
304	}
305
306	var ajaxPost = $.ajax({
307		type: 'POST',
308		url: '/api-favorite',
309		data: $.param(favData),
310		dataType: 'json',
311		success:function(ret) {
312			var code = ret.code ;
313			var msg = ret.message ;
314			if(code == '0000') {
315				el.toggleClass('faved');
316				clearTimeout(loadingCircle);
317				el.removeClass('loading');
318
319				_saveGrid = $('#main').clone();
320				_saveGrid.find('.title-container').remove();
321				_saveGrid = _saveGrid.html();
322			}else {
323				var errorMsg = 'Please log in to remove image from your favorites.';
324				if (addFav) {
325					errorMsg = 'Please log in to add image to your favorites.';
326				}
327				$('#login-tab h3').after('<div class="alert alert-danger error-msg">' + errorMsg + '</div>');
328				$('#login-signup-modal .tab-pane').removeClass('active');
329				$('#login-signup-modal #login-tab').addClass('active');
330				$('#login-signup-modal').modal('show');		
331			}
332		},
333		error:function(error) {
334			_showReqFailModal();
335		}		
336	});
337}
338
339var _saveGrid;
340var _photosGridLoaded = [];
341
342if ($('.photo-grid-item').length) {
343	_photosGrid = true;
344	_saveGrid = $('#main').clone();
345	_saveGrid.find('.title-container').remove();
346	_saveGrid = _saveGrid.html();
347}
348
349$(window).on('beforeunload', function() {
350	if (_photosGrid) {
351		var stateObj = {
352			scrollTop: $(window).scrollTop(),
353			photoGrid: _photosGridLoaded
354		}
355		history.replaceState(stateObj, null, null);
356	}
357});
358
359if (history.state) {
360	_photosGridLoaded = history.state.photoGrid;
361	var requests = [];
362
363	if (_photosGridLoaded.length > 0) {
364		_loadingPhotos = true;
365		for(i = 0; i < _photosGridLoaded.length; i++) {
366			requests.push($.getJSON(_photosGridLoaded[i]));
367		}
368
369		$.when.apply($, requests).done(function() {
370			if (requests.length == 1) {
371				renderPhotosGrid(arguments[0]);
372			}
373			else {
374				$.each(arguments, function(index, responseData) {
375					renderPhotosGrid(responseData[0]);
376				});
377			}
378			$(window).scrollTop(history.state.scrollTop);
379		});
380	}
381}
382
383/**********************************************************************************
384|
385|	Initialize grid if grid is present.
386|	Hide items until rowGrid finishes so reflow does not count toward CLS.
387|	rowGrid runs on mobile too to keep masonry without blank gaps.
388|
389**********************************************************************************/
390
391if ($('.photo-grid-item').length) {

392	var options = {minMargin: 8, maxMargin: 15, itemSelector: '.photo-grid-item'};
393	var $main = $('#main');
394	function _revealGrid() {
395		$main.addClass('grid-ready');
396	}
397	$main.rowGrid(options);
398	_revealGrid();
399	// Fallback if layout path fails
400	setTimeout(_revealGrid, 2000);
401}