https://uogames.org/templates/strider/js/main.js

1/**
2 * @package Helix Ultimate Framework
3 * @author JoomShaper https://www.joomshaper.com
4 * @copyright Copyright (c) 2010 - 2021 JoomShaper
5 * @license http://www.gnu.org/licenses/gpl-2.0.html GNU/GPLv2 or Later
6 */
7
8// Preloader
9jQuery(window).on('load', function () {
10	if (jQuery('.sp-loader-with-logo').length > 0) {
11		move();
12	}
13	jQuery('.sp-pre-loader').fadeOut(500, function () {
14		jQuery(this).remove();
15	});
16});
17
18/**
19 * Move the progress bar
20 */
21function move() {
22	var elem = document.getElementById('line-load');
23	var width = 1;
24	var id = setInterval(frame, 10);
25	function frame() {
26		if (width >= 100) {
27			clearInterval(id);
28		} else {
29			width++;
30			elem.style.width = width + '%';
31		}
32	}
33}
34
35jQuery(function ($) {
36	/**
37	 * Helix settings data
38	 *
39	 */
40	var settings = Joomla.getOptions('data') || {};
41
42	/**
43	 * Device wise sticky header
44	 *
45	 * @param {string} className the header className
46	 */
47	var deviceWiseStickyHeader = function (className, offsetTop) {
48		if ($('body:not(.layout-edit-iframe)').hasClass(className)) {
49			var $header = $('#sp-header');
50			var headerHeight = $header.outerHeight();
51			var $stickyHeaderPlaceholder = $('.sticky-header-placeholder');
52			let $stickyOffset = '100';
53
54			if (settings.header !== undefined && settings.header.stickyOffset !== undefined) {
55				$stickyOffset = settings.header .stickyOffset || '100';
56			}
57
58			var stickyHeader = function () {
59				var scrollTop = $(window).scrollTop();
60				if (scrollTop >= offsetTop + Number($stickyOffset)) {
61					$header.addClass('header-sticky');
62					$stickyHeaderPlaceholder.height(headerHeight);
63				} else {
64					if ($header.hasClass('header-sticky')) {
65						$header.removeClass('header-sticky');
66						$stickyHeaderPlaceholder.height('inherit');
67					}
68				}
69			};
70
71			stickyHeader();
72			$(window).scroll(function () {
73				stickyHeader();
74			});
75
76			if ($('body').hasClass('layout-boxed')) {
77				var windowWidth = $header.parent().outerWidth();
78				$header.css({ 'max-width': windowWidth, left: 'auto' });
79			}
80		} else {
81			var $header = $('#sp-header');
82			if ($header.hasClass('header-sticky')) {
83				$header.removeClass('header-sticky');
84			}
85			$(window).off('scroll');
86		}
87	};
88
89	/**
90	 * Calculate the header offset based on the
91	 * backend preview iframe site and real site.
92	 *
93	 * @return  integer The offset value
94	 */
95	function getHeaderOffset() {
96		/**
97		 * Real site header offset top
98		 *
99		 */
100		let $header = $('#sp-header');
101		let stickyHeaderTop = $header.offset().top;
102
103		/**
104		 * Backend edit preview iframe header offset top
105		 *
106		 */
107		let $backHeader = $('body.back-panel').find('#sp-header');
108		let backPanelStickyHeaderTop = null;
109
110		/**
111		 * If the class .back-panel exists,
112		 * that means this is from backend preview frame,
113		 * then get the offset top, as it varies with the original one.
114		 *
115		 */
116		if ($backHeader.length > 0) {
117			backPanelStickyHeaderTop = $backHeader.offset().top;
118		}
119
120		// By Default the header offset is the original header top
121		let headerOffset = stickyHeaderTop;
122
123		/**
124		 * If back panel sticky header top has value rather than null
125		 * that means the device type is changes from desktop to table or mobile or vice-versa.
126		 * If value found then subtract the settings topbar height from the offset top.
127		 *
128		 */
129		if (backPanelStickyHeaderTop !== null) {
130			headerOffset = backPanelStickyHeaderTop - settings.topbarHeight;
131			headerOffset = headerOffset < 0 ? stickyHeaderTop : headerOffset;
132		}
133
134		return headerOffset;
135	}
136
137	function handleStickiness() {
138		deviceWiseStickyHeader('sticky-header', getHeaderOffset());
139
140		/** @TODO: uncomment it if devicewise sticky header is required. */
141
142		/* let width = window.innerWidth;
143		if (width > settings.breakpoints.tablet) {
144			deviceWiseStickyHeader('sticky-header', getHeaderOffset());
145		} else if (
146			width <= settings.breakpoints.tablet &&
147			width > settings.breakpoints.mobile
148		) {
149			deviceWiseStickyHeader('sticky-header-md', getHeaderOffset());
150		} else {
151			deviceWiseStickyHeader('sticky-header-sm', getHeaderOffset());
152		} */
153	}
154	const headerExist = $('#sp-header');
155	if(headerExist.length>0) {
156		handleStickiness();
157	}
158
159	$(window).on('resize', function (e) {
160		if(headerExist.length>0) {
161			handleStickiness();
162		}
163	});
164
165	// go to top
166	$(window).scroll(function () {
167		if ($(this).scrollTop() > 100) {
168			$('.sp-scroll-up').fadeIn();
169		} else {
170			$('.sp-scroll-up').fadeOut(400);
171		}
172	});
173
174	$('.sp-scroll-up').click(function () {
175		$('html, body').animate(
176			{
177				scrollTop: -60,
178			},
179			600
180		);
181		return false;

182	});
183
184	//mega menu
185	$('.sp-megamenu-wrapper').parent().parent().css('position', 'static').parent().css('position', 'relative');
186	$('.sp-menu-full').each(function () {
187		$(this).parent().addClass('menu-justify');
188	});
189
190	// Offcanvs
191	$('#offcanvas-toggler').on('click', function (event) {
192		event.preventDefault();
193		$('.offcanvas-init').addClass('offcanvas-active');
194	});
195
196	$('.offcanvas-toggler-secondary').on('click', function (event) {
197		event.preventDefault();
198		$('.offcanvas-init').addClass('offcanvas-active');
199	});
200
201	$('.offcanvas-toggler-full').on('click', function (event) {
202		event.preventDefault();
203		$('.offcanvas-init').addClass('offcanvas-active full-offcanvas');
204	});
205
206	$('.close-offcanvas, .offcanvas-overlay').on('click', function (event) {
207		event.preventDefault();
208		$('.offcanvas-init').removeClass('offcanvas-active full-offcanvas');
209	});
210
211	$(document).on('click', '.offcanvas-inner .menu-toggler', function (event) {
212		event.preventDefault();
213		$(this).closest('.menu-parent').toggleClass('menu-parent-open').find('>.menu-child').slideToggle(400);
214	});
215
216	// Modal Menu
217	if ($('#modal-menu').length > 0) {
218		let $modalToggler = $('#modal-menu-toggler');
219		let $modalMenu = $('#modal-menu');
220		let $body = $('body');
221
222		$modalToggler.on('click', function (e) {
223			e.preventDefault();
224			$modalMenu.toggleClass('active');
225			$body.toggleClass('modal-menu-active');
226			$(this).toggleClass('active');
227		});
228
229		// modal menu close with escape
230		$(document).keyup(function (e) {
231			if (e.key == 'Escape') {
232				$modalMenu.removeClass('active');
233				$modalToggler.removeClass('active');
234				$body.removeClass('modal-menu-active');
235			}
236		});
237	}
238
239	// Tooltip
240	var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"], .hasTooltip'));
241	var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
242		return new bootstrap.Tooltip(tooltipTriggerEl,{
243			html: true
244		  });
245	});
246
247	// Popover
248	var popoverTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]'));
249	var popoverList = popoverTriggerList.map(function (popoverTriggerEl) {
250		return new bootstrap.Popover(popoverTriggerEl);
251	});
252
253	// Article Ajax voting
254	$('.article-ratings .rating-star').on('click', function (event) {
255		event.preventDefault();
256		var $parent = $(this).closest('.article-ratings');
257
258		var request = {
259			option: 'com_ajax',
260			template: template,
261			action: 'rating',
262			rating: $(this).data('number'),
263			article_id: $parent.data('id'),
264			format: 'json',
265		};
266
267		$.ajax({
268			type: 'POST',
269			data: request,
270			beforeSend: function () {
271				$parent.find('.fa-spinner').show();
272			},
273			success: function (response) {
274				var data = $.parseJSON(response);
275				$parent.find('.ratings-count').text(data.message);
276				$parent.find('.fa-spinner').hide();
277
278				if (data.status) {
279					$parent.find('.rating-symbol').html(data.ratings);
280				}
281
282				setTimeout(function () {
283					$parent.find('.ratings-count').text('(' + data.rating_count + ')');
284				}, 3000);
285			},
286		});
287	});
288
289	//  Cookie consent
290	$('.sp-cookie-allow').on('click', function (event) {
291		event.preventDefault();
292
293		var date = new Date();
294		date.setTime(date.getTime() + 30 * 24 * 60 * 60 * 1000);
295		var expires = '; expires=' + date.toGMTString();
296		document.cookie = 'spcookie_status=ok' + expires + '; path=/';
297
298		$(this).closest('.sp-cookie-consent').fadeOut();
299	});
300
301	$('.btn-group label:not(.active)').click(function () {
302		var label = $(this);
303		var input = $('#' + label.attr('for'));
304
305		if (!input.prop('checked')) {
306			label.closest('.btn-group').find('label').removeClass('active btn-success btn-danger btn-primary');
307			if (input.val() === '') {
308				label.addClass('active btn-primary');
309			} else if (input.val() == 0) {
310				label.addClass('active btn-danger');
311			} else {
312				label.addClass('active btn-success');
313			}
314			input.prop('checked', true);
315			input.trigger('change');
316		}
317		var parent = $(this).parents('#attrib-helix_ultimate_blog_options');
318		if (parent) {
319			showCategoryItems(parent, input.val());
320		}
321	});
322	$('.btn-group input[checked=checked]').each(function () {
323		if ($(this).val() == '') {
324			$('label[for=' + $(this).attr('id') + ']').addClass('active btn btn-primary');
325		} else if ($(this).val() == 0) {
326			$('label[for=' + $(this).attr('id') + ']').addClass('active btn btn-danger');
327		} else {
328			$('label[for=' + $(this).attr('id') + ']').addClass('active btn btn-success');
329		}
330		var parent = $(this).parents('#attrib-helix_ultimate_blog_options');
331		if (parent) {
332			parent.find('*[data-showon]').each(function () {
333				$(this).hide();
334			});
335		}
336	});
337
338	function showCategoryItems(parent, value) {
339		var controlGroup = parent.find('*[data-showon]');
340
341		controlGroup.each(function () {
342			var data = $(this).attr('data-showon');
343			data = typeof data !== 'undefined' ? JSON.parse(data) : [];
344			if (data.length > 0) {
345				if (typeof data[0].values !== 'undefined' && data[0].values.includes(value)) {
346					$(this).slideDown();
347				} else {
348					$(this).hide();
349				}
350			}
351		});
352	}
353
354	$(window).on('scroll', function () {
355		var scrollBar = $('.sp-reading-progress-bar');
356		if (scrollBar.length > 0) {
357			var s = $(window).scrollTop(),
358				d = $(document).height(),
359				c = $(window).height();
360			var scrollPercent = (s / (d - c)) * 100;
361			const position = scrollBar.data('position');
362			if (position === 'top') {
363				// var sticky = $('.header-sticky');
364				// if( sticky.length > 0 ){
365				//     sticky.css({ top: scrollBar.height() })
366				// }else{
367				//     sticky.css({ top: 0 })
368				// }
369			}
370			scrollBar.css({ width: `${scrollPercent}%` });
371		}
372	});
373});