https://www.hausverw.de/themes/unify/assets/js/components/hs.popup.js

1/**
2 * Fancybox wrapper.
3 *
4 * @author Htmlstream
5 * @version 1.0
6 * @requires
7 *
8 */
9;
10(function($) {
11	'use strict';
12
13	$.HSCore.components.HSPopup = {
14		/**
15		 *
16		 *
17		 * @var Object _baseConfig
18		 */
19		_baseConfig: {
20			parentEl: 'html',
21			baseClass: 'u-fancybox-theme',
22			slideClass: 'u-fancybox-slide',
23			speed: 1000,
24			slideSpeedCoefficient: 1,
25			infobar: false,
26			fullScreen: true,
27			thumbs: true,
28			closeBtn: true,
29			baseTpl: '<div class="fancybox-container" role="dialog" tabindex="-1">' +
30				'<div class="fancybox-content">' +
31				'<div class="fancybox-bg"></div>' +
32				'<div class="fancybox-controls" style="position: relative; z-index: 99999;">' +
33				'<div class="fancybox-infobar">' +
34				'<div class="fancybox-infobar__body">' +
35				'<span data-fancybox-index></span>&nbsp;/&nbsp;<span data-fancybox-count></span>' +
36				'</div>' +
37				'</div>' +
38				'<div class="fancybox-toolbar">{{BUTTONS}}</div>' +
39				'</div>' +
40				'<div class="fancybox-slider-wrap">' +
41				'<button data-fancybox-prev class="fancybox-arrow fancybox-arrow--left" title="Previous"></button>' +
42				'<button data-fancybox-next class="fancybox-arrow fancybox-arrow--right" title="Next"></button>' +
43				'<div class="fancybox-stage"></div>' +
44				'</div>' +
45				'<div class="fancybox-caption-wrap">' +
46				'<div class="fancybox-caption"></div>' +
47				'</div>' +
48				'</div>' +
49				'</div>',
50			animationEffect: 'fade'
51		},
52
53		/**
54		 *
55		 *
56		 * @var jQuery pageCollection
57		 */
58		pageCollection: $(),
59
60		/**
61		 * Initialization of Fancybox wrapper.
62		 *
63		 * @param String selector (optional)
64		 * @param Object config (optional)
65		 *
66		 * @return jQuery pageCollection - collection of initialized items.
67		 */
68
69		init: function(selector, config) {
70			if (!selector) return;
71
72			var $collection = $(selector);
73
74			if (!$collection.length) return;
75
76			config = config && $.isPlainObject(config) ? $.extend(true, {}, this._baseConfig, config) : this._baseConfig;
77
78			this.initPopup(selector, config);
79		},
80
81		initPopup: function(el, conf) {
82			var $fancybox = $(el);
83
84			$fancybox.on('click', function() {
85				var $this = $(this),
86					animationDuration = $this.data('speed'),
87					isGroup = $this.data('fancybox'),
88					isInfinite = Boolean($this.data('is-infinite')),
89					slideShowSpeed = $this.data('slideshow-speed');
90
91				$.fancybox.defaults.animationDuration = animationDuration;
92
93				if (isInfinite == true) {
94					$.fancybox.defaults.loop = true;
95				}
96
97				if (isGroup) {
98					$.fancybox.defaults.transitionEffect = 'slide';
99					$.fancybox.defaults.slideShow.speed = slideShowSpeed;
100				}
101			});
102
103			$fancybox.fancybox($.extend(true, {}, conf, {
104				beforeShow: function(instance, slide) {
105					var $fancyModal = $(instance.$refs.container),
106						$fancyOverlay = $(instance.$refs.bg[0]),
107						$fancySlide = $(instance.current.$slide),
108
109						animateIn = instance.current.opts.$orig[0].dataset.animateIn,
110						animateOut = instance.current.opts.$orig[0].dataset.animateOut,
111						speed = instance.current.opts.$orig[0].dataset.speed,
112						overlayBG = instance.current.opts.$orig[0].dataset.overlayBg,
113						overlayBlurBG = instance.current.opts.$orig[0].dataset.overlayBlurBg;
114
115					if (animateIn && $('body').hasClass('u-first-slide-init')) {
116						var $fancyPrevSlide = $(instance.slides[instance.prevPos].$slide);
117
118						$fancySlide.addClass('has-animation');
119
120						$fancyPrevSlide.addClass('animated ' + animateOut);
121
122						setTimeout(function() {
123							$fancySlide.addClass('animated ' + animateIn);
124						}, speed / 2);
125					} else if (animateIn) {
126						var $fancyPrevSlide = $(instance.slides[instance.prevPos].$slide);
127
128						$fancySlide.addClass('has-animation');
129
130						$fancySlide.addClass('animated ' + animateIn);
131
132						$('body').addClass('u-first-slide-init');
133					}
134
135					if (speed) {
136						$fancyOverlay.css('transition-duration', speed + 'ms');
137					} else {
138						$fancyOverlay.css('transition-duration', '1000ms');
139					}
140
141					if (overlayBG) {
142						$fancyOverlay.css('background-color', overlayBG);
143					}
144
145					if (overlayBlurBG) {
146						$('body').addClass('g-blur-30');
147					}
148				},
149
150				beforeClose: function(instance, slide) {
151					var $fancyModal = $(instance.$refs.container),
152						$fancySlide = $(instance.current.$slide),
153
154						animateIn = instance.current.opts.$orig[0].dataset.animateIn,
155						animateOut = instance.current.opts.$orig[0].dataset.animateOut,
156						overlayBlurBG = instance.current.opts.$orig[0].dataset.overlayBlurBg;
157
158					if (animateOut) {
159						$fancySlide.removeClass(animateIn).addClass(animateOut);
160						$('body').removeClass('u-first-slide-init')
161					}
162
163					if (overlayBlurBG) {
164						$('body').removeClass('g-blur-30')
165					}
166				}
167			}));
168		}
169	}
170})(jQuery);