PluginProbe
Elementor Website Builder – more than just a page builder / 3.5.0-dev8
Elementor Website Builder – more than just a page builder v3.5.0-dev8
4.3.0-beta2 4.3.0-beta1 4.2.4 4.2.3 4.2.2 4.2.1 4.2.0 4.1.5 4.2.0-beta2 4.2.0-dev2 4.2.0-beta1 4.1.4 4.1.3 4.1.2 4.1.1 4.1.0 4.1.0-beta3 4.1.0-dev3 4.0.9 4.1.0-beta2 4.1.0-dev2 4.0.8 4.1.0-beta1 4.1.0-dev1 4.0.7 All 451 releases
elementor / assets / js / preloaded-modules.js

preloaded-modules.js in Elementor Website Builder – more than just a page builder 3.5.0-dev8, at assets/js/preloaded-modules.js

2,026 lines 61.5 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /*! elementor - v3.3.1 - 14-08-2021 */
2 (self["webpackChunkelementor"] = self["webpackChunkelementor"] || []).push([["preloaded-modules"],{
3
4 /***/ "../assets/dev/js/frontend/handlers/accordion.js":
5 /*!*******************************************************!*\
6 !*** ../assets/dev/js/frontend/handlers/accordion.js ***!
7 \*******************************************************/
8 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
9
10 "use strict";
11
12
13 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
14
15 Object.defineProperty(exports, "__esModule", ({
16 value: true
17 }));
18 exports.default = void 0;
19
20 var _baseTabs = _interopRequireDefault(__webpack_require__(/*! ./base-tabs */ "../assets/dev/js/frontend/handlers/base-tabs.js"));
21
22 class Accordion extends _baseTabs.default {
23 getDefaultSettings() {
24 const defaultSettings = super.getDefaultSettings();
25 return { ...defaultSettings,
26 showTabFn: 'slideDown',
27 hideTabFn: 'slideUp'
28 };
29 }
30
31 }
32
33 exports.default = Accordion;
34
35 /***/ }),
36
37 /***/ "../assets/dev/js/frontend/handlers/alert.js":
38 /*!***************************************************!*\
39 !*** ../assets/dev/js/frontend/handlers/alert.js ***!
40 \***************************************************/
41 /***/ ((__unused_webpack_module, exports) => {
42
43 "use strict";
44
45
46 Object.defineProperty(exports, "__esModule", ({
47 value: true
48 }));
49 exports.default = void 0;
50
51 class Alert extends elementorModules.frontend.handlers.Base {
52 getDefaultSettings() {
53 return {
54 selectors: {
55 dismissButton: '.elementor-alert-dismiss'
56 }
57 };
58 }
59
60 getDefaultElements() {
61 const selectors = this.getSettings('selectors');
62 return {
63 $dismissButton: this.$element.find(selectors.dismissButton)
64 };
65 }
66
67 bindEvents() {
68 this.elements.$dismissButton.on('click', this.onDismissButtonClick.bind(this));
69 }
70
71 onDismissButtonClick() {
72 this.$element.fadeOut();
73 }
74
75 }
76
77 exports.default = Alert;
78
79 /***/ }),
80
81 /***/ "../assets/dev/js/frontend/handlers/base-tabs.js":
82 /*!*******************************************************!*\
83 !*** ../assets/dev/js/frontend/handlers/base-tabs.js ***!
84 \*******************************************************/
85 /***/ ((__unused_webpack_module, exports) => {
86
87 "use strict";
88
89
90 Object.defineProperty(exports, "__esModule", ({
91 value: true
92 }));
93 exports.default = void 0;
94
95 class baseTabs extends elementorModules.frontend.handlers.Base {
96 getDefaultSettings() {
97 return {
98 selectors: {
99 tablist: '[role="tablist"]',
100 tabTitle: '.elementor-tab-title',
101 tabContent: '.elementor-tab-content'
102 },
103 classes: {
104 active: 'elementor-active'
105 },
106 showTabFn: 'show',
107 hideTabFn: 'hide',
108 toggleSelf: true,
109 hidePrevious: true,
110 autoExpand: true,
111 keyDirection: {
112 ArrowLeft: elementorFrontendConfig.is_rtl ? 1 : -1,
113 ArrowUp: -1,
114 ArrowRight: elementorFrontendConfig.is_rtl ? -1 : 1,
115 ArrowDown: 1
116 }
117 };
118 }
119
120 getDefaultElements() {
121 const selectors = this.getSettings('selectors');
122 return {
123 $tabTitles: this.findElement(selectors.tabTitle),
124 $tabContents: this.findElement(selectors.tabContent)
125 };
126 }
127
128 activateDefaultTab() {
129 const settings = this.getSettings();
130
131 if (!settings.autoExpand || 'editor' === settings.autoExpand && !this.isEdit) {
132 return;
133 }
134
135 const defaultActiveTab = this.getEditSettings('activeItemIndex') || 1,
136 originalToggleMethods = {
137 showTabFn: settings.showTabFn,
138 hideTabFn: settings.hideTabFn
139 }; // Toggle tabs without animation to avoid jumping
140
141 this.setSettings({
142 showTabFn: 'show',
143 hideTabFn: 'hide'
144 });
145 this.changeActiveTab(defaultActiveTab); // Return back original toggle effects
146
147 this.setSettings(originalToggleMethods);
148 }
149
150 handleKeyboardNavigation(event) {
151 const tab = event.currentTarget,
152 $tabList = jQuery(tab.closest(this.getSettings('selectors').tablist)),
153 $tabs = $tabList.find(this.getSettings('selectors').tabTitle),
154 isVertical = 'vertical' === $tabList.attr('aria-orientation');
155
156 switch (event.key) {
157 case 'ArrowLeft':
158 case 'ArrowRight':
159 if (isVertical) {
160 return;
161 }
162
163 break;
164
165 case 'ArrowUp':
166 case 'ArrowDown':
167 if (!isVertical) {
168 return;
169 }
170
171 event.preventDefault();
172 break;
173
174 case 'Home':
175 event.preventDefault();
176 $tabs.first().focus();
177 return;
178
179 case 'End':
180 event.preventDefault();
181 $tabs.last().focus();
182 return;
183
184 default:
185 return;
186 }
187
188 const tabIndex = tab.getAttribute('data-tab') - 1,
189 direction = this.getSettings('keyDirection')[event.key],
190 nextTab = $tabs[tabIndex + direction];
191
192 if (nextTab) {
193 nextTab.focus();
194 } else if (-1 === tabIndex + direction) {
195 $tabs.last().focus();
196 } else {
197 $tabs.first().focus();
198 }
199 }
200
201 deactivateActiveTab(tabIndex) {
202 const settings = this.getSettings(),
203 activeClass = settings.classes.active,
204 activeFilter = tabIndex ? '[data-tab="' + tabIndex + '"]' : '.' + activeClass,
205 $activeTitle = this.elements.$tabTitles.filter(activeFilter),
206 $activeContent = this.elements.$tabContents.filter(activeFilter);
207 $activeTitle.add($activeContent).removeClass(activeClass);
208 $activeTitle.attr({
209 tabindex: '-1',
210 'aria-selected': 'false',
211 'aria-expanded': 'false'
212 });
213 $activeContent[settings.hideTabFn]();
214 $activeContent.attr('hidden', 'hidden');
215 }
216
217 activateTab(tabIndex) {
218 const settings = this.getSettings(),
219 activeClass = settings.classes.active,
220 $requestedTitle = this.elements.$tabTitles.filter('[data-tab="' + tabIndex + '"]'),
221 $requestedContent = this.elements.$tabContents.filter('[data-tab="' + tabIndex + '"]'),
222 animationDuration = 'show' === settings.showTabFn ? 0 : 400;
223 $requestedTitle.add($requestedContent).addClass(activeClass);
224 $requestedTitle.attr({
225 tabindex: '0',
226 'aria-selected': 'true',
227 'aria-expanded': 'true'
228 });
229 $requestedContent[settings.showTabFn](animationDuration, () => elementorFrontend.elements.$window.trigger('resize'));
230 $requestedContent.removeAttr('hidden');
231 }
232
233 isActiveTab(tabIndex) {
234 return this.elements.$tabTitles.filter('[data-tab="' + tabIndex + '"]').hasClass(this.getSettings('classes.active'));
235 }
236
237 bindEvents() {
238 this.elements.$tabTitles.on({
239 keydown: event => {
240 // Support for old markup that includes an `<a>` tag in the tab
241 if (jQuery(event.target).is('a') && `Enter` === event.key) {
242 event.preventDefault();
243 } // We listen to keydowon event for these keys in order to prevent undesired page scrolling
244
245
246 if (['End', 'Home', 'ArrowUp', 'ArrowDown'].includes(event.key)) {
247 this.handleKeyboardNavigation(event);
248 }
249 },
250 keyup: event => {
251 switch (event.key) {
252 case 'ArrowLeft':
253 case 'ArrowRight':
254 this.handleKeyboardNavigation(event);
255 break;
256
257 case 'Enter':
258 case 'Space':
259 event.preventDefault();
260 this.changeActiveTab(event.currentTarget.getAttribute('data-tab'));
261 break;
262 }
263 },
264 click: event => {
265 event.preventDefault();
266 this.changeActiveTab(event.currentTarget.getAttribute('data-tab'));
267 }
268 });
269 }
270
271 onInit(...args) {
272 super.onInit(...args);
273 this.activateDefaultTab();
274 }
275
276 onEditSettingsChange(propertyName) {
277 if ('activeItemIndex' === propertyName) {
278 this.activateDefaultTab();
279 }
280 }
281
282 changeActiveTab(tabIndex) {
283 const isActiveTab = this.isActiveTab(tabIndex),
284 settings = this.getSettings();
285
286 if ((settings.toggleSelf || !isActiveTab) && settings.hidePrevious) {
287 this.deactivateActiveTab();
288 }
289
290 if (!settings.hidePrevious && isActiveTab) {
291 this.deactivateActiveTab(tabIndex);
292 }
293
294 if (!isActiveTab) {
295 this.activateTab(tabIndex);
296 }
297 }
298
299 }
300
301 exports.default = baseTabs;
302
303 /***/ }),
304
305 /***/ "../assets/dev/js/frontend/handlers/counter.js":
306 /*!*****************************************************!*\
307 !*** ../assets/dev/js/frontend/handlers/counter.js ***!
308 \*****************************************************/
309 /***/ ((__unused_webpack_module, exports) => {
310
311 "use strict";
312
313
314 Object.defineProperty(exports, "__esModule", ({
315 value: true
316 }));
317 exports.default = void 0;
318
319 class Counter extends elementorModules.frontend.handlers.Base {
320 getDefaultSettings() {
321 return {
322 selectors: {
323 counterNumber: '.elementor-counter-number'
324 }
325 };
326 }
327
328 getDefaultElements() {
329 const selectors = this.getSettings('selectors');
330 return {
331 $counterNumber: this.$element.find(selectors.counterNumber)
332 };
333 }
334
335 onInit() {
336 super.onInit();
337 elementorFrontend.waypoint(this.elements.$counterNumber, () => {
338 const data = this.elements.$counterNumber.data(),
339 decimalDigits = data.toValue.toString().match(/\.(.*)/);
340
341 if (decimalDigits) {
342 data.rounding = decimalDigits[1].length;
343 }
344
345 this.elements.$counterNumber.numerator(data);
346 });
347 }
348
349 }
350
351 exports.default = Counter;
352
353 /***/ }),
354
355 /***/ "../assets/dev/js/frontend/handlers/image-carousel.js":
356 /*!************************************************************!*\
357 !*** ../assets/dev/js/frontend/handlers/image-carousel.js ***!
358 \************************************************************/
359 /***/ ((__unused_webpack_module, exports) => {
360
361 "use strict";
362
363
364 Object.defineProperty(exports, "__esModule", ({
365 value: true
366 }));
367 exports.default = void 0;
368
369 class ImageCarousel extends elementorModules.frontend.handlers.SwiperBase {
370 getDefaultSettings() {
371 return {
372 selectors: {
373 carousel: '.elementor-image-carousel-wrapper',
374 slideContent: '.swiper-slide'
375 }
376 };
377 }
378
379 getDefaultElements() {
380 const selectors = this.getSettings('selectors');
381 const elements = {
382 $swiperContainer: this.$element.find(selectors.carousel)
383 };
384 elements.$slides = elements.$swiperContainer.find(selectors.slideContent);
385 return elements;
386 }
387
388 getSwiperSettings() {
389 const elementSettings = this.getElementSettings(),
390 slidesToShow = +elementSettings.slides_to_show || 3,
391 isSingleSlide = 1 === slidesToShow,
392 elementorBreakpoints = elementorFrontend.config.responsive.activeBreakpoints,
393 defaultSlidesToShowMap = {
394 mobile: 1,
395 tablet: isSingleSlide ? 1 : 2
396 };
397 const swiperOptions = {
398 slidesPerView: slidesToShow,
399 loop: 'yes' === elementSettings.infinite,
400 speed: elementSettings.speed,
401 handleElementorBreakpoints: true
402 };
403 swiperOptions.breakpoints = {};
404 let lastBreakpointSlidesToShowValue = slidesToShow;
405 Object.keys(elementorBreakpoints).reverse().forEach(breakpointName => {
406 // Tablet has a specific default `slides_to_show`.
407 const defaultSlidesToShow = defaultSlidesToShowMap[breakpointName] ? defaultSlidesToShowMap[breakpointName] : lastBreakpointSlidesToShowValue;
408 swiperOptions.breakpoints[elementorBreakpoints[breakpointName].value] = {
409 slidesPerView: +elementSettings['slides_to_show_' + breakpointName] || defaultSlidesToShow,
410 slidesPerGroup: +elementSettings['slides_to_scroll_' + breakpointName] || 1
411 };
412 lastBreakpointSlidesToShowValue = +elementSettings['slides_to_show_' + breakpointName] || defaultSlidesToShow;
413 });
414
415 if ('yes' === elementSettings.autoplay) {
416 swiperOptions.autoplay = {
417 delay: elementSettings.autoplay_speed,
418 disableOnInteraction: 'yes' === elementSettings.pause_on_interaction
419 };
420 }
421
422 if (isSingleSlide) {
423 swiperOptions.effect = elementSettings.effect;
424
425 if ('fade' === elementSettings.effect) {
426 swiperOptions.fadeEffect = {
427 crossFade: true
428 };
429 }
430 } else {
431 swiperOptions.slidesPerGroup = +elementSettings.slides_to_scroll || 1;
432 }
433
434 if (elementSettings.image_spacing_custom) {
435 swiperOptions.spaceBetween = elementSettings.image_spacing_custom.size;
436 }
437
438 const showArrows = 'arrows' === elementSettings.navigation || 'both' === elementSettings.navigation,
439 showDots = 'dots' === elementSettings.navigation || 'both' === elementSettings.navigation;
440
441 if (showArrows) {
442 swiperOptions.navigation = {
443 prevEl: '.elementor-swiper-button-prev',
444 nextEl: '.elementor-swiper-button-next'
445 };
446 }
447
448 if (showDots) {
449 swiperOptions.pagination = {
450 el: '.swiper-pagination',
451 type: 'bullets',
452 clickable: true
453 };
454 }
455
456 return swiperOptions;
457 }
458
459 async onInit(...args) {
460 super.onInit(...args);
461 const elementSettings = this.getElementSettings();
462
463 if (!this.elements.$swiperContainer.length || 2 > this.elements.$slides.length) {
464 return;
465 }
466
467 const Swiper = elementorFrontend.utils.swiper;
468 this.swiper = await new Swiper(this.elements.$swiperContainer, this.getSwiperSettings()); // Expose the swiper instance in the frontend
469
470 this.elements.$swiperContainer.data('swiper', this.swiper);
471
472 if ('yes' === elementSettings.pause_on_hover) {
473 this.togglePauseOnHover(true);
474 }
475 }
476
477 updateSwiperOption(propertyName) {
478 const elementSettings = this.getElementSettings(),
479 newSettingValue = elementSettings[propertyName],
480 params = this.swiper.params; // Handle special cases where the value to update is not the value that the Swiper library accepts.
481
482 switch (propertyName) {
483 case 'image_spacing_custom':
484 params.spaceBetween = newSettingValue.size || 0;
485 break;
486
487 case 'autoplay_speed':
488 params.autoplay.delay = newSettingValue;
489 break;
490
491 case 'speed':
492 params.speed = newSettingValue;
493 break;
494 }
495
496 this.swiper.update();
497 }
498
499 getChangeableProperties() {
500 return {
501 pause_on_hover: 'pauseOnHover',
502 autoplay_speed: 'delay',
503 speed: 'speed',
504 image_spacing_custom: 'spaceBetween'
505 };
506 }
507
508 onElementChange(propertyName) {
509 const changeableProperties = this.getChangeableProperties();
510
511 if (changeableProperties[propertyName]) {
512 // 'pause_on_hover' is implemented by the handler with event listeners, not the Swiper library.
513 if ('pause_on_hover' === propertyName) {
514 const newSettingValue = this.getElementSettings('pause_on_hover');
515 this.togglePauseOnHover('yes' === newSettingValue);
516 } else {
517 this.updateSwiperOption(propertyName);
518 }
519 }
520 }
521
522 onEditSettingsChange(propertyName) {
523 if ('activeItemIndex' === propertyName) {
524 this.swiper.slideToLoop(this.getEditSettings('activeItemIndex') - 1);
525 }
526 }
527
528 }
529
530 exports.default = ImageCarousel;
531
532 /***/ }),
533
534 /***/ "../assets/dev/js/frontend/handlers/progress.js":
535 /*!******************************************************!*\
536 !*** ../assets/dev/js/frontend/handlers/progress.js ***!
537 \******************************************************/
538 /***/ ((__unused_webpack_module, exports) => {
539
540 "use strict";
541
542
543 Object.defineProperty(exports, "__esModule", ({
544 value: true
545 }));
546 exports.default = void 0;
547
548 class Progress extends elementorModules.frontend.handlers.Base {
549 getDefaultSettings() {
550 return {
551 selectors: {
552 progressNumber: '.elementor-progress-bar'
553 }
554 };
555 }
556
557 getDefaultElements() {
558 const selectors = this.getSettings('selectors');
559 return {
560 $progressNumber: this.$element.find(selectors.progressNumber)
561 };
562 }
563
564 onInit() {
565 super.onInit();
566 elementorFrontend.waypoint(this.elements.$progressNumber, () => {
567 const $progressbar = this.elements.$progressNumber;
568 $progressbar.css('width', $progressbar.data('max') + '%');
569 });
570 }
571
572 }
573
574 exports.default = Progress;
575
576 /***/ }),
577
578 /***/ "../assets/dev/js/frontend/handlers/tabs.js":
579 /*!**************************************************!*\
580 !*** ../assets/dev/js/frontend/handlers/tabs.js ***!
581 \**************************************************/
582 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
583
584 "use strict";
585
586
587 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
588
589 Object.defineProperty(exports, "__esModule", ({
590 value: true
591 }));
592 exports.default = void 0;
593
594 var _baseTabs = _interopRequireDefault(__webpack_require__(/*! ./base-tabs */ "../assets/dev/js/frontend/handlers/base-tabs.js"));
595
596 class Tabs extends _baseTabs.default {
597 getDefaultSettings() {
598 const defaultSettings = super.getDefaultSettings();
599 return { ...defaultSettings,
600 toggleSelf: false
601 };
602 }
603
604 }
605
606 exports.default = Tabs;
607
608 /***/ }),
609
610 /***/ "../assets/dev/js/frontend/handlers/text-editor.js":
611 /*!*********************************************************!*\
612 !*** ../assets/dev/js/frontend/handlers/text-editor.js ***!
613 \*********************************************************/
614 /***/ ((__unused_webpack_module, exports) => {
615
616 "use strict";
617
618
619 Object.defineProperty(exports, "__esModule", ({
620 value: true
621 }));
622 exports.default = void 0;
623
624 class TextEditor extends elementorModules.frontend.handlers.Base {
625 getDefaultSettings() {
626 return {
627 selectors: {
628 paragraph: 'p:first'
629 },
630 classes: {
631 dropCap: 'elementor-drop-cap',
632 dropCapLetter: 'elementor-drop-cap-letter'
633 }
634 };
635 }
636
637 getDefaultElements() {
638 const selectors = this.getSettings('selectors'),
639 classes = this.getSettings('classes'),
640 $dropCap = jQuery('<span>', {
641 class: classes.dropCap
642 }),
643 $dropCapLetter = jQuery('<span>', {
644 class: classes.dropCapLetter
645 });
646 $dropCap.append($dropCapLetter);
647 return {
648 $paragraph: this.$element.find(selectors.paragraph),
649 $dropCap: $dropCap,
650 $dropCapLetter: $dropCapLetter
651 };
652 }
653
654 wrapDropCap() {
655 const isDropCapEnabled = this.getElementSettings('drop_cap');
656
657 if (!isDropCapEnabled) {
658 // If there is an old drop cap inside the paragraph
659 if (this.dropCapLetter) {
660 this.elements.$dropCap.remove();
661 this.elements.$paragraph.prepend(this.dropCapLetter);
662 this.dropCapLetter = '';
663 }
664
665 return;
666 }
667
668 const $paragraph = this.elements.$paragraph;
669
670 if (!$paragraph.length) {
671 return;
672 }
673
674 const paragraphContent = $paragraph.html().replace(/&nbsp;/g, ' '),
675 firstLetterMatch = paragraphContent.match(/^ *([^ ] ?)/);
676
677 if (!firstLetterMatch) {
678 return;
679 }
680
681 const firstLetter = firstLetterMatch[1],
682 trimmedFirstLetter = firstLetter.trim(); // Don't apply drop cap when the content starting with an HTML tag
683
684 if ('<' === trimmedFirstLetter) {
685 return;
686 }
687
688 this.dropCapLetter = firstLetter;
689 this.elements.$dropCapLetter.text(trimmedFirstLetter);
690 const restoredParagraphContent = paragraphContent.slice(firstLetter.length).replace(/^ */, match => {
691 return new Array(match.length + 1).join('&nbsp;');
692 });
693 $paragraph.html(restoredParagraphContent).prepend(this.elements.$dropCap);
694 }
695
696 onInit(...args) {
697 super.onInit(...args);
698 this.wrapDropCap();
699 }
700
701 onElementChange(propertyName) {
702 if ('drop_cap' === propertyName) {
703 this.wrapDropCap();
704 }
705 }
706
707 }
708
709 exports.default = TextEditor;
710
711 /***/ }),
712
713 /***/ "../assets/dev/js/frontend/handlers/toggle.js":
714 /*!****************************************************!*\
715 !*** ../assets/dev/js/frontend/handlers/toggle.js ***!
716 \****************************************************/
717 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
718
719 "use strict";
720
721
722 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
723
724 Object.defineProperty(exports, "__esModule", ({
725 value: true
726 }));
727 exports.default = void 0;
728
729 var _baseTabs = _interopRequireDefault(__webpack_require__(/*! ./base-tabs */ "../assets/dev/js/frontend/handlers/base-tabs.js"));
730
731 class Toggle extends _baseTabs.default {
732 getDefaultSettings() {
733 const defaultSettings = super.getDefaultSettings();
734 return { ...defaultSettings,
735 showTabFn: 'slideDown',
736 hideTabFn: 'slideUp',
737 hidePrevious: false,
738 autoExpand: 'editor'
739 };
740 }
741
742 }
743
744 exports.default = Toggle;
745
746 /***/ }),
747
748 /***/ "../assets/dev/js/frontend/handlers/video.js":
749 /*!***************************************************!*\
750 !*** ../assets/dev/js/frontend/handlers/video.js ***!
751 \***************************************************/
752 /***/ ((__unused_webpack_module, exports) => {
753
754 "use strict";
755
756
757 Object.defineProperty(exports, "__esModule", ({
758 value: true
759 }));
760 exports.default = void 0;
761
762 class Video extends elementorModules.frontend.handlers.Base {
763 getDefaultSettings() {
764 return {
765 selectors: {
766 imageOverlay: '.elementor-custom-embed-image-overlay',
767 video: '.elementor-video',
768 videoIframe: '.elementor-video-iframe'
769 }
770 };
771 }
772
773 getDefaultElements() {
774 const selectors = this.getSettings('selectors');
775 return {
776 $imageOverlay: this.$element.find(selectors.imageOverlay),
777 $video: this.$element.find(selectors.video),
778 $videoIframe: this.$element.find(selectors.videoIframe)
779 };
780 }
781
782 handleVideo() {
783 if (this.getElementSettings('lightbox')) {
784 return;
785 }
786
787 if ('youtube' === this.getElementSettings('video_type')) {
788 this.apiProvider.onApiReady(apiObject => {
789 this.elements.$imageOverlay.remove();
790 this.prepareYTVideo(apiObject, true);
791 });
792 } else {
793 this.elements.$imageOverlay.remove();
794 this.playVideo();
795 }
796 }
797
798 playVideo() {
799 if (this.elements.$video.length) {
800 // this.youtubePlayer exists only for YouTube videos, and its play function is different.
801 if (this.youtubePlayer) {
802 this.youtubePlayer.playVideo();
803 } else {
804 this.elements.$video[0].play();
805 }
806
807 return;
808 }
809
810 const $videoIframe = this.elements.$videoIframe,
811 lazyLoad = $videoIframe.data('lazy-load');
812
813 if (lazyLoad) {
814 $videoIframe.attr('src', lazyLoad);
815 }
816
817 const newSourceUrl = $videoIframe[0].src.replace('&autoplay=0', '');
818 $videoIframe[0].src = newSourceUrl + '&autoplay=1';
819
820 if ($videoIframe[0].src.includes('vimeo.com')) {
821 const videoSrc = $videoIframe[0].src,
822 timeMatch = /#t=[^&]*/.exec(videoSrc); // Param '#t=' must be last in the URL
823
824 $videoIframe[0].src = videoSrc.slice(0, timeMatch.index) + videoSrc.slice(timeMatch.index + timeMatch[0].length) + timeMatch[0];
825 }
826 }
827
828 async animateVideo() {
829 const lightbox = await elementorFrontend.utils.lightbox;
830 lightbox.setEntranceAnimation(this.getCurrentDeviceSetting('lightbox_content_animation'));
831 }
832
833 async handleAspectRatio() {
834 const lightbox = await elementorFrontend.utils.lightbox;
835 lightbox.setVideoAspectRatio(this.getElementSettings('aspect_ratio'));
836 }
837
838 async hideLightbox() {
839 const lightbox = await elementorFrontend.utils.lightbox;
840 lightbox.getModal().hide();
841 }
842
843 prepareYTVideo(YT, onOverlayClick) {
844 const elementSettings = this.getElementSettings(),
845 playerOptions = {
846 videoId: this.videoID,
847 events: {
848 onReady: () => {
849 if (elementSettings.mute) {
850 this.youtubePlayer.mute();
851 }
852
853 if (elementSettings.autoplay || onOverlayClick) {
854 this.youtubePlayer.playVideo();
855 }
856 },
857 onStateChange: event => {
858 if (event.data === YT.PlayerState.ENDED && elementSettings.loop) {
859 this.youtubePlayer.seekTo(elementSettings.start || 0);
860 }
861 }
862 },
863 playerVars: {
864 controls: elementSettings.controls ? 1 : 0,
865 rel: elementSettings.rel ? 1 : 0,
866 playsinline: elementSettings.play_on_mobile ? 1 : 0,
867 modestbranding: elementSettings.modestbranding ? 1 : 0,
868 autoplay: elementSettings.autoplay ? 1 : 0,
869 start: elementSettings.start,
870 end: elementSettings.end
871 }
872 }; // To handle CORS issues, when the default host is changed, the origin parameter has to be set.
873
874 if (elementSettings.yt_privacy) {
875 playerOptions.host = 'https://www.youtube-nocookie.com';
876 playerOptions.origin = window.location.hostname;
877 }
878
879 this.youtubePlayer = new YT.Player(this.elements.$video[0], playerOptions);
880 }
881
882 bindEvents() {
883 this.elements.$imageOverlay.on('click', this.handleVideo.bind(this));
884 }
885
886 onInit() {
887 super.onInit();
888 const elementSettings = this.getElementSettings();
889
890 if ('youtube' !== elementSettings.video_type) {
891 // Currently the only API integration in the Video widget is for the YT API
892 return;
893 }
894
895 this.apiProvider = elementorFrontend.utils.youtube;
896 this.videoID = this.apiProvider.getVideoIDFromURL(elementSettings.youtube_url); // If there is an image overlay, the YouTube video prep method will be triggered on click
897
898 if (!this.videoID) {
899 return;
900 } // If the user is using an image overlay, loading the API happens on overlay click instead of on init.
901
902
903 if (elementSettings.show_image_overlay && elementSettings.image_overlay.url) {
904 return;
905 }
906
907 if (elementSettings.lazy_load) {
908 this.intersectionObserver = elementorModules.utils.Scroll.scrollObserver({
909 callback: event => {
910 if (event.isInViewport) {
911 this.intersectionObserver.unobserve(this.elements.$video.parent()[0]);
912 this.apiProvider.onApiReady(apiObject => this.prepareYTVideo(apiObject));
913 }
914 }
915 }); // We observe the parent, since the video container has a height of 0.
916
917 this.intersectionObserver.observe(this.elements.$video.parent()[0]);
918 return;
919 } // When Optimized asset loading is set to off, the video type is set to 'Youtube', and 'Privacy Mode' is set
920 // to 'On', there might be a conflict with other videos that are loaded WITHOUT privacy mode, such as a
921 // video bBackground in a section. In these cases, to avoid the conflict, a timeout is added to postpone the
922 // initialization of the Youtube API object.
923
924
925 if (!elementorFrontend.config.experimentalFeatures['e_optimized_assets_loading']) {
926 setTimeout(() => {
927 this.apiProvider.onApiReady(apiObject => this.prepareYTVideo(apiObject));
928 }, 0);
929 } else {
930 this.apiProvider.onApiReady(apiObject => this.prepareYTVideo(apiObject));
931 }
932 }
933
934 onElementChange(propertyName) {
935 if (0 === propertyName.indexOf('lightbox_content_animation')) {
936 this.animateVideo();
937 return;
938 }
939
940 const isLightBoxEnabled = this.getElementSettings('lightbox');
941
942 if ('lightbox' === propertyName && !isLightBoxEnabled) {
943 this.hideLightbox();
944 return;
945 }
946
947 if ('aspect_ratio' === propertyName && isLightBoxEnabled) {
948 this.handleAspectRatio();
949 }
950 }
951
952 }
953
954 exports.default = Video;
955
956 /***/ }),
957
958 /***/ "../assets/dev/js/frontend/preloaded-modules.js":
959 /*!******************************************************!*\
960 !*** ../assets/dev/js/frontend/preloaded-modules.js ***!
961 \******************************************************/
962 /***/ ((__unused_webpack_module, __unused_webpack_exports, __webpack_require__) => {
963
964 "use strict";
965
966
967 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
968
969 var _accordion = _interopRequireDefault(__webpack_require__(/*! ./handlers/accordion */ "../assets/dev/js/frontend/handlers/accordion.js"));
970
971 var _alert = _interopRequireDefault(__webpack_require__(/*! ./handlers/alert */ "../assets/dev/js/frontend/handlers/alert.js"));
972
973 var _counter = _interopRequireDefault(__webpack_require__(/*! ./handlers/counter */ "../assets/dev/js/frontend/handlers/counter.js"));
974
975 var _progress = _interopRequireDefault(__webpack_require__(/*! ./handlers/progress */ "../assets/dev/js/frontend/handlers/progress.js"));
976
977 var _tabs = _interopRequireDefault(__webpack_require__(/*! ./handlers/tabs */ "../assets/dev/js/frontend/handlers/tabs.js"));
978
979 var _toggle = _interopRequireDefault(__webpack_require__(/*! ./handlers/toggle */ "../assets/dev/js/frontend/handlers/toggle.js"));
980
981 var _video = _interopRequireDefault(__webpack_require__(/*! ./handlers/video */ "../assets/dev/js/frontend/handlers/video.js"));
982
983 var _imageCarousel = _interopRequireDefault(__webpack_require__(/*! ./handlers/image-carousel */ "../assets/dev/js/frontend/handlers/image-carousel.js"));
984
985 var _textEditor = _interopRequireDefault(__webpack_require__(/*! ./handlers/text-editor */ "../assets/dev/js/frontend/handlers/text-editor.js"));
986
987 var _lightbox = _interopRequireDefault(__webpack_require__(/*! elementor-frontend/utils/lightbox/lightbox */ "../assets/dev/js/frontend/utils/lightbox/lightbox.js"));
988
989 elementorFrontend.elements.$window.on('elementor/frontend/init', () => {
990 elementorFrontend.elementsHandler.elementsHandlers = {
991 'accordion.default': _accordion.default,
992 'alert.default': _alert.default,
993 'counter.default': _counter.default,
994 'progress.default': _progress.default,
995 'tabs.default': _tabs.default,
996 'toggle.default': _toggle.default,
997 'video.default': _video.default,
998 'image-carousel.default': _imageCarousel.default,
999 'text-editor.default': _textEditor.default
1000 };
1001 elementorFrontend.on('components:init', () => {
1002 // We first need to delete the property because by default it's a getter function that cannot be overwritten.
1003 delete elementorFrontend.utils.lightbox;
1004 elementorFrontend.utils.lightbox = new _lightbox.default();
1005 });
1006 });
1007
1008 /***/ }),
1009
1010 /***/ "../assets/dev/js/frontend/utils/lightbox/lightbox.js":
1011 /*!************************************************************!*\
1012 !*** ../assets/dev/js/frontend/utils/lightbox/lightbox.js ***!
1013 \************************************************************/
1014 /***/ ((module, __unused_webpack_exports, __webpack_require__) => {
1015
1016 "use strict";
1017
1018
1019 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
1020
1021 var _screenfull = _interopRequireDefault(__webpack_require__(/*! ./screenfull */ "../assets/dev/js/frontend/utils/lightbox/screenfull.js"));
1022
1023 module.exports = elementorModules.ViewModule.extend({
1024 oldAspectRatio: null,
1025 oldAnimation: null,
1026 swiper: null,
1027 player: null,
1028 getDefaultSettings: function () {
1029 return {
1030 classes: {
1031 aspectRatio: 'elementor-aspect-ratio-%s',
1032 item: 'elementor-lightbox-item',
1033 image: 'elementor-lightbox-image',
1034 videoContainer: 'elementor-video-container',
1035 videoWrapper: 'elementor-fit-aspect-ratio',
1036 playButton: 'elementor-custom-embed-play',
1037 playButtonIcon: 'fa',
1038 playing: 'elementor-playing',
1039 hidden: 'elementor-hidden',
1040 invisible: 'elementor-invisible',
1041 preventClose: 'elementor-lightbox-prevent-close',
1042 slideshow: {
1043 container: 'swiper-container',
1044 slidesWrapper: 'swiper-wrapper',
1045 prevButton: 'elementor-swiper-button elementor-swiper-button-prev',
1046 nextButton: 'elementor-swiper-button elementor-swiper-button-next',
1047 prevButtonIcon: 'eicon-chevron-left',
1048 nextButtonIcon: 'eicon-chevron-right',
1049 slide: 'swiper-slide',
1050 header: 'elementor-slideshow__header',
1051 footer: 'elementor-slideshow__footer',
1052 title: 'elementor-slideshow__title',
1053 description: 'elementor-slideshow__description',
1054 counter: 'elementor-slideshow__counter',
1055 iconExpand: 'eicon-frame-expand',
1056 iconShrink: 'eicon-frame-minimize',
1057 iconZoomIn: 'eicon-zoom-in-bold',
1058 iconZoomOut: 'eicon-zoom-out-bold',
1059 iconShare: 'eicon-share-arrow',
1060 shareMenu: 'elementor-slideshow__share-menu',
1061 shareLinks: 'elementor-slideshow__share-links',
1062 hideUiVisibility: 'elementor-slideshow--ui-hidden',
1063 shareMode: 'elementor-slideshow--share-mode',
1064 fullscreenMode: 'elementor-slideshow--fullscreen-mode',
1065 zoomMode: 'elementor-slideshow--zoom-mode'
1066 }
1067 },
1068 selectors: {
1069 image: '.elementor-lightbox-image',
1070 links: 'a, [data-elementor-lightbox]',
1071 slideshow: {
1072 activeSlide: '.swiper-slide-active',
1073 prevSlide: '.swiper-slide-prev',
1074 nextSlide: '.swiper-slide-next'
1075 }
1076 },
1077 modalOptions: {
1078 id: 'elementor-lightbox',
1079 entranceAnimation: 'zoomIn',
1080 videoAspectRatio: 169,
1081 position: {
1082 enable: false
1083 }
1084 }
1085 };
1086 },
1087 getModal: function () {
1088 if (!module.exports.modal) {
1089 this.initModal();
1090 }
1091
1092 return module.exports.modal;
1093 },
1094 initModal: function () {
1095 const modal = module.exports.modal = elementorFrontend.getDialogsManager().createWidget('lightbox', {
1096 className: 'elementor-lightbox',
1097 closeButton: true,
1098 closeButtonOptions: {
1099 iconClass: 'eicon-close',
1100 attributes: {
1101 tabindex: 0,
1102 role: 'button',
1103 'aria-label': elementorFrontend.config.i18n.close + ' (Esc)'
1104 }
1105 },
1106 selectors: {
1107 preventClose: '.' + this.getSettings('classes.preventClose')
1108 },
1109 hide: {
1110 onClick: true
1111 }
1112 });
1113 modal.on('hide', function () {
1114 modal.setMessage('');
1115 });
1116 },
1117 showModal: function (options) {
1118 if (options.url && !options.url.startsWith('http')) {
1119 return;
1120 }
1121
1122 this.elements.$closeButton = this.getModal().getElements('closeButton');
1123 this.$buttons = this.elements.$closeButton;
1124 this.focusedButton = null;
1125 const self = this,
1126 defaultOptions = self.getDefaultSettings().modalOptions;
1127 self.id = options.id;
1128 self.setSettings('modalOptions', jQuery.extend(defaultOptions, options.modalOptions));
1129 const modal = self.getModal();
1130 modal.setID(self.getSettings('modalOptions.id'));
1131
1132 modal.onShow = function () {
1133 DialogsManager.getWidgetType('lightbox').prototype.onShow.apply(modal, arguments);
1134 self.setEntranceAnimation();
1135 };
1136
1137 modal.onHide = function () {
1138 DialogsManager.getWidgetType('lightbox').prototype.onHide.apply(modal, arguments);
1139 modal.getElements('message').removeClass('animated');
1140
1141 if (_screenfull.default.isFullscreen) {
1142 self.deactivateFullscreen();
1143 }
1144
1145 self.unbindHotKeys();
1146 };
1147
1148 switch (options.type) {
1149 case 'video':
1150 self.setVideoContent(options);
1151 break;
1152
1153 case 'image':
1154 const slides = [{
1155 image: options.url,
1156 index: 0,
1157 title: options.title,
1158 description: options.description
1159 }];
1160 options.slideshow = {
1161 slides,
1162 swiper: {
1163 loop: false,
1164 pagination: false
1165 }
1166 };
1167
1168 case 'slideshow':
1169 self.setSlideshowContent(options.slideshow);
1170 break;
1171
1172 default:
1173 self.setHTMLContent(options.html);
1174 }
1175
1176 modal.show();
1177 },
1178 createLightbox: function (element) {
1179 let lightboxData = {};
1180
1181 if (element.dataset.elementorLightbox) {
1182 lightboxData = JSON.parse(element.dataset.elementorLightbox);
1183 }
1184
1185 if (lightboxData.type && 'slideshow' !== lightboxData.type) {
1186 this.showModal(lightboxData);
1187 return;
1188 }
1189
1190 if (!element.dataset.elementorLightboxSlideshow) {
1191 const slideshowID = 'single-img';
1192 this.showModal({
1193 type: 'image',
1194 id: slideshowID,
1195 url: element.href,
1196 title: element.dataset.elementorLightboxTitle,
1197 description: element.dataset.elementorLightboxDescription,
1198 modalOptions: {
1199 id: 'elementor-lightbox-slideshow-' + slideshowID
1200 }
1201 });
1202 return;
1203 }
1204
1205 const initialSlideURL = element.dataset.elementorLightboxVideo || element.href;
1206 this.openSlideshow(element.dataset.elementorLightboxSlideshow, initialSlideURL);
1207 },
1208 setHTMLContent: function (html) {
1209 if (window.elementorCommon) {
1210 elementorCommon.helpers.hardDeprecated('elementorFrontend.utils.lightbox.setHTMLContent', '3.1.4');
1211 }
1212
1213 this.getModal().setMessage(html);
1214 },
1215 setVideoContent: function (options) {
1216 const $ = jQuery,
1217 classes = this.getSettings('classes'),
1218 $videoContainer = $('<div>', {
1219 class: `${classes.videoContainer} ${classes.preventClose}`
1220 }),
1221 $videoWrapper = $('<div>', {
1222 class: classes.videoWrapper
1223 }),
1224 modal = this.getModal();
1225 let $videoElement;
1226
1227 if ('hosted' === options.videoType) {
1228 const videoParams = $.extend({
1229 src: options.url,
1230 autoplay: ''
1231 }, options.videoParams);
1232 $videoElement = $('<video>', videoParams);
1233 } else {
1234 const videoURL = options.url.replace('&autoplay=0', '') + '&autoplay=1';
1235 $videoElement = $('<iframe>', {
1236 src: videoURL,
1237 allowfullscreen: 1
1238 });
1239 }
1240
1241 $videoContainer.append($videoWrapper);
1242 $videoWrapper.append($videoElement);
1243 modal.setMessage($videoContainer);
1244 this.setVideoAspectRatio();
1245 const onHideMethod = modal.onHide;
1246
1247 modal.onHide = function () {
1248 onHideMethod();
1249 this.$buttons = jQuery();
1250 this.focusedButton = null;
1251 modal.getElements('message').removeClass('elementor-fit-aspect-ratio');
1252 };
1253 },
1254 getShareLinks: function () {
1255 const {
1256 i18n
1257 } = elementorFrontend.config,
1258 socialNetworks = {
1259 facebook: i18n.shareOnFacebook,
1260 twitter: i18n.shareOnTwitter,
1261 pinterest: i18n.pinIt
1262 },
1263 $ = jQuery,
1264 classes = this.getSettings('classes'),
1265 selectors = this.getSettings('selectors'),
1266 $linkList = $('<div>', {
1267 class: classes.slideshow.shareLinks
1268 }),
1269 $activeSlide = this.getSlide('active'),
1270 $image = $activeSlide.find(selectors.image),
1271 videoUrl = $activeSlide.data('elementor-slideshow-video');
1272 let itemUrl;
1273
1274 if (videoUrl) {
1275 itemUrl = videoUrl;
1276 } else {
1277 itemUrl = $image.attr('src');
1278 }
1279
1280 $.each(socialNetworks, (key, networkLabel) => {
1281 const $link = $('<a>', {
1282 href: this.createShareLink(key, itemUrl),
1283 target: '_blank'
1284 }).text(networkLabel);
1285 $link.prepend($('<i>', {
1286 class: 'eicon-' + key
1287 }));
1288 $linkList.append($link);
1289 });
1290
1291 if (!videoUrl) {
1292 $linkList.append($('<a>', {
1293 href: itemUrl,
1294 download: ''
1295 }).text(i18n.downloadImage).prepend($('<i>', {
1296 class: 'eicon-download-bold',
1297 'aria-label': i18n.download
1298 })));
1299 }
1300
1301 return $linkList;
1302 },
1303 createShareLink: function (networkName, itemUrl) {
1304 const options = {};
1305
1306 if ('pinterest' === networkName) {
1307 options.image = encodeURIComponent(itemUrl);
1308 } else {
1309 const hash = elementorFrontend.utils.urlActions.createActionHash('lightbox', {
1310 id: this.id,
1311 url: itemUrl
1312 });
1313 options.url = encodeURIComponent(location.href.replace(/#.*/, '')) + hash;
1314 }
1315
1316 return ShareLink.getNetworkLink(networkName, options);
1317 },
1318 getSlideshowHeader: function () {
1319 const {
1320 i18n
1321 } = elementorFrontend.config,
1322 $ = jQuery,
1323 showCounter = 'yes' === elementorFrontend.getKitSettings('lightbox_enable_counter'),
1324 showFullscreen = 'yes' === elementorFrontend.getKitSettings('lightbox_enable_fullscreen'),
1325 showZoom = 'yes' === elementorFrontend.getKitSettings('lightbox_enable_zoom'),
1326 showShare = 'yes' === elementorFrontend.getKitSettings('lightbox_enable_share'),
1327 classes = this.getSettings('classes'),
1328 slideshowClasses = classes.slideshow,
1329 elements = this.elements;
1330
1331 if (!(showCounter || showFullscreen || showZoom || showShare)) {
1332 return;
1333 }
1334
1335 elements.$header = $('<header>', {
1336 class: slideshowClasses.header + ' ' + classes.preventClose
1337 });
1338
1339 if (showShare) {
1340 elements.$iconShare = $('<i>', {
1341 class: slideshowClasses.iconShare,
1342 role: 'button',
1343 'aria-label': i18n.share,
1344 'aria-expanded': false
1345 }).append($('<span>'));
1346 const $shareLinks = $('<div>');
1347 $shareLinks.on('click', e => {
1348 e.stopPropagation();
1349 });
1350 elements.$shareMenu = $('<div>', {
1351 class: slideshowClasses.shareMenu
1352 }).append($shareLinks);
1353 elements.$iconShare.add(elements.$shareMenu).on('click', this.toggleShareMenu);
1354 elements.$header.append(elements.$iconShare, elements.$shareMenu);
1355 this.$buttons = this.$buttons.add(elements.$iconShare);
1356 }
1357
1358 if (showZoom) {
1359 elements.$iconZoom = $('<i>', {
1360 class: slideshowClasses.iconZoomIn,
1361 role: 'switch',
1362 'aria-checked': false,
1363 'aria-label': i18n.zoom
1364 });
1365 elements.$iconZoom.on('click', this.toggleZoomMode);
1366 elements.$header.append(elements.$iconZoom);
1367 this.$buttons = this.$buttons.add(elements.$iconZoom);
1368 }
1369
1370 if (showFullscreen) {
1371 elements.$iconExpand = $('<i>', {
1372 class: slideshowClasses.iconExpand,
1373 role: 'switch',
1374 'aria-checked': false,
1375 'aria-label': i18n.fullscreen
1376 }).append($('<span>'), $('<span>'));
1377 elements.$iconExpand.on('click', this.toggleFullscreen);
1378 elements.$header.append(elements.$iconExpand);
1379 this.$buttons = this.$buttons.add(elements.$iconExpand);
1380 }
1381
1382 if (showCounter) {
1383 elements.$counter = $('<span>', {
1384 class: slideshowClasses.counter
1385 });
1386 elements.$header.append(elements.$counter);
1387 }
1388
1389 return elements.$header;
1390 },
1391 toggleFullscreen: function () {
1392 if (_screenfull.default.isFullscreen) {
1393 this.deactivateFullscreen();
1394 } else if (_screenfull.default.isEnabled) {
1395 this.activateFullscreen();
1396 }
1397 },
1398 toggleZoomMode: function () {
1399 if (1 !== this.swiper.zoom.scale) {
1400 this.deactivateZoom();
1401 } else {
1402 this.activateZoom();
1403 }
1404 },
1405 toggleShareMenu: function () {
1406 if (this.shareMode) {
1407 this.deactivateShareMode();
1408 } else {
1409 this.elements.$shareMenu.html(this.getShareLinks());
1410 this.activateShareMode();
1411 }
1412 },
1413 activateShareMode: function () {
1414 const classes = this.getSettings('classes');
1415 this.elements.$container.addClass(classes.slideshow.shareMode);
1416 this.elements.$iconShare.attr('aria-expanded', true); // Prevent swiper interactions while in share mode
1417
1418 this.swiper.detachEvents(); // Temporarily replace tabbable buttons with share-menu items
1419
1420 this.$originalButtons = this.$buttons;
1421 this.$buttons = this.elements.$iconShare.add(this.elements.$shareMenu.find('a'));
1422 this.shareMode = true;
1423 },
1424 deactivateShareMode: function () {
1425 const classes = this.getSettings('classes');
1426 this.elements.$container.removeClass(classes.slideshow.shareMode);
1427 this.elements.$iconShare.attr('aria-expanded', false);
1428 this.swiper.attachEvents();
1429 this.$buttons = this.$originalButtons;
1430 this.shareMode = false;
1431 },
1432 activateFullscreen: function () {
1433 const classes = this.getSettings('classes');
1434
1435 _screenfull.default.request(this.elements.$container.parents('.dialog-widget')[0]);
1436
1437 this.elements.$iconExpand.removeClass(classes.slideshow.iconExpand).addClass(classes.slideshow.iconShrink).attr('aria-checked', 'true');
1438 this.elements.$container.addClass(classes.slideshow.fullscreenMode);
1439 },
1440 deactivateFullscreen: function () {
1441 const classes = this.getSettings('classes');
1442
1443 _screenfull.default.exit();
1444
1445 this.elements.$iconExpand.removeClass(classes.slideshow.iconShrink).addClass(classes.slideshow.iconExpand).attr('aria-checked', 'false');
1446 this.elements.$container.removeClass(classes.slideshow.fullscreenMode);
1447 },
1448 activateZoom: function () {
1449 const swiper = this.swiper,
1450 elements = this.elements,
1451 classes = this.getSettings('classes');
1452 swiper.zoom.in();
1453 swiper.allowSlideNext = false;
1454 swiper.allowSlidePrev = false;
1455 swiper.allowTouchMove = false;
1456 elements.$container.addClass(classes.slideshow.zoomMode);
1457 elements.$iconZoom.removeClass(classes.slideshow.iconZoomIn).addClass(classes.slideshow.iconZoomOut);
1458 },
1459 deactivateZoom: function () {
1460 const swiper = this.swiper,
1461 elements = this.elements,
1462 classes = this.getSettings('classes');
1463 swiper.zoom.out();
1464 swiper.allowSlideNext = true;
1465 swiper.allowSlidePrev = true;
1466 swiper.allowTouchMove = true;
1467 elements.$container.removeClass(classes.slideshow.zoomMode);
1468 elements.$iconZoom.removeClass(classes.slideshow.iconZoomOut).addClass(classes.slideshow.iconZoomIn);
1469 },
1470 getSlideshowFooter: function () {
1471 const $ = jQuery,
1472 classes = this.getSettings('classes'),
1473 $footer = $('<footer>', {
1474 class: classes.slideshow.footer + ' ' + classes.preventClose
1475 }),
1476 $title = $('<div>', {
1477 class: classes.slideshow.title
1478 }),
1479 $description = $('<div>', {
1480 class: classes.slideshow.description
1481 });
1482 $footer.append($title, $description);
1483 return $footer;
1484 },
1485 setSlideshowContent: function (options) {
1486 const {
1487 i18n
1488 } = elementorFrontend.config,
1489 $ = jQuery,
1490 isSingleSlide = 1 === options.slides.length,
1491 hasTitle = '' !== elementorFrontend.getKitSettings('lightbox_title_src'),
1492 hasDescription = '' !== elementorFrontend.getKitSettings('lightbox_description_src'),
1493 showFooter = hasTitle || hasDescription,
1494 classes = this.getSettings('classes'),
1495 slideshowClasses = classes.slideshow,
1496 $container = $('<div>', {
1497 class: slideshowClasses.container
1498 }),
1499 $slidesWrapper = $('<div>', {
1500 class: slideshowClasses.slidesWrapper
1501 });
1502 let $prevButton, $nextButton;
1503 options.slides.forEach(slide => {
1504 let slideClass = slideshowClasses.slide + ' ' + classes.item;
1505
1506 if (slide.video) {
1507 slideClass += ' ' + classes.video;
1508 }
1509
1510 const $slide = $('<div>', {
1511 class: slideClass
1512 });
1513
1514 if (slide.video) {
1515 $slide.attr('data-elementor-slideshow-video', slide.video);
1516 const $playIcon = $('<div>', {
1517 class: classes.playButton
1518 }).html($('<i>', {
1519 class: classes.playButtonIcon,
1520 'aria-label': i18n.playVideo
1521 }));
1522 $slide.append($playIcon);
1523 } else {
1524 const $zoomContainer = $('<div>', {
1525 class: 'swiper-zoom-container'
1526 }),
1527 $slidePlaceholder = $('<div class="swiper-lazy-preloader"></div>'),
1528 imageAttributes = {
1529 'data-src': slide.image,
1530 class: classes.image + ' ' + classes.preventClose + ' swiper-lazy'
1531 };
1532
1533 if (slide.title) {
1534 imageAttributes['data-title'] = slide.title;
1535 imageAttributes.alt = slide.title;
1536 }
1537
1538 if (slide.description) {
1539 imageAttributes['data-description'] = slide.description;
1540 imageAttributes.alt += ' - ' + slide.description;
1541 }
1542
1543 const $slideImage = $('<img>', imageAttributes);
1544 $zoomContainer.append([$slideImage, $slidePlaceholder]);
1545 $slide.append($zoomContainer);
1546 }
1547
1548 $slidesWrapper.append($slide);
1549 });
1550 this.elements.$container = $container;
1551 this.elements.$header = this.getSlideshowHeader();
1552 $container.prepend(this.elements.$header).append($slidesWrapper);
1553
1554 if (!isSingleSlide) {
1555 $prevButton = $('<div>', {
1556 class: slideshowClasses.prevButton + ' ' + classes.preventClose,
1557 'aria-label': i18n.previous
1558 }).html($('<i>', {
1559 class: slideshowClasses.prevButtonIcon
1560 }));
1561 $nextButton = $('<div>', {
1562 class: slideshowClasses.nextButton + ' ' + classes.preventClose,
1563 'aria-label': i18n.next
1564 }).html($('<i>', {
1565 class: slideshowClasses.nextButtonIcon
1566 }));
1567 $container.append($nextButton, $prevButton);
1568 this.$buttons = this.$buttons.add($nextButton).add($prevButton);
1569 }
1570
1571 if (showFooter) {
1572 this.elements.$footer = this.getSlideshowFooter();
1573 $container.append(this.elements.$footer);
1574 }
1575
1576 this.setSettings('hideUiTimeout', '');
1577 $container.on('click mousemove keypress', this.showLightboxUi);
1578 const modal = this.getModal();
1579 modal.setMessage($container);
1580 const onShowMethod = modal.onShow;
1581
1582 modal.onShow = async () => {
1583 onShowMethod();
1584 const swiperOptions = {
1585 pagination: {
1586 el: '.' + slideshowClasses.counter,
1587 type: 'fraction'
1588 },
1589 on: {
1590 slideChangeTransitionEnd: this.onSlideChange
1591 },
1592 lazy: {
1593 loadPrevNext: true
1594 },
1595 zoom: true,
1596 spaceBetween: 100,
1597 grabCursor: true,
1598 runCallbacksOnInit: false,
1599 loop: true,
1600 keyboard: true,
1601 handleElementorBreakpoints: true
1602 };
1603
1604 if (!isSingleSlide) {
1605 swiperOptions.navigation = {
1606 prevEl: $prevButton,
1607 nextEl: $nextButton
1608 };
1609 }
1610
1611 if (options.swiper) {
1612 $.extend(swiperOptions, options.swiper);
1613 }
1614
1615 const Swiper = elementorFrontend.utils.swiper;
1616 this.swiper = await new Swiper($container, swiperOptions); // Expose the swiper instance in the frontend
1617
1618 $container.data('swiper', this.swiper);
1619 this.setVideoAspectRatio();
1620 this.playSlideVideo();
1621
1622 if (showFooter) {
1623 this.updateFooterText();
1624 }
1625
1626 this.bindHotKeys();
1627 this.makeButtonsAccessible();
1628 };
1629 },
1630 makeButtonsAccessible: function () {
1631 this.$buttons.attr('tabindex', 0).on('keypress', event => {
1632 const ENTER_KEY = 13,
1633 SPACE_KEY = 32;
1634
1635 if (ENTER_KEY === event.which || SPACE_KEY === event.which) {
1636 jQuery(event.currentTarget).trigger('click');
1637 }
1638 });
1639 },
1640 showLightboxUi: function () {
1641 const slideshowClasses = this.getSettings('classes').slideshow;
1642 this.elements.$container.removeClass(slideshowClasses.hideUiVisibility);
1643 clearTimeout(this.getSettings('hideUiTimeout'));
1644 this.setSettings('hideUiTimeout', setTimeout(() => {
1645 if (!this.shareMode) {
1646 this.elements.$container.addClass(slideshowClasses.hideUiVisibility);
1647 }
1648 }, 3500));
1649 },
1650 bindHotKeys: function () {
1651 this.getModal().getElements('window').on('keydown', this.activeKeyDown);
1652 },
1653 unbindHotKeys: function () {
1654 this.getModal().getElements('window').off('keydown', this.activeKeyDown);
1655 },
1656 activeKeyDown: function (event) {
1657 this.showLightboxUi();
1658 const TAB_KEY = 9;
1659
1660 if (event.which === TAB_KEY) {
1661 const $buttons = this.$buttons;
1662 let focusedButton,
1663 isFirst = false,
1664 isLast = false;
1665 $buttons.each(index => {
1666 const item = $buttons[index];
1667
1668 if (jQuery(item).is(':focus')) {
1669 focusedButton = item;
1670 isFirst = 0 === index;
1671 isLast = $buttons.length - 1 === index;
1672 return false;
1673 }
1674 });
1675
1676 if (event.shiftKey) {
1677 if (isFirst) {
1678 event.preventDefault();
1679 $buttons.last().trigger('focus');
1680 }
1681 } else if (isLast || !focusedButton) {
1682 event.preventDefault();
1683 $buttons.first().trigger('focus');
1684 }
1685 }
1686 },
1687 setVideoAspectRatio: function (aspectRatio) {
1688 aspectRatio = aspectRatio || this.getSettings('modalOptions.videoAspectRatio');
1689 const $widgetContent = this.getModal().getElements('widgetContent'),
1690 oldAspectRatio = this.oldAspectRatio,
1691 aspectRatioClass = this.getSettings('classes.aspectRatio');
1692 this.oldAspectRatio = aspectRatio;
1693
1694 if (oldAspectRatio) {
1695 $widgetContent.removeClass(aspectRatioClass.replace('%s', oldAspectRatio));
1696 }
1697
1698 if (aspectRatio) {
1699 $widgetContent.addClass(aspectRatioClass.replace('%s', aspectRatio));
1700 }
1701 },
1702 getSlide: function (slideState) {
1703 return jQuery(this.swiper.slides).filter(this.getSettings('selectors.slideshow.' + slideState + 'Slide'));
1704 },
1705 updateFooterText: function () {
1706 if (!this.elements.$footer) {
1707 return;
1708 }
1709
1710 const classes = this.getSettings('classes'),
1711 $activeSlide = this.getSlide('active'),
1712 $image = $activeSlide.find('.elementor-lightbox-image'),
1713 titleText = $image.data('title'),
1714 descriptionText = $image.data('description'),
1715 $title = this.elements.$footer.find('.' + classes.slideshow.title),
1716 $description = this.elements.$footer.find('.' + classes.slideshow.description);
1717 $title.text(titleText || '');
1718 $description.text(descriptionText || '');
1719 },
1720 playSlideVideo: function () {
1721 const $activeSlide = this.getSlide('active'),
1722 videoURL = $activeSlide.data('elementor-slideshow-video');
1723
1724 if (!videoURL) {
1725 return;
1726 }
1727
1728 const classes = this.getSettings('classes'),
1729 $videoContainer = jQuery('<div>', {
1730 class: classes.videoContainer + ' ' + classes.invisible
1731 }),
1732 $videoWrapper = jQuery('<div>', {
1733 class: classes.videoWrapper
1734 }),
1735 $playIcon = $activeSlide.children('.' + classes.playButton);
1736 let videoType, apiProvider;
1737 $videoContainer.append($videoWrapper);
1738 $activeSlide.append($videoContainer);
1739
1740 if (-1 !== videoURL.indexOf('vimeo.com')) {
1741 videoType = 'vimeo';
1742 apiProvider = elementorFrontend.utils.vimeo;
1743 } else if (videoURL.match(/^(?:https?:\/\/)?(?:www\.)?(?:m\.)?(?:youtu\.be\/|youtube\.com)/)) {
1744 videoType = 'youtube';
1745 apiProvider = elementorFrontend.utils.youtube;
1746 }
1747
1748 const videoID = apiProvider.getVideoIDFromURL(videoURL);
1749 apiProvider.onApiReady(apiObject => {
1750 if ('youtube' === videoType) {
1751 this.prepareYTVideo(apiObject, videoID, $videoContainer, $videoWrapper, $playIcon);
1752 } else if ('vimeo' === videoType) {
1753 this.prepareVimeoVideo(apiObject, videoID, $videoContainer, $videoWrapper, $playIcon);
1754 }
1755 });
1756 $playIcon.addClass(classes.playing).removeClass(classes.hidden);
1757 },
1758 prepareYTVideo: function (YT, videoID, $videoContainer, $videoWrapper, $playIcon) {
1759 const classes = this.getSettings('classes'),
1760 $videoPlaceholderElement = jQuery('<div>');
1761 let startStateCode = YT.PlayerState.PLAYING;
1762 $videoWrapper.append($videoPlaceholderElement); // Since version 67, Chrome doesn't fire the `PLAYING` state at start time
1763
1764 if (window.chrome) {
1765 startStateCode = YT.PlayerState.UNSTARTED;
1766 }
1767
1768 $videoContainer.addClass('elementor-loading' + ' ' + classes.invisible);
1769 this.player = new YT.Player($videoPlaceholderElement[0], {
1770 videoId: videoID,
1771 events: {
1772 onReady: () => {
1773 $playIcon.addClass(classes.hidden);
1774 $videoContainer.removeClass(classes.invisible);
1775 this.player.playVideo();
1776 },
1777 onStateChange: event => {
1778 if (event.data === startStateCode) {
1779 $videoContainer.removeClass('elementor-loading' + ' ' + classes.invisible);
1780 }
1781 }
1782 },
1783 playerVars: {
1784 controls: 0,
1785 rel: 0
1786 }
1787 });
1788 },
1789 prepareVimeoVideo: function (Vimeo, videoId, $videoContainer, $videoWrapper, $playIcon) {
1790 const classes = this.getSettings('classes'),
1791 vimeoOptions = {
1792 id: videoId,
1793 autoplay: true,
1794 transparent: false,
1795 playsinline: false
1796 };
1797 this.player = new Vimeo.Player($videoWrapper, vimeoOptions);
1798 this.player.ready().then(() => {
1799 $playIcon.addClass(classes.hidden);
1800 $videoContainer.removeClass(classes.invisible);
1801 });
1802 },
1803 setEntranceAnimation: function (animation) {
1804 animation = animation || elementorFrontend.getCurrentDeviceSetting(this.getSettings('modalOptions'), 'entranceAnimation');
1805 const $widgetMessage = this.getModal().getElements('message');
1806
1807 if (this.oldAnimation) {
1808 $widgetMessage.removeClass(this.oldAnimation);
1809 }
1810
1811 this.oldAnimation = animation;
1812
1813 if (animation) {
1814 $widgetMessage.addClass('animated ' + animation);
1815 }
1816 },
1817 openSlideshow: function (slideshowID, initialSlideURL) {
1818 const $allSlideshowLinks = jQuery(this.getSettings('selectors.links')).filter((index, element) => {
1819 const $element = jQuery(element);
1820 return slideshowID === element.dataset.elementorLightboxSlideshow && !$element.parent('.swiper-slide-duplicate').length && !$element.parents('.slick-cloned').length;
1821 });
1822 const slides = [];
1823 let initialSlideIndex = 0;
1824 $allSlideshowLinks.each(function () {
1825 const slideVideo = this.dataset.elementorLightboxVideo;
1826 let slideIndex = this.dataset.elementorLightboxIndex;
1827
1828 if (undefined === slideIndex) {
1829 slideIndex = $allSlideshowLinks.index(this);
1830 }
1831
1832 if (initialSlideURL === this.href || slideVideo && initialSlideURL === slideVideo) {
1833 initialSlideIndex = slideIndex;
1834 }
1835
1836 const slideData = {
1837 image: this.href,
1838 index: slideIndex,
1839 title: this.dataset.elementorLightboxTitle,
1840 description: this.dataset.elementorLightboxDescription
1841 };
1842
1843 if (slideVideo) {
1844 slideData.video = slideVideo;
1845 }
1846
1847 slides.push(slideData);
1848 });
1849 slides.sort((a, b) => a.index - b.index);
1850 this.showModal({
1851 type: 'slideshow',
1852 id: slideshowID,
1853 modalOptions: {
1854 id: 'elementor-lightbox-slideshow-' + slideshowID
1855 },
1856 slideshow: {
1857 slides: slides,
1858 swiper: {
1859 initialSlide: +initialSlideIndex
1860 }
1861 }
1862 });
1863 },
1864 onSlideChange: function () {
1865 this.getSlide('prev').add(this.getSlide('next')).add(this.getSlide('active')).find('.' + this.getSettings('classes.videoWrapper')).remove();
1866 this.playSlideVideo();
1867 this.updateFooterText();
1868 }
1869 });
1870
1871 /***/ }),
1872
1873 /***/ "../assets/dev/js/frontend/utils/lightbox/screenfull.js":
1874 /*!**************************************************************!*\
1875 !*** ../assets/dev/js/frontend/utils/lightbox/screenfull.js ***!
1876 \**************************************************************/
1877 /***/ ((module) => {
1878
1879 "use strict";
1880
1881
1882 (function () {
1883 'use strict';
1884
1885 var document = typeof window !== 'undefined' && typeof window.document !== 'undefined' ? window.document : {};
1886 var isCommonjs = true && module.exports;
1887
1888 var fn = function () {
1889 var val;
1890 var fnMap = [['requestFullscreen', 'exitFullscreen', 'fullscreenElement', 'fullscreenEnabled', 'fullscreenchange', 'fullscreenerror'], // New WebKit
1891 ['webkitRequestFullscreen', 'webkitExitFullscreen', 'webkitFullscreenElement', 'webkitFullscreenEnabled', 'webkitfullscreenchange', 'webkitfullscreenerror'], // Old WebKit
1892 ['webkitRequestFullScreen', 'webkitCancelFullScreen', 'webkitCurrentFullScreenElement', 'webkitCancelFullScreen', 'webkitfullscreenchange', 'webkitfullscreenerror'], ['mozRequestFullScreen', 'mozCancelFullScreen', 'mozFullScreenElement', 'mozFullScreenEnabled', 'mozfullscreenchange', 'mozfullscreenerror'], ['msRequestFullscreen', 'msExitFullscreen', 'msFullscreenElement', 'msFullscreenEnabled', 'MSFullscreenChange', 'MSFullscreenError']];
1893 var i = 0;
1894 var l = fnMap.length;
1895 var ret = {};
1896
1897 for (; i < l; i++) {
1898 val = fnMap[i];
1899
1900 if (val && val[1] in document) {
1901 var valLength = val.length;
1902
1903 for (i = 0; i < valLength; i++) {
1904 ret[fnMap[0][i]] = val[i];
1905 }
1906
1907 return ret;
1908 }
1909 }
1910
1911 return false;
1912 }();
1913
1914 var eventNameMap = {
1915 change: fn.fullscreenchange,
1916 error: fn.fullscreenerror
1917 };
1918 var screenfull = {
1919 request: function (element) {
1920 return new Promise(function (resolve, reject) {
1921 var onFullScreenEntered = function () {
1922 this.off('change', onFullScreenEntered);
1923 resolve();
1924 }.bind(this);
1925
1926 this.on('change', onFullScreenEntered);
1927 element = element || document.documentElement;
1928 Promise.resolve(element[fn.requestFullscreen]()).catch(reject);
1929 }.bind(this));
1930 },
1931 exit: function () {
1932 return new Promise(function (resolve, reject) {
1933 if (!this.isFullscreen) {
1934 resolve();
1935 return;
1936 }
1937
1938 var onFullScreenExit = function () {
1939 this.off('change', onFullScreenExit);
1940 resolve();
1941 }.bind(this);
1942
1943 this.on('change', onFullScreenExit);
1944 Promise.resolve(document[fn.exitFullscreen]()).catch(reject);
1945 }.bind(this));
1946 },
1947 toggle: function (element) {
1948 return this.isFullscreen ? this.exit() : this.request(element);
1949 },
1950 onchange: function (callback) {
1951 this.on('change', callback);
1952 },
1953 onerror: function (callback) {
1954 this.on('error', callback);
1955 },
1956 on: function (event, callback) {
1957 var eventName = eventNameMap[event];
1958
1959 if (eventName) {
1960 document.addEventListener(eventName, callback, false);
1961 }
1962 },
1963 off: function (event, callback) {
1964 var eventName = eventNameMap[event];
1965
1966 if (eventName) {
1967 document.removeEventListener(eventName, callback, false);
1968 }
1969 },
1970 raw: fn
1971 };
1972
1973 if (!fn) {
1974 if (isCommonjs) {
1975 module.exports = {
1976 isEnabled: false
1977 };
1978 } else {
1979 window.screenfull = {
1980 isEnabled: false
1981 };
1982 }
1983
1984 return;
1985 }
1986
1987 Object.defineProperties(screenfull, {
1988 isFullscreen: {
1989 get: function () {
1990 return Boolean(document[fn.fullscreenElement]);
1991 }
1992 },
1993 element: {
1994 enumerable: true,
1995 get: function () {
1996 return document[fn.fullscreenElement];
1997 }
1998 },
1999 isEnabled: {
2000 enumerable: true,
2001 get: function () {
2002 // Coerce to boolean in case of old WebKit
2003 return Boolean(document[fn.fullscreenEnabled]);
2004 }
2005 }
2006 });
2007
2008 if (isCommonjs) {
2009 module.exports = screenfull;
2010 } else {
2011 window.screenfull = screenfull;
2012 }
2013 })();
2014
2015 /***/ })
2016
2017 },
2018 /******/ __webpack_require__ => { // webpackRuntimeModules
2019 /******/ "use strict";
2020 /******/
2021 /******/ var __webpack_exec__ = (moduleId) => (__webpack_require__(__webpack_require__.s = moduleId))
2022 /******/ __webpack_require__.O(0, ["frontend","frontend-modules"], () => (__webpack_exec__("../assets/dev/js/frontend/preloaded-modules.js")));
2023 /******/ var __webpack_exports__ = __webpack_require__.O();
2024 /******/ }
2025 ]);
2026 //# sourceMappingURL=preloaded-modules.js.map