https://www.atiner.gr/wp-content/themes/accesspress-lite/js/nivo-lightbox.js

1/*
2 * Nivo Lightbox v1.3.1
3 * http://dev7studios.com/nivo-lightbox
4 *
5 * Copyright 2013, Dev7studios
6 * Free to use and abuse under the MIT license.
7 * http://www.opensource.org/licenses/mit-license.php
8 */
9
10;(function($, window, document, undefined){
11
12    var pluginName = 'nivoLightbox',
13        defaults = {
14            effect: 'fade',
15            theme: 'default',
16            keyboardNav: true,
17            clickImgToClose: false,
18            clickOverlayToClose: true,
19            onInit: function(){},
20            beforeShowLightbox: function(){},
21            afterShowLightbox: function(lightbox){},
22            beforeHideLightbox: function(){},
23            afterHideLightbox: function(){},
24            beforePrev: function(element){},
25            onPrev: function(element){},
26            beforeNext: function(element){},
27            onNext: function(element){},
28            errorMessage: 'The requested content cannot be loaded. Please try again later.'
29        };
30
31    function NivoLightbox(element, options){
32        this.el = element;
33        this.$el = $(this.el);
34
35        this.options = $.extend({}, defaults, options);
36
37        this._defaults = defaults;
38        this._name = pluginName;
39
40        this.init();
41    }
42
43    NivoLightbox.prototype = {
44
45        init: function(){
46			var $this = this;
47
48			// Need this so we don't use CSS transitions in mobile
49			if(!$('html').hasClass('nivo-lightbox-notouch')) $('html').addClass('nivo-lightbox-notouch');
50			if('ontouchstart' in document) $('html').removeClass('nivo-lightbox-notouch');
51
52			// Setup the click
53            this.$el.on('click', function(e){
54                $this.showLightbox(e);
55            });
56
57            // keyboardNav
58            if(this.options.keyboardNav){
59                $('body').off('keyup').on('keyup', function(e){
60                    var code = (e.keyCode ? e.keyCode : e.which);
61                    // Escape
62                    if(code == 27) $this.destructLightbox();
63                    // Left
64                    if(code == 37) $('.nivo-lightbox-prev').trigger('click');
65                    // Right
66                    if(code == 39) $('.nivo-lightbox-next').trigger('click');
67				});
68			}
69
70			this.options.onInit.call(this);
71
72        },
73
74        showLightbox: function(e){
75            var $this = this,
76                currentLink = this.$el;
77
78			// Check content
79			var check = this.checkContent(currentLink);
80			if(!check) return;
81
82			e.preventDefault();
83            this.options.beforeShowLightbox.call(this);
84            var lightbox = this.constructLightbox();
85            if(!lightbox) return;
86            var content = lightbox.find('.nivo-lightbox-content');
87            if(!content) return;
88
89            $('body').addClass('nivo-lightbox-body-effect-'+ this.options.effect);
90
91			this.processContent( content, currentLink );
92
93            // Nav
94            if(this.$el.attr('data-lightbox-gallery')){
95                var galleryItems = $('[data-lightbox-gallery="'+ this.$el.attr('data-lightbox-gallery') +'"]');
96
97                $('.nivo-lightbox-nav').show();
98
99				// Prev
100                $('.nivo-lightbox-prev').off('click').on('click', function(e){
101                    e.preventDefault();
102                    var index = galleryItems.index(currentLink);
103                    currentLink = galleryItems.eq(index - 1);
104                    if(!$(currentLink).length) currentLink = galleryItems.last();
105                    $.when($this.options.beforePrev.call(this, [ currentLink ])).done(function(){
106                        $this.processContent(content, currentLink);
107                        $this.options.onPrev.call(this, [ currentLink ]);
108                    });
109                });
110
111                // Next
112                $('.nivo-lightbox-next').off('click').on('click', function(e){
113                    e.preventDefault();
114                    var index = galleryItems.index(currentLink);
115                    currentLink = galleryItems.eq(index + 1);
116                    if(!$(currentLink).length) currentLink = galleryItems.first();
117                    $.when($this.options.beforeNext.call(this, [ currentLink ])).done(function(){
118                        $this.processContent(content, currentLink);
119                        $this.options.onNext.call(this, [ currentLink ]);
120                    });
121                });
122            }
123
124            setTimeout(function(){
125                lightbox.addClass('nivo-lightbox-open');
126                $this.options.afterShowLightbox.call(this, [ lightbox ]);
127            }, 1); // For CSS transitions
128        },
129
130		checkContent: function( link ) {
131			var $this = this,
132                href = link.attr('href'),
133                video = href.match(/(youtube|youtube-nocookie|youtu|vimeo)\.(com|be)\/(watch\?v=([\w-]+)|([\w-]+))/);
134
135            if(href.match(/\.(jpeg|jpg|gif|png)$/i) !== null){
136				return true;
137			}
138			// Video (Youtube/Vimeo)
139            else if(video){
140				return true;
141			}
142			// AJAX
143			else if(link.attr('data-lightbox-type') == 'ajax'){
144				return true;
145			}
146			// Inline HTML
147			else if(href.substring(0, 1) == '#' && link.attr('data-lightbox-type') == 'inline'){
148				return true;
149			}
150			// iFrame (default)
151			else if(link.attr('data-lightbox-type') == 'iframe'){
152				return true;
153			}
154
155			return false;

156		},
157
158        processContent: function(content, link){
159            var $this = this,
160                href = link.attr('href'),
161                video = href.match(/(youtube|youtube-nocookie|youtu|vimeo)\.(com|be)\/(watch\?v=([\w-]+)|([\w-]+))/);
162
163            content.html('').addClass('nivo-lightbox-loading');
164
165            // Is HiDPI?
166            if(this.isHidpi() && link.attr('data-lightbox-hidpi')){
167                href = link.attr('data-lightbox-hidpi');
168            }
169
170            // Image
171            if(href.match(/\.(jpeg|jpg|gif|png)$/i) !== null){
172                var img = $('<img>', { src: href, 'class': 'nivo-lightbox-image-display' });
173                img.one('load', function() {
174					var wrap = $('<div class="nivo-lightbox-image" />');
175                    wrap.append(img);
176					content.html(wrap).removeClass('nivo-lightbox-loading');
177
178					// Vertically center images
179					wrap.css({
180						'line-height': $('.nivo-lightbox-content').height() +'px',
181						'height': $('.nivo-lightbox-content').height() +'px' // For Firefox
182					});
183					$(window).resize(function() {
184						wrap.css({
185							'line-height': $('.nivo-lightbox-content').height() +'px',
186							'height': $('.nivo-lightbox-content').height() +'px' // For Firefox
187						});
188					});
189				}).each(function() {
190					if(this.complete) $(this).load();
191				});
192
193				img.error(function() {
194					var wrap = $('<div class="nivo-lightbox-error"><p>'+ $this.options.errorMessage +'</p></div>');
195                    content.html(wrap).removeClass('nivo-lightbox-loading');
196				});
197            }
198            // Video (Youtube/Vimeo)
199            else if(video){
200                var src = '',
201                    classTerm = 'nivo-lightbox-video';
202
203                if(video[1] == 'youtube'){
204                    src = '//www.youtube.com/embed/'+ video[4];
205                    classTerm = 'nivo-lightbox-youtube';
206                }
207                if(video[1] == 'youtube-nocookie'){
208                    src = href; //https://www.youtube-nocookie.com/embed/...
209                    classTerm = 'nivo-lightbox-youtube';
210                }
211                if(video[1] == 'youtu'){
212                    src = '//www.youtube.com/embed/'+ video[3];
213                    classTerm = 'nivo-lightbox-youtube';
214                }
215                if(video[1] == 'vimeo'){
216                    src = '//player.vimeo.com/video/'+ video[3];
217                    classTerm = 'nivo-lightbox-vimeo';
218                }
219
220                if(src){
221                    var iframeVideo = $('<iframe>', {
222                        src: src,
223                        'class': classTerm,
224                        frameborder: 0,
225                        vspace: 0,
226                        hspace: 0,
227                        scrolling: 'auto'
228                    });
229                    content.html(iframeVideo);
230                    iframeVideo.load(function(){ content.removeClass('nivo-lightbox-loading'); });
231                }
232            }
233            // AJAX
234            else if(link.attr('data-lightbox-type') == 'ajax'){
235				$.ajax({
236					url: href,
237					cache: false,
238					success: function(data) {
239						var wrap = $('<div class="nivo-lightbox-ajax" />');
240						wrap.append(data);
241						content.html(wrap).removeClass('nivo-lightbox-loading');
242
243						// Vertically center html
244						if(wrap.outerHeight() < content.height()){
245							wrap.css({
246								'position': 'relative',
247								'top': '50%',
248								'margin-top': -(wrap.outerHeight()/2) +'px'
249							});
250						}
251						$(window).resize(function() {
252							if(wrap.outerHeight() < content.height()){
253								wrap.css({
254									'position': 'relative',
255									'top': '50%',
256									'margin-top': -(wrap.outerHeight()/2) +'px'
257								});
258							}
259						});
260					},
261					error: function(){
262						var wrap = $('<div class="nivo-lightbox-error"><p>'+ $this.options.errorMessage +'</p></div>');
263                        content.html(wrap).removeClass('nivo-lightbox-loading');
264					}
265				});
266            }
267            // Inline HTML
268            else if(href.substring(0, 1) == '#' && link.attr('data-lightbox-type') == 'inline'){
269                if($(href).length){
270                    var wrap = $('<div class="nivo-lightbox-inline" />');
271					wrap.append($(href).clone().show());
272                    content.html(wrap).removeClass('nivo-lightbox-loading');
273
274                    // Vertically center html
275					if(wrap.outerHeight() < content.height()){
276						wrap.css({
277							'position': 'relative',
278							'top': '50%',
279							'margin-top': -(wrap.outerHeight()/2) +'px'
280						});
281					}
282					$(window).resize(function() {
283						if(wrap.outerHeight() < content.height()){
284							wrap.css({
285								'position': 'relative',
286								'top': '50%',
287								'margin-top': -(wrap.outerHeight()/2) +'px'
288							});
289						}
290					});
291				} else {
292					var wrapError = $('<div class="nivo-lightbox-error"><p>'+ $this.options.errorMessage +'</p></div>');
293                    content.html(wrapError).removeClass('nivo-lightbox-loading');
294				}
295            }
296            // iFrame (default)
297            else if(link.attr('data-lightbox-type') == 'iframe'){
298                var iframe = $('<iframe>', {
299                    src: href,
300                    'class': 'nivo-lightbox-item',
301                    frameborder: 0,
302                    vspace: 0,
303                    hspace: 0,
304                    scrolling: 'auto'
305                });
306                content.html(iframe);
307                iframe.load(function(){ content.removeClass('nivo-lightbox-loading'); });
308            } else {
309				return false;

310			}
311
312            // Set the title
313            if(link.attr('title')){
314                var titleWrap = $('<span>', { 'class': 'nivo-lightbox-title' });
315                titleWrap.text(link.attr('title'));
316                $('.nivo-lightbox-title-wrap').html(titleWrap);
317            } else {
318                $('.nivo-lightbox-title-wrap').html('');
319            }
320        },
321
322        constructLightbox: function(){
323            if($('.nivo-lightbox-overlay').length) return $('.nivo-lightbox-overlay');
324
325            var overlay = $('<div>', { 'class': 'nivo-lightbox-overlay nivo-lightbox-theme-'+ this.options.theme +' nivo-lightbox-effect-'+ this.options.effect });
326            var wrap = $('<div>', { 'class': 'nivo-lightbox-wrap' });
327            var content = $('<div>', { 'class': 'nivo-lightbox-content' });
328            var nav = $('<a href="#" class="nivo-lightbox-nav nivo-lightbox-prev">Previous</a><a href="#" class="nivo-lightbox-nav nivo-lightbox-next">Next</a>');
329            var close = $('<a href="#" class="nivo-lightbox-close" title="Close">Close</a>');
330            var title = $('<div>', { 'class': 'nivo-lightbox-title-wrap' });
331
332            var isMSIE = /*@cc_on!@*/0;
333            if(isMSIE) overlay.addClass('nivo-lightbox-ie');
334
335            wrap.append(content);
336            wrap.append(title);
337            overlay.append(wrap);
338            overlay.append(nav);
339            overlay.append(close);
340            $('body').append(overlay);
341
342            var $this = this;
343            if($this.options.clickOverlayToClose){
344                overlay.on('click', function(e){
345                    if(e.target === this || $(e.target).hasClass('nivo-lightbox-content') || $(e.target).hasClass('nivo-lightbox-image')){
346                        $this.destructLightbox();
347                    }
348                });
349            }
350            if($this.options.clickImgToClose){
351                overlay.on('click', function(e){
352                    if(e.target === this || $(e.target).hasClass('nivo-lightbox-image-display')){
353                        $this.destructLightbox();
354                    }
355                });
356            }
357
358            close.on('click', function(e){
359                e.preventDefault();
360                $this.destructLightbox();
361            });
362
363            return overlay;
364        },
365
366        destructLightbox: function(){
367            var $this = this;
368            this.options.beforeHideLightbox.call(this);
369
370            $('.nivo-lightbox-overlay').removeClass('nivo-lightbox-open');
371            $('.nivo-lightbox-nav').hide();
372            $('body').removeClass('nivo-lightbox-body-effect-'+ $this.options.effect);
373
374            // For IE
375            var isMSIE = /*@cc_on!@*/0;
376            if(isMSIE){
377                $('.nivo-lightbox-overlay iframe').attr("src", " ");
378                $('.nivo-lightbox-overlay iframe').remove();
379            }
380
381            // Remove click handlers
382            $('.nivo-lightbox-prev').off('click');
383            $('.nivo-lightbox-next').off('click');
384
385            // Empty content (for videos)
386            $('.nivo-lightbox-content').empty();
387
388            this.options.afterHideLightbox.call(this);
389        },
390
391        isHidpi: function(){
392			var mediaQuery = "(-webkit-min-device-pixel-ratio: 1.5),\
393                              (min--moz-device-pixel-ratio: 1.5),\
394                              (-o-min-device-pixel-ratio: 3/2),\
395                              (min-resolution: 1.5dppx)";
396			if(window.devicePixelRatio > 1) return true;
397			if(window.matchMedia && window.matchMedia(mediaQuery).matches) return true;
398			return false;
399		}
400
401    };
402
403    $.fn[pluginName] = function(options){
404        return this.each(function(){
405            if(!$.data(this, pluginName)){
406                $.data(this, pluginName, new NivoLightbox(this, options));
407            }
408        });
409    };
410
411})(jQuery, window, document);