PluginProbe ʕ •ᴥ•ʔ
EmbedPress – PDF Embedder, Embed PDF viewer, YouTube Videos, 3D FlipBook, Social feeds & more / 4.3.1
EmbedPress – PDF Embedder, Embed PDF viewer, YouTube Videos, 3D FlipBook, Social feeds & more v4.3.1
4.5.6 4.5.5 4.5.4 4.5.3 4.5.2 trunk 1.0.0 1.1.0 1.1.1 1.1.2 1.1.3 1.2.0 1.3.0 1.3.1 1.4.0 1.4.1 1.4.2 1.4.3 1.4.4 1.5.0 1.6.0 1.6.1 1.6.2 1.6.3 1.7.0 1.7.1 1.7.2 1.7.3 1.7.4 1.7.5 2.0.0 2.0.1 2.0.2 2.0.3 2.1.0 2.1.1 2.1.2 2.1.3 2.1.4 2.1.5 2.1.6 2.2.0 2.2.1 2.2.2 2.3.0 2.3.1 2.3.2 2.3.3 2.4.0 2.4.1 2.5.0 2.5.1 2.5.2 2.5.3 2.5.4 2.5.5 2.6.0 2.6.1 2.6.2 2.7.0 2.7.1 2.7.2 2.7.3 2.7.4 2.7.5 2.7.6 2.7.7 3.0.0 3.0.1 3.0.2 3.0.3 3.0.4 3.1.0 3.1.1 3.1.2 3.1.3 3.2.0 3.2.1 3.3.0 3.3.1 3.3.2 3.3.3 3.3.4 3.3.5 3.3.6 3.3.7 3.4.0 3.4.1 3.4.2 3.4.3 3.5.0 3.5.1 3.5.2 3.5.3 3.6.0 3.6.1 3.6.2 3.6.3 3.6.4 3.6.5 3.6.6 3.6.7 3.6.8 3.7.0 3.7.1 3.7.2 3.7.3 3.8.0 3.8.1 3.8.2 3.8.3 3.8.4 3.8.5 3.9.0 3.9.1 3.9.10 3.9.11 3.9.12 3.9.13 3.9.14 3.9.15 3.9.16 3.9.17 3.9.2 3.9.3 3.9.4 3.9.5 3.9.6 3.9.7 3.9.8 3.9.9 4.0.0 4.0.1 4.0.10 4.0.11 4.0.12 4.0.13 4.0.14 4.0.2 4.0.3 4.0.4 4.0.5 4.0.6 4.0.7 4.0.8 4.0.9 4.1.0 4.1.1 4.1.10 4.1.2 4.1.3 4.1.4 4.1.5 4.1.6 4.1.7 4.1.8 4.1.9 4.2.0 4.2.1 4.2.2 4.2.3 4.2.4 4.2.5 4.2.6 4.2.7 4.2.8 4.2.9 4.3.0 4.3.1 4.4.0 4.4.1 4.4.10 4.4.11 4.4.2 4.4.3 4.4.4 4.4.5 4.4.6 4.4.7 4.4.8 4.4.9 4.5.0 4.5.1
embedpress / assets / js / front.js
embedpress / assets / js Last commit date
vendor 7 years ago admin.js 1 year ago ads.js 1 year ago carousel.js 1 year ago carousel.min.js 2 years ago documents-viewer-script.js 3 years ago embed-ui.min.js 11 months ago front.js 1 year ago gallery-justify.js 1 year ago glider.js 1 year ago glider.min.js 2 years ago gutneberg-script.js 1 year ago index.html 7 years ago initCarousel.js 2 years ago initplyr.js 2 years ago instafeed.js 2 years ago license.js 2 years ago pdfobject.js 1 year ago plyr.js 1 year ago plyr.polyfilled.js 3 years ago preview.js 10 months ago remove-round-button.js 11 months ago settings.js 6 years ago vimeo-player.js 2 years ago ytiframeapi.js 2 years ago
front.js
1418 lines
1 /**
2 * @package EmbedPress
3 * @author EmbedPress <help@embedpress.com>
4 * @copyright Copyright (C) 2023 EmbedPress. All rights reserved.
5 * @license GPLv2 or later
6 * @since 1.7.0
7 */
8
9
10
11 let epGlobals = {};
12
13 (function ($) {
14 'use strict';
15 // function equivalent to jquery ready()
16 function ready(fn) {
17 if (document.readyState !== 'loading') {
18 fn();
19 } else {
20 document.addEventListener('DOMContentLoaded', fn);
21 }
22 }
23
24 ready(function () {
25 let option = {
26 forceObject: true,
27 };
28 let selector = document.querySelectorAll('.embedpress-embed-document-pdf');
29 if (selector.length) {
30 selector.forEach((function (value, index, thisArg) {
31 let id = value.dataset['emid'];
32 let src = value.dataset['emsrc'];
33 PDFObject?.embed(src, "." + id, option);
34 }));
35 }
36 if (typeof epGlobals.youtubeChannelGallery === 'function') {
37 epGlobals.youtubeChannelGallery();
38 }
39 });
40
41 /**
42 *
43 * Make embeds responsive so they don't overflow their container.
44 */
45
46 /**
47 * Add max-width & max-height to <iframe> elements, depending on their width & height props.
48 *
49 *
50 * @return {void}
51 */
52 function embedPressResponsiveEmbeds() {
53 var proportion, parentWidth;
54
55 // Loop iframe elements.
56 document.querySelectorAll('iframe').forEach(function (iframe) {
57 // Only continue if the iframe has a width & height defined.
58 if (iframe.width && iframe.height) {
59 // Calculate the proportion/ratio based on the width & height.
60 proportion = parseFloat(iframe.width) / parseFloat(iframe.height);
61 // Get the parent element's width.
62 parentWidth = parseFloat(window.getComputedStyle(iframe.parentElement, null).width.replace('px', ''));
63 // Set the max-width & height.
64 iframe.style.maxWidth = '100%';
65 iframe.style.maxHeight = Math.round(parentWidth / proportion).toString() + 'px';
66 }
67 });
68 }
69
70 epGlobals.handlePosterImageLoad = function () {
71 var posterImages = document.querySelectorAll(".plyr__poster");
72 posterImages.forEach(function (posterImage) {
73 if (posterImage) {
74 var videoWrappers = document.querySelectorAll("[data-playerid]");
75 videoWrappers.forEach(function (videoWrapper) {
76 var observer = new MutationObserver(function (mutationsList, observer) {
77 var posterImageStyle = window.getComputedStyle(posterImage);
78 if (posterImageStyle.getPropertyValue('background-image') !== 'none') {
79 setTimeout(function () {
80 videoWrapper.style.opacity = "1";
81 }, 200);
82 observer.disconnect();
83 }
84 });
85
86 observer.observe(posterImage, { attributes: true, attributeFilter: ['style'] });
87 });
88 }
89 });
90 }
91
92 // Run on initial load.
93 embedPressResponsiveEmbeds();
94
95 // Run on resize.
96 window.onresize = embedPressResponsiveEmbeds;
97
98
99 function hasClass(ele, cls) {
100 return !!ele.className.match(new RegExp("(\\s|^)" + cls + "(\\s|$)"));
101 }
102
103 function addClass(ele, cls) {
104 if (!hasClass(ele, cls)) ele.className += " " + cls;
105 }
106
107 function removeClass(ele, cls) {
108 if (hasClass(ele, cls)) {
109 var reg = new RegExp("(\\s|^)" + cls + "(\\s|$)");
110 ele.className = ele.className.replace(reg, " ");
111 }
112 }
113 if (!Element.prototype.matches) {
114 Element.prototype.matches =
115 Element.prototype.matchesSelector ||
116 Element.prototype.webkitMatchesSelector ||
117 Element.prototype.mozMatchesSelector ||
118 Element.prototype.msMatchesSelector ||
119 Element.prototype.oMatchesSelector ||
120 function (s) {
121 var matches = (this.document || this.ownerDocument).querySelectorAll(s),
122 i = matches.length;
123 while (--i >= 0 && matches.item(i) !== this) { }
124 return i > -1;
125 };
126 }
127 var delegate = function (el, evt, sel, handler) {
128 el.addEventListener(evt, function (event) {
129 var t = event.target;
130 while (t && t !== this) {
131 if (t.matches(sel)) {
132 handler.call(t, event);
133 }
134 t = t.parentNode;
135 }
136 });
137 };
138
139 function sendRequest(url, postData, callback) {
140 var req = createXMLHTTPObject();
141 if (!req) return;
142 var method = postData ? "POST" : "GET";
143 req.open(method, url, true);
144 if (postData) {
145 req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
146 }
147 req.onreadystatechange = function () {
148 if (req.readyState != 4) return;
149 if (req.status != 200 && req.status != 304) {
150 return;
151 }
152 callback(req);
153 };
154 if (req.readyState == 4) return;
155 req.send(postData);
156 }
157
158 var XMLHttpFactories = [
159 function () {
160 return new XMLHttpRequest();
161 },
162 function () {
163 return new ActiveXObject("Msxml3.XMLHTTP");
164 },
165 function () {
166 return new ActiveXObject("Msxml2.XMLHTTP.6.0");
167 },
168 function () {
169 return new ActiveXObject("Msxml2.XMLHTTP.3.0");
170 },
171 function () {
172 return new ActiveXObject("Msxml2.XMLHTTP");
173 },
174 function () {
175 return new ActiveXObject("Microsoft.XMLHTTP");
176 },
177 ];
178
179 function createXMLHTTPObject() {
180 var xmlhttp = false;
181 for (var i = 0; i < XMLHttpFactories.length; i++) {
182 try {
183 xmlhttp = XMLHttpFactories[i]();
184 } catch (e) {
185 continue;
186 }
187 break;
188 }
189 return xmlhttp;
190 }
191
192 epGlobals.youtubeChannelGallery = function () {
193 var playerWraps = document.getElementsByClassName("ep-player-wrap");
194 if (playerWraps && playerWraps.length) {
195 for (var i = 0, im = playerWraps.length; im > i; i++) {
196 youtubeChannelEvents(playerWraps[i])
197 }
198 }
199 }
200
201 function youtubeChannelEvents(playerWrap) {
202
203 delegate(playerWrap, "click", ".item", function (event) {
204 var embed = "https://www.youtube.com/embed/";
205 var vid = this.getAttribute("data-vid");
206 var iframe = playerWrap.getElementsByTagName("iframe");
207 if (vid) {
208 if (iframe) {
209 var vidSrc = iframe[0].src.replace(/(.*\/embed\/)([^\?&"'>]+)(.+)?/, `\$1${vid}\$3`);
210 if (vidSrc.indexOf('autoplay') > 0) {
211 vidSrc = vidSrc.replace('autoplay=0', 'autoplay=1');
212 }
213 else {
214 vidSrc += '&autoplay=1';
215 }
216 iframe[0].src = vidSrc;
217 playerWrap.scrollIntoView();
218 }
219 }
220 });
221
222 var currentPage = 1;
223
224 let nearestEpContentId = playerWrap.querySelector('.ep-youtube__content__block').getAttribute('data-unique-id');
225
226 let epContentBlock = playerWrap.querySelector('.ep-youtube__content__block');
227 let parentElement = epContentBlock.parentElement;
228
229 // Get the value of data-channel-url attribute from a sibling
230 let channelUrl = parentElement.querySelector('[data-channel-url]').getAttribute('data-channel-url');
231
232
233 delegate(playerWrap, "click", ".ep-next, .ep-prev", function (event) {
234 const totalPages = event.target.closest('.ose-youtube').getAttribute('data-total-pages');
235 const closestClass = event.target.closest('.ose-youtube').classList;
236
237 const activePage = document.querySelector(`.${closestClass[1]} .embedpress-page-active`);
238 if (activePage) {
239 document.querySelector(`.${closestClass[1]} .embedpress-page-active`).classList.remove('embedpress-page-active');
240 }
241
242
243
244 var isNext = this.classList.contains("ep-next");
245
246 if (isNext) {
247 currentPage++;
248 } else {
249 currentPage--;
250 }
251
252 var data = {
253 action: "youtube_rest_api",
254 playlistid: this.getAttribute("data-playlistid"),
255 pagetoken: this.getAttribute("data-pagetoken"),
256 pagesize: this.getAttribute("data-pagesize"),
257 channelUrl: channelUrl,
258 currentpage: currentPage
259 };
260
261 var formBody = [];
262 for (var property in data) {
263 var encodedKey = encodeURIComponent(property);
264 var encodedValue = encodeURIComponent(data[property]);
265 formBody.push(encodedKey + "=" + encodedValue);
266 }
267 formBody = formBody.join("&");
268
269 var galleryWrapper = playerWrap.getElementsByClassName(
270 "ep-youtube__content__block"
271 );
272
273 playerWrap.setAttribute('data-current-page', currentPage);
274
275
276 let x = 1;
277
278 sendRequest(eplocalize.ajaxurl, formBody, function (request) {
279 if (galleryWrapper && galleryWrapper[0] && request.responseText) {
280 var response = JSON.parse(request.responseText);
281 galleryWrapper[0].outerHTML = response.html;
282
283 var currentPageNode =
284 galleryWrapper[0].getElementsByClassName("current-page");
285 if (currentPageNode && currentPageNode[0]) {
286 currentPageNode[0].textContent = currentPage;
287
288 }
289 }
290 });
291
292 const intervalID = setInterval(() => {
293 x++
294
295 if (playerWrap.querySelector('.ep-youtube__content__block')) {
296 const newNearestEpContentId = playerWrap
297 .querySelector('.ep-youtube__content__block')
298 .getAttribute('data-unique-id');
299
300 if (newNearestEpContentId !== nearestEpContentId && playerWrap.querySelector(`[data-page="${currentPage}"]`)) {
301 playerWrap.querySelector(`[data-page="${currentPage}"]`).classList.add('embedpress-page-active');
302 nearestEpContentId = newNearestEpContentId;
303 clearInterval(intervalID);
304 }
305 }
306
307 if (x > 100) {
308 clearInterval(intervalID);
309 }
310 }, 100);
311
312 });
313 }
314
315 //Load more for OpenaSea collection
316 const epLoadMore = () => {
317
318 $('.embedpress-gutenberg-wrapper .ep-nft-gallery-wrapper').each(function () {
319 let selctorEl = `[data-nftid='${$(this).data('nftid')}']`;
320
321 let loadmorelabel = $(selctorEl).data('loadmorelabel');
322 let iconcolor = $(selctorEl + " .nft-loadmore").data('iconcolor');
323
324 let spinicon = `<svg width="18" height="18" fill="${iconcolor || '#fff'}" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><style>.spinner_GuJz{transform-origin:center;animation:spinner_STY6 1.5s linear infinite}@keyframes spinner_STY6{100%{transform:rotate(360deg)}}</style><g class="spinner_GuJz"><circle cx="3" cy="12" r="2"/><circle cx="21" cy="12" r="2"/><circle cx="12" cy="21" r="2"/><circle cx="12" cy="3" r="2"/><circle cx="5.64" cy="5.64" r="2"/><circle cx="18.36" cy="18.36" r="2"/><circle cx="5.64" cy="18.36" r="2"/><circle cx="18.36" cy="5.64" r="2"/></g></svg>`;
325
326 $(selctorEl + ` .ep_nft_item`).slice(0, $(selctorEl).data('itemparpage')).show();
327 $('.embedpress-gutenberg-wrapper .ep-nft-gallery-wrapper .ep-loadmore-wrapper button').css('display', 'flex');
328
329 $(selctorEl + " .nft-loadmore").click(function (e) {
330 //change the text of the button
331 $(this).html(loadmorelabel + spinicon);
332 //disable the button
333 $(this).prop("disabled", true);
334 //wait for 1 seconds
335 setTimeout(function () {
336 //change the text back
337 $(selctorEl + " .nft-loadmore").text(loadmorelabel);
338 //enable the button
339 $(selctorEl + " .nft-loadmore").prop("disabled", false);
340 $(selctorEl + " .ep_nft_item:hidden").slice(0, $(selctorEl).data('itemparpage')).fadeIn("slow");
341 if ($(selctorEl + " .ep_nft_item:hidden").length == 0) {
342 $(selctorEl + " .nft-loadmore").fadeOut("slow");
343 }
344 }, 500);
345 });
346 });
347 };
348
349 if ($('.embedpress-gutenberg-wrapper .ep-nft-gallery-wrapper').length > 0) {
350 epLoadMore();
351 }
352
353 // Content protection system function
354 const unlockSubmitHander = (perentSel, that) => {
355 var ep_client_id = jQuery(that).closest('form').find('input[name="ep_client_id"]').val();
356 var password = jQuery(`input[name="pass_${ep_client_id}"]`).val();
357 var post_id = jQuery(`input[name="post_id"]`).val();
358 const buttonText = jQuery(that).closest('.password-form-container').find('input[type="submit"]').val();
359 const unlokingText = jQuery(that).data('unlocking-text');
360
361
362 var data = {
363 'action': 'lock_content_form_handler',
364 'client_id': ep_client_id,
365 'password': password,
366 'post_id': post_id,
367 };
368
369 jQuery('#' + perentSel + '-' + ep_client_id + ' .password-form input[type="submit"]').val(unlokingText);
370
371 jQuery.post(eplocalize.ajaxurl, data, function (response) {
372 if (response.success) {
373 if (!response.embedHtml) {
374 jQuery('#' + perentSel + '-' + ep_client_id + ' .password-form input[type="submit"]').val(buttonText);
375 jQuery('#' + perentSel + '-' + ep_client_id + ' .password-form input[type="password"]').val('');
376 jQuery(that).closest('.password-form-container').find('.error-message').removeClass('hidden');
377 }
378 else {
379 jQuery('#' + perentSel + '-' + ep_client_id + ' .ep-embed-content-wraper').html(response.embedHtml);
380
381 if (jQuery('#' + perentSel + '-' + ep_client_id + ' .ose-youtube').length > 0) {
382 epGlobals.youtubeChannelGallery();
383 }
384
385 if ($('.embedpress-gutenberg-wrapper .ep-nft-gallery-wrapper').length > 0) {
386 epLoadMore();
387 }
388
389 // Custom player initialization when content protection enabled
390 document.querySelector('#' + perentSel + '-' + ep_client_id + ' .ep-embed-content-wraper')?.classList?.remove('plyr-initialized');
391
392 if (typeof initPlayer === 'function') {
393 initPlayer(document.querySelector('#' + perentSel + '-' + ep_client_id + ' .ep-embed-content-wraper'));
394 }
395 if (eplocalize.is_pro_plugin_active) {
396 const adIdEl = document.querySelector('#' + perentSel + '-' + ep_client_id + ' [data-sponsored-id]');
397 if (typeof adInitialization === 'function') {
398 adInitialization(adIdEl, adIdEl?.getAttribute('data-ad-index'));
399 }
400 }
401
402 }
403 } else {
404 jQuery('#password-error_' + ep_client_id).html(response.form);
405 jQuery('#password-error_' + ep_client_id).show();
406 }
407 }, 'json');
408 }
409
410 // unlockSubmitHander called for gutentberg
411 jQuery('.ep-gutenberg-content .password-form').submit(function (e) {
412 e.preventDefault(); // Prevent the default form submission
413 unlockSubmitHander('ep-gutenberg-content', this);
414 });
415
416 jQuery('.ep-shortcode-content .password-form').submit(function (e) {
417 e.preventDefault(); // Prevent the default form submission
418 unlockSubmitHander('ep-shortcode-content', this);
419 });
420
421 window.addEventListener('load', function (e) {
422 const urlParams = new URLSearchParams(window.location.search);
423 const hash = urlParams.get('hash');
424
425 // find the element with the matching id
426 const element = document.getElementById(hash);
427
428 if (element) {
429 element.scrollIntoView({ behavior: 'smooth' });
430 }
431
432 });
433
434 // Get the insta-gallery container element
435 const getPopupTemplate = (instPost, hashtag = '', accountType) => {
436
437 let instaPostData = JSON.parse(instPost);
438
439
440 let likeIcon = '<svg aria-label="Like" class="x1lliihq x1n2onr6" color="#262626" fill="#262626" height="24" viewBox="0 0 24 24" width="24"><path d="M16.792 3.904A4.989 4.989 0 0 1 21.5 9.122c0 3.072-2.652 4.959-5.197 7.222-2.512 2.243-3.865 3.469-4.303 3.752-.477-.309-2.143-1.823-4.303-3.752C5.141 14.072 2.5 12.167 2.5 9.122a4.989 4.989 0 0 1 4.708-5.218 4.21 4.21 0 0 1 3.675 1.941c.84 1.175.98 1.763 1.12 1.763s.278-.588 1.11-1.766a4.17 4.17 0 0 1 3.679-1.938m0-2a6.04 6.04 0 0 0-4.797 2.127 6.052 6.052 0 0 0-4.787-2.127A6.985 6.985 0 0 0 .5 9.122c0 3.61 2.55 5.827 5.015 7.97.283.246.569.494.853.747l1.027.918a44.998 44.998 0 0 0 3.518 3.018 2 2 0 0 0 2.174 0 45.263 45.263 0 0 0 3.626-3.115l.922-.824c.293-.26.59-.519.885-.774 2.334-2.025 4.98-4.32 4.98-7.94a6.985 6.985 0 0 0-6.708-7.218Z"/></svg>';
441
442 if (instaPostData.like_count > 0) {
443 likeIcon = '<svg aria-label="Unlike" class="x1lliihq x1n2onr6" color="#FF3040" fill="#FF3040" height="24" viewBox="0 0 48 48" width="24"><path d="M34.6 3.1c-4.5 0-7.9 1.8-10.6 5.6-2.7-3.7-6.1-5.5-10.6-5.5C6 3.1 0 9.6 0 17.6c0 7.3 5.4 12 10.6 16.5.6.5 1.3 1.1 1.9 1.7l2.3 2c4.4 3.9 6.6 5.9 7.6 6.5.5.3 1.1.5 1.6.5s1.1-.2 1.6-.5c1-.6 2.8-2.2 7.8-6.8l2-1.8c.7-.6 1.3-1.2 2-1.7C42.7 29.6 48 25 48 17.6c0-8-6-14.5-13.4-14.5z"/></svg>';
444 }
445
446 const commentsIcon = '<svg aria-label="Comment" class="x1lliihq x1n2onr6" color="#000" height="24" viewBox="0 0 24 24" width="24"><path d="M20.656 17.008a9.993 9.993 0 1 0-3.59 3.615L22 22Z" fill="none" stroke="currentColor" stroke-linejoin="round" stroke-width="2"/></svg>';
447
448 const shareIcon = '<svg width="20" height="20" viewBox="0 0 0.6 0.6" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg"><path stroke-width="1" d="m.543.282-.2-.2A.025.025 0 0 0 .3.1v.089a.275.275 0 0 0-.25.274V.5a.025.025 0 0 0 .045.015.3.3 0 0 1 .197-.101L.3.413V.5a.025.025 0 0 0 .043.018l.2-.2a.025.025 0 0 0 0-.035M.35.44V.388A.025.025 0 0 0 .325.363L.286.365a.35.35 0 0 0-.185.074.225.225 0 0 1 .224-.201A.025.025 0 0 0 .35.213V.16L.49.3Z"/></svg>';
449
450 const instaIcon = '<svg width="18" height="18" viewBox="0 0 0.338 0.338" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M.248.079H.27M.102.012h.135a.09.09 0 0 1 .09.09v.135a.09.09 0 0 1-.09.09H.102a.09.09 0 0 1-.09-.09V.102a.09.09 0 0 1 .09-.09ZM.17.237a.068.068 0 1 1 0-.135.068.068 0 0 1 0 .135Z" stroke="#000" stroke-width=".032"/></svg>';
451
452
453
454 const instaUserInfo = instPost.user_info;
455
456 let getDate = new Date(instaPostData.timestamp);
457 getDate = getDate.toLocaleString('en-US', { day: 'numeric', month: 'short', year: 'numeric' });
458
459 let getTime = new Date(instaPostData.timestamp);
460 getTime = getTime.toLocaleString('en-US', { hour12: false, hour: 'numeric', minute: 'numeric', second: 'numeric' });
461
462 let captionText = instaPostData.caption ? instaPostData.caption : '';
463 const tagRegex = /(#\w+)/g;
464
465 const wrapTag = (match) => {
466 const tag = match.substring(1); // Remove the '#' character
467 const tagUrl = `https://www.instagram.com/explore/tags/${tag}`;
468 return `<span class="tag-wrapper"><a target="_blank" href="${tagUrl}">${match}</a></span>`;
469 };
470
471 captionText = captionText.replace(tagRegex, wrapTag);
472
473 let carouselTemplate = '';
474 if (instaPostData.media_type === 'CAROUSEL_ALBUM') {
475 carouselTemplate += `<div class="popup-carousel"><div class="cg-carousel__track js-carousel__track">`;
476
477 instaPostData.children.data?.map((item) => {
478 if (item.media_type?.toLowerCase() === 'video') {
479 carouselTemplate += `<video width="630" class="popup-media-image cg-carousel__slide js-carousel__slide" controls src="${item.media_url || ''}" alt="${item.caption || ''}" controlsList="nodownload"></video>`;
480 }
481 else {
482 carouselTemplate += `<img width="630" class="popup-media-image cg-carousel__slide js-carousel__slide" src="${item.media_url || ''}" alt="${item.caption || ''}" />`;
483 }
484 });
485
486 carouselTemplate += `</div></div>`;
487
488 carouselTemplate += `<div class="cg-carousel__btns">
489 <button class="cg-carousel__btn js-carousel__prev-1"><svg width="20" height="30" viewBox="-5 0 23 23" xmlns="http://www.w3.org/2000/svg"><path d="M11.24.29.361 10.742l-.06.054a.97.97 0 0 0-.301.642v.124a.97.97 0 0 0 .3.642l.054.044L11.239 22.71a1.061 1.061 0 0 0 1.459 0 .964.964 0 0 0 0-1.402l-10.15-9.746 10.15-9.87a.964.964 0 0 0 0-1.402 1.061 1.061 0 0 0-1.459 0Z" fill="#fff"/></svg></button>
490
491 <button class="cg-carousel__btn js-carousel__next-1"><svg width="20" height="30" viewBox="-5 0 23 23" xmlns="http://www.w3.org/2000/svg"><path d="m1.76.29 10.879 10.452.06.054a.97.97 0 0 1 .301.642v.124a.97.97 0 0 1-.3.642l-.054.044L1.761 22.71a1.061 1.061 0 0 1-1.459 0 .964.964 0 0 1 0-1.402l10.15-9.746-10.15-9.87a.964.964 0 0 1 0-1.402 1.061 1.061 0 0 1 1.459 0Z" fill="#fff"/></svg></button>
492 </div>`
493 }
494 else {
495 if (instaPostData.media_type?.toLowerCase() === 'video') {
496 carouselTemplate += `<video width="630" class="popup-media-image" controls src="${instaPostData.media_url || ''}" alt="${instaPostData.caption || ''}"></video>`;
497 }
498 else {
499 carouselTemplate += `<img width="630" class="popup-media-image" src="${instaPostData.media_url || ''}" alt="${instaPostData.caption || ''}" />`;
500 }
501 }
502
503 let srcUrl = `https://www.instagram.com/${instaPostData.username}/`;
504
505 if (hashtag) {
506 instaPostData.username = '#' + hashtag;
507 srcUrl = `https://www.instagram.com/explore/tags/${hashtag}/`;
508 }
509
510
511 let likeComments = '';
512
513 if (eplocalize.is_pro_plugin_active && accountType === 'business') {
514 if (instaPostData.show_likes_count == 'true') {
515 likeComments += `
516 <div class="embedpress-inline popup-like-button"><a target="_blank" href="${instaPostData.permalink}">${likeIcon} ${instaPostData.like_count || 0}</a></div>
517 `;
518 }
519 if (instaPostData.show_comments_count == 'true') {
520 likeComments += `
521 <div class="embedpress-inline"><a target="_blank" href="${instaPostData.permalink}">${commentsIcon} ${instaPostData.comments_count || 0}</a></div>
522 `;
523 }
524 }
525
526
527 let followBtn = '';
528 if (instaPostData.popup_follow_button_text == 'false') {
529 instaPostData.popup_follow_button_text = '';
530 }
531 if (instaPostData.popup_follow_button == 'true' || instaPostData.popup_follow_button == 'yes') {
532 followBtn = `<div class="insta-followbtn">
533 <a target="_new" href="${srcUrl}" type="button" class="btn btn-primary">${instaPostData.popup_follow_button_text}</a>
534 </div>`;
535 }
536
537 let popupHtml = '';
538 popupHtml += `
539 <div class="popup-container">
540 <div class="popup-md-9 white">
541 <div class="embedpress-popup-block embedpress-popup-img" id="post-${instaPostData.id}">
542 ${carouselTemplate}
543 </div>
544 </div>
545 <div class="popup-md-3 red">
546 <div class="embedpress-popup-block embedpress-popup-info">
547 <div class="embedpress-popup-header">
548 <div class="embedpress-popup-header-img"> <a target="_blank" href="${srcUrl}"
549 target="_blank" class="embedpress-href">
550 <img decoding="async" loading="lazy" class="embedpress-popup-round" src="${instaPostData.profile_picture_url}" width="30" height="30"> <span class="embedpress-popup-username">${instaPostData.username}</span>
551 </a>
552 </div>
553 ${followBtn}
554 </div>
555 <div class="embedpress-popup-text">${captionText}</div>
556 <div class="embedpress-popup-stats">
557 ${likeComments}
558 <div class="embedpress-inline">
559 <div class="embedpress-popup-share-buttons"> <a
560 href="https://www.facebook.com/sharer/sharer.php?u=${instaPostData.permalink}" target="_blank">
561 <span class="dashicons dashicons-facebook"></span></a> <a
562 href="https://twitter.com/intent/tweet?url=${instaPostData.permalink}"
563 target="_blank"><span>
564 <svg viewBox="0 0 18 18" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-lrsllp r-18jsvk2 r-16y2uox r-8kz0gk" width="18" height="18"><path d="M13.683 1.688h2.481l-5.42 6.195 6.377 8.43h-4.993L8.217 11.2l-4.474 5.113H1.26l5.798-6.626L.941 1.688H6.06l3.535 4.673zm-.871 13.14h1.375L5.313 3.095H3.838z"/></svg>
565 </span></a>
566 <a href="https://www.linkedin.com/shareArticle?mini=true&amp;url=${instaPostData.permalink}"
567 target="_blank"><span class="dashicons dashicons-linkedin"></span></a> <a
568 href="https://pinterest.com/pin/create/button/?url=${instaPostData.permalink}"
569 target="_blank"><span class="dashicons dashicons-pinterest"></span></a></div>
570 <div class="embedpress-href embedpress-popup-share">${shareIcon}</div>
571 </div><div class="embedpress-inline embedpress-popup-instagram-buttons"><a
572 href="${instaPostData.permalink}" target="_blank"
573 class="embedpress-href">${instaIcon}</a></div>
574 </div>
575
576 </div>
577 </div>
578 </div>
579 `;
580
581 // INIT CAROUSEL
582
583
584 return popupHtml;
585 }
586
587 // Add a click event listener to the insta-gallery container
588 epGlobals.instaPopup = (container) => {
589 container?.addEventListener('click', function (event) {
590 // Check if the clicked element has the class insta-gallery-item
591 const instaItem = event.target.closest('.insta-gallery-item');
592
593 if (instaItem) {
594
595 const postData = instaItem.dataset.postdata;
596
597 const postid = instaItem.getAttribute('data-insta-postid');
598 const accountType = container?.closest('.instagram-container')?.getAttribute('data-connected-acc-type');
599
600 let hashtag = '';
601
602 if (instaItem.closest('.instagram-container').getAttribute('data-hashtag')) {
603 hashtag = instaItem?.closest('.instagram-container')?.getAttribute('data-hashtag');
604 }
605
606 const closestPopup = event.target.closest('.ose-instagram-feed')?.querySelector('.insta-popup');
607
608 if (closestPopup) {
609 closestPopup.style.display = 'block';
610 }
611
612
613 var feedElement = event.target.closest('.ose-instagram-feed');
614 if (feedElement) {
615 var popupElement = feedElement.querySelector('.popup-is-initialized');
616 if (popupElement) {
617 popupElement.innerHTML = getPopupTemplate(postData, hashtag, accountType);
618 }
619 }
620
621 if (!document.querySelector(`#post-${postid}`)?.classList.contains('carousel-is-initialized')) {
622 const carousel = new CgCarousel(`#post-${postid}`, { slidesPerView: 1, loop: true }, {});
623
624 const next = document.querySelector(`#post-${postid} .js-carousel__next-1`);
625 next?.addEventListener('click', () => carousel.next());
626
627 const prev = document.querySelector(`#post-${postid} .js-carousel__prev-1`);
628 prev?.addEventListener('click', () => carousel.prev());
629
630 document.querySelector(`#post-${postid}`)?.classList.add('carousel-is-initialized');
631 }
632
633 }
634 });
635 }
636
637
638 const instaContainers = document.querySelectorAll('.embedpress-gutenberg-wrapper .insta-gallery');
639 if (instaContainers.length > 0) {
640 instaContainers.forEach((container) => {
641 epGlobals.instaPopup(container);
642 });
643 }
644
645 $('.popup-close').click(function (e) {
646 // Hide the popup by setting display to none
647 $('.insta-popup').hide();
648 $('.popup-container').remove();
649 });
650
651 $(document).on('click', function (e) {
652 if (e.target.classList.contains('popup-wrapper')) {
653 $('.insta-popup').hide();
654 $('.popup-container').remove();
655 }
656 });
657
658
659 const instafeeds = document.querySelectorAll('.ose-instagram-feed');
660
661 epGlobals.initializeTabs = (containerEl) => {
662
663 // Initial tab selection
664 showItems('ALL');
665
666 containerEl.addEventListener('click', function (event) {
667 const clickedElement = event.target;
668 if (!clickedElement) {
669 return; // No element clicked, ignore the event
670 }
671
672 if (containerEl.querySelector('.load-more-button-container') && (clickedElement.getAttribute('data-media-type') === 'VIDEO' || clickedElement.getAttribute('data-media-type') === 'CAROUSEL_ALBUM')) {
673 containerEl.querySelector('.load-more-button-container').style.display = 'none';
674 }
675 else if (containerEl.querySelector('.load-more-button-container') && (clickedElement.getAttribute('data-media-type') === 'ALL')) {
676 containerEl.querySelector('.load-more-button-container').style.display = 'flex';
677 }
678
679 // Handle tab click
680 if (clickedElement.matches('.tabs li')) {
681 if (clickedElement.classList.contains('active')) {
682 return;
683 } else {
684 const mediaType = clickedElement.getAttribute('data-media-type');
685 showItems(mediaType);
686
687 const tabs = containerEl.querySelectorAll('.tabs li');
688 tabs.forEach(t => t.classList.remove('active'));
689 clickedElement.classList.add('active');
690 }
691 }
692
693 });
694
695 function showItems(mediaType) {
696 const items = containerEl.getElementsByClassName('insta-gallery-item');
697 for (let i = 0; i < items.length; i++) {
698 const item = items[i];
699 if (mediaType === 'ALL' || item.getAttribute('data-media-type') === mediaType) {
700 item.style.display = 'block';
701 } else {
702 item.style.display = 'none';
703 }
704 }
705 }
706 }
707
708 epGlobals.instaLoadMore = () => {
709 // Unbind any previously bound click event to avoid multiple bindings
710 $('.insta-load-more-button').off('click').on('click', function (e) {
711 const that = $(this);
712 const loadmoreBtn = that.closest('.load-more-button-container');
713 const loadmoreKey = loadmoreBtn.data('loadmorekey');
714 const connectedAccount = that.closest('.instagram-container').data('connected-acc-type');
715 const feedType = that.closest('.instagram-container').data('feed-type');
716 const hashtagId = that.closest('.instagram-container').data('hashtag-id');
717 const userId = that.closest('.instagram-container').data('uid');
718 let loadedPosts = loadmoreBtn.data('loaded-posts') || 0;
719 let postsPerPage = loadmoreBtn.data('posts-per-page') || 0;
720 const params = JSON.stringify(that.closest('.instagram-container').data('params'));
721
722
723 const instaContainer = that.closest('.instagram-container');
724
725 const spinicon = `<svg class="insta-loadmore-spinicon" width="18" height="18" fill="${'#fff'}" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><style>.spinner_GuJz{transform-origin:center;animation:spinner_STY6 1.5s linear infinite}@keyframes spinner_STY6{100%{transform:rotate(360deg)}}</style><g class="spinner_GuJz"><circle cx="3" cy="12" r="2"/><circle cx="21" cy="12" r="2"/><circle cx="12" cy="21" r="2"/><circle cx="12" cy="3" r="2"/><circle cx="5.64" cy="5.64" r="2"/><circle cx="18.36" cy="18.36" r="2"/><circle cx="5.64" cy="18.36" r="2"/><circle cx="18.36" cy="5.64" r="2"/></g></svg>`;
726
727 // Check if no spinicon exists
728 if (instaContainer.find('.insta-loadmore-spinicon').length === 0) {
729 that.append(spinicon);
730 }
731
732 that.attr('disabled', true);
733
734 var data = {
735 'action': 'loadmore_data_handler',
736 'user_id': userId,
737 'loaded_posts': loadedPosts,
738 'posts_per_page': postsPerPage,
739 'feed_type': feedType,
740 'connected_account_type': connectedAccount,
741 'loadmore_key': loadmoreKey,
742 'params': params,
743 '_nonce': eplocalize.nonce
744 };
745
746 if (feedType === 'hashtag_type') {
747 data.hashtag_id = hashtagId;
748 }
749
750 jQuery.post(eplocalize.ajaxurl, data, function (response) {
751 if (response.total_feed_posts >= response.next_post_index) {
752 var $responseHtml = $(response.html);
753
754 instaContainer.find('.insta-gallery').append($responseHtml);
755 that.removeAttr('disabled');
756
757 instaContainer.find('.insta-loadmore-spinicon').remove();
758
759 loadedPosts = response.next_post_index;
760
761 loadmoreBtn.data('loaded-posts', loadedPosts);
762
763 // After loading more items, reinitialize the tabs for the specific container
764 const containerEl = loadmoreBtn.closest('.ose-instagram-feed')[0];
765 epGlobals.initializeTabs(containerEl);
766
767 if (response.total_feed_posts === response.next_post_index) {
768 loadmoreBtn.remove();
769 }
770 } else {
771 loadmoreBtn.remove();
772 }
773 });
774 });
775 }
776
777
778 if (instafeeds.length > 0) {
779 instafeeds.forEach(function (feed) {
780 epGlobals.initializeTabs(feed);
781 });
782 }
783
784 if ($('.embedpress-gutenberg-wrapper .ose-instagram-feed').length > 0) {
785 epGlobals.instaLoadMore();
786 }
787
788 $(document).on({
789 mouseenter: function () {
790 $('.embedpress-popup-share-buttons').addClass('show');
791 },
792 mouseleave: function () {
793 var buttons = $('.embedpress-popup-share-buttons');
794 setTimeout(function () {
795 if (!buttons.is(':hover')) buttons.removeClass('show');
796 }, 200);
797 }
798 }, '.embedpress-href.embedpress-popup-share, .embedpress-popup-share-buttons');
799
800 $(document).on({
801 mouseenter: function () {
802 $(this).addClass('show');
803 },
804 mouseleave: function () {
805 $(this).removeClass('show');
806 }
807 }, '.embedpress-popup-share-buttons');
808
809
810
811
812
813 })(jQuery);
814
815
816
817 document.addEventListener('DOMContentLoaded', function () {
818
819 epGlobals.initCarousel = (carouselSelector, options, carouselId) => {
820
821 const carouselOptions = {
822 slidesPerView: options.slideshow,
823 spacing: options.spacing,
824 loop: options.loop,
825 autoplay: options.autoplay,
826 transitionSpeed: options.transitionspeed,
827 autoplaySpeed: options.autoplayspeed,
828 arrows: options.arrows,
829 breakpoints: {
830 768: {
831 slidesPerView: parseInt(options.slideshow) - 1
832 },
833 1024: {
834 slidesPerView: parseInt(options.slideshow)
835 }
836 }
837 };
838
839 // INIT CAROUSEL
840 const carousel = new CgCarousel(carouselSelector, carouselOptions, {});
841
842 // Navigation
843 const next = document.querySelector(`[data-carouselid="${carouselId}"] #js-carousel__next-1`);
844 next?.addEventListener('click', () => carousel.next());
845
846 const prev = document.querySelector(`[data-carouselid="${carouselId}"] #js-carousel__prev-1`);
847 prev?.addEventListener('click', () => carousel.prev());
848 }
849
850 const instaWrappers = document.querySelectorAll('.ep-embed-content-wraper');
851
852 if (instaWrappers.length > 0) {
853 instaWrappers.forEach((wrapper) => {
854 const carouselId = wrapper.getAttribute('data-carouselid');
855
856 if (!carouselId) return;
857
858 let options = wrapper.getAttribute(`data-carousel-options`);
859
860 options = JSON.parse(options);
861 const carouselSelector = `[data-carouselid="${carouselId}"] .embedpress-insta-container`;
862
863 if (options.arrows) {
864 document.querySelector(`[data-carouselid="${carouselId}"] .cg-carousel__btns`).classList.remove('hidden');
865 }
866
867 epGlobals.initCarousel(carouselSelector, options, carouselId);
868
869 });
870 }
871
872 // Youtube Channel Carousel
873
874 const youtubeCarouselWraper = document.querySelectorAll('[data-youtube-channel-carousel]');
875
876 if (youtubeCarouselWraper.length > 0) {
877 youtubeCarouselWraper.forEach((wrapper) => {
878 const carouselId = wrapper.getAttribute('data-youtube-channel-carousel');
879 if (!carouselId) return;
880
881 // let options = wrapper.getAttribute(`data-carousel-options`);
882
883 // options = JSON.parse(options);
884
885 const carouselSelector = `[data-youtube-channel-carousel="${carouselId}"] .youtube__content__body`;
886
887 // if (options.arrows) {
888 // document.querySelector(`[data-youtube-channel-carousel="${carouselId}"] .cg-carousel__btns`).classList.remove('hidden');
889 // }
890
891 const options = {
892 slidesPerView: 2,
893 autoplay: true,
894 loop: true,
895 breakpoints: {
896 768: {
897 slidesPerView: 2
898 },
899 1024: {
900 slidesPerView: 4
901 }
902 }
903 }
904
905 // epGlobals.initCarousel(carouselSelector, options, {});
906
907 });
908 }
909
910
911
912 });
913
914 document.addEventListener('DOMContentLoaded', () => {
915 const carousel = document.querySelector('.youtube-carousel');
916
917 if (!carousel) {
918 return;
919 }
920
921 const items = document.querySelectorAll('.item');
922 const prevButton = document.querySelector('.preview');
923 const nextButton = document.querySelector('.next');
924
925 let itemsToShow = getItemsToShow(); // Determine items to show based on screen width
926
927 const totalItems = items.length;
928 let currentIndex = 0;
929
930 function updateCarousel() {
931 const offset = -currentIndex * (100 / itemsToShow);
932 carousel.style.transform = `translateX(${offset}%)`;
933 }
934
935 function nextSlide() {
936 const remainingItems = totalItems - (currentIndex + itemsToShow);
937 if (remainingItems >= itemsToShow) {
938 currentIndex += itemsToShow;
939 } else if (remainingItems > 0) {
940 currentIndex += remainingItems;
941 } else {
942 currentIndex = 0;
943 }
944 updateCarousel();
945 }
946
947 function prevSlide() {
948 if (currentIndex > 0) {
949 currentIndex -= itemsToShow;
950 if (currentIndex < 0) {
951 currentIndex = 0;
952 }
953 } else {
954 currentIndex = totalItems - itemsToShow;
955 }
956 updateCarousel();
957 }
958
959 nextButton?.addEventListener('click', nextSlide);
960 prevButton?.addEventListener('click', prevSlide);
961
962 // Optional: Autoplay
963 let autoplay = false;
964 const autoplayInterval = 3000; // Change the time as needed
965 let autoplayId;
966
967 function startAutoplay() {
968 autoplayId = setInterval(nextSlide, autoplayInterval);
969 }
970
971 function stopAutoplay() {
972 clearInterval(autoplayId);
973 }
974
975 if (autoplay) {
976 startAutoplay();
977
978 // Stop autoplay on mouseover, resume on mouseout
979 carousel.addEventListener('mouseover', stopAutoplay);
980 carousel.addEventListener('mouseout', startAutoplay);
981 }
982
983 // Handle responsive behavior
984 window.addEventListener('resize', () => {
985 itemsToShow = getItemsToShow();
986 updateCarousel();
987
988 });
989
990 function getItemsToShow() {
991 const width = window.innerWidth;
992 if (width >= 1024) {
993 return 3;
994 } else if (width >= 768) {
995 return 2;
996 } else {
997 return 1;
998 }
999 }
1000 });
1001
1002
1003
1004
1005 jQuery(window).on("elementor/frontend/init", function () {
1006
1007 var filterableGalleryHandler = function ($scope, $) {
1008
1009 // Get the Elementor unique selector for this widget
1010 let classes = $scope[0].className;
1011 let selectorEl = '.' + classes.split(' ').join('.');
1012
1013 const epElLoadMore = () => {
1014
1015 const spinicon = '<svg width="18" height="18" fill="#fff" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><style>.spinner_GuJz{transform-origin:center;animation:spinner_STY6 1.5s linear infinite}@keyframes spinner_STY6{100%{transform:rotate(360deg)}}</style><g class="spinner_GuJz"><circle cx="3" cy="12" r="2"/><circle cx="21" cy="12" r="2"/><circle cx="12" cy="21" r="2"/><circle cx="12" cy="3" r="2"/><circle cx="5.64" cy="5.64" r="2"/><circle cx="18.36" cy="18.36" r="2"/><circle cx="5.64" cy="18.36" r="2"/><circle cx="18.36" cy="5.64" r="2"/></g></svg>';
1016
1017 $('.elementor-widget-embedpres_elementor .ep-nft-gallery-wrapper').each(function () {
1018 let selctorEl = `.elementor-widget-embedpres_elementor [data-nftid='${$(this).data('nftid')}']`;
1019 let loadmorelabel = $(selctorEl).data('loadmorelabel');
1020 $(selctorEl + ` .ep_nft_item`).slice(0, $(selctorEl).data('itemparpage')).show();
1021 $('.elementor-widget-embedpres_elementor .ep-nft-gallery-wrapper .ep-loadmore-wrapper button').css('display', 'flex');
1022
1023 $(selctorEl + " .nft-loadmore").click(function (e) {
1024 //change the text of the button
1025 $(this).html(loadmorelabel + spinicon);
1026
1027 //disable the button
1028 $(this).prop("disabled", true);
1029 //wait for 1 seconds
1030 setTimeout(function () {
1031 //change the text back
1032 $(selctorEl + " .nft-loadmore").text(loadmorelabel);
1033 //enable the button
1034 $(selctorEl + " .nft-loadmore").prop("disabled", false);
1035 $(selctorEl + " .ep_nft_item:hidden").slice(0, $(selctorEl).data('itemparpage')).fadeIn("slow");
1036 if ($(selctorEl + " .ep_nft_item:hidden").length == 0) {
1037 $(selctorEl + " .nft-loadmore").fadeOut("slow");
1038 }
1039 }, 500);
1040 });
1041 });
1042 };
1043
1044 if ($('.elementor-widget-embedpres_elementor .ep-nft-gallery-wrapper').length > 0) {
1045 epElLoadMore();
1046 }
1047
1048 // Content protection system function
1049 const unlockElSubmitHander = (perentSel, that) => {
1050 var ep_client_id = jQuery(that).closest('form').find('input[name="ep_client_id"]').val();
1051 var password = jQuery(`input[name="pass_${ep_client_id}"]`).val();
1052 var post_id = jQuery(`input[name="post_id"]`).val();
1053 const buttonText = jQuery(that).closest('.password-form-container').find('input[type="submit"]').val();
1054 const unlokingText = jQuery(that).data('unlocking-text');
1055
1056 var data = {
1057 'action': 'lock_content_form_handler',
1058 'client_id': ep_client_id,
1059 'password': password,
1060 'post_id': post_id,
1061 };
1062
1063 jQuery('#' + perentSel + '-' + ep_client_id + ' .password-form input[type="submit"]').val(unlokingText);
1064
1065 jQuery.post(eplocalize.ajaxurl, data, function (response) {
1066 if (response.success) {
1067 if (!response.embedHtml) {
1068 jQuery('#' + perentSel + '-' + ep_client_id + ' .password-form input[type="submit"]').val(buttonText);
1069 jQuery('#' + perentSel + '-' + ep_client_id + ' .password-form input[type="password"]').val('');
1070 jQuery(that).closest('.password-form-container').find('.error-message').removeClass('hidden');
1071 }
1072 else {
1073 if ($('.ep-content-locked').has('#' + perentSel + '-' + ep_client_id).length) {
1074 $('.ep-content-locked').removeClass('ep-content-locked');
1075 }
1076
1077 jQuery('#' + perentSel + '-' + ep_client_id + ' .ep-embed-content-wraper').html(response.embedHtml);
1078
1079 $('#' + perentSel + '-' + ep_client_id).removeClass('ep-content-protection-enabled');
1080
1081 if (jQuery('#' + perentSel + '-' + ep_client_id + ' .ose-youtube').length > 0) {
1082 epGlobals.youtubeChannelGallery();
1083 }
1084
1085 if ($('.elementor-widget-embedpres_elementor .ep-nft-gallery-wrapper').length > 0) {
1086 epElLoadMore();
1087 }
1088 }
1089 } else {
1090 jQuery('#password-error_' + ep_client_id).html(response.form);
1091 jQuery('#password-error_' + ep_client_id).show();
1092 }
1093 }, 'json');
1094 }
1095
1096 // unlockElSubmitHander called for Elementor
1097 jQuery('.ep-elementor-content .password-form').submit(function (e) {
1098 e.preventDefault(); // Prevent the default form submission
1099 unlockElSubmitHander('ep-elementor-content', this);
1100 });
1101
1102
1103 const instaWrappers = document.querySelectorAll('.ep-embed-content-wrapper');
1104
1105 if (instaWrappers.length > 0) {
1106
1107 instaWrappers.forEach((wrapper) => {
1108 wrapper.classList.add('class-content-wrapper');
1109 const carouselId = wrapper.getAttribute('data-carouselid');
1110
1111 if (!carouselId) return;
1112
1113 let options = wrapper.getAttribute(`data-carousel-options`);
1114
1115 options = JSON.parse(options);
1116 const carouselSelector = `[data-carouselid="${carouselId}"] .embedpress-insta-container`;
1117
1118
1119 if (options.arrows) {
1120 document.querySelector(`[data-carouselid="${carouselId}"] .cg-carousel__btns`).classList.remove('hidden');
1121 }
1122
1123 epGlobals.initCarousel(carouselSelector, options, carouselId);
1124
1125 });
1126 }
1127
1128
1129 const instaFeed = document.querySelector(`${selectorEl} .ose-instagram-feed`);
1130 const instaGallery = document.querySelector(`${selectorEl} .insta-gallery`);
1131 if (instaFeed) {
1132 epGlobals.initializeTabs(instaFeed);
1133 }
1134 if (instaGallery) {
1135 epGlobals.instaPopup(instaGallery);
1136
1137 $('.popup-close').click(function (e) {
1138 // Hide the popup by setting display to none
1139 $('.insta-popup').hide();
1140 $('.popup-container').remove();
1141 });
1142
1143 }
1144
1145 if ($('.elementor-widget-embedpres_elementor .ose-instagram-feed').length > 0) {
1146 epGlobals.instaLoadMore();
1147 }
1148
1149 };
1150
1151 const adsHandler = function ($scope, $) {
1152 window.epAdIndex = typeof (window.epAdIndex) === 'undefined' ? 0 : window.epAdIndex + 1;
1153 let classes = $scope[0].className;
1154 let classJoint = '.' + classes.split(' ').join('.');
1155 const selectorEl = document.querySelector(classJoint + ' [data-sponsored-id]');
1156
1157 if (jQuery('body').hasClass('elementor-editor-active') && eplocalize.is_pro_plugin_active) {
1158 adInitialization(selectorEl, window.epAdIndex);
1159 }
1160
1161 }
1162
1163 elementorFrontend.hooks.addAction("frontend/element_ready/embedpres_elementor.default", filterableGalleryHandler);
1164 elementorFrontend.hooks.addAction("frontend/element_ready/embedpress_pdf.default", filterableGalleryHandler);
1165 elementorFrontend.hooks.addAction("frontend/element_ready/embedpres_document.default", filterableGalleryHandler);
1166 elementorFrontend.hooks.addAction("frontend/element_ready/embedpres_elementor.default", adsHandler);
1167 elementorFrontend.hooks.addAction("frontend/element_ready/embedpres_elementor.default", epGlobals.handlePosterImageLoad);
1168 });
1169
1170
1171 function presentationModeForIOS(iframes) {
1172 iframes?.forEach(function (iframe) {
1173 iframe.onload = function () {
1174 var iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
1175 var button = iframeDoc?.querySelector('#presentationMode.presentationMode');
1176 button?.addEventListener('click', function () {
1177 iframe.classList.toggle('presentationModeEnabledIosDevice');
1178 });
1179 iframeDoc?.addEventListener('keydown', function (event) {
1180 if (event.keyCode === 27) {
1181 iframe.classList.remove('presentationModeEnabledIosDevice');
1182 }
1183 });
1184 };
1185 });
1186 }
1187
1188 function isIOSDevice() {
1189 return /iPhone|iPad|iPod/i.test(navigator.userAgent);
1190 }
1191
1192 if (isIOSDevice()) {
1193 var iframes = document.querySelectorAll('.embedpress-embed-document-pdf');
1194 presentationModeForIOS(iframes)
1195 }
1196
1197 document.addEventListener("DOMContentLoaded", epGlobals.handlePosterImageLoad);
1198
1199
1200 jQuery(document).ready(function ($) {
1201
1202 let currentIndex = -1;
1203
1204 function createVideoPopup() {
1205 const videoPopupHtml = `
1206 <div id="videoPopup" class="video-popup">
1207 <div class="video-popup-content">
1208 <span class="close">&times;</span>
1209 <div class="video-popup-inner-content">
1210 <iframe id="videoIframe" frameborder="0" allowfullscreen allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"></iframe>
1211 <div id="videoDescription"></div>
1212 </div>
1213 <div class="popup-controls">
1214 <span id="prevVideo" class="nav-icon prev-icon">&#10094;</span>
1215 <span id="nextVideo" class="nav-icon next-icon">&#10095;</span>
1216 </div>
1217 </div>
1218 </div>`;
1219 return $(videoPopupHtml).appendTo('body');
1220 }
1221
1222 function openVideoPopup(index) {
1223 const items = $('.layout-grid .item, .layout-list .item, .layout-carousel .item');
1224 if (index >= 0 && index < items.length) {
1225 // Remove any existing video popup before creating a new one
1226 $('#videoPopup').remove();
1227
1228 currentIndex = index;
1229 const videoId = $(items[currentIndex]).data('vid');
1230 const videoPopup = createVideoPopup();
1231 const videoIframe = videoPopup.find('#videoIframe');
1232 const videoDescriptionContainer = videoPopup.find('#videoDescription');
1233 const closeBtn = videoPopup.find('.close');
1234 const nextBtn = videoPopup.find('#nextVideo');
1235 const prevBtn = videoPopup.find('#prevVideo');
1236
1237 if (videoId) {
1238 fetchVideoData(videoId, videoIframe, videoDescriptionContainer);
1239 videoPopup.show();
1240 updateNavigationButtons(nextBtn, prevBtn, items);
1241
1242 closeBtn.on('click', () => {
1243 closeVideoPopup(videoPopup);
1244 });
1245
1246 $(window).on('click', function (event) {
1247 if ($(event.target).is(videoPopup)) {
1248 closeVideoPopup(videoPopup);
1249 }
1250 });
1251
1252 nextBtn.on('click', function () {
1253 if (currentIndex >= 0 && currentIndex < items.length - 1) {
1254 openVideoPopup(currentIndex + 1);
1255 }
1256 });
1257
1258 prevBtn.on('click', function () {
1259 if (currentIndex > 0) {
1260 openVideoPopup(currentIndex - 1);
1261 }
1262 });
1263 }
1264 }
1265 }
1266
1267
1268 function closeVideoPopup(videoPopup) {
1269 videoPopup.remove();
1270 currentIndex = -1; // Reset the index
1271 }
1272
1273 function updateNavigationButtons(nextBtn, prevBtn, items) {
1274 prevBtn.toggle(currentIndex > 0);
1275 nextBtn.toggle(currentIndex < items.length - 1);
1276 }
1277
1278 function fetchVideoData(videoId, videoIframe, videoDescriptionContainer) {
1279 const data = {
1280 action: 'fetch_video_description',
1281 vid: videoId
1282 };
1283
1284 $.post(eplocalize.ajaxurl, data, function (response) {
1285 if (response.success) {
1286 videoIframe.attr('src', `https://www.youtube.com/embed/${videoId}?autoplay=1`);
1287 videoDescriptionContainer.html(response.data.description);
1288 } else {
1289 console.error('Error fetching video data:', response?.data?.error);
1290 }
1291 });
1292 }
1293
1294 $(document).on('click', '.layout-grid .item, .layout-list .item, .layout-carousel .item', function () {
1295 const items = $('.layout-grid .item, .layout-list .item, .layout-carousel .item');
1296 const index = items.index(this);
1297 openVideoPopup(index);
1298 });
1299 });
1300 jQuery(document).ready(function ($) {
1301 let currentIndex = 0;
1302 const $photos = $('.photo-item');
1303
1304 function createPopupGooglePhotos() {
1305 if ($('#ep-popup-overlay').length === 0) {
1306 const photoPopup = `
1307 <div class="popup-overlay" id="ep-popup-overlay" style="display: none!important">
1308
1309 <div class="popup">
1310 <span class="close-btn" id="close-btn">
1311 <svg width="20" height="20" viewBox="0 0 0.6 0.6" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M.132.132a.025.025 0 0 1 .035 0L.3.265.432.133a.025.025 0 1 1 .035.035L.335.3l.132.132a.025.025 0 0 1-.035.035L.3.335.168.467A.025.025 0 0 1 .133.432L.265.3.132.168a.025.025 0 0 1 0-.035" fill="#fff"/></svg>
1312 </span>
1313 <button class="prev-btn" id="prev-btn">
1314 <svg width="20" height="20" viewBox="0 0 0.6 0.6" data-name="Flat Color" xmlns="http://www.w3.org/2000/svg" class="icon flat-color"><path d="M.525.275h-.39L.268.143A.025.025 0 1 0 .233.108L.058.283a.025.025 0 0 0 0 .035l.175.175a.025.025 0 0 0 .035 0 .025.025 0 0 0 0-.035L.135.325h.39a.025.025 0 0 0 0-.05" style="fill:#fff"/></svg>
1315 </button>
1316 <div id="popup-content" class="loading">
1317 <div class="photo-loader"></div>
1318 <img id="popup-image" src="" style="display:none;" loading="lazy" />
1319 </div>
1320 <button class="next-btn" id="next-btn">
1321 <svg width="20" height="20" viewBox="0 0 0.6 0.6" data-name="Flat Color" xmlns="http://www.w3.org/2000/svg" class="icon flat-color"><path d="M.543.282.368.107a.025.025 0 0 0-.035.035l.133.132H.075a.025.025 0 0 0 0 .05h.39L.332.456a.025.025 0 0 0 0 .035.025.025 0 0 0 .035 0L.542.316a.025.025 0 0 0 0-.035" style="fill:#fff"/></svg>
1322 </button>
1323 </div>
1324 </div>`;
1325 $('body').append(photoPopup);
1326
1327 // Loader spinner CSS (can be moved to your CSS file)
1328 const spinnerStyles = `
1329 <style>
1330 .popup #popup-content .photo-loader {
1331 display: none;
1332 }
1333 .popup #popup-content.loading .photo-loader {
1334 width: 40px;
1335 height: 40px;
1336 border: 4px solid #fff;
1337 border-top: 4px solid transparent;
1338 border-radius: 50%;
1339 animation: spin 1s linear infinite;
1340 margin: 40px auto;
1341 display: block;
1342 }
1343 @keyframes spin {
1344 0% { transform: rotate(0deg); }
1345 100% { transform: rotate(360deg); }
1346 }
1347 </style>`;
1348 $('head').append(spinnerStyles);
1349
1350 // Events
1351 $('#ep-popup-overlay').on('click', function (e) {
1352 if ($(e.target).is('#ep-popup-overlay') || $(e.target).is('.popup')) {
1353 $('#ep-popup-overlay').hide();
1354 }
1355 });
1356
1357 $('#close-btn').on('click', function () {
1358 $('#ep-popup-overlay').hide();
1359 });
1360
1361 $('#prev-btn').on('click', function () {
1362 currentIndex = (currentIndex - 1 + $photos.length) % $photos.length;
1363 updatePopupImage();
1364 });
1365
1366 $('#next-btn').on('click', function () {
1367 currentIndex = (currentIndex + 1) % $photos.length;
1368 updatePopupImage();
1369 });
1370 }
1371 }
1372
1373 function updatePopupImage() {
1374 const imgSrc = $photos.eq(currentIndex).find('img').attr('data-photo-src');
1375 const $popupImage = $('#popup-image');
1376 const $popupContent = $('#popup-content');
1377
1378 $popupContent.addClass('loading');
1379 $popupImage.hide();
1380
1381 const preload = new Image();
1382 preload.src = imgSrc;
1383
1384 preload.onload = function () {
1385 $popupImage.attr('src', imgSrc);
1386 $popupContent.removeClass('loading');
1387 $popupImage.fadeIn();
1388 };
1389 }
1390
1391 $('.photo-item').on('click', function () {
1392 currentIndex = $photos.index(this);
1393 createPopupGooglePhotos();
1394 updatePopupImage();
1395 $('#ep-popup-overlay').show();
1396 });
1397 });
1398
1399
1400 // pause audio/video
1401
1402 jQuery(document).ready(function () {
1403 const players = jQuery('.enabled-auto-pause audio, .enabled-auto-pause video');
1404
1405 function pauseAllExcept(currentPlayer) {
1406 players.each(function () {
1407 if (this !== currentPlayer[0]) {
1408 this.pause();
1409 }
1410 });
1411 }
1412
1413 players.on('play', function () {
1414 pauseAllExcept(jQuery(this));
1415 });
1416 });
1417
1418