From af1a4be521b10c44eae5c654286925e22f04a0d6 Mon Sep 17 00:00:00 2001 From: Janis Skarnelis Date: Fri, 9 Jun 2017 10:49:41 +0300 Subject: [PATCH 01/56] Updated link to the latest jQuery version --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 769bb031..983a3045 100644 --- a/README.md +++ b/README.md @@ -13,7 +13,7 @@ Follow [@thefancyapps](//twitter.com/thefancyapps) for updates. 1\. Add latest jQuery and fancyBox files ```html - + From aa030c61a025348231d9d9809009056fba2e6254 Mon Sep 17 00:00:00 2001 From: Janis Skarnelis Date: Tue, 13 Jun 2017 23:00:57 +0300 Subject: [PATCH 02/56] Additional iframe demo --- docs/index.html | 19 +++++++++++++++++-- 1 file changed, 17 insertions(+), 2 deletions(-) diff --git a/docs/index.html b/docs/index.html index 70a5a2f5..7525083c 100644 --- a/docs/index.html +++ b/docs/index.html @@ -696,12 +696,28 @@

Iframe

- If you have not disabled iframe preloading (using an "preload" option), then the script will atempt to + If you have not disabled iframe preloading (using preload option), then the script will atempt to calculate content dimensions and will adjust width/height of iframe to fit with content in it. Keep in mind, that due to same origin policy, there are some limitations.

+

+ This example will disable iframe preloading and will display small close button next to iframe instead of the toolbar: +

+ +
$('[data-fancybox]').fancybox({
+	toolbar  : false,
+	smallBtn : true,
+	iframe : {
+		preload : false
+	}
+})
+
+

+ View demo on CodePen +

+ -

FAQ

+ -

Opening/closing causes fixed element to jump

+
+ +

FAQ

+ +

1. Opening/closing causes fixed element to jump

Simply add compensate-for-scrollbar CSS class to your fixed positioned elements. @@ -1627,7 +1634,7 @@

Opening/closing causes fixed element to jump

right: 0; } -

How to customize caption

+

2. How to customize caption

You can use caption option that accepts a function and is called for each group element. Example of appending image download link: @@ -1681,7 +1688,7 @@

How to customize caption

-

How to create custom button in the toolbar

+

3. How to create custom button in the toolbar

Example of creating reusable button and changing href property dynamically @@ -1711,16 +1718,37 @@

How to create custom button in the toolbar

View demo on CodePen

-

How to reposition thumbnail grid

+

4. How to reposition thumbnail grid

There is currenty no JS option to change thumbnail grid position. But fancyBox is designed so that you can use CSS to change position or dimension for each block (e.g., content area, caption or thumbnail grid). This gives you freedom to completely change the look and feel of the modal window, if needed. + View demo on CodePen

+

5. How to disable touch gestures/swiping

+ +

+ When you want to make your content selectable or clickable, you have two options: +

+ +
    +
  • + disable touch gestures completely by setting touch:false +
  • +
  • + add data-selectable="true" attribute to your html element. +
  • +
+ +

+ View demo on CodePen +

+ +
@@ -1751,11 +1779,9 @@

How to reposition thumbnail grid

self.targets = []; // Get current top position of sticky element - self.stickyTop = self.$sticky.css( 'position', 'relative' ).offset().top; // Cache all targets and their top positions - self.$sticky.find( 'a' ).map(function () { var $el = $( this ), href = $el.data('target') || $el.attr( 'href' ), @@ -1780,7 +1806,6 @@

How to reposition thumbnail grid

var currentIndex = 0; // Toggle fixed position depending on visibility - if ( $(window).width() < 800 || self.stickyTop > windowTop ) { stickyPosition = 'relative'; @@ -1799,7 +1824,6 @@

How to reposition thumbnail grid

self.$sticky.css( 'position', stickyPosition ); $stickyLinks.eq( currentIndex ).addClass( 'active' ); - }, init : function() { diff --git a/package.json b/package.json index 0be0d973..735fd3b0 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "@fancyapps/fancybox", "description": "Touch enabled, responsive and fully customizable jQuery lightbox script", - "version": "3.1.25", + "version": "3.1.26", "homepage": "http://fancyapps.com/fancybox/", "main": "./dist/jquery.fancybox.js", "author": "fancyApps", diff --git a/src/js/core.js b/src/js/core.js index 43a22abb..9381e1e7 100644 --- a/src/js/core.js +++ b/src/js/core.js @@ -26,7 +26,7 @@ // Enable infinite gallery navigation loop : false, - // Space around image, ignored if zoomed-in or viewport smaller than 800px + // Space around image, ignored if zoomed-in or viewport width is smaller than 800px margin : [44, 0], // Horizontal space between slides @@ -217,6 +217,7 @@ autoStart : false, }, + // Set `touch: false` to disable dragging/swiping touch : { vertical : true, // Allow to drag content vertically momentum : true // Continue movement after releasing mouse/touch when panning @@ -315,7 +316,7 @@ return current.type === 'image' ? 'toggleControls' : false; }, clickSlide : function( current, event ) { - return current.type === 'image' ? 'toggleControls' : "close"; + return current.type === 'image' ? 'toggleControls' : 'close'; }, dblclickContent : function( current, event ) { return current.type === 'image' ? 'zoom' : false; @@ -1806,11 +1807,11 @@ $slide.on('refresh.fb', function() { var $wrap = slide.$content, - $contents, - $body, + frameWidth = opts.css.width, + frameHeight = opts.css.height, scrollWidth, - frameWidth, - frameHeight; + $contents, + $body; if ( $iframe[0].isReady !== 1 ) { return; @@ -1826,19 +1827,28 @@ } catch (ignore) {} // Calculate dimensions for the wrapper - if ( $body && $body.length && !( opts.css.width !== undefined && opts.css.height !== undefined ) ) { + if ( $body && $body.length ) { - scrollWidth = $iframe[0].contentWindow.document.documentElement.scrollWidth; + if ( frameWidth === undefined ) { + scrollWidth = $iframe[0].contentWindow.document.documentElement.scrollWidth; - frameWidth = Math.ceil( $body.outerWidth(true) + ( $wrap.width() - scrollWidth ) ); - frameHeight = Math.ceil( $body.outerHeight(true) ); + frameWidth = Math.ceil( $body.outerWidth(true) + ( $wrap.width() - scrollWidth ) ); + frameWidth += $wrap.outerWidth() - $wrap.innerWidth(); + } + + if ( frameHeight === undefined ) { + frameHeight = Math.ceil( $body.outerHeight(true) ); + frameHeight += $wrap.outerHeight() - $wrap.innerHeight(); + } // Resize wrapper to fit iframe content - $wrap.css({ - 'width' : opts.css.width === undefined ? frameWidth + ( $wrap.outerWidth() - $wrap.innerWidth() ) : opts.css.width, - 'height' : opts.css.height === undefined ? frameHeight + ( $wrap.outerHeight() - $wrap.innerHeight() ) : opts.css.height - }); + if ( frameWidth ) { + $wrap.width( frameWidth ); + } + if ( frameHeight ) { + $wrap.height( frameHeight ); + } } $wrap.removeClass( 'fancybox-is-hidden' ); @@ -2246,7 +2256,7 @@ $.fancybox.stop( slide.$slide ); - slide.$slide.unbind().remove(); + slide.$slide.off().remove(); } }); @@ -2300,8 +2310,16 @@ return; } - // Skip for images and iframes - $el = current && current.isComplete ? current.$slide.find('button,:input,[tabindex],a').filter(':not([disabled]):visible:first') : null; + if ( current && current.isComplete ) { + + // Look for first input with autofocus attribute + $el = current.$slide.find('input[autofocus]:enabled:visible:first'); + + if ( !$el.length ) { + $el = current.$slide.find('button,:input,[tabindex],a').filter(':enabled:visible:first'); + } + } + $el = $el && $el.length ? $el : this.$refs.container; $el.focus(); @@ -2485,7 +2503,6 @@ instance.activate(); } else { - $W.scrollTop( self.scrollTop ).scrollLeft( self.scrollLeft ); $( 'html' ).removeClass( 'fancybox-enabled' ); diff --git a/src/js/guestures.js b/src/js/guestures.js index 67e43117..61a37ce8 100644 --- a/src/js/guestures.js +++ b/src/js/guestures.js @@ -66,7 +66,7 @@ var isClickable = function( $el ) { - if ( $el.is('a,button,input,select,textarea') || $.isFunction( $el.get(0).onclick ) || $el.data('selectable') ) { + if ( $el.is('a,button,input,select,textarea,label') || $.isFunction( $el.get(0).onclick ) || $el.data('selectable') ) { return true; } From 65c74334e4081bb3b773ea44a3af75a93d18b149 Mon Sep 17 00:00:00 2001 From: Janis Skarnelis Date: Fri, 29 Sep 2017 16:46:34 +0300 Subject: [PATCH 11/56] Fix #1653 - Random slides missing in IE11 --- dist/jquery.fancybox.js | 7 +++---- dist/jquery.fancybox.min.js | 6 +++--- package.json | 2 +- src/js/core.js | 3 +-- 4 files changed, 8 insertions(+), 10 deletions(-) diff --git a/dist/jquery.fancybox.js b/dist/jquery.fancybox.js index 45c70d89..763289a6 100644 --- a/dist/jquery.fancybox.js +++ b/dist/jquery.fancybox.js @@ -1,5 +1,5 @@ // ================================================== -// fancyBox v3.1.26 +// fancyBox v3.1.27 // // Licensed GPLv3 for open source use // or fancyBox Commercial License for commercial use @@ -1760,7 +1760,7 @@ .attr('src', slide.src) .appendTo( slide.$content ); - if ( $img[0].complete ) { + if ( ( $img[0].complete || $img[0].readyState == "complete" ) && $img[0].naturalWidth && $img[0].naturalHeight ) { $img.trigger( 'load' ); } else if( $img[0].error ) { @@ -2095,7 +2095,6 @@ effect = 'fade'; } - // Zoom animation // ============== @@ -2646,7 +2645,7 @@ $.fancybox = { - version : "3.1.26", + version : "3.1.27", defaults : defaults, diff --git a/dist/jquery.fancybox.min.js b/dist/jquery.fancybox.min.js index 283d3704..3c5fab66 100644 --- a/dist/jquery.fancybox.min.js +++ b/dist/jquery.fancybox.min.js @@ -1,5 +1,5 @@ // ================================================== -// fancyBox v3.1.26 +// fancyBox v3.1.27 // // Licensed GPLv3 for open source use // or fancyBox Commercial License for commercial use @@ -8,5 +8,5 @@ // Copyright 2017 fancyApps // // ================================================== -!function(t,e,n,o){"use strict";function i(t){var e=t.currentTarget,o=t.data?t.data.options:{},i=o.selector?n(o.selector):t.data?t.data.items:[],a=n(e).attr("data-fancybox")||"",s=0,r=n.fancybox.getInstance();t.preventDefault(),t.stopPropagation(),r&&r.current.opts.$orig.is(e)||(a?(i=i.length?i.filter('[data-fancybox="'+a+'"]'):n('[data-fancybox="'+a+'"]'),s=i.index(e),s<0&&(s=0)):i=[e],n.fancybox.open(i,o,s))}if(n){if(n.fn.fancybox)return void n.error("fancyBox already initialized");var a={loop:!1,margin:[44,0],gutter:50,keyboard:!0,arrows:!0,infobar:!1,toolbar:!0,buttons:["slideShow","fullScreen","thumbs","close"],idleTime:4,smallBtn:"auto",protect:!1,modal:!1,image:{preload:"auto"},ajax:{settings:{data:{fancybox:!0}}},iframe:{tpl:'',preload:!0,css:{},attr:{scrolling:"auto"}},animationEffect:"zoom",animationDuration:366,zoomOpacity:"auto",transitionEffect:"fade",transitionDuration:366,slideClass:"",baseClass:"",baseTpl:'',spinnerTpl:'
',errorTpl:'

{{ERROR}}

',btnTpl:{slideShow:'',fullScreen:'',thumbs:'',close:'',smallBtn:''},parentEl:"body",autoFocus:!0,backFocus:!0,trapFocus:!0,fullScreen:{autoStart:!1},touch:{vertical:!0,momentum:!0},hash:null,media:{},slideShow:{autoStart:!1,speed:4e3},thumbs:{autoStart:!1,hideOnClose:!0},onInit:n.noop,beforeLoad:n.noop,afterLoad:n.noop,beforeShow:n.noop,afterShow:n.noop,beforeClose:n.noop,afterClose:n.noop,onActivate:n.noop,onDeactivate:n.noop,clickContent:function(t,e){return"image"===t.type&&"zoom"},clickSlide:"close",clickOutside:"close",dblclickContent:!1,dblclickSlide:!1,dblclickOutside:!1,mobile:{clickContent:function(t,e){return"image"===t.type&&"toggleControls"},clickSlide:function(t,e){return"image"===t.type?"toggleControls":"close"},dblclickContent:function(t,e){return"image"===t.type&&"zoom"},dblclickSlide:function(t,e){return"image"===t.type&&"zoom"}},lang:"en",i18n:{en:{CLOSE:"Close",NEXT:"Next",PREV:"Previous",ERROR:"The requested content cannot be loaded.
Please try again later.",PLAY_START:"Start slideshow",PLAY_STOP:"Pause slideshow",FULL_SCREEN:"Full screen",THUMBS:"Thumbnails"},de:{CLOSE:"Schliessen",NEXT:"Weiter",PREV:"Zurück",ERROR:"Die angeforderten Daten konnten nicht geladen werden.
Bitte versuchen Sie es später nochmal.",PLAY_START:"Diaschau starten",PLAY_STOP:"Diaschau beenden",FULL_SCREEN:"Vollbild",THUMBS:"Vorschaubilder"}}},s=n(t),r=n(e),c=0,l=function(t){return t&&t.hasOwnProperty&&t instanceof n},u=function(){return t.requestAnimationFrame||t.webkitRequestAnimationFrame||t.mozRequestAnimationFrame||t.oRequestAnimationFrame||function(e){return t.setTimeout(e,1e3/60)}}(),d=function(){var t,n=e.createElement("fakeelement"),i={transition:"transitionend",OTransition:"oTransitionEnd",MozTransition:"transitionend",WebkitTransition:"webkitTransitionEnd"};for(t in i)if(n.style[t]!==o)return i[t]}(),f=function(t){return t&&t.length&&t[0].offsetHeight},p=function(t,o,i){var s=this;s.opts=n.extend(!0,{index:i},a,o||{}),o&&n.isArray(o.buttons)&&(s.opts.buttons=o.buttons),s.id=s.opts.id||++c,s.group=[],s.currIndex=parseInt(s.opts.index,10)||0,s.prevIndex=null,s.prevPos=null,s.currPos=0,s.firstRun=null,s.createGroup(t),s.group.length&&(s.$lastFocus=n(e.activeElement).blur(),s.slides={},s.init(t))};n.extend(p.prototype,{init:function(){var t,e,o,i=this,a=i.group[i.currIndex].opts;i.scrollTop=r.scrollTop(),i.scrollLeft=r.scrollLeft(),n.fancybox.getInstance()||n.fancybox.isMobile||"hidden"===n("body").css("overflow")||(t=n("body").width(),n("html").addClass("fancybox-enabled"),t=n("body").width()-t,t>1&&n("head").append('")),o="",n.each(a.buttons,function(t,e){o+=a.btnTpl[e]||""}),e=n(i.translate(i,a.baseTpl.replace("{{BUTTONS}}",o))).addClass("fancybox-is-hidden").attr("id","fancybox-container-"+i.id).addClass(a.baseClass).data("FancyBox",i).prependTo(a.parentEl),i.$refs={container:e},["bg","inner","infobar","toolbar","stage","caption"].forEach(function(t){i.$refs[t]=e.find(".fancybox-"+t)}),(!a.arrows||i.group.length<2)&&e.find(".fancybox-navigation").remove(),a.infobar||i.$refs.infobar.remove(),a.toolbar||i.$refs.toolbar.remove(),i.trigger("onInit"),i.activate(),i.jumpTo(i.currIndex)},translate:function(t,e){var n=t.opts.i18n[t.opts.lang];return e.replace(/\{\{(\w+)\}\}/g,function(t,e){var i=n[e];return i===o?t:i})},createGroup:function(t){var e=this,i=n.makeArray(t);n.each(i,function(t,i){var a,s,r,c,l={},u={},d=[];n.isPlainObject(i)?(l=i,u=i.opts||i):"object"===n.type(i)&&n(i).length?(a=n(i),d=a.data(),u="options"in d?d.options:{},u="object"===n.type(u)?u:{},l.src="src"in d?d.src:u.src||a.attr("href"),["width","height","thumb","type","filter"].forEach(function(t){t in d&&(u[t]=d[t])}),"srcset"in d&&(u.image={srcset:d.srcset}),u.$orig=a,l.type||l.src||(l.type="inline",l.src=i)):l={type:"html",src:i+""},l.opts=n.extend(!0,{},e.opts,u),n.fancybox.isMobile&&(l.opts=n.extend(!0,{},l.opts,l.opts.mobile)),s=l.type||l.opts.type,r=l.src||"",!s&&r&&(r.match(/(^data:image\/[a-z0-9+\/=]*,)|(\.(jp(e|g|eg)|gif|png|bmp|webp|svg|ico)((\?|#).*)?$)/i)?s="image":r.match(/\.(pdf)((\?|#).*)?$/i)?s="pdf":"#"===r.charAt(0)&&(s="inline")),l.type=s,l.index=e.group.length,l.opts.$orig&&!l.opts.$orig.length&&delete l.opts.$orig,!l.opts.$thumb&&l.opts.$orig&&(l.opts.$thumb=l.opts.$orig.find("img:first")),l.opts.$thumb&&!l.opts.$thumb.length&&delete l.opts.$thumb,"function"===n.type(l.opts.caption)?l.opts.caption=l.opts.caption.apply(i,[e,l]):"caption"in d&&(l.opts.caption=d.caption),l.opts.caption=l.opts.caption===o?"":l.opts.caption+"","ajax"===s&&(c=r.split(/\s+/,2),c.length>1&&(l.src=c.shift(),l.opts.filter=c.shift())),"auto"==l.opts.smallBtn&&(n.inArray(s,["html","inline","ajax"])>-1?(l.opts.toolbar=!1,l.opts.smallBtn=!0):l.opts.smallBtn=!1),"pdf"===s&&(l.type="iframe",l.opts.iframe.preload=!1),l.opts.modal&&(l.opts=n.extend(!0,l.opts,{infobar:0,toolbar:0,smallBtn:0,keyboard:0,slideShow:0,fullScreen:0,thumbs:0,touch:0,clickContent:!1,clickSlide:!1,clickOutside:!1,dblclickContent:!1,dblclickSlide:!1,dblclickOutside:!1})),e.group.push(l)})},addEvents:function(){var o=this;o.removeEvents(),o.$refs.container.on("click.fb-close","[data-fancybox-close]",function(t){t.stopPropagation(),t.preventDefault(),o.close(t)}).on("click.fb-prev touchend.fb-prev","[data-fancybox-prev]",function(t){t.stopPropagation(),t.preventDefault(),o.previous()}).on("click.fb-next touchend.fb-next","[data-fancybox-next]",function(t){t.stopPropagation(),t.preventDefault(),o.next()}),s.on("orientationchange.fb resize.fb",function(t){t&&t.originalEvent&&"resize"===t.originalEvent.type?u(function(){o.update()}):(o.$refs.stage.hide(),setTimeout(function(){o.$refs.stage.show(),o.update()},500))}),r.on("focusin.fb",function(t){var i=n.fancybox?n.fancybox.getInstance():null;i.isClosing||!i.current||!i.current.opts.trapFocus||n(t.target).hasClass("fancybox-container")||n(t.target).is(e)||i&&"fixed"!==n(t.target).css("position")&&!i.$refs.container.has(t.target).length&&(t.stopPropagation(),i.focus(),s.scrollTop(o.scrollTop).scrollLeft(o.scrollLeft))}),r.on("keydown.fb",function(t){var e=o.current,i=t.keyCode||t.which;if(e&&e.opts.keyboard&&!n(t.target).is("input")&&!n(t.target).is("textarea"))return 8===i||27===i?(t.preventDefault(),void o.close(t)):37===i||38===i?(t.preventDefault(),void o.previous()):39===i||40===i?(t.preventDefault(),void o.next()):void o.trigger("afterKeydown",t,i)}),o.group[o.currIndex].opts.idleTime&&(o.idleSecondsCounter=0,r.on("mousemove.fb-idle mouseenter.fb-idle mouseleave.fb-idle mousedown.fb-idle touchstart.fb-idle touchmove.fb-idle scroll.fb-idle keydown.fb-idle",function(){o.idleSecondsCounter=0,o.isIdle&&o.showControls(),o.isIdle=!1}),o.idleInterval=t.setInterval(function(){o.idleSecondsCounter++,o.idleSecondsCounter>=o.group[o.currIndex].opts.idleTime&&(o.isIdle=!0,o.idleSecondsCounter=0,o.hideControls())},1e3))},removeEvents:function(){var e=this;s.off("orientationchange.fb resize.fb"),r.off("focusin.fb keydown.fb .fb-idle"),this.$refs.container.off(".fb-close .fb-prev .fb-next"),e.idleInterval&&(t.clearInterval(e.idleInterval),e.idleInterval=null)},previous:function(t){return this.jumpTo(this.currPos-1,t)},next:function(t){return this.jumpTo(this.currPos+1,t)},jumpTo:function(t,e,i){var a,s,r,c,l,u,d,p=this,h=p.group.length;if(!(p.isSliding||p.isClosing||p.isAnimating&&p.firstRun)){if(t=parseInt(t,10),s=p.current?p.current.opts.loop:p.opts.loop,!s&&(t<0||t>=h))return!1;if(a=p.firstRun=null===p.firstRun,!(h<2&&!a&&p.isSliding)){if(c=p.current,p.prevIndex=p.currIndex,p.prevPos=p.currPos,r=p.createSlide(t),h>1&&((s||r.index>0)&&p.createSlide(t-1),(s||r.indexr.pos?"next":"previous"),c.$slide.removeClass("fancybox-slide--complete fancybox-slide--current fancybox-slide--next fancybox-slide--previous"),c.isComplete=!1,e&&(r.isMoved||r.opts.transitionEffect)&&(r.isMoved?c.$slide.addClass(d):(d="fancybox-animated "+d+" fancybox-fx-"+r.opts.transitionEffect,n.fancybox.animate(c.$slide,d,e,function(){c.$slide.removeClass(d).removeAttr("style")}))))}}},createSlide:function(t){var e,o,i=this;return o=t%i.group.length,o=o<0?i.group.length+o:o,!i.slides[t]&&i.group[o]&&(e=n('
').appendTo(i.$refs.stage),i.slides[t]=n.extend(!0,{},i.group[o],{pos:t,$slide:e,isLoaded:!1}),i.updateSlide(i.slides[t])),i.slides[t]},scaleToActual:function(t,e,i){var a,s,r,c,l,u=this,d=u.current,f=d.$content,p=parseInt(d.$slide.width(),10),h=parseInt(d.$slide.height(),10),g=d.width,b=d.height;"image"!=d.type||d.hasError||!f||u.isAnimating||(n.fancybox.stop(f),u.isAnimating=!0,t=t===o?.5*p:t,e=e===o?.5*h:e,a=n.fancybox.getTranslate(f),c=g/a.width,l=b/a.height,s=.5*p-.5*g,r=.5*h-.5*b,g>p&&(s=a.left*c-(t*c-t),s>0&&(s=0),sh&&(r=a.top*l-(e*l-e),r>0&&(r=0),rt.width||o.height>t.height))},isScaledDown:function(){var t=this,e=t.current,o=e.$content,i=!1;return o&&(i=n.fancybox.getTranslate(o),i=i.width1||Math.abs(n.height()-o.height)>1),o},loadSlide:function(t){var e,o,i,a=this;if(!t.isLoading&&!t.isLoaded){switch(t.isLoading=!0,a.trigger("beforeLoad",t),e=t.type,o=t.$slide,o.off("refresh").trigger("onReset").addClass("fancybox-slide--"+(e||"unknown")).addClass(t.opts.slideClass),e){case"image":a.setImage(t);break;case"iframe":a.setIframe(t);break;case"html":a.setContent(t,t.src||t.content);break;case"inline":n(t.src).length?a.setContent(t,n(t.src)):a.setError(t);break;case"ajax":a.showLoading(t),i=n.ajax(n.extend({},t.opts.ajax.settings,{url:t.src,success:function(e,n){"success"===n&&a.setContent(t,e)},error:function(e,n){e&&"abort"!==n&&a.setError(t)}})),o.one("onReset",function(){i.abort()});break;default:a.setError(t)}return!0}},setImage:function(e){var o,i,a,s,r=this,c=e.opts.image.srcset;if(c){a=t.devicePixelRatio||1,s=t.innerWidth*a,i=c.split(",").map(function(t){var e={};return t.trim().split(/\s+/).forEach(function(t,n){var o=parseInt(t.substring(0,t.length-1),10);return 0===n?e.url=t:void(o&&(e.value=o,e.postfix=t[t.length-1]))}),e}),i.sort(function(t,e){return t.value-e.value});for(var l=0;l=s||"x"===u.postfix&&u.value>=a){o=u;break}}!o&&i.length&&(o=i[i.length-1]),o&&(e.src=o.url,e.width&&e.height&&"w"==o.postfix&&(e.height=e.width/e.height*o.value,e.width=o.value))}e.$content=n('
').addClass("fancybox-is-hidden").appendTo(e.$slide),e.opts.preload!==!1&&e.opts.width&&e.opts.height&&(e.opts.thumb||e.opts.$thumb)?(e.width=e.opts.width,e.height=e.opts.height,e.$ghost=n("").one("error",function(){n(this).remove(),e.$ghost=null,r.setBigImage(e)}).one("load",function(){r.afterLoad(e),r.setBigImage(e)}).addClass("fancybox-image").appendTo(e.$content).attr("src",e.opts.thumb||e.opts.$thumb.attr("src"))):r.setBigImage(e)},setBigImage:function(t){var e=this,o=n("");t.$image=o.one("error",function(){e.setError(t)}).one("load",function(){clearTimeout(t.timouts),t.timouts=null,e.isClosing||(t.width=this.naturalWidth,t.height=this.naturalHeight,t.opts.image.srcset&&o.attr("sizes","100vw").attr("srcset",t.opts.image.srcset),e.hideLoading(t),t.$ghost?t.timouts=setTimeout(function(){t.timouts=null,t.$ghost.hide()},Math.min(300,Math.max(1e3,t.height/1600))):e.afterLoad(t))}).addClass("fancybox-image").attr("src",t.src).appendTo(t.$content),o[0].complete?o.trigger("load"):o[0].error?o.trigger("error"):t.timouts=setTimeout(function(){o[0].complete||t.hasError||e.showLoading(t)},100)},setIframe:function(t){var e,i=this,a=t.opts.iframe,s=t.$slide;t.$content=n('
').css(a.css).appendTo(s),e=n(a.tpl.replace(/\{rnd\}/g,(new Date).getTime())).attr(a.attr).appendTo(t.$content),a.preload?(i.showLoading(t),e.on("load.fb error.fb",function(e){this.isReady=1,t.$slide.trigger("refresh"),i.afterLoad(t)}),s.on("refresh.fb",function(){var n,i,s,r=t.$content,c=a.css.width,l=a.css.height;if(1===e[0].isReady){try{i=e.contents(),s=i.find("body")}catch(t){}s&&s.length&&(c===o&&(n=e[0].contentWindow.document.documentElement.scrollWidth,c=Math.ceil(s.outerWidth(!0)+(r.width()-n)),c+=r.outerWidth()-r.innerWidth()),l===o&&(l=Math.ceil(s.outerHeight(!0)),l+=r.outerHeight()-r.innerHeight()),c&&r.width(c),l&&r.height(l)),r.removeClass("fancybox-is-hidden")}})):this.afterLoad(t),e.attr("src",t.src),t.opts.smallBtn===!0&&t.$content.prepend(i.translate(t,t.opts.btnTpl.smallBtn)),s.one("onReset",function(){try{n(this).find("iframe").hide().attr("src","//about:blank")}catch(t){}n(this).empty(),t.isLoaded=!1})},setContent:function(t,e){var o=this;o.isClosing||(o.hideLoading(t),t.$slide.empty(),l(e)&&e.parent().length?(e.parent(".fancybox-slide--inline").trigger("onReset"),t.$placeholder=n("
").hide().insertAfter(e),e.css("display","inline-block")):t.hasError||("string"===n.type(e)&&(e=n("
").append(n.trim(e)).contents(),3===e[0].nodeType&&(e=n("
").html(e))),t.opts.filter&&(e=n("
").html(e).find(t.opts.filter))),t.$slide.one("onReset",function(){t.$placeholder&&(t.$placeholder.after(e.hide()).remove(),t.$placeholder=null),t.$smallBtn&&(t.$smallBtn.remove(),t.$smallBtn=null),t.hasError||(n(this).empty(),t.isLoaded=!1)}),t.$content=n(e).appendTo(t.$slide),t.opts.smallBtn&&!t.$smallBtn&&(t.$smallBtn=n(o.translate(t,t.opts.btnTpl.smallBtn)).appendTo(t.$content.filter("div").first())),this.afterLoad(t))},setError:function(t){t.hasError=!0,t.$slide.removeClass("fancybox-slide--"+t.type),this.setContent(t,this.translate(t,t.opts.errorTpl))},showLoading:function(t){var e=this;t=t||e.current,t&&!t.$spinner&&(t.$spinner=n(e.opts.spinnerTpl).appendTo(t.$slide))},hideLoading:function(t){var e=this;t=t||e.current,t&&t.$spinner&&(t.$spinner.remove(),delete t.$spinner)},afterLoad:function(t){var e=this;e.isClosing||(t.isLoading=!1,t.isLoaded=!0,e.trigger("afterLoad",t),e.hideLoading(t),t.opts.protect&&t.$content&&!t.hasError&&(t.$content.on("contextmenu.fb",function(t){return 2==t.button&&t.preventDefault(),!0}),"image"===t.type&&n('
').appendTo(t.$content)),e.revealContent(t))},revealContent:function(t){var e,i,a,s,r,c=this,l=t.$slide,u=!1;return e=t.opts[c.firstRun?"animationEffect":"transitionEffect"],a=t.opts[c.firstRun?"animationDuration":"transitionDuration"],a=parseInt(t.forcedDuration===o?a:t.forcedDuration,10),!t.isMoved&&t.pos===c.currPos&&a||(e=!1),"zoom"!==e||t.pos===c.currPos&&a&&"image"===t.type&&!t.hasError&&(u=c.getThumbPos(t))||(e="fade"),"zoom"===e?(r=c.getFitPos(t),r.scaleX=r.width/u.width,r.scaleY=r.height/u.height,delete r.width,delete r.height,s=t.opts.zoomOpacity,"auto"==s&&(s=Math.abs(t.width/t.height-u.width/u.height)>.1),s&&(u.opacity=.1,r.opacity=1),n.fancybox.setTranslate(t.$content.removeClass("fancybox-is-hidden"),u),f(t.$content),void n.fancybox.animate(t.$content,r,a,function(){c.complete()})):(c.updateSlide(t),e?(n.fancybox.stop(l),i="fancybox-animated fancybox-slide--"+(t.pos>c.prevPos?"next":"previous")+" fancybox-fx-"+e,l.removeAttr("style").removeClass("fancybox-slide--current fancybox-slide--next fancybox-slide--previous").addClass(i),t.$content.removeClass("fancybox-is-hidden"),f(l),void n.fancybox.animate(l,"fancybox-slide--current",a,function(e){l.removeClass(i).removeAttr("style"),t.pos===c.currPos&&c.complete()},!0)):(f(l),t.$content.removeClass("fancybox-is-hidden"),void(t.pos===c.currPos&&c.complete())))},getThumbPos:function(o){var i,a=this,s=!1,r=function(e){for(var o,i=e[0],a=i.getBoundingClientRect(),s=[];null!==i.parentElement;)"hidden"!==n(i.parentElement).css("overflow")&&"auto"!==n(i.parentElement).css("overflow")||s.push(i.parentElement.getBoundingClientRect()),i=i.parentElement;return o=s.every(function(t){var e=Math.min(a.right,t.right)-Math.max(a.left,t.left),n=Math.min(a.bottom,t.bottom)-Math.max(a.top,t.top);return e>0&&n>0}),o&&a.bottom>0&&a.right>0&&a.left=t.currPos-1&&o.pos<=t.currPos+1?i[o.pos]=o:o&&(n.fancybox.stop(o.$slide),o.$slide.off().remove())}),t.slides=i,t.updateCursor(),t.trigger("afterShow"),(n(e.activeElement).is("[disabled]")||o.opts.autoFocus&&"image"!=o.type&&"iframe"!==o.type)&&t.focus())},preload:function(){var t,e,n=this;n.group.length<2||(t=n.slides[n.currPos+1],e=n.slides[n.currPos-1],t&&"image"===t.type&&n.loadSlide(t),e&&"image"===e.type&&n.loadSlide(e))},focus:function(){var t,e=this.current;this.isClosing||(e&&e.isComplete&&(t=e.$slide.find("input[autofocus]:enabled:visible:first"),t.length||(t=e.$slide.find("button,:input,[tabindex],a").filter(":enabled:visible:first"))),t=t&&t.length?t:this.$refs.container,t.focus())},activate:function(){var t=this;n(".fancybox-container").each(function(){var e=n(this).data("FancyBox");e&&e.uid!==t.uid&&!e.isClosing&&e.trigger("onDeactivate")}),t.current&&(t.$refs.container.index()>0&&t.$refs.container.prependTo(e.body),t.updateControls()),t.trigger("onActivate"),t.addEvents()},close:function(t,e){var o,i,a,s,r,c,l=this,f=l.current,p=function(){l.cleanUp(t)};return!l.isClosing&&(l.isClosing=!0,l.trigger("beforeClose",t)===!1?(l.isClosing=!1,u(function(){l.update()}),!1):(l.removeEvents(),f.timouts&&clearTimeout(f.timouts),a=f.$content,o=f.opts.animationEffect,i=n.isNumeric(e)?e:o?f.opts.animationDuration:0,f.$slide.off(d).removeClass("fancybox-slide--complete fancybox-slide--next fancybox-slide--previous fancybox-animated"),f.$slide.siblings().trigger("onReset").remove(),i&&l.$refs.container.removeClass("fancybox-is-open").addClass("fancybox-is-closing"),l.hideLoading(f),l.hideControls(),l.updateCursor(),"zoom"!==o||t!==!0&&a&&i&&"image"===f.type&&!f.hasError&&(c=l.getThumbPos(f))||(o="fade"),"zoom"===o?(n.fancybox.stop(a),r=n.fancybox.getTranslate(a),r.width=r.width*r.scaleX,r.height=r.height*r.scaleY,s=f.opts.zoomOpacity,"auto"==s&&(s=Math.abs(f.width/f.height-c.width/c.height)>.1),s&&(c.opacity=0),r.scaleX=r.width/c.width,r.scaleY=r.height/c.height,r.width=c.width,r.height=c.height,n.fancybox.setTranslate(f.$content,r),n.fancybox.animate(f.$content,c,i,p),!0):(o&&i?t===!0?setTimeout(p,i):n.fancybox.animate(f.$slide.removeClass("fancybox-slide--current"),"fancybox-animated fancybox-slide--previous fancybox-fx-"+o,i,p):p(),!0)))},cleanUp:function(t){var e,o=this;o.current.$slide.trigger("onReset"),o.$refs.container.empty().remove(),o.trigger("afterClose",t),o.$lastFocus&&o.current.opts.backFocus&&o.$lastFocus.focus(),o.current=null,e=n.fancybox.getInstance(),e?e.activate():(s.scrollTop(o.scrollTop).scrollLeft(o.scrollLeft),n("html").removeClass("fancybox-enabled"),n("#fancybox-style-noscroll").remove())},trigger:function(t,e){var o,i=Array.prototype.slice.call(arguments,1),a=this,s=e&&e.opts?e:a.current;return s?i.unshift(s):s=a,i.unshift(a),n.isFunction(s.opts[t])&&(o=s.opts[t].apply(s,i)),o===!1?o:void("afterClose"===t?r.trigger(t+".fb",i):a.$refs.container.trigger(t+".fb",i))},updateControls:function(t){var e=this,o=e.current,i=o.index,a=o.opts,s=a.caption,r=e.$refs.caption;o.$slide.trigger("refresh"),e.$caption=s&&s.length?r.html(s):null,e.isHiddenControls||e.showControls(),n("[data-fancybox-count]").html(e.group.length),n("[data-fancybox-index]").html(i+1),n("[data-fancybox-prev]").prop("disabled",!a.loop&&i<=0),n("[data-fancybox-next]").prop("disabled",!a.loop&&i>=e.group.length-1)},hideControls:function(){this.isHiddenControls=!0,this.$refs.container.removeClass("fancybox-show-infobar fancybox-show-toolbar fancybox-show-caption fancybox-show-nav")},showControls:function(){var t=this,e=t.current?t.current.opts:t.opts,n=t.$refs.container;t.isHiddenControls=!1,t.idleSecondsCounter=0,n.toggleClass("fancybox-show-toolbar",!(!e.toolbar||!e.buttons)).toggleClass("fancybox-show-infobar",!!(e.infobar&&t.group.length>1)).toggleClass("fancybox-show-nav",!!(e.arrows&&t.group.length>1)).toggleClass("fancybox-is-modal",!!e.modal),t.$caption?n.addClass("fancybox-show-caption "):n.removeClass("fancybox-show-caption")},toggleControls:function(){this.isHiddenControls?this.showControls():this.hideControls()}}),n.fancybox={version:"3.1.26",defaults:a,getInstance:function(t){var e=n('.fancybox-container:not(".fancybox-is-closing"):first').data("FancyBox"),o=Array.prototype.slice.call(arguments,1);return e instanceof p&&("string"===n.type(t)?e[t].apply(e,o):"function"===n.type(t)&&t.apply(e,o),e)},open:function(t,e,n){return new p(t,e,n)},close:function(t){var e=this.getInstance();e&&(e.close(),t===!0&&this.close())},destroy:function(){this.close(!0),r.off("click.fb-start")},isMobile:e.createTouch!==o&&/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent),use3d:function(){var n=e.createElement("div");return t.getComputedStyle&&t.getComputedStyle(n).getPropertyValue("transform")&&!(e.documentMode&&e.documentMode<11)}(),getTranslate:function(t){var e;if(!t||!t.length)return!1;if(e=t.eq(0).css("transform"),e&&e.indexOf("matrix")!==-1?(e=e.split("(")[1],e=e.split(")")[0],e=e.split(",")):e=[],e.length)e=e.length>10?[e[13],e[12],e[0],e[5]]:[e[5],e[4],e[0],e[3]],e=e.map(parseFloat);else{e=[0,0,1,1];var n=/\.*translate\((.*)px,(.*)px\)/i,o=n.exec(t.eq(0).attr("style"));o&&(e[0]=parseFloat(o[2]),e[1]=parseFloat(o[1]))}return{top:e[0],left:e[1],scaleX:e[2],scaleY:e[3],opacity:parseFloat(t.css("opacity")),width:t.width(),height:t.height()}},setTranslate:function(t,e){var n="",i={};if(t&&e)return e.left===o&&e.top===o||(n=(e.left===o?t.position().left:e.left)+"px, "+(e.top===o?t.position().top:e.top)+"px",n=this.use3d?"translate3d("+n+", 0px)":"translate("+n+")"),e.scaleX!==o&&e.scaleY!==o&&(n=(n.length?n+" ":"")+"scale("+e.scaleX+", "+e.scaleY+")"),n.length&&(i.transform=n),e.opacity!==o&&(i.opacity=e.opacity),e.width!==o&&(i.width=e.width),e.height!==o&&(i.height=e.height),t.css(i)},animate:function(t,e,i,a,s){var r=d||"transitionend";n.isFunction(i)&&(a=i,i=null),n.isPlainObject(e)||t.removeAttr("style"),t.on(r,function(i){(!i||!i.originalEvent||t.is(i.originalEvent.target)&&"z-index"!=i.originalEvent.propertyName)&&(t.off(r),n.isPlainObject(e)?e.scaleX!==o&&e.scaleY!==o&&(t.css("transition-duration","0ms"),e.width=Math.round(t.width()*e.scaleX),e.height=Math.round(t.height()*e.scaleY),e.scaleX=1,e.scaleY=1,n.fancybox.setTranslate(t,e)):s!==!0&&t.removeClass(e),n.isFunction(a)&&a(i))}),n.isNumeric(i)&&t.css("transition-duration",i+"ms"),n.isPlainObject(e)?n.fancybox.setTranslate(t,e):t.addClass(e),t.data("timer",setTimeout(function(){t.trigger("transitionend")},i+16))},stop:function(t){clearTimeout(t.data("timer")),t.off(d)}},n.fn.fancybox=function(t){var e;return t=t||{},e=t.selector||!1,e?n("body").off("click.fb-start",e).on("click.fb-start",e,{options:t},i):this.off("click.fb-start").on("click.fb-start",{items:this,options:t},i),this},r.on("click.fb-start","[data-fancybox]",i)}}(window,document,window.jQuery||jQuery),function(t){"use strict";var e=function(e,n,o){if(e)return o=o||"","object"===t.type(o)&&(o=t.param(o,!0)),t.each(n,function(t,n){e=e.replace("$"+t,n||"")}),o.length&&(e+=(e.indexOf("?")>0?"&":"?")+o),e},n={youtube:{matcher:/(youtube\.com|youtu\.be|youtube\-nocookie\.com)\/(watch\?(.*&)?v=|v\/|u\/|embed\/?)?(videoseries\?list=(.*)|[\w-]{11}|\?listType=(.*)&list=(.*))(.*)/i,params:{autoplay:1,autohide:1,fs:1,rel:0,hd:1,wmode:"transparent",enablejsapi:1,html5:1},paramPlace:8,type:"iframe",url:"//www.youtube.com/embed/$4",thumb:"//img.youtube.com/vi/$4/hqdefault.jpg"},vimeo:{matcher:/^.+vimeo.com\/(.*\/)?([\d]+)(.*)?/,params:{autoplay:1,hd:1,show_title:1,show_byline:1,show_portrait:0,fullscreen:1,api:1},paramPlace:3,type:"iframe",url:"//player.vimeo.com/video/$2"},metacafe:{matcher:/metacafe.com\/watch\/(\d+)\/(.*)?/,type:"iframe",url:"//www.metacafe.com/embed/$1/?ap=1"},dailymotion:{matcher:/dailymotion.com\/video\/(.*)\/?(.*)/,params:{additionalInfos:0,autoStart:1},type:"iframe",url:"//www.dailymotion.com/embed/video/$1"},vine:{matcher:/vine.co\/v\/([a-zA-Z0-9\?\=\-]+)/,type:"iframe",url:"//vine.co/v/$1/embed/simple"},instagram:{matcher:/(instagr\.am|instagram\.com)\/p\/([a-zA-Z0-9_\-]+)\/?/i,type:"image",url:"//$1/p/$2/media/?size=l"},gmap_place:{matcher:/(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(((maps\/(place\/(.*)\/)?\@(.*),(\d+.?\d+?)z))|(\?ll=))(.*)?/i,type:"iframe",url:function(t){return"//maps.google."+t[2]+"/?ll="+(t[9]?t[9]+"&z="+Math.floor(t[10])+(t[12]?t[12].replace(/^\//,"&"):""):t[12])+"&output="+(t[12]&&t[12].indexOf("layer=c")>0?"svembed":"embed")}},gmap_search:{matcher:/(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(maps\/search\/)(.*)/i,type:"iframe",url:function(t){return"//maps.google."+t[2]+"/maps?q="+t[5].replace("query=","q=").replace("api=1","")+"&output=embed"}}};t(document).on("onInit.fb",function(o,i){t.each(i.group,function(o,i){var a,s,r,c,l,u,d,f=i.src||"",p=!1;i.type||(a=t.extend(!0,{},n,i.opts.media),t.each(a,function(n,o){if(r=f.match(o.matcher),u={},d=n,r){if(p=o.type,o.paramPlace&&r[o.paramPlace]){l=r[o.paramPlace],"?"==l[0]&&(l=l.substring(1)),l=l.split("&");for(var a=0;ae.clientHeight,a=("scroll"===o||"auto"===o)&&e.scrollWidth>e.clientWidth;return i||a},l=function(t){for(var e=!1;;){if(e=c(t.get(0)))break;if(t=t.parent(),!t.length||t.hasClass("fancybox-stage")||t.is("body"))break}return e},u=function(t){var e=this;e.instance=t,e.$bg=t.$refs.bg,e.$stage=t.$refs.stage,e.$container=t.$refs.container,e.destroy(),e.$container.on("touchstart.fb.touch mousedown.fb.touch",n.proxy(e,"ontouchstart"))};u.prototype.destroy=function(){this.$container.off(".fb.touch")},u.prototype.ontouchstart=function(o){var i=this,c=n(o.target),u=i.instance,d=u.current,f=d.$content,p="touchstart"==o.type;if(p&&i.$container.off("mousedown.fb.touch"),!d||i.instance.isAnimating||i.instance.isClosing)return o.stopPropagation(),void o.preventDefault();if((!o.originalEvent||2!=o.originalEvent.button)&&c.length&&!r(c)&&!r(c.parent())&&!(o.originalEvent.clientX>c[0].clientWidth+c.offset().left)&&(i.startPoints=a(o),i.startPoints&&!(i.startPoints.length>1&&u.isSliding))){if(i.$target=c,i.$content=f,i.canTap=!0,n(e).off(".fb.touch"),n(e).on(p?"touchend.fb.touch touchcancel.fb.touch":"mouseup.fb.touch mouseleave.fb.touch",n.proxy(i,"ontouchend")),n(e).on(p?"touchmove.fb.touch":"mousemove.fb.touch",n.proxy(i,"ontouchmove")),!u.current.opts.touch&&!u.canPan()||!c.is(i.$stage)&&!i.$stage.find(c).length)return void(c.is("img")&&o.preventDefault());o.stopPropagation(),n.fancybox.isMobile&&(l(i.$target)||l(i.$target.parent()))||o.preventDefault(),i.canvasWidth=Math.round(d.$slide[0].clientWidth),i.canvasHeight=Math.round(d.$slide[0].clientHeight),i.startTime=(new Date).getTime(),i.distanceX=i.distanceY=i.distance=0,i.isPanning=!1,i.isSwiping=!1,i.isZooming=!1,i.sliderStartPos=i.sliderLastPos||{top:0,left:0},i.contentStartPos=n.fancybox.getTranslate(i.$content),i.contentLastPos=null,1!==i.startPoints.length||i.isZooming||(i.canTap=!u.isSliding,"image"===d.type&&(i.contentStartPos.width>i.canvasWidth+1||i.contentStartPos.height>i.canvasHeight+1)?(n.fancybox.stop(i.$content),i.$content.css("transition-duration","0ms"),i.isPanning=!0):i.isSwiping=!0,i.$container.addClass("fancybox-controls--isGrabbing")),2!==i.startPoints.length||u.isAnimating||d.hasError||"image"!==d.type||!d.isLoaded&&!d.$ghost||(i.isZooming=!0,i.isSwiping=!1,i.isPanning=!1,n.fancybox.stop(i.$content),i.$content.css("transition-duration","0ms"),i.centerPointStartX=.5*(i.startPoints[0].x+i.startPoints[1].x)-n(t).scrollLeft(),i.centerPointStartY=.5*(i.startPoints[0].y+i.startPoints[1].y)-n(t).scrollTop(),i.percentageOfImageAtPinchPointX=(i.centerPointStartX-i.contentStartPos.left)/i.contentStartPos.width,i.percentageOfImageAtPinchPointY=(i.centerPointStartY-i.contentStartPos.top)/i.contentStartPos.height,i.startDistanceBetweenFingers=s(i.startPoints[0],i.startPoints[1]))}},u.prototype.ontouchmove=function(t){var e=this;if(e.newPoints=a(t),n.fancybox.isMobile&&(l(e.$target)||l(e.$target.parent())))return t.stopPropagation(),void(e.canTap=!1);if((e.instance.current.opts.touch||e.instance.canPan())&&e.newPoints&&e.newPoints.length&&(e.distanceX=s(e.newPoints[0],e.startPoints[0],"x"),e.distanceY=s(e.newPoints[0],e.startPoints[0],"y"),e.distance=s(e.newPoints[0],e.startPoints[0]),e.distance>0)){if(!e.$target.is(e.$stage)&&!e.$stage.find(e.$target).length)return;t.stopPropagation(),t.preventDefault(),e.isSwiping?e.onSwipe():e.isPanning?e.onPan():e.isZooming&&e.onZoom()}},u.prototype.onSwipe=function(){var e,a=this,s=a.isSwiping,r=a.sliderStartPos.left||0;s===!0?Math.abs(a.distance)>10&&(a.canTap=!1,a.instance.group.length<2&&a.instance.opts.touch.vertical?a.isSwiping="y":a.instance.isSliding||a.instance.opts.touch.vertical===!1||"auto"===a.instance.opts.touch.vertical&&n(t).width()>800?a.isSwiping="x":(e=Math.abs(180*Math.atan2(a.distanceY,a.distanceX)/Math.PI),a.isSwiping=e>45&&e<135?"y":"x"),a.instance.isSliding=a.isSwiping,a.startPoints=a.newPoints,n.each(a.instance.slides,function(t,e){n.fancybox.stop(e.$slide),e.$slide.css("transition-duration","0ms"),e.inTransition=!1,e.pos===a.instance.current.pos&&(a.sliderStartPos.left=n.fancybox.getTranslate(e.$slide).left)}),a.instance.SlideShow&&a.instance.SlideShow.isActive&&a.instance.SlideShow.stop()):("x"==s&&(a.distanceX>0&&(a.instance.group.length<2||0===a.instance.current.index&&!a.instance.current.opts.loop)?r+=Math.pow(a.distanceX,.8):a.distanceX<0&&(a.instance.group.length<2||a.instance.current.index===a.instance.group.length-1&&!a.instance.current.opts.loop)?r-=Math.pow(-a.distanceX,.8):r+=a.distanceX),a.sliderLastPos={top:"x"==s?0:a.sliderStartPos.top+a.distanceY,left:r},a.requestId&&(i(a.requestId),a.requestId=null),a.requestId=o(function(){a.sliderLastPos&&(n.each(a.instance.slides,function(t,e){var o=e.pos-a.instance.currPos;n.fancybox.setTranslate(e.$slide,{top:a.sliderLastPos.top,left:a.sliderLastPos.left+o*a.canvasWidth+o*e.opts.gutter})}),a.$container.addClass("fancybox-is-sliding"))}))},u.prototype.onPan=function(){var t,e,a,s=this;s.canTap=!1,t=s.contentStartPos.width>s.canvasWidth?s.contentStartPos.left+s.distanceX:s.contentStartPos.left,e=s.contentStartPos.top+s.distanceY,a=s.limitMovement(t,e,s.contentStartPos.width,s.contentStartPos.height),a.scaleX=s.contentStartPos.scaleX,a.scaleY=s.contentStartPos.scaleY,s.contentLastPos=a,s.requestId&&(i(s.requestId),s.requestId=null),s.requestId=o(function(){n.fancybox.setTranslate(s.$content,s.contentLastPos)})},u.prototype.limitMovement=function(t,e,n,o){var i,a,s,r,c=this,l=c.canvasWidth,u=c.canvasHeight,d=c.contentStartPos.left,f=c.contentStartPos.top,p=c.distanceX,h=c.distanceY;return i=Math.max(0,.5*l-.5*n),a=Math.max(0,.5*u-.5*o),s=Math.min(l-n,.5*l-.5*n),r=Math.min(u-o,.5*u-.5*o),n>l&&(p>0&&t>i&&(t=i-1+Math.pow(-i+d+p,.8)||0),p<0&&tu&&(h>0&&e>a&&(e=a-1+Math.pow(-a+f+h,.8)||0),h<0&&ea?(t=t>0?0:t,t=ts?(e=e>0?0:e,e=e50?(n.fancybox.animate(e.instance.current.$slide,{top:e.sliderStartPos.top+e.distanceY+150*e.velocityY,opacity:0},150),o=e.instance.close(!0,300)):"x"==t&&e.distanceX>50&&e.instance.group.length>1?o=e.instance.previous(e.speedX):"x"==t&&e.distanceX<-50&&e.instance.group.length>1&&(o=e.instance.next(e.speedX)),o!==!1||"x"!=t&&"y"!=t||e.instance.jumpTo(e.instance.current.index,150),e.$container.removeClass("fancybox-is-sliding")},u.prototype.endPanning=function(){var t,e,o,i=this;i.contentLastPos&&(i.instance.current.opts.touch.momentum===!1?(t=i.contentLastPos.left,e=i.contentLastPos.top):(t=i.contentLastPos.left+i.velocityX*i.speed,e=i.contentLastPos.top+i.velocityY*i.speed),o=i.limitPosition(t,e,i.contentStartPos.width,i.contentStartPos.height),o.width=i.contentStartPos.width,o.height=i.contentStartPos.height,n.fancybox.animate(i.$content,o,330))},u.prototype.endZooming=function(){var t,e,o,i,a=this,s=a.instance.current,r=a.newWidth,c=a.newHeight;a.contentLastPos&&(t=a.contentLastPos.left,e=a.contentLastPos.top,i={top:e,left:t,width:r,height:c,scaleX:1,scaleY:1},n.fancybox.setTranslate(a.$content,i),rs.width||c>s.height?a.instance.scaleToActual(a.centerPointStartX,a.centerPointStartY,150):(o=a.limitPosition(t,e,r,c),n.fancybox.setTranslate(a.content,n.fancybox.getTranslate(a.$content)),n.fancybox.animate(a.$content,o,150)))},u.prototype.onTap=function(t){var e,o=this,i=n(t.target),s=o.instance,r=s.current,c=t&&a(t)||o.startPoints,l=c[0]?c[0].x-o.$stage.offset().left:0,u=c[0]?c[0].y-o.$stage.offset().top:0,d=function(e){var i=r.opts[e];if(n.isFunction(i)&&(i=i.apply(s,[r,t])),i)switch(i){case"close":s.close(o.startEvent);break;case"toggleControls":s.toggleControls(!0);break;case"next":s.next();break;case"nextOrClose":s.group.length>1?s.next():s.close(o.startEvent);break;case"zoom":"image"==r.type&&(r.isLoaded||r.$ghost)&&(s.canPan()?s.scaleToFit():s.isScaledDown()?s.scaleToActual(l,u):s.group.length<2&&s.close(o.startEvent))}};if(!(t.originalEvent&&2==t.originalEvent.button||s.isSliding||l>i[0].clientWidth+i.offset().left)){if(i.is(".fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-container"))e="Outside";else if(i.is(".fancybox-slide"))e="Slide";else{if(!s.current.$content||!s.current.$content.has(t.target).length)return;e="Content"}if(o.tapped){if(clearTimeout(o.tapped),o.tapped=null,Math.abs(l-o.tapX)>50||Math.abs(u-o.tapY)>50||s.isSliding)return this;d("dblclick"+e)}else o.tapX=l,o.tapY=u,r.opts["dblclick"+e]&&r.opts["dblclick"+e]!==r.opts["click"+e]?o.tapped=setTimeout(function(){o.tapped=null,d("click"+e)},300):d("click"+e);return this}},n(e).on("onActivate.fb",function(t,e){e&&!e.Guestures&&(e.Guestures=new u(e))}),n(e).on("beforeClose.fb",function(t,e){e&&e.Guestures&&e.Guestures.destroy()})}(window,document,window.jQuery),function(t,e){"use strict";var n=function(t){this.instance=t,this.init()};e.extend(n.prototype,{timer:null,isActive:!1,$button:null,speed:3e3,init:function(){var t=this;t.$button=t.instance.$refs.toolbar.find("[data-fancybox-play]").on("click",function(){t.toggle()}),(t.instance.group.length<2||!t.instance.group[t.instance.currIndex].opts.slideShow)&&t.$button.hide()},set:function(){var t=this;t.instance&&t.instance.current&&(t.instance.current.opts.loop||t.instance.currIndex1&&t.instance.group[t.instance.currIndex].opts.thumbs&&("image"==e.type||e.opts.thumb||e.opts.$thumb)&&("image"==n.type||n.opts.thumb||n.opts.$thumb)?(t.$button.on("click",function(){t.toggle()}),t.isActive=!0):(t.$button.hide(),t.isActive=!1)},create:function(){var t,n,o=this.instance;this.$grid=e('
').appendTo(o.$refs.container),t="
    ",e.each(o.group,function(e,o){n=o.opts.thumb||(o.opts.$thumb?o.opts.$thumb.attr("src"):null),n||"image"!==o.type||(n=o.src),n&&n.length&&(t+='
  • ')}),t+="
",this.$list=e(t).appendTo(this.$grid).on("click","li",function(){o.jumpTo(e(this).data("index"))}),this.$list.find("img").hide().one("load",function(){var t,n,o,i,a=e(this).parent().removeClass("fancybox-thumbs-loading"),s=a.outerWidth(),r=a.outerHeight();t=this.naturalWidth||this.width,n=this.naturalHeight||this.height,o=t/s,i=n/r,o>=1&&i>=1&&(o>i?(t/=i,n=r):(t=s,n/=o)),e(this).css({width:Math.floor(t),height:Math.floor(n),"margin-top":Math.min(0,Math.floor(.3*r-.3*n)),"margin-left":Math.min(0,Math.floor(.5*s-.5*t))}).show()}).each(function(){this.src=e(this).data("src")})},focus:function(){this.instance.current&&this.$list.children().removeClass("fancybox-thumbs-active").filter('[data-index="'+this.instance.current.index+'"]').addClass("fancybox-thumbs-active").focus()},close:function(){this.$grid.hide()},update:function(){this.instance.$refs.container.toggleClass("fancybox-show-thumbs",this.isVisible),this.isVisible?(this.$grid||this.create(),this.instance.trigger("onThumbsShow"),this.focus()):this.$grid&&this.instance.trigger("onThumbsHide"),this.instance.update()},hide:function(){this.isVisible=!1,this.update()},show:function(){this.isVisible=!0,this.update()},toggle:function(){this.isVisible=!this.isVisible,this.update()}}),e(t).on({"onInit.fb":function(t,e){e&&!e.Thumbs&&(e.Thumbs=new n(e))},"beforeShow.fb":function(t,e,n,o){var i=e&&e.Thumbs;if(i&&i.isActive){if(n.modal)return i.$button.hide(),void i.hide();o&&e.opts.thumbs.autoStart===!0&&i.show(),i.isVisible&&i.focus()}},"afterKeydown.fb":function(t,e,n,o,i){var a=e&&e.Thumbs;a&&a.isActive&&71===i&&(o.preventDefault(),a.toggle())},"beforeClose.fb":function(t,e){var n=e&&e.Thumbs;n&&n.isVisible&&e.opts.thumbs.hideOnClose!==!1&&n.close()}})}(document,window.jQuery),function(t,e,n){"use strict";function o(){var t=e.location.hash.substr(1),n=t.split("-"),o=n.length>1&&/^\+?\d+$/.test(n[n.length-1])?parseInt(n.pop(-1),10)||1:1,i=n.join("-");return o<1&&(o=1),{hash:t,index:o,gallery:i}}function i(t){var e;""!==t.gallery&&(e=n("[data-fancybox='"+n.escapeSelector(t.gallery)+"']").eq(t.index-1),e.length||(e=n("#"+n.escapeSelector(t.gallery))),e.length&&(s=!1,e.trigger("click")))}function a(t){var e;return!!t&&(e=t.current?t.current.opts:t.opts,e.hash||(e.$orig?e.$orig.data("fancybox"):""))}n.escapeSelector||(n.escapeSelector=function(t){var e=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\x80-\uFFFF\w-]/g,n=function(t,e){return e?"\0"===t?"�":t.slice(0,-1)+"\\"+t.charCodeAt(t.length-1).toString(16)+" ":"\\"+t};return(t+"").replace(e,n)});var s=!0,r=null,c=null;n(function(){setTimeout(function(){n.fancybox.defaults.hash!==!1&&(n(t).on({"onInit.fb":function(t,e){var n,i;e.group[e.currIndex].opts.hash!==!1&&(n=o(),i=a(e),i&&n.gallery&&i==n.gallery&&(e.currIndex=n.index-1))},"beforeShow.fb":function(n,o,i){var l;i&&i.opts.hash!==!1&&(l=a(o),l&&""!==l&&(e.location.hash.indexOf(l)<0&&(o.opts.origHash=e.location.hash),r=l+(o.group.length>1?"-"+(i.index+1):""),"replaceState"in e.history?(c&&clearTimeout(c),c=setTimeout(function(){e.history[s?"pushState":"replaceState"]({},t.title,e.location.pathname+e.location.search+"#"+r),c=null,s=!1},300)):e.location.hash=r))},"beforeClose.fb":function(o,i,s){var l,u;c&&clearTimeout(c),s.opts.hash!==!1&&(l=a(i),u=i&&i.opts.origHash?i.opts.origHash:"",l&&""!==l&&("replaceState"in history?e.history.replaceState({},t.title,e.location.pathname+e.location.search+u):(e.location.hash=u,n(e).scrollTop(i.scrollTop).scrollLeft(i.scrollLeft))),r=null)}}),n(e).on("hashchange.fb",function(){var t=o();n.fancybox.getInstance()?!r||r===t.gallery+"-"+t.index||1===t.index&&r==t.gallery||(r=null,n.fancybox.close()):""!==t.gallery&&i(t)}),i(o()))},50)})}(document,window,window.jQuery); \ No newline at end of file +!function(t,e,n,o){"use strict";function i(t){var e=t.currentTarget,o=t.data?t.data.options:{},i=o.selector?n(o.selector):t.data?t.data.items:[],a=n(e).attr("data-fancybox")||"",s=0,r=n.fancybox.getInstance();t.preventDefault(),t.stopPropagation(),r&&r.current.opts.$orig.is(e)||(a?(i=i.length?i.filter('[data-fancybox="'+a+'"]'):n('[data-fancybox="'+a+'"]'),s=i.index(e),s<0&&(s=0)):i=[e],n.fancybox.open(i,o,s))}if(n){if(n.fn.fancybox)return void n.error("fancyBox already initialized");var a={loop:!1,margin:[44,0],gutter:50,keyboard:!0,arrows:!0,infobar:!1,toolbar:!0,buttons:["slideShow","fullScreen","thumbs","close"],idleTime:4,smallBtn:"auto",protect:!1,modal:!1,image:{preload:"auto"},ajax:{settings:{data:{fancybox:!0}}},iframe:{tpl:'',preload:!0,css:{},attr:{scrolling:"auto"}},animationEffect:"zoom",animationDuration:366,zoomOpacity:"auto",transitionEffect:"fade",transitionDuration:366,slideClass:"",baseClass:"",baseTpl:'',spinnerTpl:'
',errorTpl:'

{{ERROR}}

',btnTpl:{slideShow:'',fullScreen:'',thumbs:'',close:'',smallBtn:''},parentEl:"body",autoFocus:!0,backFocus:!0,trapFocus:!0,fullScreen:{autoStart:!1},touch:{vertical:!0,momentum:!0},hash:null,media:{},slideShow:{autoStart:!1,speed:4e3},thumbs:{autoStart:!1,hideOnClose:!0},onInit:n.noop,beforeLoad:n.noop,afterLoad:n.noop,beforeShow:n.noop,afterShow:n.noop,beforeClose:n.noop,afterClose:n.noop,onActivate:n.noop,onDeactivate:n.noop,clickContent:function(t,e){return"image"===t.type&&"zoom"},clickSlide:"close",clickOutside:"close",dblclickContent:!1,dblclickSlide:!1,dblclickOutside:!1,mobile:{clickContent:function(t,e){return"image"===t.type&&"toggleControls"},clickSlide:function(t,e){return"image"===t.type?"toggleControls":"close"},dblclickContent:function(t,e){return"image"===t.type&&"zoom"},dblclickSlide:function(t,e){return"image"===t.type&&"zoom"}},lang:"en",i18n:{en:{CLOSE:"Close",NEXT:"Next",PREV:"Previous",ERROR:"The requested content cannot be loaded.
Please try again later.",PLAY_START:"Start slideshow",PLAY_STOP:"Pause slideshow",FULL_SCREEN:"Full screen",THUMBS:"Thumbnails"},de:{CLOSE:"Schliessen",NEXT:"Weiter",PREV:"Zurück",ERROR:"Die angeforderten Daten konnten nicht geladen werden.
Bitte versuchen Sie es später nochmal.",PLAY_START:"Diaschau starten",PLAY_STOP:"Diaschau beenden",FULL_SCREEN:"Vollbild",THUMBS:"Vorschaubilder"}}},s=n(t),r=n(e),c=0,l=function(t){return t&&t.hasOwnProperty&&t instanceof n},u=function(){return t.requestAnimationFrame||t.webkitRequestAnimationFrame||t.mozRequestAnimationFrame||t.oRequestAnimationFrame||function(e){return t.setTimeout(e,1e3/60)}}(),d=function(){var t,n=e.createElement("fakeelement"),i={transition:"transitionend",OTransition:"oTransitionEnd",MozTransition:"transitionend",WebkitTransition:"webkitTransitionEnd"};for(t in i)if(n.style[t]!==o)return i[t]}(),f=function(t){return t&&t.length&&t[0].offsetHeight},p=function(t,o,i){var s=this;s.opts=n.extend(!0,{index:i},a,o||{}),o&&n.isArray(o.buttons)&&(s.opts.buttons=o.buttons),s.id=s.opts.id||++c,s.group=[],s.currIndex=parseInt(s.opts.index,10)||0,s.prevIndex=null,s.prevPos=null,s.currPos=0,s.firstRun=null,s.createGroup(t),s.group.length&&(s.$lastFocus=n(e.activeElement).blur(),s.slides={},s.init(t))};n.extend(p.prototype,{init:function(){var t,e,o,i=this,a=i.group[i.currIndex].opts;i.scrollTop=r.scrollTop(),i.scrollLeft=r.scrollLeft(),n.fancybox.getInstance()||n.fancybox.isMobile||"hidden"===n("body").css("overflow")||(t=n("body").width(),n("html").addClass("fancybox-enabled"),t=n("body").width()-t,t>1&&n("head").append('")),o="",n.each(a.buttons,function(t,e){o+=a.btnTpl[e]||""}),e=n(i.translate(i,a.baseTpl.replace("{{BUTTONS}}",o))).addClass("fancybox-is-hidden").attr("id","fancybox-container-"+i.id).addClass(a.baseClass).data("FancyBox",i).prependTo(a.parentEl),i.$refs={container:e},["bg","inner","infobar","toolbar","stage","caption"].forEach(function(t){i.$refs[t]=e.find(".fancybox-"+t)}),(!a.arrows||i.group.length<2)&&e.find(".fancybox-navigation").remove(),a.infobar||i.$refs.infobar.remove(),a.toolbar||i.$refs.toolbar.remove(),i.trigger("onInit"),i.activate(),i.jumpTo(i.currIndex)},translate:function(t,e){var n=t.opts.i18n[t.opts.lang];return e.replace(/\{\{(\w+)\}\}/g,function(t,e){var i=n[e];return i===o?t:i})},createGroup:function(t){var e=this,i=n.makeArray(t);n.each(i,function(t,i){var a,s,r,c,l={},u={},d=[];n.isPlainObject(i)?(l=i,u=i.opts||i):"object"===n.type(i)&&n(i).length?(a=n(i),d=a.data(),u="options"in d?d.options:{},u="object"===n.type(u)?u:{},l.src="src"in d?d.src:u.src||a.attr("href"),["width","height","thumb","type","filter"].forEach(function(t){t in d&&(u[t]=d[t])}),"srcset"in d&&(u.image={srcset:d.srcset}),u.$orig=a,l.type||l.src||(l.type="inline",l.src=i)):l={type:"html",src:i+""},l.opts=n.extend(!0,{},e.opts,u),n.fancybox.isMobile&&(l.opts=n.extend(!0,{},l.opts,l.opts.mobile)),s=l.type||l.opts.type,r=l.src||"",!s&&r&&(r.match(/(^data:image\/[a-z0-9+\/=]*,)|(\.(jp(e|g|eg)|gif|png|bmp|webp|svg|ico)((\?|#).*)?$)/i)?s="image":r.match(/\.(pdf)((\?|#).*)?$/i)?s="pdf":"#"===r.charAt(0)&&(s="inline")),l.type=s,l.index=e.group.length,l.opts.$orig&&!l.opts.$orig.length&&delete l.opts.$orig,!l.opts.$thumb&&l.opts.$orig&&(l.opts.$thumb=l.opts.$orig.find("img:first")),l.opts.$thumb&&!l.opts.$thumb.length&&delete l.opts.$thumb,"function"===n.type(l.opts.caption)?l.opts.caption=l.opts.caption.apply(i,[e,l]):"caption"in d&&(l.opts.caption=d.caption),l.opts.caption=l.opts.caption===o?"":l.opts.caption+"","ajax"===s&&(c=r.split(/\s+/,2),c.length>1&&(l.src=c.shift(),l.opts.filter=c.shift())),"auto"==l.opts.smallBtn&&(n.inArray(s,["html","inline","ajax"])>-1?(l.opts.toolbar=!1,l.opts.smallBtn=!0):l.opts.smallBtn=!1),"pdf"===s&&(l.type="iframe",l.opts.iframe.preload=!1),l.opts.modal&&(l.opts=n.extend(!0,l.opts,{infobar:0,toolbar:0,smallBtn:0,keyboard:0,slideShow:0,fullScreen:0,thumbs:0,touch:0,clickContent:!1,clickSlide:!1,clickOutside:!1,dblclickContent:!1,dblclickSlide:!1,dblclickOutside:!1})),e.group.push(l)})},addEvents:function(){var o=this;o.removeEvents(),o.$refs.container.on("click.fb-close","[data-fancybox-close]",function(t){t.stopPropagation(),t.preventDefault(),o.close(t)}).on("click.fb-prev touchend.fb-prev","[data-fancybox-prev]",function(t){t.stopPropagation(),t.preventDefault(),o.previous()}).on("click.fb-next touchend.fb-next","[data-fancybox-next]",function(t){t.stopPropagation(),t.preventDefault(),o.next()}),s.on("orientationchange.fb resize.fb",function(t){t&&t.originalEvent&&"resize"===t.originalEvent.type?u(function(){o.update()}):(o.$refs.stage.hide(),setTimeout(function(){o.$refs.stage.show(),o.update()},500))}),r.on("focusin.fb",function(t){var i=n.fancybox?n.fancybox.getInstance():null;i.isClosing||!i.current||!i.current.opts.trapFocus||n(t.target).hasClass("fancybox-container")||n(t.target).is(e)||i&&"fixed"!==n(t.target).css("position")&&!i.$refs.container.has(t.target).length&&(t.stopPropagation(),i.focus(),s.scrollTop(o.scrollTop).scrollLeft(o.scrollLeft))}),r.on("keydown.fb",function(t){var e=o.current,i=t.keyCode||t.which;if(e&&e.opts.keyboard&&!n(t.target).is("input")&&!n(t.target).is("textarea"))return 8===i||27===i?(t.preventDefault(),void o.close(t)):37===i||38===i?(t.preventDefault(),void o.previous()):39===i||40===i?(t.preventDefault(),void o.next()):void o.trigger("afterKeydown",t,i)}),o.group[o.currIndex].opts.idleTime&&(o.idleSecondsCounter=0,r.on("mousemove.fb-idle mouseenter.fb-idle mouseleave.fb-idle mousedown.fb-idle touchstart.fb-idle touchmove.fb-idle scroll.fb-idle keydown.fb-idle",function(){o.idleSecondsCounter=0,o.isIdle&&o.showControls(),o.isIdle=!1}),o.idleInterval=t.setInterval(function(){o.idleSecondsCounter++,o.idleSecondsCounter>=o.group[o.currIndex].opts.idleTime&&(o.isIdle=!0,o.idleSecondsCounter=0,o.hideControls())},1e3))},removeEvents:function(){var e=this;s.off("orientationchange.fb resize.fb"),r.off("focusin.fb keydown.fb .fb-idle"),this.$refs.container.off(".fb-close .fb-prev .fb-next"),e.idleInterval&&(t.clearInterval(e.idleInterval),e.idleInterval=null)},previous:function(t){return this.jumpTo(this.currPos-1,t)},next:function(t){return this.jumpTo(this.currPos+1,t)},jumpTo:function(t,e,i){var a,s,r,c,l,u,d,p=this,h=p.group.length;if(!(p.isSliding||p.isClosing||p.isAnimating&&p.firstRun)){if(t=parseInt(t,10),s=p.current?p.current.opts.loop:p.opts.loop,!s&&(t<0||t>=h))return!1;if(a=p.firstRun=null===p.firstRun,!(h<2&&!a&&p.isSliding)){if(c=p.current,p.prevIndex=p.currIndex,p.prevPos=p.currPos,r=p.createSlide(t),h>1&&((s||r.index>0)&&p.createSlide(t-1),(s||r.indexr.pos?"next":"previous"),c.$slide.removeClass("fancybox-slide--complete fancybox-slide--current fancybox-slide--next fancybox-slide--previous"),c.isComplete=!1,e&&(r.isMoved||r.opts.transitionEffect)&&(r.isMoved?c.$slide.addClass(d):(d="fancybox-animated "+d+" fancybox-fx-"+r.opts.transitionEffect,n.fancybox.animate(c.$slide,d,e,function(){c.$slide.removeClass(d).removeAttr("style")}))))}}},createSlide:function(t){var e,o,i=this;return o=t%i.group.length,o=o<0?i.group.length+o:o,!i.slides[t]&&i.group[o]&&(e=n('
').appendTo(i.$refs.stage),i.slides[t]=n.extend(!0,{},i.group[o],{pos:t,$slide:e,isLoaded:!1}),i.updateSlide(i.slides[t])),i.slides[t]},scaleToActual:function(t,e,i){var a,s,r,c,l,u=this,d=u.current,f=d.$content,p=parseInt(d.$slide.width(),10),h=parseInt(d.$slide.height(),10),g=d.width,b=d.height;"image"!=d.type||d.hasError||!f||u.isAnimating||(n.fancybox.stop(f),u.isAnimating=!0,t=t===o?.5*p:t,e=e===o?.5*h:e,a=n.fancybox.getTranslate(f),c=g/a.width,l=b/a.height,s=.5*p-.5*g,r=.5*h-.5*b,g>p&&(s=a.left*c-(t*c-t),s>0&&(s=0),sh&&(r=a.top*l-(e*l-e),r>0&&(r=0),rt.width||o.height>t.height))},isScaledDown:function(){var t=this,e=t.current,o=e.$content,i=!1;return o&&(i=n.fancybox.getTranslate(o),i=i.width1||Math.abs(n.height()-o.height)>1),o},loadSlide:function(t){var e,o,i,a=this;if(!t.isLoading&&!t.isLoaded){switch(t.isLoading=!0,a.trigger("beforeLoad",t),e=t.type,o=t.$slide,o.off("refresh").trigger("onReset").addClass("fancybox-slide--"+(e||"unknown")).addClass(t.opts.slideClass),e){case"image":a.setImage(t);break;case"iframe":a.setIframe(t);break;case"html":a.setContent(t,t.src||t.content);break;case"inline":n(t.src).length?a.setContent(t,n(t.src)):a.setError(t);break;case"ajax":a.showLoading(t),i=n.ajax(n.extend({},t.opts.ajax.settings,{url:t.src,success:function(e,n){"success"===n&&a.setContent(t,e)},error:function(e,n){e&&"abort"!==n&&a.setError(t)}})),o.one("onReset",function(){i.abort()});break;default:a.setError(t)}return!0}},setImage:function(e){var o,i,a,s,r=this,c=e.opts.image.srcset;if(c){a=t.devicePixelRatio||1,s=t.innerWidth*a,i=c.split(",").map(function(t){var e={};return t.trim().split(/\s+/).forEach(function(t,n){var o=parseInt(t.substring(0,t.length-1),10);return 0===n?e.url=t:void(o&&(e.value=o,e.postfix=t[t.length-1]))}),e}),i.sort(function(t,e){return t.value-e.value});for(var l=0;l=s||"x"===u.postfix&&u.value>=a){o=u;break}}!o&&i.length&&(o=i[i.length-1]),o&&(e.src=o.url,e.width&&e.height&&"w"==o.postfix&&(e.height=e.width/e.height*o.value,e.width=o.value))}e.$content=n('
').addClass("fancybox-is-hidden").appendTo(e.$slide),e.opts.preload!==!1&&e.opts.width&&e.opts.height&&(e.opts.thumb||e.opts.$thumb)?(e.width=e.opts.width,e.height=e.opts.height,e.$ghost=n("").one("error",function(){n(this).remove(),e.$ghost=null,r.setBigImage(e)}).one("load",function(){r.afterLoad(e),r.setBigImage(e)}).addClass("fancybox-image").appendTo(e.$content).attr("src",e.opts.thumb||e.opts.$thumb.attr("src"))):r.setBigImage(e)},setBigImage:function(t){var e=this,o=n("");t.$image=o.one("error",function(){e.setError(t)}).one("load",function(){clearTimeout(t.timouts),t.timouts=null,e.isClosing||(t.width=this.naturalWidth,t.height=this.naturalHeight,t.opts.image.srcset&&o.attr("sizes","100vw").attr("srcset",t.opts.image.srcset),e.hideLoading(t),t.$ghost?t.timouts=setTimeout(function(){t.timouts=null,t.$ghost.hide()},Math.min(300,Math.max(1e3,t.height/1600))):e.afterLoad(t))}).addClass("fancybox-image").attr("src",t.src).appendTo(t.$content),(o[0].complete||"complete"==o[0].readyState)&&o[0].naturalWidth&&o[0].naturalHeight?o.trigger("load"):o[0].error?o.trigger("error"):t.timouts=setTimeout(function(){o[0].complete||t.hasError||e.showLoading(t)},100)},setIframe:function(t){var e,i=this,a=t.opts.iframe,s=t.$slide;t.$content=n('
').css(a.css).appendTo(s),e=n(a.tpl.replace(/\{rnd\}/g,(new Date).getTime())).attr(a.attr).appendTo(t.$content),a.preload?(i.showLoading(t),e.on("load.fb error.fb",function(e){this.isReady=1,t.$slide.trigger("refresh"),i.afterLoad(t)}),s.on("refresh.fb",function(){var n,i,s,r=t.$content,c=a.css.width,l=a.css.height;if(1===e[0].isReady){try{i=e.contents(),s=i.find("body")}catch(t){}s&&s.length&&(c===o&&(n=e[0].contentWindow.document.documentElement.scrollWidth,c=Math.ceil(s.outerWidth(!0)+(r.width()-n)),c+=r.outerWidth()-r.innerWidth()),l===o&&(l=Math.ceil(s.outerHeight(!0)),l+=r.outerHeight()-r.innerHeight()),c&&r.width(c),l&&r.height(l)),r.removeClass("fancybox-is-hidden")}})):this.afterLoad(t),e.attr("src",t.src),t.opts.smallBtn===!0&&t.$content.prepend(i.translate(t,t.opts.btnTpl.smallBtn)),s.one("onReset",function(){try{n(this).find("iframe").hide().attr("src","//about:blank")}catch(t){}n(this).empty(),t.isLoaded=!1})},setContent:function(t,e){var o=this;o.isClosing||(o.hideLoading(t),t.$slide.empty(),l(e)&&e.parent().length?(e.parent(".fancybox-slide--inline").trigger("onReset"),t.$placeholder=n("
").hide().insertAfter(e),e.css("display","inline-block")):t.hasError||("string"===n.type(e)&&(e=n("
").append(n.trim(e)).contents(),3===e[0].nodeType&&(e=n("
").html(e))),t.opts.filter&&(e=n("
").html(e).find(t.opts.filter))),t.$slide.one("onReset",function(){t.$placeholder&&(t.$placeholder.after(e.hide()).remove(),t.$placeholder=null),t.$smallBtn&&(t.$smallBtn.remove(),t.$smallBtn=null),t.hasError||(n(this).empty(),t.isLoaded=!1)}),t.$content=n(e).appendTo(t.$slide),t.opts.smallBtn&&!t.$smallBtn&&(t.$smallBtn=n(o.translate(t,t.opts.btnTpl.smallBtn)).appendTo(t.$content.filter("div").first())),this.afterLoad(t))},setError:function(t){t.hasError=!0,t.$slide.removeClass("fancybox-slide--"+t.type),this.setContent(t,this.translate(t,t.opts.errorTpl))},showLoading:function(t){var e=this;t=t||e.current,t&&!t.$spinner&&(t.$spinner=n(e.opts.spinnerTpl).appendTo(t.$slide))},hideLoading:function(t){var e=this;t=t||e.current,t&&t.$spinner&&(t.$spinner.remove(),delete t.$spinner)},afterLoad:function(t){var e=this;e.isClosing||(t.isLoading=!1,t.isLoaded=!0,e.trigger("afterLoad",t),e.hideLoading(t),t.opts.protect&&t.$content&&!t.hasError&&(t.$content.on("contextmenu.fb",function(t){return 2==t.button&&t.preventDefault(),!0}),"image"===t.type&&n('
').appendTo(t.$content)),e.revealContent(t))},revealContent:function(t){var e,i,a,s,r,c=this,l=t.$slide,u=!1;return e=t.opts[c.firstRun?"animationEffect":"transitionEffect"],a=t.opts[c.firstRun?"animationDuration":"transitionDuration"],a=parseInt(t.forcedDuration===o?a:t.forcedDuration,10),!t.isMoved&&t.pos===c.currPos&&a||(e=!1),"zoom"!==e||t.pos===c.currPos&&a&&"image"===t.type&&!t.hasError&&(u=c.getThumbPos(t))||(e="fade"),"zoom"===e?(r=c.getFitPos(t),r.scaleX=r.width/u.width,r.scaleY=r.height/u.height,delete r.width,delete r.height,s=t.opts.zoomOpacity,"auto"==s&&(s=Math.abs(t.width/t.height-u.width/u.height)>.1),s&&(u.opacity=.1,r.opacity=1),n.fancybox.setTranslate(t.$content.removeClass("fancybox-is-hidden"),u),f(t.$content),void n.fancybox.animate(t.$content,r,a,function(){c.complete()})):(c.updateSlide(t),e?(n.fancybox.stop(l),i="fancybox-animated fancybox-slide--"+(t.pos>c.prevPos?"next":"previous")+" fancybox-fx-"+e,l.removeAttr("style").removeClass("fancybox-slide--current fancybox-slide--next fancybox-slide--previous").addClass(i),t.$content.removeClass("fancybox-is-hidden"),f(l),void n.fancybox.animate(l,"fancybox-slide--current",a,function(e){l.removeClass(i).removeAttr("style"),t.pos===c.currPos&&c.complete()},!0)):(f(l),t.$content.removeClass("fancybox-is-hidden"),void(t.pos===c.currPos&&c.complete())))},getThumbPos:function(o){var i,a=this,s=!1,r=function(e){for(var o,i=e[0],a=i.getBoundingClientRect(),s=[];null!==i.parentElement;)"hidden"!==n(i.parentElement).css("overflow")&&"auto"!==n(i.parentElement).css("overflow")||s.push(i.parentElement.getBoundingClientRect()),i=i.parentElement;return o=s.every(function(t){var e=Math.min(a.right,t.right)-Math.max(a.left,t.left),n=Math.min(a.bottom,t.bottom)-Math.max(a.top,t.top);return e>0&&n>0}),o&&a.bottom>0&&a.right>0&&a.left=t.currPos-1&&o.pos<=t.currPos+1?i[o.pos]=o:o&&(n.fancybox.stop(o.$slide),o.$slide.off().remove())}),t.slides=i,t.updateCursor(),t.trigger("afterShow"),(n(e.activeElement).is("[disabled]")||o.opts.autoFocus&&"image"!=o.type&&"iframe"!==o.type)&&t.focus())},preload:function(){var t,e,n=this;n.group.length<2||(t=n.slides[n.currPos+1],e=n.slides[n.currPos-1],t&&"image"===t.type&&n.loadSlide(t),e&&"image"===e.type&&n.loadSlide(e))},focus:function(){var t,e=this.current;this.isClosing||(e&&e.isComplete&&(t=e.$slide.find("input[autofocus]:enabled:visible:first"),t.length||(t=e.$slide.find("button,:input,[tabindex],a").filter(":enabled:visible:first"))),t=t&&t.length?t:this.$refs.container,t.focus())},activate:function(){var t=this;n(".fancybox-container").each(function(){var e=n(this).data("FancyBox");e&&e.uid!==t.uid&&!e.isClosing&&e.trigger("onDeactivate")}),t.current&&(t.$refs.container.index()>0&&t.$refs.container.prependTo(e.body),t.updateControls()),t.trigger("onActivate"),t.addEvents()},close:function(t,e){var o,i,a,s,r,c,l=this,f=l.current,p=function(){l.cleanUp(t)};return!l.isClosing&&(l.isClosing=!0,l.trigger("beforeClose",t)===!1?(l.isClosing=!1,u(function(){l.update()}),!1):(l.removeEvents(),f.timouts&&clearTimeout(f.timouts),a=f.$content,o=f.opts.animationEffect,i=n.isNumeric(e)?e:o?f.opts.animationDuration:0,f.$slide.off(d).removeClass("fancybox-slide--complete fancybox-slide--next fancybox-slide--previous fancybox-animated"),f.$slide.siblings().trigger("onReset").remove(),i&&l.$refs.container.removeClass("fancybox-is-open").addClass("fancybox-is-closing"),l.hideLoading(f),l.hideControls(),l.updateCursor(),"zoom"!==o||t!==!0&&a&&i&&"image"===f.type&&!f.hasError&&(c=l.getThumbPos(f))||(o="fade"),"zoom"===o?(n.fancybox.stop(a),r=n.fancybox.getTranslate(a),r.width=r.width*r.scaleX,r.height=r.height*r.scaleY,s=f.opts.zoomOpacity,"auto"==s&&(s=Math.abs(f.width/f.height-c.width/c.height)>.1),s&&(c.opacity=0),r.scaleX=r.width/c.width,r.scaleY=r.height/c.height,r.width=c.width,r.height=c.height,n.fancybox.setTranslate(f.$content,r),n.fancybox.animate(f.$content,c,i,p),!0):(o&&i?t===!0?setTimeout(p,i):n.fancybox.animate(f.$slide.removeClass("fancybox-slide--current"),"fancybox-animated fancybox-slide--previous fancybox-fx-"+o,i,p):p(),!0)))},cleanUp:function(t){var e,o=this;o.current.$slide.trigger("onReset"),o.$refs.container.empty().remove(),o.trigger("afterClose",t),o.$lastFocus&&o.current.opts.backFocus&&o.$lastFocus.focus(),o.current=null,e=n.fancybox.getInstance(),e?e.activate():(s.scrollTop(o.scrollTop).scrollLeft(o.scrollLeft),n("html").removeClass("fancybox-enabled"),n("#fancybox-style-noscroll").remove())},trigger:function(t,e){var o,i=Array.prototype.slice.call(arguments,1),a=this,s=e&&e.opts?e:a.current;return s?i.unshift(s):s=a,i.unshift(a),n.isFunction(s.opts[t])&&(o=s.opts[t].apply(s,i)),o===!1?o:void("afterClose"===t?r.trigger(t+".fb",i):a.$refs.container.trigger(t+".fb",i))},updateControls:function(t){var e=this,o=e.current,i=o.index,a=o.opts,s=a.caption,r=e.$refs.caption;o.$slide.trigger("refresh"),e.$caption=s&&s.length?r.html(s):null,e.isHiddenControls||e.showControls(),n("[data-fancybox-count]").html(e.group.length),n("[data-fancybox-index]").html(i+1),n("[data-fancybox-prev]").prop("disabled",!a.loop&&i<=0),n("[data-fancybox-next]").prop("disabled",!a.loop&&i>=e.group.length-1)},hideControls:function(){this.isHiddenControls=!0,this.$refs.container.removeClass("fancybox-show-infobar fancybox-show-toolbar fancybox-show-caption fancybox-show-nav")},showControls:function(){var t=this,e=t.current?t.current.opts:t.opts,n=t.$refs.container;t.isHiddenControls=!1,t.idleSecondsCounter=0,n.toggleClass("fancybox-show-toolbar",!(!e.toolbar||!e.buttons)).toggleClass("fancybox-show-infobar",!!(e.infobar&&t.group.length>1)).toggleClass("fancybox-show-nav",!!(e.arrows&&t.group.length>1)).toggleClass("fancybox-is-modal",!!e.modal),t.$caption?n.addClass("fancybox-show-caption "):n.removeClass("fancybox-show-caption")},toggleControls:function(){this.isHiddenControls?this.showControls():this.hideControls()}}),n.fancybox={version:"3.1.27",defaults:a,getInstance:function(t){var e=n('.fancybox-container:not(".fancybox-is-closing"):first').data("FancyBox"),o=Array.prototype.slice.call(arguments,1);return e instanceof p&&("string"===n.type(t)?e[t].apply(e,o):"function"===n.type(t)&&t.apply(e,o),e)},open:function(t,e,n){return new p(t,e,n)},close:function(t){var e=this.getInstance();e&&(e.close(),t===!0&&this.close())},destroy:function(){this.close(!0),r.off("click.fb-start")},isMobile:e.createTouch!==o&&/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent),use3d:function(){var n=e.createElement("div");return t.getComputedStyle&&t.getComputedStyle(n).getPropertyValue("transform")&&!(e.documentMode&&e.documentMode<11)}(),getTranslate:function(t){var e;if(!t||!t.length)return!1;if(e=t.eq(0).css("transform"),e&&e.indexOf("matrix")!==-1?(e=e.split("(")[1],e=e.split(")")[0],e=e.split(",")):e=[],e.length)e=e.length>10?[e[13],e[12],e[0],e[5]]:[e[5],e[4],e[0],e[3]],e=e.map(parseFloat);else{e=[0,0,1,1];var n=/\.*translate\((.*)px,(.*)px\)/i,o=n.exec(t.eq(0).attr("style"));o&&(e[0]=parseFloat(o[2]),e[1]=parseFloat(o[1]))}return{top:e[0],left:e[1],scaleX:e[2],scaleY:e[3],opacity:parseFloat(t.css("opacity")),width:t.width(),height:t.height()}},setTranslate:function(t,e){var n="",i={};if(t&&e)return e.left===o&&e.top===o||(n=(e.left===o?t.position().left:e.left)+"px, "+(e.top===o?t.position().top:e.top)+"px",n=this.use3d?"translate3d("+n+", 0px)":"translate("+n+")"),e.scaleX!==o&&e.scaleY!==o&&(n=(n.length?n+" ":"")+"scale("+e.scaleX+", "+e.scaleY+")"),n.length&&(i.transform=n),e.opacity!==o&&(i.opacity=e.opacity),e.width!==o&&(i.width=e.width),e.height!==o&&(i.height=e.height),t.css(i)},animate:function(t,e,i,a,s){var r=d||"transitionend";n.isFunction(i)&&(a=i,i=null),n.isPlainObject(e)||t.removeAttr("style"),t.on(r,function(i){(!i||!i.originalEvent||t.is(i.originalEvent.target)&&"z-index"!=i.originalEvent.propertyName)&&(t.off(r),n.isPlainObject(e)?e.scaleX!==o&&e.scaleY!==o&&(t.css("transition-duration","0ms"),e.width=Math.round(t.width()*e.scaleX),e.height=Math.round(t.height()*e.scaleY),e.scaleX=1,e.scaleY=1,n.fancybox.setTranslate(t,e)):s!==!0&&t.removeClass(e),n.isFunction(a)&&a(i))}),n.isNumeric(i)&&t.css("transition-duration",i+"ms"),n.isPlainObject(e)?n.fancybox.setTranslate(t,e):t.addClass(e),t.data("timer",setTimeout(function(){t.trigger("transitionend")},i+16))},stop:function(t){clearTimeout(t.data("timer")),t.off(d)}},n.fn.fancybox=function(t){var e;return t=t||{},e=t.selector||!1,e?n("body").off("click.fb-start",e).on("click.fb-start",e,{options:t},i):this.off("click.fb-start").on("click.fb-start",{items:this,options:t},i),this},r.on("click.fb-start","[data-fancybox]",i)}}(window,document,window.jQuery||jQuery),function(t){"use strict";var e=function(e,n,o){if(e)return o=o||"","object"===t.type(o)&&(o=t.param(o,!0)),t.each(n,function(t,n){e=e.replace("$"+t,n||"")}),o.length&&(e+=(e.indexOf("?")>0?"&":"?")+o),e},n={youtube:{matcher:/(youtube\.com|youtu\.be|youtube\-nocookie\.com)\/(watch\?(.*&)?v=|v\/|u\/|embed\/?)?(videoseries\?list=(.*)|[\w-]{11}|\?listType=(.*)&list=(.*))(.*)/i,params:{autoplay:1,autohide:1,fs:1,rel:0,hd:1,wmode:"transparent",enablejsapi:1,html5:1},paramPlace:8,type:"iframe",url:"//www.youtube.com/embed/$4",thumb:"//img.youtube.com/vi/$4/hqdefault.jpg"},vimeo:{matcher:/^.+vimeo.com\/(.*\/)?([\d]+)(.*)?/,params:{autoplay:1,hd:1,show_title:1,show_byline:1,show_portrait:0,fullscreen:1,api:1},paramPlace:3,type:"iframe",url:"//player.vimeo.com/video/$2"},metacafe:{matcher:/metacafe.com\/watch\/(\d+)\/(.*)?/,type:"iframe",url:"//www.metacafe.com/embed/$1/?ap=1"},dailymotion:{matcher:/dailymotion.com\/video\/(.*)\/?(.*)/,params:{additionalInfos:0,autoStart:1},type:"iframe",url:"//www.dailymotion.com/embed/video/$1"},vine:{matcher:/vine.co\/v\/([a-zA-Z0-9\?\=\-]+)/,type:"iframe",url:"//vine.co/v/$1/embed/simple"},instagram:{matcher:/(instagr\.am|instagram\.com)\/p\/([a-zA-Z0-9_\-]+)\/?/i,type:"image",url:"//$1/p/$2/media/?size=l"},gmap_place:{matcher:/(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(((maps\/(place\/(.*)\/)?\@(.*),(\d+.?\d+?)z))|(\?ll=))(.*)?/i,type:"iframe",url:function(t){return"//maps.google."+t[2]+"/?ll="+(t[9]?t[9]+"&z="+Math.floor(t[10])+(t[12]?t[12].replace(/^\//,"&"):""):t[12])+"&output="+(t[12]&&t[12].indexOf("layer=c")>0?"svembed":"embed")}},gmap_search:{matcher:/(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(maps\/search\/)(.*)/i,type:"iframe",url:function(t){return"//maps.google."+t[2]+"/maps?q="+t[5].replace("query=","q=").replace("api=1","")+"&output=embed"}}};t(document).on("onInit.fb",function(o,i){t.each(i.group,function(o,i){var a,s,r,c,l,u,d,f=i.src||"",p=!1;i.type||(a=t.extend(!0,{},n,i.opts.media),t.each(a,function(n,o){if(r=f.match(o.matcher),u={},d=n,r){if(p=o.type,o.paramPlace&&r[o.paramPlace]){l=r[o.paramPlace],"?"==l[0]&&(l=l.substring(1)),l=l.split("&");for(var a=0;ae.clientHeight,a=("scroll"===o||"auto"===o)&&e.scrollWidth>e.clientWidth;return i||a},l=function(t){for(var e=!1;;){if(e=c(t.get(0)))break;if(t=t.parent(),!t.length||t.hasClass("fancybox-stage")||t.is("body"))break}return e},u=function(t){var e=this;e.instance=t,e.$bg=t.$refs.bg,e.$stage=t.$refs.stage,e.$container=t.$refs.container,e.destroy(),e.$container.on("touchstart.fb.touch mousedown.fb.touch",n.proxy(e,"ontouchstart"))};u.prototype.destroy=function(){this.$container.off(".fb.touch")},u.prototype.ontouchstart=function(o){var i=this,c=n(o.target),u=i.instance,d=u.current,f=d.$content,p="touchstart"==o.type;if(p&&i.$container.off("mousedown.fb.touch"),!d||i.instance.isAnimating||i.instance.isClosing)return o.stopPropagation(),void o.preventDefault();if((!o.originalEvent||2!=o.originalEvent.button)&&c.length&&!r(c)&&!r(c.parent())&&!(o.originalEvent.clientX>c[0].clientWidth+c.offset().left)&&(i.startPoints=a(o),i.startPoints&&!(i.startPoints.length>1&&u.isSliding))){if(i.$target=c,i.$content=f,i.canTap=!0,n(e).off(".fb.touch"),n(e).on(p?"touchend.fb.touch touchcancel.fb.touch":"mouseup.fb.touch mouseleave.fb.touch",n.proxy(i,"ontouchend")),n(e).on(p?"touchmove.fb.touch":"mousemove.fb.touch",n.proxy(i,"ontouchmove")),!u.current.opts.touch&&!u.canPan()||!c.is(i.$stage)&&!i.$stage.find(c).length)return void(c.is("img")&&o.preventDefault());o.stopPropagation(),n.fancybox.isMobile&&(l(i.$target)||l(i.$target.parent()))||o.preventDefault(),i.canvasWidth=Math.round(d.$slide[0].clientWidth),i.canvasHeight=Math.round(d.$slide[0].clientHeight),i.startTime=(new Date).getTime(),i.distanceX=i.distanceY=i.distance=0,i.isPanning=!1,i.isSwiping=!1,i.isZooming=!1,i.sliderStartPos=i.sliderLastPos||{top:0,left:0},i.contentStartPos=n.fancybox.getTranslate(i.$content),i.contentLastPos=null,1!==i.startPoints.length||i.isZooming||(i.canTap=!u.isSliding,"image"===d.type&&(i.contentStartPos.width>i.canvasWidth+1||i.contentStartPos.height>i.canvasHeight+1)?(n.fancybox.stop(i.$content),i.$content.css("transition-duration","0ms"),i.isPanning=!0):i.isSwiping=!0,i.$container.addClass("fancybox-controls--isGrabbing")),2!==i.startPoints.length||u.isAnimating||d.hasError||"image"!==d.type||!d.isLoaded&&!d.$ghost||(i.isZooming=!0,i.isSwiping=!1,i.isPanning=!1,n.fancybox.stop(i.$content),i.$content.css("transition-duration","0ms"),i.centerPointStartX=.5*(i.startPoints[0].x+i.startPoints[1].x)-n(t).scrollLeft(),i.centerPointStartY=.5*(i.startPoints[0].y+i.startPoints[1].y)-n(t).scrollTop(),i.percentageOfImageAtPinchPointX=(i.centerPointStartX-i.contentStartPos.left)/i.contentStartPos.width,i.percentageOfImageAtPinchPointY=(i.centerPointStartY-i.contentStartPos.top)/i.contentStartPos.height,i.startDistanceBetweenFingers=s(i.startPoints[0],i.startPoints[1]))}},u.prototype.ontouchmove=function(t){var e=this;if(e.newPoints=a(t),n.fancybox.isMobile&&(l(e.$target)||l(e.$target.parent())))return t.stopPropagation(),void(e.canTap=!1);if((e.instance.current.opts.touch||e.instance.canPan())&&e.newPoints&&e.newPoints.length&&(e.distanceX=s(e.newPoints[0],e.startPoints[0],"x"),e.distanceY=s(e.newPoints[0],e.startPoints[0],"y"),e.distance=s(e.newPoints[0],e.startPoints[0]),e.distance>0)){if(!e.$target.is(e.$stage)&&!e.$stage.find(e.$target).length)return;t.stopPropagation(),t.preventDefault(),e.isSwiping?e.onSwipe():e.isPanning?e.onPan():e.isZooming&&e.onZoom()}},u.prototype.onSwipe=function(){var e,a=this,s=a.isSwiping,r=a.sliderStartPos.left||0;s===!0?Math.abs(a.distance)>10&&(a.canTap=!1,a.instance.group.length<2&&a.instance.opts.touch.vertical?a.isSwiping="y":a.instance.isSliding||a.instance.opts.touch.vertical===!1||"auto"===a.instance.opts.touch.vertical&&n(t).width()>800?a.isSwiping="x":(e=Math.abs(180*Math.atan2(a.distanceY,a.distanceX)/Math.PI),a.isSwiping=e>45&&e<135?"y":"x"),a.instance.isSliding=a.isSwiping,a.startPoints=a.newPoints,n.each(a.instance.slides,function(t,e){n.fancybox.stop(e.$slide),e.$slide.css("transition-duration","0ms"),e.inTransition=!1,e.pos===a.instance.current.pos&&(a.sliderStartPos.left=n.fancybox.getTranslate(e.$slide).left)}),a.instance.SlideShow&&a.instance.SlideShow.isActive&&a.instance.SlideShow.stop()):("x"==s&&(a.distanceX>0&&(a.instance.group.length<2||0===a.instance.current.index&&!a.instance.current.opts.loop)?r+=Math.pow(a.distanceX,.8):a.distanceX<0&&(a.instance.group.length<2||a.instance.current.index===a.instance.group.length-1&&!a.instance.current.opts.loop)?r-=Math.pow(-a.distanceX,.8):r+=a.distanceX),a.sliderLastPos={top:"x"==s?0:a.sliderStartPos.top+a.distanceY,left:r},a.requestId&&(i(a.requestId),a.requestId=null),a.requestId=o(function(){a.sliderLastPos&&(n.each(a.instance.slides,function(t,e){var o=e.pos-a.instance.currPos;n.fancybox.setTranslate(e.$slide,{top:a.sliderLastPos.top,left:a.sliderLastPos.left+o*a.canvasWidth+o*e.opts.gutter})}),a.$container.addClass("fancybox-is-sliding"))}))},u.prototype.onPan=function(){var t,e,a,s=this;s.canTap=!1,t=s.contentStartPos.width>s.canvasWidth?s.contentStartPos.left+s.distanceX:s.contentStartPos.left,e=s.contentStartPos.top+s.distanceY,a=s.limitMovement(t,e,s.contentStartPos.width,s.contentStartPos.height),a.scaleX=s.contentStartPos.scaleX,a.scaleY=s.contentStartPos.scaleY,s.contentLastPos=a,s.requestId&&(i(s.requestId),s.requestId=null),s.requestId=o(function(){n.fancybox.setTranslate(s.$content,s.contentLastPos)})},u.prototype.limitMovement=function(t,e,n,o){var i,a,s,r,c=this,l=c.canvasWidth,u=c.canvasHeight,d=c.contentStartPos.left,f=c.contentStartPos.top,p=c.distanceX,h=c.distanceY;return i=Math.max(0,.5*l-.5*n),a=Math.max(0,.5*u-.5*o),s=Math.min(l-n,.5*l-.5*n),r=Math.min(u-o,.5*u-.5*o),n>l&&(p>0&&t>i&&(t=i-1+Math.pow(-i+d+p,.8)||0),p<0&&tu&&(h>0&&e>a&&(e=a-1+Math.pow(-a+f+h,.8)||0),h<0&&ea?(t=t>0?0:t,t=ts?(e=e>0?0:e,e=e50?(n.fancybox.animate(e.instance.current.$slide,{top:e.sliderStartPos.top+e.distanceY+150*e.velocityY,opacity:0},150),o=e.instance.close(!0,300)):"x"==t&&e.distanceX>50&&e.instance.group.length>1?o=e.instance.previous(e.speedX):"x"==t&&e.distanceX<-50&&e.instance.group.length>1&&(o=e.instance.next(e.speedX)),o!==!1||"x"!=t&&"y"!=t||e.instance.jumpTo(e.instance.current.index,150),e.$container.removeClass("fancybox-is-sliding")},u.prototype.endPanning=function(){var t,e,o,i=this;i.contentLastPos&&(i.instance.current.opts.touch.momentum===!1?(t=i.contentLastPos.left,e=i.contentLastPos.top):(t=i.contentLastPos.left+i.velocityX*i.speed,e=i.contentLastPos.top+i.velocityY*i.speed),o=i.limitPosition(t,e,i.contentStartPos.width,i.contentStartPos.height),o.width=i.contentStartPos.width,o.height=i.contentStartPos.height,n.fancybox.animate(i.$content,o,330))},u.prototype.endZooming=function(){var t,e,o,i,a=this,s=a.instance.current,r=a.newWidth,c=a.newHeight;a.contentLastPos&&(t=a.contentLastPos.left,e=a.contentLastPos.top,i={top:e,left:t,width:r,height:c,scaleX:1,scaleY:1},n.fancybox.setTranslate(a.$content,i),rs.width||c>s.height?a.instance.scaleToActual(a.centerPointStartX,a.centerPointStartY,150):(o=a.limitPosition(t,e,r,c),n.fancybox.setTranslate(a.content,n.fancybox.getTranslate(a.$content)),n.fancybox.animate(a.$content,o,150)))},u.prototype.onTap=function(t){var e,o=this,i=n(t.target),s=o.instance,r=s.current,c=t&&a(t)||o.startPoints,l=c[0]?c[0].x-o.$stage.offset().left:0,u=c[0]?c[0].y-o.$stage.offset().top:0,d=function(e){var i=r.opts[e];if(n.isFunction(i)&&(i=i.apply(s,[r,t])),i)switch(i){case"close":s.close(o.startEvent);break;case"toggleControls":s.toggleControls(!0);break;case"next":s.next();break;case"nextOrClose":s.group.length>1?s.next():s.close(o.startEvent);break;case"zoom":"image"==r.type&&(r.isLoaded||r.$ghost)&&(s.canPan()?s.scaleToFit():s.isScaledDown()?s.scaleToActual(l,u):s.group.length<2&&s.close(o.startEvent))}};if(!(t.originalEvent&&2==t.originalEvent.button||s.isSliding||l>i[0].clientWidth+i.offset().left)){if(i.is(".fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-container"))e="Outside";else if(i.is(".fancybox-slide"))e="Slide";else{if(!s.current.$content||!s.current.$content.has(t.target).length)return;e="Content"}if(o.tapped){if(clearTimeout(o.tapped),o.tapped=null,Math.abs(l-o.tapX)>50||Math.abs(u-o.tapY)>50||s.isSliding)return this;d("dblclick"+e)}else o.tapX=l,o.tapY=u,r.opts["dblclick"+e]&&r.opts["dblclick"+e]!==r.opts["click"+e]?o.tapped=setTimeout(function(){o.tapped=null,d("click"+e)},300):d("click"+e);return this}},n(e).on("onActivate.fb",function(t,e){e&&!e.Guestures&&(e.Guestures=new u(e))}),n(e).on("beforeClose.fb",function(t,e){e&&e.Guestures&&e.Guestures.destroy()})}(window,document,window.jQuery),function(t,e){"use strict";var n=function(t){this.instance=t,this.init()};e.extend(n.prototype,{timer:null,isActive:!1,$button:null,speed:3e3,init:function(){var t=this;t.$button=t.instance.$refs.toolbar.find("[data-fancybox-play]").on("click",function(){t.toggle()}),(t.instance.group.length<2||!t.instance.group[t.instance.currIndex].opts.slideShow)&&t.$button.hide()},set:function(){var t=this;t.instance&&t.instance.current&&(t.instance.current.opts.loop||t.instance.currIndex1&&t.instance.group[t.instance.currIndex].opts.thumbs&&("image"==e.type||e.opts.thumb||e.opts.$thumb)&&("image"==n.type||n.opts.thumb||n.opts.$thumb)?(t.$button.on("click",function(){t.toggle()}),t.isActive=!0):(t.$button.hide(),t.isActive=!1)},create:function(){var t,n,o=this.instance;this.$grid=e('
').appendTo(o.$refs.container),t="
    ",e.each(o.group,function(e,o){n=o.opts.thumb||(o.opts.$thumb?o.opts.$thumb.attr("src"):null),n||"image"!==o.type||(n=o.src),n&&n.length&&(t+='
  • ')}),t+="
",this.$list=e(t).appendTo(this.$grid).on("click","li",function(){o.jumpTo(e(this).data("index"))}),this.$list.find("img").hide().one("load",function(){var t,n,o,i,a=e(this).parent().removeClass("fancybox-thumbs-loading"),s=a.outerWidth(),r=a.outerHeight();t=this.naturalWidth||this.width,n=this.naturalHeight||this.height,o=t/s,i=n/r,o>=1&&i>=1&&(o>i?(t/=i,n=r):(t=s,n/=o)),e(this).css({width:Math.floor(t),height:Math.floor(n),"margin-top":Math.min(0,Math.floor(.3*r-.3*n)),"margin-left":Math.min(0,Math.floor(.5*s-.5*t))}).show()}).each(function(){this.src=e(this).data("src")})},focus:function(){this.instance.current&&this.$list.children().removeClass("fancybox-thumbs-active").filter('[data-index="'+this.instance.current.index+'"]').addClass("fancybox-thumbs-active").focus()},close:function(){this.$grid.hide()},update:function(){this.instance.$refs.container.toggleClass("fancybox-show-thumbs",this.isVisible),this.isVisible?(this.$grid||this.create(),this.instance.trigger("onThumbsShow"),this.focus()):this.$grid&&this.instance.trigger("onThumbsHide"),this.instance.update()},hide:function(){this.isVisible=!1,this.update()},show:function(){this.isVisible=!0,this.update()},toggle:function(){this.isVisible=!this.isVisible,this.update()}}),e(t).on({"onInit.fb":function(t,e){e&&!e.Thumbs&&(e.Thumbs=new n(e))},"beforeShow.fb":function(t,e,n,o){var i=e&&e.Thumbs;if(i&&i.isActive){if(n.modal)return i.$button.hide(),void i.hide();o&&e.opts.thumbs.autoStart===!0&&i.show(),i.isVisible&&i.focus()}},"afterKeydown.fb":function(t,e,n,o,i){var a=e&&e.Thumbs;a&&a.isActive&&71===i&&(o.preventDefault(),a.toggle())},"beforeClose.fb":function(t,e){var n=e&&e.Thumbs;n&&n.isVisible&&e.opts.thumbs.hideOnClose!==!1&&n.close()}})}(document,window.jQuery),function(t,e,n){"use strict";function o(){var t=e.location.hash.substr(1),n=t.split("-"),o=n.length>1&&/^\+?\d+$/.test(n[n.length-1])?parseInt(n.pop(-1),10)||1:1,i=n.join("-");return o<1&&(o=1),{hash:t,index:o,gallery:i}}function i(t){var e;""!==t.gallery&&(e=n("[data-fancybox='"+n.escapeSelector(t.gallery)+"']").eq(t.index-1),e.length||(e=n("#"+n.escapeSelector(t.gallery))),e.length&&(s=!1,e.trigger("click")))}function a(t){var e;return!!t&&(e=t.current?t.current.opts:t.opts,e.hash||(e.$orig?e.$orig.data("fancybox"):""))}n.escapeSelector||(n.escapeSelector=function(t){var e=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\x80-\uFFFF\w-]/g,n=function(t,e){return e?"\0"===t?"�":t.slice(0,-1)+"\\"+t.charCodeAt(t.length-1).toString(16)+" ":"\\"+t};return(t+"").replace(e,n)});var s=!0,r=null,c=null;n(function(){setTimeout(function(){n.fancybox.defaults.hash!==!1&&(n(t).on({"onInit.fb":function(t,e){var n,i;e.group[e.currIndex].opts.hash!==!1&&(n=o(),i=a(e),i&&n.gallery&&i==n.gallery&&(e.currIndex=n.index-1))},"beforeShow.fb":function(n,o,i){var l;i&&i.opts.hash!==!1&&(l=a(o),l&&""!==l&&(e.location.hash.indexOf(l)<0&&(o.opts.origHash=e.location.hash),r=l+(o.group.length>1?"-"+(i.index+1):""),"replaceState"in e.history?(c&&clearTimeout(c),c=setTimeout(function(){e.history[s?"pushState":"replaceState"]({},t.title,e.location.pathname+e.location.search+"#"+r),c=null,s=!1},300)):e.location.hash=r))},"beforeClose.fb":function(o,i,s){var l,u;c&&clearTimeout(c),s.opts.hash!==!1&&(l=a(i),u=i&&i.opts.origHash?i.opts.origHash:"",l&&""!==l&&("replaceState"in history?e.history.replaceState({},t.title,e.location.pathname+e.location.search+u):(e.location.hash=u,n(e).scrollTop(i.scrollTop).scrollLeft(i.scrollLeft))),r=null)}}),n(e).on("hashchange.fb",function(){var t=o();n.fancybox.getInstance()?!r||r===t.gallery+"-"+t.index||1===t.index&&r==t.gallery||(r=null,n.fancybox.close()):""!==t.gallery&&i(t)}),i(o()))},50)})}(document,window,window.jQuery); \ No newline at end of file diff --git a/package.json b/package.json index 735fd3b0..955af5ff 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "@fancyapps/fancybox", "description": "Touch enabled, responsive and fully customizable jQuery lightbox script", - "version": "3.1.26", + "version": "3.1.27", "homepage": "http://fancyapps.com/fancybox/", "main": "./dist/jquery.fancybox.js", "author": "fancyApps", diff --git a/src/js/core.js b/src/js/core.js index 9381e1e7..faf62b9c 100644 --- a/src/js/core.js +++ b/src/js/core.js @@ -1750,7 +1750,7 @@ .attr('src', slide.src) .appendTo( slide.$content ); - if ( $img[0].complete ) { + if ( ( $img[0].complete || $img[0].readyState == "complete" ) && $img[0].naturalWidth && $img[0].naturalHeight ) { $img.trigger( 'load' ); } else if( $img[0].error ) { @@ -2085,7 +2085,6 @@ effect = 'fade'; } - // Zoom animation // ============== From 913b6ea3c4e3b2d518d1f771446eade3a51f2e1d Mon Sep 17 00:00:00 2001 From: Janis Skarnelis Date: Tue, 3 Oct 2017 17:56:30 +0300 Subject: [PATCH 12/56] Fix #1661 and #1658 - Enable custom click events on fancyboxed elements - Enable thumbs.autoStart using `data-options` --- dist/jquery.fancybox.js | 21 ++++++++++----------- dist/jquery.fancybox.min.js | 6 +++--- package.json | 2 +- src/js/core.js | 3 +-- src/js/thumbs.js | 14 +++++++------- 5 files changed, 22 insertions(+), 24 deletions(-) diff --git a/dist/jquery.fancybox.js b/dist/jquery.fancybox.js index 763289a6..f991ac2c 100644 --- a/dist/jquery.fancybox.js +++ b/dist/jquery.fancybox.js @@ -1,5 +1,5 @@ // ================================================== -// fancyBox v3.1.27 +// fancyBox v3.1.28 // // Licensed GPLv3 for open source use // or fancyBox Commercial License for commercial use @@ -2645,7 +2645,7 @@ $.fancybox = { - version : "3.1.27", + version : "3.1.28", defaults : defaults, @@ -2923,12 +2923,11 @@ var target = e.currentTarget, opts = e.data ? e.data.options : {}, items = opts.selector ? $( opts.selector ) : ( e.data ? e.data.items : [] ), - value = $(target).attr( 'data-fancybox' ) || '', + value = $( target ).attr( 'data-fancybox' ) || '', index = 0, active = $.fancybox.getInstance(); e.preventDefault(); - e.stopPropagation(); // Avoid opening multiple times if ( active && active.current.opts.$orig.is( target ) ) { @@ -4578,7 +4577,7 @@ this.$list.find('img').hide().one('load', function() { - var $parent = $(this).parent().removeClass('fancybox-thumbs-loading'), + var $parent = $(this).parent().removeClass( 'fancybox-thumbs-loading' ), thumbWidth = $parent.outerWidth(), thumbHeight = $parent.outerHeight(), width, @@ -4589,12 +4588,12 @@ width = this.naturalWidth || this.width; height = this.naturalHeight || this.height; - //Calculate thumbnail width/height and center it + // Calculate thumbnail width/height and center it widthRatio = width / thumbWidth; heightRatio = height / thumbHeight; - if (widthRatio >= 1 && heightRatio >= 1) { + if ( widthRatio >= 1 && heightRatio >= 1 ) { if (widthRatio > heightRatio) { width = width / heightRatio; height = thumbHeight; @@ -4624,9 +4623,9 @@ if ( this.instance.current ) { this.$list .children() - .removeClass('fancybox-thumbs-active') - .filter('[data-index="' + this.instance.current.index + '"]') - .addClass('fancybox-thumbs-active') + .removeClass( 'fancybox-thumbs-active' ) + .filter( '[data-index="' + this.instance.current.index + '"]' ) + .addClass( 'fancybox-thumbs-active' ) .focus(); } @@ -4699,7 +4698,7 @@ return; } - if ( firstRun && instance.opts.thumbs.autoStart === true ) { + if ( firstRun && item.opts.thumbs.autoStart === true ) { Thumbs.show(); } diff --git a/dist/jquery.fancybox.min.js b/dist/jquery.fancybox.min.js index 3c5fab66..a361832d 100644 --- a/dist/jquery.fancybox.min.js +++ b/dist/jquery.fancybox.min.js @@ -1,5 +1,5 @@ // ================================================== -// fancyBox v3.1.27 +// fancyBox v3.1.28 // // Licensed GPLv3 for open source use // or fancyBox Commercial License for commercial use @@ -8,5 +8,5 @@ // Copyright 2017 fancyApps // // ================================================== -!function(t,e,n,o){"use strict";function i(t){var e=t.currentTarget,o=t.data?t.data.options:{},i=o.selector?n(o.selector):t.data?t.data.items:[],a=n(e).attr("data-fancybox")||"",s=0,r=n.fancybox.getInstance();t.preventDefault(),t.stopPropagation(),r&&r.current.opts.$orig.is(e)||(a?(i=i.length?i.filter('[data-fancybox="'+a+'"]'):n('[data-fancybox="'+a+'"]'),s=i.index(e),s<0&&(s=0)):i=[e],n.fancybox.open(i,o,s))}if(n){if(n.fn.fancybox)return void n.error("fancyBox already initialized");var a={loop:!1,margin:[44,0],gutter:50,keyboard:!0,arrows:!0,infobar:!1,toolbar:!0,buttons:["slideShow","fullScreen","thumbs","close"],idleTime:4,smallBtn:"auto",protect:!1,modal:!1,image:{preload:"auto"},ajax:{settings:{data:{fancybox:!0}}},iframe:{tpl:'',preload:!0,css:{},attr:{scrolling:"auto"}},animationEffect:"zoom",animationDuration:366,zoomOpacity:"auto",transitionEffect:"fade",transitionDuration:366,slideClass:"",baseClass:"",baseTpl:'',spinnerTpl:'
',errorTpl:'

{{ERROR}}

',btnTpl:{slideShow:'',fullScreen:'',thumbs:'',close:'',smallBtn:''},parentEl:"body",autoFocus:!0,backFocus:!0,trapFocus:!0,fullScreen:{autoStart:!1},touch:{vertical:!0,momentum:!0},hash:null,media:{},slideShow:{autoStart:!1,speed:4e3},thumbs:{autoStart:!1,hideOnClose:!0},onInit:n.noop,beforeLoad:n.noop,afterLoad:n.noop,beforeShow:n.noop,afterShow:n.noop,beforeClose:n.noop,afterClose:n.noop,onActivate:n.noop,onDeactivate:n.noop,clickContent:function(t,e){return"image"===t.type&&"zoom"},clickSlide:"close",clickOutside:"close",dblclickContent:!1,dblclickSlide:!1,dblclickOutside:!1,mobile:{clickContent:function(t,e){return"image"===t.type&&"toggleControls"},clickSlide:function(t,e){return"image"===t.type?"toggleControls":"close"},dblclickContent:function(t,e){return"image"===t.type&&"zoom"},dblclickSlide:function(t,e){return"image"===t.type&&"zoom"}},lang:"en",i18n:{en:{CLOSE:"Close",NEXT:"Next",PREV:"Previous",ERROR:"The requested content cannot be loaded.
Please try again later.",PLAY_START:"Start slideshow",PLAY_STOP:"Pause slideshow",FULL_SCREEN:"Full screen",THUMBS:"Thumbnails"},de:{CLOSE:"Schliessen",NEXT:"Weiter",PREV:"Zurück",ERROR:"Die angeforderten Daten konnten nicht geladen werden.
Bitte versuchen Sie es später nochmal.",PLAY_START:"Diaschau starten",PLAY_STOP:"Diaschau beenden",FULL_SCREEN:"Vollbild",THUMBS:"Vorschaubilder"}}},s=n(t),r=n(e),c=0,l=function(t){return t&&t.hasOwnProperty&&t instanceof n},u=function(){return t.requestAnimationFrame||t.webkitRequestAnimationFrame||t.mozRequestAnimationFrame||t.oRequestAnimationFrame||function(e){return t.setTimeout(e,1e3/60)}}(),d=function(){var t,n=e.createElement("fakeelement"),i={transition:"transitionend",OTransition:"oTransitionEnd",MozTransition:"transitionend",WebkitTransition:"webkitTransitionEnd"};for(t in i)if(n.style[t]!==o)return i[t]}(),f=function(t){return t&&t.length&&t[0].offsetHeight},p=function(t,o,i){var s=this;s.opts=n.extend(!0,{index:i},a,o||{}),o&&n.isArray(o.buttons)&&(s.opts.buttons=o.buttons),s.id=s.opts.id||++c,s.group=[],s.currIndex=parseInt(s.opts.index,10)||0,s.prevIndex=null,s.prevPos=null,s.currPos=0,s.firstRun=null,s.createGroup(t),s.group.length&&(s.$lastFocus=n(e.activeElement).blur(),s.slides={},s.init(t))};n.extend(p.prototype,{init:function(){var t,e,o,i=this,a=i.group[i.currIndex].opts;i.scrollTop=r.scrollTop(),i.scrollLeft=r.scrollLeft(),n.fancybox.getInstance()||n.fancybox.isMobile||"hidden"===n("body").css("overflow")||(t=n("body").width(),n("html").addClass("fancybox-enabled"),t=n("body").width()-t,t>1&&n("head").append('")),o="",n.each(a.buttons,function(t,e){o+=a.btnTpl[e]||""}),e=n(i.translate(i,a.baseTpl.replace("{{BUTTONS}}",o))).addClass("fancybox-is-hidden").attr("id","fancybox-container-"+i.id).addClass(a.baseClass).data("FancyBox",i).prependTo(a.parentEl),i.$refs={container:e},["bg","inner","infobar","toolbar","stage","caption"].forEach(function(t){i.$refs[t]=e.find(".fancybox-"+t)}),(!a.arrows||i.group.length<2)&&e.find(".fancybox-navigation").remove(),a.infobar||i.$refs.infobar.remove(),a.toolbar||i.$refs.toolbar.remove(),i.trigger("onInit"),i.activate(),i.jumpTo(i.currIndex)},translate:function(t,e){var n=t.opts.i18n[t.opts.lang];return e.replace(/\{\{(\w+)\}\}/g,function(t,e){var i=n[e];return i===o?t:i})},createGroup:function(t){var e=this,i=n.makeArray(t);n.each(i,function(t,i){var a,s,r,c,l={},u={},d=[];n.isPlainObject(i)?(l=i,u=i.opts||i):"object"===n.type(i)&&n(i).length?(a=n(i),d=a.data(),u="options"in d?d.options:{},u="object"===n.type(u)?u:{},l.src="src"in d?d.src:u.src||a.attr("href"),["width","height","thumb","type","filter"].forEach(function(t){t in d&&(u[t]=d[t])}),"srcset"in d&&(u.image={srcset:d.srcset}),u.$orig=a,l.type||l.src||(l.type="inline",l.src=i)):l={type:"html",src:i+""},l.opts=n.extend(!0,{},e.opts,u),n.fancybox.isMobile&&(l.opts=n.extend(!0,{},l.opts,l.opts.mobile)),s=l.type||l.opts.type,r=l.src||"",!s&&r&&(r.match(/(^data:image\/[a-z0-9+\/=]*,)|(\.(jp(e|g|eg)|gif|png|bmp|webp|svg|ico)((\?|#).*)?$)/i)?s="image":r.match(/\.(pdf)((\?|#).*)?$/i)?s="pdf":"#"===r.charAt(0)&&(s="inline")),l.type=s,l.index=e.group.length,l.opts.$orig&&!l.opts.$orig.length&&delete l.opts.$orig,!l.opts.$thumb&&l.opts.$orig&&(l.opts.$thumb=l.opts.$orig.find("img:first")),l.opts.$thumb&&!l.opts.$thumb.length&&delete l.opts.$thumb,"function"===n.type(l.opts.caption)?l.opts.caption=l.opts.caption.apply(i,[e,l]):"caption"in d&&(l.opts.caption=d.caption),l.opts.caption=l.opts.caption===o?"":l.opts.caption+"","ajax"===s&&(c=r.split(/\s+/,2),c.length>1&&(l.src=c.shift(),l.opts.filter=c.shift())),"auto"==l.opts.smallBtn&&(n.inArray(s,["html","inline","ajax"])>-1?(l.opts.toolbar=!1,l.opts.smallBtn=!0):l.opts.smallBtn=!1),"pdf"===s&&(l.type="iframe",l.opts.iframe.preload=!1),l.opts.modal&&(l.opts=n.extend(!0,l.opts,{infobar:0,toolbar:0,smallBtn:0,keyboard:0,slideShow:0,fullScreen:0,thumbs:0,touch:0,clickContent:!1,clickSlide:!1,clickOutside:!1,dblclickContent:!1,dblclickSlide:!1,dblclickOutside:!1})),e.group.push(l)})},addEvents:function(){var o=this;o.removeEvents(),o.$refs.container.on("click.fb-close","[data-fancybox-close]",function(t){t.stopPropagation(),t.preventDefault(),o.close(t)}).on("click.fb-prev touchend.fb-prev","[data-fancybox-prev]",function(t){t.stopPropagation(),t.preventDefault(),o.previous()}).on("click.fb-next touchend.fb-next","[data-fancybox-next]",function(t){t.stopPropagation(),t.preventDefault(),o.next()}),s.on("orientationchange.fb resize.fb",function(t){t&&t.originalEvent&&"resize"===t.originalEvent.type?u(function(){o.update()}):(o.$refs.stage.hide(),setTimeout(function(){o.$refs.stage.show(),o.update()},500))}),r.on("focusin.fb",function(t){var i=n.fancybox?n.fancybox.getInstance():null;i.isClosing||!i.current||!i.current.opts.trapFocus||n(t.target).hasClass("fancybox-container")||n(t.target).is(e)||i&&"fixed"!==n(t.target).css("position")&&!i.$refs.container.has(t.target).length&&(t.stopPropagation(),i.focus(),s.scrollTop(o.scrollTop).scrollLeft(o.scrollLeft))}),r.on("keydown.fb",function(t){var e=o.current,i=t.keyCode||t.which;if(e&&e.opts.keyboard&&!n(t.target).is("input")&&!n(t.target).is("textarea"))return 8===i||27===i?(t.preventDefault(),void o.close(t)):37===i||38===i?(t.preventDefault(),void o.previous()):39===i||40===i?(t.preventDefault(),void o.next()):void o.trigger("afterKeydown",t,i)}),o.group[o.currIndex].opts.idleTime&&(o.idleSecondsCounter=0,r.on("mousemove.fb-idle mouseenter.fb-idle mouseleave.fb-idle mousedown.fb-idle touchstart.fb-idle touchmove.fb-idle scroll.fb-idle keydown.fb-idle",function(){o.idleSecondsCounter=0,o.isIdle&&o.showControls(),o.isIdle=!1}),o.idleInterval=t.setInterval(function(){o.idleSecondsCounter++,o.idleSecondsCounter>=o.group[o.currIndex].opts.idleTime&&(o.isIdle=!0,o.idleSecondsCounter=0,o.hideControls())},1e3))},removeEvents:function(){var e=this;s.off("orientationchange.fb resize.fb"),r.off("focusin.fb keydown.fb .fb-idle"),this.$refs.container.off(".fb-close .fb-prev .fb-next"),e.idleInterval&&(t.clearInterval(e.idleInterval),e.idleInterval=null)},previous:function(t){return this.jumpTo(this.currPos-1,t)},next:function(t){return this.jumpTo(this.currPos+1,t)},jumpTo:function(t,e,i){var a,s,r,c,l,u,d,p=this,h=p.group.length;if(!(p.isSliding||p.isClosing||p.isAnimating&&p.firstRun)){if(t=parseInt(t,10),s=p.current?p.current.opts.loop:p.opts.loop,!s&&(t<0||t>=h))return!1;if(a=p.firstRun=null===p.firstRun,!(h<2&&!a&&p.isSliding)){if(c=p.current,p.prevIndex=p.currIndex,p.prevPos=p.currPos,r=p.createSlide(t),h>1&&((s||r.index>0)&&p.createSlide(t-1),(s||r.indexr.pos?"next":"previous"),c.$slide.removeClass("fancybox-slide--complete fancybox-slide--current fancybox-slide--next fancybox-slide--previous"),c.isComplete=!1,e&&(r.isMoved||r.opts.transitionEffect)&&(r.isMoved?c.$slide.addClass(d):(d="fancybox-animated "+d+" fancybox-fx-"+r.opts.transitionEffect,n.fancybox.animate(c.$slide,d,e,function(){c.$slide.removeClass(d).removeAttr("style")}))))}}},createSlide:function(t){var e,o,i=this;return o=t%i.group.length,o=o<0?i.group.length+o:o,!i.slides[t]&&i.group[o]&&(e=n('
').appendTo(i.$refs.stage),i.slides[t]=n.extend(!0,{},i.group[o],{pos:t,$slide:e,isLoaded:!1}),i.updateSlide(i.slides[t])),i.slides[t]},scaleToActual:function(t,e,i){var a,s,r,c,l,u=this,d=u.current,f=d.$content,p=parseInt(d.$slide.width(),10),h=parseInt(d.$slide.height(),10),g=d.width,b=d.height;"image"!=d.type||d.hasError||!f||u.isAnimating||(n.fancybox.stop(f),u.isAnimating=!0,t=t===o?.5*p:t,e=e===o?.5*h:e,a=n.fancybox.getTranslate(f),c=g/a.width,l=b/a.height,s=.5*p-.5*g,r=.5*h-.5*b,g>p&&(s=a.left*c-(t*c-t),s>0&&(s=0),sh&&(r=a.top*l-(e*l-e),r>0&&(r=0),rt.width||o.height>t.height))},isScaledDown:function(){var t=this,e=t.current,o=e.$content,i=!1;return o&&(i=n.fancybox.getTranslate(o),i=i.width1||Math.abs(n.height()-o.height)>1),o},loadSlide:function(t){var e,o,i,a=this;if(!t.isLoading&&!t.isLoaded){switch(t.isLoading=!0,a.trigger("beforeLoad",t),e=t.type,o=t.$slide,o.off("refresh").trigger("onReset").addClass("fancybox-slide--"+(e||"unknown")).addClass(t.opts.slideClass),e){case"image":a.setImage(t);break;case"iframe":a.setIframe(t);break;case"html":a.setContent(t,t.src||t.content);break;case"inline":n(t.src).length?a.setContent(t,n(t.src)):a.setError(t);break;case"ajax":a.showLoading(t),i=n.ajax(n.extend({},t.opts.ajax.settings,{url:t.src,success:function(e,n){"success"===n&&a.setContent(t,e)},error:function(e,n){e&&"abort"!==n&&a.setError(t)}})),o.one("onReset",function(){i.abort()});break;default:a.setError(t)}return!0}},setImage:function(e){var o,i,a,s,r=this,c=e.opts.image.srcset;if(c){a=t.devicePixelRatio||1,s=t.innerWidth*a,i=c.split(",").map(function(t){var e={};return t.trim().split(/\s+/).forEach(function(t,n){var o=parseInt(t.substring(0,t.length-1),10);return 0===n?e.url=t:void(o&&(e.value=o,e.postfix=t[t.length-1]))}),e}),i.sort(function(t,e){return t.value-e.value});for(var l=0;l=s||"x"===u.postfix&&u.value>=a){o=u;break}}!o&&i.length&&(o=i[i.length-1]),o&&(e.src=o.url,e.width&&e.height&&"w"==o.postfix&&(e.height=e.width/e.height*o.value,e.width=o.value))}e.$content=n('
').addClass("fancybox-is-hidden").appendTo(e.$slide),e.opts.preload!==!1&&e.opts.width&&e.opts.height&&(e.opts.thumb||e.opts.$thumb)?(e.width=e.opts.width,e.height=e.opts.height,e.$ghost=n("").one("error",function(){n(this).remove(),e.$ghost=null,r.setBigImage(e)}).one("load",function(){r.afterLoad(e),r.setBigImage(e)}).addClass("fancybox-image").appendTo(e.$content).attr("src",e.opts.thumb||e.opts.$thumb.attr("src"))):r.setBigImage(e)},setBigImage:function(t){var e=this,o=n("");t.$image=o.one("error",function(){e.setError(t)}).one("load",function(){clearTimeout(t.timouts),t.timouts=null,e.isClosing||(t.width=this.naturalWidth,t.height=this.naturalHeight,t.opts.image.srcset&&o.attr("sizes","100vw").attr("srcset",t.opts.image.srcset),e.hideLoading(t),t.$ghost?t.timouts=setTimeout(function(){t.timouts=null,t.$ghost.hide()},Math.min(300,Math.max(1e3,t.height/1600))):e.afterLoad(t))}).addClass("fancybox-image").attr("src",t.src).appendTo(t.$content),(o[0].complete||"complete"==o[0].readyState)&&o[0].naturalWidth&&o[0].naturalHeight?o.trigger("load"):o[0].error?o.trigger("error"):t.timouts=setTimeout(function(){o[0].complete||t.hasError||e.showLoading(t)},100)},setIframe:function(t){var e,i=this,a=t.opts.iframe,s=t.$slide;t.$content=n('
').css(a.css).appendTo(s),e=n(a.tpl.replace(/\{rnd\}/g,(new Date).getTime())).attr(a.attr).appendTo(t.$content),a.preload?(i.showLoading(t),e.on("load.fb error.fb",function(e){this.isReady=1,t.$slide.trigger("refresh"),i.afterLoad(t)}),s.on("refresh.fb",function(){var n,i,s,r=t.$content,c=a.css.width,l=a.css.height;if(1===e[0].isReady){try{i=e.contents(),s=i.find("body")}catch(t){}s&&s.length&&(c===o&&(n=e[0].contentWindow.document.documentElement.scrollWidth,c=Math.ceil(s.outerWidth(!0)+(r.width()-n)),c+=r.outerWidth()-r.innerWidth()),l===o&&(l=Math.ceil(s.outerHeight(!0)),l+=r.outerHeight()-r.innerHeight()),c&&r.width(c),l&&r.height(l)),r.removeClass("fancybox-is-hidden")}})):this.afterLoad(t),e.attr("src",t.src),t.opts.smallBtn===!0&&t.$content.prepend(i.translate(t,t.opts.btnTpl.smallBtn)),s.one("onReset",function(){try{n(this).find("iframe").hide().attr("src","//about:blank")}catch(t){}n(this).empty(),t.isLoaded=!1})},setContent:function(t,e){var o=this;o.isClosing||(o.hideLoading(t),t.$slide.empty(),l(e)&&e.parent().length?(e.parent(".fancybox-slide--inline").trigger("onReset"),t.$placeholder=n("
").hide().insertAfter(e),e.css("display","inline-block")):t.hasError||("string"===n.type(e)&&(e=n("
").append(n.trim(e)).contents(),3===e[0].nodeType&&(e=n("
").html(e))),t.opts.filter&&(e=n("
").html(e).find(t.opts.filter))),t.$slide.one("onReset",function(){t.$placeholder&&(t.$placeholder.after(e.hide()).remove(),t.$placeholder=null),t.$smallBtn&&(t.$smallBtn.remove(),t.$smallBtn=null),t.hasError||(n(this).empty(),t.isLoaded=!1)}),t.$content=n(e).appendTo(t.$slide),t.opts.smallBtn&&!t.$smallBtn&&(t.$smallBtn=n(o.translate(t,t.opts.btnTpl.smallBtn)).appendTo(t.$content.filter("div").first())),this.afterLoad(t))},setError:function(t){t.hasError=!0,t.$slide.removeClass("fancybox-slide--"+t.type),this.setContent(t,this.translate(t,t.opts.errorTpl))},showLoading:function(t){var e=this;t=t||e.current,t&&!t.$spinner&&(t.$spinner=n(e.opts.spinnerTpl).appendTo(t.$slide))},hideLoading:function(t){var e=this;t=t||e.current,t&&t.$spinner&&(t.$spinner.remove(),delete t.$spinner)},afterLoad:function(t){var e=this;e.isClosing||(t.isLoading=!1,t.isLoaded=!0,e.trigger("afterLoad",t),e.hideLoading(t),t.opts.protect&&t.$content&&!t.hasError&&(t.$content.on("contextmenu.fb",function(t){return 2==t.button&&t.preventDefault(),!0}),"image"===t.type&&n('
').appendTo(t.$content)),e.revealContent(t))},revealContent:function(t){var e,i,a,s,r,c=this,l=t.$slide,u=!1;return e=t.opts[c.firstRun?"animationEffect":"transitionEffect"],a=t.opts[c.firstRun?"animationDuration":"transitionDuration"],a=parseInt(t.forcedDuration===o?a:t.forcedDuration,10),!t.isMoved&&t.pos===c.currPos&&a||(e=!1),"zoom"!==e||t.pos===c.currPos&&a&&"image"===t.type&&!t.hasError&&(u=c.getThumbPos(t))||(e="fade"),"zoom"===e?(r=c.getFitPos(t),r.scaleX=r.width/u.width,r.scaleY=r.height/u.height,delete r.width,delete r.height,s=t.opts.zoomOpacity,"auto"==s&&(s=Math.abs(t.width/t.height-u.width/u.height)>.1),s&&(u.opacity=.1,r.opacity=1),n.fancybox.setTranslate(t.$content.removeClass("fancybox-is-hidden"),u),f(t.$content),void n.fancybox.animate(t.$content,r,a,function(){c.complete()})):(c.updateSlide(t),e?(n.fancybox.stop(l),i="fancybox-animated fancybox-slide--"+(t.pos>c.prevPos?"next":"previous")+" fancybox-fx-"+e,l.removeAttr("style").removeClass("fancybox-slide--current fancybox-slide--next fancybox-slide--previous").addClass(i),t.$content.removeClass("fancybox-is-hidden"),f(l),void n.fancybox.animate(l,"fancybox-slide--current",a,function(e){l.removeClass(i).removeAttr("style"),t.pos===c.currPos&&c.complete()},!0)):(f(l),t.$content.removeClass("fancybox-is-hidden"),void(t.pos===c.currPos&&c.complete())))},getThumbPos:function(o){var i,a=this,s=!1,r=function(e){for(var o,i=e[0],a=i.getBoundingClientRect(),s=[];null!==i.parentElement;)"hidden"!==n(i.parentElement).css("overflow")&&"auto"!==n(i.parentElement).css("overflow")||s.push(i.parentElement.getBoundingClientRect()),i=i.parentElement;return o=s.every(function(t){var e=Math.min(a.right,t.right)-Math.max(a.left,t.left),n=Math.min(a.bottom,t.bottom)-Math.max(a.top,t.top);return e>0&&n>0}),o&&a.bottom>0&&a.right>0&&a.left=t.currPos-1&&o.pos<=t.currPos+1?i[o.pos]=o:o&&(n.fancybox.stop(o.$slide),o.$slide.off().remove())}),t.slides=i,t.updateCursor(),t.trigger("afterShow"),(n(e.activeElement).is("[disabled]")||o.opts.autoFocus&&"image"!=o.type&&"iframe"!==o.type)&&t.focus())},preload:function(){var t,e,n=this;n.group.length<2||(t=n.slides[n.currPos+1],e=n.slides[n.currPos-1],t&&"image"===t.type&&n.loadSlide(t),e&&"image"===e.type&&n.loadSlide(e))},focus:function(){var t,e=this.current;this.isClosing||(e&&e.isComplete&&(t=e.$slide.find("input[autofocus]:enabled:visible:first"),t.length||(t=e.$slide.find("button,:input,[tabindex],a").filter(":enabled:visible:first"))),t=t&&t.length?t:this.$refs.container,t.focus())},activate:function(){var t=this;n(".fancybox-container").each(function(){var e=n(this).data("FancyBox");e&&e.uid!==t.uid&&!e.isClosing&&e.trigger("onDeactivate")}),t.current&&(t.$refs.container.index()>0&&t.$refs.container.prependTo(e.body),t.updateControls()),t.trigger("onActivate"),t.addEvents()},close:function(t,e){var o,i,a,s,r,c,l=this,f=l.current,p=function(){l.cleanUp(t)};return!l.isClosing&&(l.isClosing=!0,l.trigger("beforeClose",t)===!1?(l.isClosing=!1,u(function(){l.update()}),!1):(l.removeEvents(),f.timouts&&clearTimeout(f.timouts),a=f.$content,o=f.opts.animationEffect,i=n.isNumeric(e)?e:o?f.opts.animationDuration:0,f.$slide.off(d).removeClass("fancybox-slide--complete fancybox-slide--next fancybox-slide--previous fancybox-animated"),f.$slide.siblings().trigger("onReset").remove(),i&&l.$refs.container.removeClass("fancybox-is-open").addClass("fancybox-is-closing"),l.hideLoading(f),l.hideControls(),l.updateCursor(),"zoom"!==o||t!==!0&&a&&i&&"image"===f.type&&!f.hasError&&(c=l.getThumbPos(f))||(o="fade"),"zoom"===o?(n.fancybox.stop(a),r=n.fancybox.getTranslate(a),r.width=r.width*r.scaleX,r.height=r.height*r.scaleY,s=f.opts.zoomOpacity,"auto"==s&&(s=Math.abs(f.width/f.height-c.width/c.height)>.1),s&&(c.opacity=0),r.scaleX=r.width/c.width,r.scaleY=r.height/c.height,r.width=c.width,r.height=c.height,n.fancybox.setTranslate(f.$content,r),n.fancybox.animate(f.$content,c,i,p),!0):(o&&i?t===!0?setTimeout(p,i):n.fancybox.animate(f.$slide.removeClass("fancybox-slide--current"),"fancybox-animated fancybox-slide--previous fancybox-fx-"+o,i,p):p(),!0)))},cleanUp:function(t){var e,o=this;o.current.$slide.trigger("onReset"),o.$refs.container.empty().remove(),o.trigger("afterClose",t),o.$lastFocus&&o.current.opts.backFocus&&o.$lastFocus.focus(),o.current=null,e=n.fancybox.getInstance(),e?e.activate():(s.scrollTop(o.scrollTop).scrollLeft(o.scrollLeft),n("html").removeClass("fancybox-enabled"),n("#fancybox-style-noscroll").remove())},trigger:function(t,e){var o,i=Array.prototype.slice.call(arguments,1),a=this,s=e&&e.opts?e:a.current;return s?i.unshift(s):s=a,i.unshift(a),n.isFunction(s.opts[t])&&(o=s.opts[t].apply(s,i)),o===!1?o:void("afterClose"===t?r.trigger(t+".fb",i):a.$refs.container.trigger(t+".fb",i))},updateControls:function(t){var e=this,o=e.current,i=o.index,a=o.opts,s=a.caption,r=e.$refs.caption;o.$slide.trigger("refresh"),e.$caption=s&&s.length?r.html(s):null,e.isHiddenControls||e.showControls(),n("[data-fancybox-count]").html(e.group.length),n("[data-fancybox-index]").html(i+1),n("[data-fancybox-prev]").prop("disabled",!a.loop&&i<=0),n("[data-fancybox-next]").prop("disabled",!a.loop&&i>=e.group.length-1)},hideControls:function(){this.isHiddenControls=!0,this.$refs.container.removeClass("fancybox-show-infobar fancybox-show-toolbar fancybox-show-caption fancybox-show-nav")},showControls:function(){var t=this,e=t.current?t.current.opts:t.opts,n=t.$refs.container;t.isHiddenControls=!1,t.idleSecondsCounter=0,n.toggleClass("fancybox-show-toolbar",!(!e.toolbar||!e.buttons)).toggleClass("fancybox-show-infobar",!!(e.infobar&&t.group.length>1)).toggleClass("fancybox-show-nav",!!(e.arrows&&t.group.length>1)).toggleClass("fancybox-is-modal",!!e.modal),t.$caption?n.addClass("fancybox-show-caption "):n.removeClass("fancybox-show-caption")},toggleControls:function(){this.isHiddenControls?this.showControls():this.hideControls()}}),n.fancybox={version:"3.1.27",defaults:a,getInstance:function(t){var e=n('.fancybox-container:not(".fancybox-is-closing"):first').data("FancyBox"),o=Array.prototype.slice.call(arguments,1);return e instanceof p&&("string"===n.type(t)?e[t].apply(e,o):"function"===n.type(t)&&t.apply(e,o),e)},open:function(t,e,n){return new p(t,e,n)},close:function(t){var e=this.getInstance();e&&(e.close(),t===!0&&this.close())},destroy:function(){this.close(!0),r.off("click.fb-start")},isMobile:e.createTouch!==o&&/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent),use3d:function(){var n=e.createElement("div");return t.getComputedStyle&&t.getComputedStyle(n).getPropertyValue("transform")&&!(e.documentMode&&e.documentMode<11)}(),getTranslate:function(t){var e;if(!t||!t.length)return!1;if(e=t.eq(0).css("transform"),e&&e.indexOf("matrix")!==-1?(e=e.split("(")[1],e=e.split(")")[0],e=e.split(",")):e=[],e.length)e=e.length>10?[e[13],e[12],e[0],e[5]]:[e[5],e[4],e[0],e[3]],e=e.map(parseFloat);else{e=[0,0,1,1];var n=/\.*translate\((.*)px,(.*)px\)/i,o=n.exec(t.eq(0).attr("style"));o&&(e[0]=parseFloat(o[2]),e[1]=parseFloat(o[1]))}return{top:e[0],left:e[1],scaleX:e[2],scaleY:e[3],opacity:parseFloat(t.css("opacity")),width:t.width(),height:t.height()}},setTranslate:function(t,e){var n="",i={};if(t&&e)return e.left===o&&e.top===o||(n=(e.left===o?t.position().left:e.left)+"px, "+(e.top===o?t.position().top:e.top)+"px",n=this.use3d?"translate3d("+n+", 0px)":"translate("+n+")"),e.scaleX!==o&&e.scaleY!==o&&(n=(n.length?n+" ":"")+"scale("+e.scaleX+", "+e.scaleY+")"),n.length&&(i.transform=n),e.opacity!==o&&(i.opacity=e.opacity),e.width!==o&&(i.width=e.width),e.height!==o&&(i.height=e.height),t.css(i)},animate:function(t,e,i,a,s){var r=d||"transitionend";n.isFunction(i)&&(a=i,i=null),n.isPlainObject(e)||t.removeAttr("style"),t.on(r,function(i){(!i||!i.originalEvent||t.is(i.originalEvent.target)&&"z-index"!=i.originalEvent.propertyName)&&(t.off(r),n.isPlainObject(e)?e.scaleX!==o&&e.scaleY!==o&&(t.css("transition-duration","0ms"),e.width=Math.round(t.width()*e.scaleX),e.height=Math.round(t.height()*e.scaleY),e.scaleX=1,e.scaleY=1,n.fancybox.setTranslate(t,e)):s!==!0&&t.removeClass(e),n.isFunction(a)&&a(i))}),n.isNumeric(i)&&t.css("transition-duration",i+"ms"),n.isPlainObject(e)?n.fancybox.setTranslate(t,e):t.addClass(e),t.data("timer",setTimeout(function(){t.trigger("transitionend")},i+16))},stop:function(t){clearTimeout(t.data("timer")),t.off(d)}},n.fn.fancybox=function(t){var e;return t=t||{},e=t.selector||!1,e?n("body").off("click.fb-start",e).on("click.fb-start",e,{options:t},i):this.off("click.fb-start").on("click.fb-start",{items:this,options:t},i),this},r.on("click.fb-start","[data-fancybox]",i)}}(window,document,window.jQuery||jQuery),function(t){"use strict";var e=function(e,n,o){if(e)return o=o||"","object"===t.type(o)&&(o=t.param(o,!0)),t.each(n,function(t,n){e=e.replace("$"+t,n||"")}),o.length&&(e+=(e.indexOf("?")>0?"&":"?")+o),e},n={youtube:{matcher:/(youtube\.com|youtu\.be|youtube\-nocookie\.com)\/(watch\?(.*&)?v=|v\/|u\/|embed\/?)?(videoseries\?list=(.*)|[\w-]{11}|\?listType=(.*)&list=(.*))(.*)/i,params:{autoplay:1,autohide:1,fs:1,rel:0,hd:1,wmode:"transparent",enablejsapi:1,html5:1},paramPlace:8,type:"iframe",url:"//www.youtube.com/embed/$4",thumb:"//img.youtube.com/vi/$4/hqdefault.jpg"},vimeo:{matcher:/^.+vimeo.com\/(.*\/)?([\d]+)(.*)?/,params:{autoplay:1,hd:1,show_title:1,show_byline:1,show_portrait:0,fullscreen:1,api:1},paramPlace:3,type:"iframe",url:"//player.vimeo.com/video/$2"},metacafe:{matcher:/metacafe.com\/watch\/(\d+)\/(.*)?/,type:"iframe",url:"//www.metacafe.com/embed/$1/?ap=1"},dailymotion:{matcher:/dailymotion.com\/video\/(.*)\/?(.*)/,params:{additionalInfos:0,autoStart:1},type:"iframe",url:"//www.dailymotion.com/embed/video/$1"},vine:{matcher:/vine.co\/v\/([a-zA-Z0-9\?\=\-]+)/,type:"iframe",url:"//vine.co/v/$1/embed/simple"},instagram:{matcher:/(instagr\.am|instagram\.com)\/p\/([a-zA-Z0-9_\-]+)\/?/i,type:"image",url:"//$1/p/$2/media/?size=l"},gmap_place:{matcher:/(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(((maps\/(place\/(.*)\/)?\@(.*),(\d+.?\d+?)z))|(\?ll=))(.*)?/i,type:"iframe",url:function(t){return"//maps.google."+t[2]+"/?ll="+(t[9]?t[9]+"&z="+Math.floor(t[10])+(t[12]?t[12].replace(/^\//,"&"):""):t[12])+"&output="+(t[12]&&t[12].indexOf("layer=c")>0?"svembed":"embed")}},gmap_search:{matcher:/(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(maps\/search\/)(.*)/i,type:"iframe",url:function(t){return"//maps.google."+t[2]+"/maps?q="+t[5].replace("query=","q=").replace("api=1","")+"&output=embed"}}};t(document).on("onInit.fb",function(o,i){t.each(i.group,function(o,i){var a,s,r,c,l,u,d,f=i.src||"",p=!1;i.type||(a=t.extend(!0,{},n,i.opts.media),t.each(a,function(n,o){if(r=f.match(o.matcher),u={},d=n,r){if(p=o.type,o.paramPlace&&r[o.paramPlace]){l=r[o.paramPlace],"?"==l[0]&&(l=l.substring(1)),l=l.split("&");for(var a=0;ae.clientHeight,a=("scroll"===o||"auto"===o)&&e.scrollWidth>e.clientWidth;return i||a},l=function(t){for(var e=!1;;){if(e=c(t.get(0)))break;if(t=t.parent(),!t.length||t.hasClass("fancybox-stage")||t.is("body"))break}return e},u=function(t){var e=this;e.instance=t,e.$bg=t.$refs.bg,e.$stage=t.$refs.stage,e.$container=t.$refs.container,e.destroy(),e.$container.on("touchstart.fb.touch mousedown.fb.touch",n.proxy(e,"ontouchstart"))};u.prototype.destroy=function(){this.$container.off(".fb.touch")},u.prototype.ontouchstart=function(o){var i=this,c=n(o.target),u=i.instance,d=u.current,f=d.$content,p="touchstart"==o.type;if(p&&i.$container.off("mousedown.fb.touch"),!d||i.instance.isAnimating||i.instance.isClosing)return o.stopPropagation(),void o.preventDefault();if((!o.originalEvent||2!=o.originalEvent.button)&&c.length&&!r(c)&&!r(c.parent())&&!(o.originalEvent.clientX>c[0].clientWidth+c.offset().left)&&(i.startPoints=a(o),i.startPoints&&!(i.startPoints.length>1&&u.isSliding))){if(i.$target=c,i.$content=f,i.canTap=!0,n(e).off(".fb.touch"),n(e).on(p?"touchend.fb.touch touchcancel.fb.touch":"mouseup.fb.touch mouseleave.fb.touch",n.proxy(i,"ontouchend")),n(e).on(p?"touchmove.fb.touch":"mousemove.fb.touch",n.proxy(i,"ontouchmove")),!u.current.opts.touch&&!u.canPan()||!c.is(i.$stage)&&!i.$stage.find(c).length)return void(c.is("img")&&o.preventDefault());o.stopPropagation(),n.fancybox.isMobile&&(l(i.$target)||l(i.$target.parent()))||o.preventDefault(),i.canvasWidth=Math.round(d.$slide[0].clientWidth),i.canvasHeight=Math.round(d.$slide[0].clientHeight),i.startTime=(new Date).getTime(),i.distanceX=i.distanceY=i.distance=0,i.isPanning=!1,i.isSwiping=!1,i.isZooming=!1,i.sliderStartPos=i.sliderLastPos||{top:0,left:0},i.contentStartPos=n.fancybox.getTranslate(i.$content),i.contentLastPos=null,1!==i.startPoints.length||i.isZooming||(i.canTap=!u.isSliding,"image"===d.type&&(i.contentStartPos.width>i.canvasWidth+1||i.contentStartPos.height>i.canvasHeight+1)?(n.fancybox.stop(i.$content),i.$content.css("transition-duration","0ms"),i.isPanning=!0):i.isSwiping=!0,i.$container.addClass("fancybox-controls--isGrabbing")),2!==i.startPoints.length||u.isAnimating||d.hasError||"image"!==d.type||!d.isLoaded&&!d.$ghost||(i.isZooming=!0,i.isSwiping=!1,i.isPanning=!1,n.fancybox.stop(i.$content),i.$content.css("transition-duration","0ms"),i.centerPointStartX=.5*(i.startPoints[0].x+i.startPoints[1].x)-n(t).scrollLeft(),i.centerPointStartY=.5*(i.startPoints[0].y+i.startPoints[1].y)-n(t).scrollTop(),i.percentageOfImageAtPinchPointX=(i.centerPointStartX-i.contentStartPos.left)/i.contentStartPos.width,i.percentageOfImageAtPinchPointY=(i.centerPointStartY-i.contentStartPos.top)/i.contentStartPos.height,i.startDistanceBetweenFingers=s(i.startPoints[0],i.startPoints[1]))}},u.prototype.ontouchmove=function(t){var e=this;if(e.newPoints=a(t),n.fancybox.isMobile&&(l(e.$target)||l(e.$target.parent())))return t.stopPropagation(),void(e.canTap=!1);if((e.instance.current.opts.touch||e.instance.canPan())&&e.newPoints&&e.newPoints.length&&(e.distanceX=s(e.newPoints[0],e.startPoints[0],"x"),e.distanceY=s(e.newPoints[0],e.startPoints[0],"y"),e.distance=s(e.newPoints[0],e.startPoints[0]),e.distance>0)){if(!e.$target.is(e.$stage)&&!e.$stage.find(e.$target).length)return;t.stopPropagation(),t.preventDefault(),e.isSwiping?e.onSwipe():e.isPanning?e.onPan():e.isZooming&&e.onZoom()}},u.prototype.onSwipe=function(){var e,a=this,s=a.isSwiping,r=a.sliderStartPos.left||0;s===!0?Math.abs(a.distance)>10&&(a.canTap=!1,a.instance.group.length<2&&a.instance.opts.touch.vertical?a.isSwiping="y":a.instance.isSliding||a.instance.opts.touch.vertical===!1||"auto"===a.instance.opts.touch.vertical&&n(t).width()>800?a.isSwiping="x":(e=Math.abs(180*Math.atan2(a.distanceY,a.distanceX)/Math.PI),a.isSwiping=e>45&&e<135?"y":"x"),a.instance.isSliding=a.isSwiping,a.startPoints=a.newPoints,n.each(a.instance.slides,function(t,e){n.fancybox.stop(e.$slide),e.$slide.css("transition-duration","0ms"),e.inTransition=!1,e.pos===a.instance.current.pos&&(a.sliderStartPos.left=n.fancybox.getTranslate(e.$slide).left)}),a.instance.SlideShow&&a.instance.SlideShow.isActive&&a.instance.SlideShow.stop()):("x"==s&&(a.distanceX>0&&(a.instance.group.length<2||0===a.instance.current.index&&!a.instance.current.opts.loop)?r+=Math.pow(a.distanceX,.8):a.distanceX<0&&(a.instance.group.length<2||a.instance.current.index===a.instance.group.length-1&&!a.instance.current.opts.loop)?r-=Math.pow(-a.distanceX,.8):r+=a.distanceX),a.sliderLastPos={top:"x"==s?0:a.sliderStartPos.top+a.distanceY,left:r},a.requestId&&(i(a.requestId),a.requestId=null),a.requestId=o(function(){a.sliderLastPos&&(n.each(a.instance.slides,function(t,e){var o=e.pos-a.instance.currPos;n.fancybox.setTranslate(e.$slide,{top:a.sliderLastPos.top,left:a.sliderLastPos.left+o*a.canvasWidth+o*e.opts.gutter})}),a.$container.addClass("fancybox-is-sliding"))}))},u.prototype.onPan=function(){var t,e,a,s=this;s.canTap=!1,t=s.contentStartPos.width>s.canvasWidth?s.contentStartPos.left+s.distanceX:s.contentStartPos.left,e=s.contentStartPos.top+s.distanceY,a=s.limitMovement(t,e,s.contentStartPos.width,s.contentStartPos.height),a.scaleX=s.contentStartPos.scaleX,a.scaleY=s.contentStartPos.scaleY,s.contentLastPos=a,s.requestId&&(i(s.requestId),s.requestId=null),s.requestId=o(function(){n.fancybox.setTranslate(s.$content,s.contentLastPos)})},u.prototype.limitMovement=function(t,e,n,o){var i,a,s,r,c=this,l=c.canvasWidth,u=c.canvasHeight,d=c.contentStartPos.left,f=c.contentStartPos.top,p=c.distanceX,h=c.distanceY;return i=Math.max(0,.5*l-.5*n),a=Math.max(0,.5*u-.5*o),s=Math.min(l-n,.5*l-.5*n),r=Math.min(u-o,.5*u-.5*o),n>l&&(p>0&&t>i&&(t=i-1+Math.pow(-i+d+p,.8)||0),p<0&&tu&&(h>0&&e>a&&(e=a-1+Math.pow(-a+f+h,.8)||0),h<0&&ea?(t=t>0?0:t,t=ts?(e=e>0?0:e,e=e50?(n.fancybox.animate(e.instance.current.$slide,{top:e.sliderStartPos.top+e.distanceY+150*e.velocityY,opacity:0},150),o=e.instance.close(!0,300)):"x"==t&&e.distanceX>50&&e.instance.group.length>1?o=e.instance.previous(e.speedX):"x"==t&&e.distanceX<-50&&e.instance.group.length>1&&(o=e.instance.next(e.speedX)),o!==!1||"x"!=t&&"y"!=t||e.instance.jumpTo(e.instance.current.index,150),e.$container.removeClass("fancybox-is-sliding")},u.prototype.endPanning=function(){var t,e,o,i=this;i.contentLastPos&&(i.instance.current.opts.touch.momentum===!1?(t=i.contentLastPos.left,e=i.contentLastPos.top):(t=i.contentLastPos.left+i.velocityX*i.speed,e=i.contentLastPos.top+i.velocityY*i.speed),o=i.limitPosition(t,e,i.contentStartPos.width,i.contentStartPos.height),o.width=i.contentStartPos.width,o.height=i.contentStartPos.height,n.fancybox.animate(i.$content,o,330))},u.prototype.endZooming=function(){var t,e,o,i,a=this,s=a.instance.current,r=a.newWidth,c=a.newHeight;a.contentLastPos&&(t=a.contentLastPos.left,e=a.contentLastPos.top,i={top:e,left:t,width:r,height:c,scaleX:1,scaleY:1},n.fancybox.setTranslate(a.$content,i),rs.width||c>s.height?a.instance.scaleToActual(a.centerPointStartX,a.centerPointStartY,150):(o=a.limitPosition(t,e,r,c),n.fancybox.setTranslate(a.content,n.fancybox.getTranslate(a.$content)),n.fancybox.animate(a.$content,o,150)))},u.prototype.onTap=function(t){var e,o=this,i=n(t.target),s=o.instance,r=s.current,c=t&&a(t)||o.startPoints,l=c[0]?c[0].x-o.$stage.offset().left:0,u=c[0]?c[0].y-o.$stage.offset().top:0,d=function(e){var i=r.opts[e];if(n.isFunction(i)&&(i=i.apply(s,[r,t])),i)switch(i){case"close":s.close(o.startEvent);break;case"toggleControls":s.toggleControls(!0);break;case"next":s.next();break;case"nextOrClose":s.group.length>1?s.next():s.close(o.startEvent);break;case"zoom":"image"==r.type&&(r.isLoaded||r.$ghost)&&(s.canPan()?s.scaleToFit():s.isScaledDown()?s.scaleToActual(l,u):s.group.length<2&&s.close(o.startEvent))}};if(!(t.originalEvent&&2==t.originalEvent.button||s.isSliding||l>i[0].clientWidth+i.offset().left)){if(i.is(".fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-container"))e="Outside";else if(i.is(".fancybox-slide"))e="Slide";else{if(!s.current.$content||!s.current.$content.has(t.target).length)return;e="Content"}if(o.tapped){if(clearTimeout(o.tapped),o.tapped=null,Math.abs(l-o.tapX)>50||Math.abs(u-o.tapY)>50||s.isSliding)return this;d("dblclick"+e)}else o.tapX=l,o.tapY=u,r.opts["dblclick"+e]&&r.opts["dblclick"+e]!==r.opts["click"+e]?o.tapped=setTimeout(function(){o.tapped=null,d("click"+e)},300):d("click"+e);return this}},n(e).on("onActivate.fb",function(t,e){e&&!e.Guestures&&(e.Guestures=new u(e))}),n(e).on("beforeClose.fb",function(t,e){e&&e.Guestures&&e.Guestures.destroy()})}(window,document,window.jQuery),function(t,e){"use strict";var n=function(t){this.instance=t,this.init()};e.extend(n.prototype,{timer:null,isActive:!1,$button:null,speed:3e3,init:function(){var t=this;t.$button=t.instance.$refs.toolbar.find("[data-fancybox-play]").on("click",function(){t.toggle()}),(t.instance.group.length<2||!t.instance.group[t.instance.currIndex].opts.slideShow)&&t.$button.hide()},set:function(){var t=this;t.instance&&t.instance.current&&(t.instance.current.opts.loop||t.instance.currIndex1&&t.instance.group[t.instance.currIndex].opts.thumbs&&("image"==e.type||e.opts.thumb||e.opts.$thumb)&&("image"==n.type||n.opts.thumb||n.opts.$thumb)?(t.$button.on("click",function(){t.toggle()}),t.isActive=!0):(t.$button.hide(),t.isActive=!1)},create:function(){var t,n,o=this.instance;this.$grid=e('
').appendTo(o.$refs.container),t="
    ",e.each(o.group,function(e,o){n=o.opts.thumb||(o.opts.$thumb?o.opts.$thumb.attr("src"):null),n||"image"!==o.type||(n=o.src),n&&n.length&&(t+='
  • ')}),t+="
",this.$list=e(t).appendTo(this.$grid).on("click","li",function(){o.jumpTo(e(this).data("index"))}),this.$list.find("img").hide().one("load",function(){var t,n,o,i,a=e(this).parent().removeClass("fancybox-thumbs-loading"),s=a.outerWidth(),r=a.outerHeight();t=this.naturalWidth||this.width,n=this.naturalHeight||this.height,o=t/s,i=n/r,o>=1&&i>=1&&(o>i?(t/=i,n=r):(t=s,n/=o)),e(this).css({width:Math.floor(t),height:Math.floor(n),"margin-top":Math.min(0,Math.floor(.3*r-.3*n)),"margin-left":Math.min(0,Math.floor(.5*s-.5*t))}).show()}).each(function(){this.src=e(this).data("src")})},focus:function(){this.instance.current&&this.$list.children().removeClass("fancybox-thumbs-active").filter('[data-index="'+this.instance.current.index+'"]').addClass("fancybox-thumbs-active").focus()},close:function(){this.$grid.hide()},update:function(){this.instance.$refs.container.toggleClass("fancybox-show-thumbs",this.isVisible),this.isVisible?(this.$grid||this.create(),this.instance.trigger("onThumbsShow"),this.focus()):this.$grid&&this.instance.trigger("onThumbsHide"),this.instance.update()},hide:function(){this.isVisible=!1,this.update()},show:function(){this.isVisible=!0,this.update()},toggle:function(){this.isVisible=!this.isVisible,this.update()}}),e(t).on({"onInit.fb":function(t,e){e&&!e.Thumbs&&(e.Thumbs=new n(e))},"beforeShow.fb":function(t,e,n,o){var i=e&&e.Thumbs;if(i&&i.isActive){if(n.modal)return i.$button.hide(),void i.hide();o&&e.opts.thumbs.autoStart===!0&&i.show(),i.isVisible&&i.focus()}},"afterKeydown.fb":function(t,e,n,o,i){var a=e&&e.Thumbs;a&&a.isActive&&71===i&&(o.preventDefault(),a.toggle())},"beforeClose.fb":function(t,e){var n=e&&e.Thumbs;n&&n.isVisible&&e.opts.thumbs.hideOnClose!==!1&&n.close()}})}(document,window.jQuery),function(t,e,n){"use strict";function o(){var t=e.location.hash.substr(1),n=t.split("-"),o=n.length>1&&/^\+?\d+$/.test(n[n.length-1])?parseInt(n.pop(-1),10)||1:1,i=n.join("-");return o<1&&(o=1),{hash:t,index:o,gallery:i}}function i(t){var e;""!==t.gallery&&(e=n("[data-fancybox='"+n.escapeSelector(t.gallery)+"']").eq(t.index-1),e.length||(e=n("#"+n.escapeSelector(t.gallery))),e.length&&(s=!1,e.trigger("click")))}function a(t){var e;return!!t&&(e=t.current?t.current.opts:t.opts,e.hash||(e.$orig?e.$orig.data("fancybox"):""))}n.escapeSelector||(n.escapeSelector=function(t){var e=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\x80-\uFFFF\w-]/g,n=function(t,e){return e?"\0"===t?"�":t.slice(0,-1)+"\\"+t.charCodeAt(t.length-1).toString(16)+" ":"\\"+t};return(t+"").replace(e,n)});var s=!0,r=null,c=null;n(function(){setTimeout(function(){n.fancybox.defaults.hash!==!1&&(n(t).on({"onInit.fb":function(t,e){var n,i;e.group[e.currIndex].opts.hash!==!1&&(n=o(),i=a(e),i&&n.gallery&&i==n.gallery&&(e.currIndex=n.index-1))},"beforeShow.fb":function(n,o,i){var l;i&&i.opts.hash!==!1&&(l=a(o),l&&""!==l&&(e.location.hash.indexOf(l)<0&&(o.opts.origHash=e.location.hash),r=l+(o.group.length>1?"-"+(i.index+1):""),"replaceState"in e.history?(c&&clearTimeout(c),c=setTimeout(function(){e.history[s?"pushState":"replaceState"]({},t.title,e.location.pathname+e.location.search+"#"+r),c=null,s=!1},300)):e.location.hash=r))},"beforeClose.fb":function(o,i,s){var l,u;c&&clearTimeout(c),s.opts.hash!==!1&&(l=a(i),u=i&&i.opts.origHash?i.opts.origHash:"",l&&""!==l&&("replaceState"in history?e.history.replaceState({},t.title,e.location.pathname+e.location.search+u):(e.location.hash=u,n(e).scrollTop(i.scrollTop).scrollLeft(i.scrollLeft))),r=null)}}),n(e).on("hashchange.fb",function(){var t=o();n.fancybox.getInstance()?!r||r===t.gallery+"-"+t.index||1===t.index&&r==t.gallery||(r=null,n.fancybox.close()):""!==t.gallery&&i(t)}),i(o()))},50)})}(document,window,window.jQuery); \ No newline at end of file +!function(t,e,n,o){"use strict";function i(t){var e=t.currentTarget,o=t.data?t.data.options:{},i=o.selector?n(o.selector):t.data?t.data.items:[],a=n(e).attr("data-fancybox")||"",s=0,r=n.fancybox.getInstance();t.preventDefault(),r&&r.current.opts.$orig.is(e)||(a?(i=i.length?i.filter('[data-fancybox="'+a+'"]'):n('[data-fancybox="'+a+'"]'),s=i.index(e),s<0&&(s=0)):i=[e],n.fancybox.open(i,o,s))}if(n){if(n.fn.fancybox)return void n.error("fancyBox already initialized");var a={loop:!1,margin:[44,0],gutter:50,keyboard:!0,arrows:!0,infobar:!1,toolbar:!0,buttons:["slideShow","fullScreen","thumbs","close"],idleTime:4,smallBtn:"auto",protect:!1,modal:!1,image:{preload:"auto"},ajax:{settings:{data:{fancybox:!0}}},iframe:{tpl:'',preload:!0,css:{},attr:{scrolling:"auto"}},animationEffect:"zoom",animationDuration:366,zoomOpacity:"auto",transitionEffect:"fade",transitionDuration:366,slideClass:"",baseClass:"",baseTpl:'',spinnerTpl:'
',errorTpl:'

{{ERROR}}

',btnTpl:{slideShow:'',fullScreen:'',thumbs:'',close:'',smallBtn:''},parentEl:"body",autoFocus:!0,backFocus:!0,trapFocus:!0,fullScreen:{autoStart:!1},touch:{vertical:!0,momentum:!0},hash:null,media:{},slideShow:{autoStart:!1,speed:4e3},thumbs:{autoStart:!1,hideOnClose:!0},onInit:n.noop,beforeLoad:n.noop,afterLoad:n.noop,beforeShow:n.noop,afterShow:n.noop,beforeClose:n.noop,afterClose:n.noop,onActivate:n.noop,onDeactivate:n.noop,clickContent:function(t,e){return"image"===t.type&&"zoom"},clickSlide:"close",clickOutside:"close",dblclickContent:!1,dblclickSlide:!1,dblclickOutside:!1,mobile:{clickContent:function(t,e){return"image"===t.type&&"toggleControls"},clickSlide:function(t,e){return"image"===t.type?"toggleControls":"close"},dblclickContent:function(t,e){return"image"===t.type&&"zoom"},dblclickSlide:function(t,e){return"image"===t.type&&"zoom"}},lang:"en",i18n:{en:{CLOSE:"Close",NEXT:"Next",PREV:"Previous",ERROR:"The requested content cannot be loaded.
Please try again later.",PLAY_START:"Start slideshow",PLAY_STOP:"Pause slideshow",FULL_SCREEN:"Full screen",THUMBS:"Thumbnails"},de:{CLOSE:"Schliessen",NEXT:"Weiter",PREV:"Zurück",ERROR:"Die angeforderten Daten konnten nicht geladen werden.
Bitte versuchen Sie es später nochmal.",PLAY_START:"Diaschau starten",PLAY_STOP:"Diaschau beenden",FULL_SCREEN:"Vollbild",THUMBS:"Vorschaubilder"}}},s=n(t),r=n(e),c=0,l=function(t){return t&&t.hasOwnProperty&&t instanceof n},u=function(){return t.requestAnimationFrame||t.webkitRequestAnimationFrame||t.mozRequestAnimationFrame||t.oRequestAnimationFrame||function(e){return t.setTimeout(e,1e3/60)}}(),d=function(){var t,n=e.createElement("fakeelement"),i={transition:"transitionend",OTransition:"oTransitionEnd",MozTransition:"transitionend",WebkitTransition:"webkitTransitionEnd"};for(t in i)if(n.style[t]!==o)return i[t]}(),f=function(t){return t&&t.length&&t[0].offsetHeight},h=function(t,o,i){var s=this;s.opts=n.extend(!0,{index:i},a,o||{}),o&&n.isArray(o.buttons)&&(s.opts.buttons=o.buttons),s.id=s.opts.id||++c,s.group=[],s.currIndex=parseInt(s.opts.index,10)||0,s.prevIndex=null,s.prevPos=null,s.currPos=0,s.firstRun=null,s.createGroup(t),s.group.length&&(s.$lastFocus=n(e.activeElement).blur(),s.slides={},s.init(t))};n.extend(h.prototype,{init:function(){var t,e,o,i=this,a=i.group[i.currIndex].opts;i.scrollTop=r.scrollTop(),i.scrollLeft=r.scrollLeft(),n.fancybox.getInstance()||n.fancybox.isMobile||"hidden"===n("body").css("overflow")||(t=n("body").width(),n("html").addClass("fancybox-enabled"),t=n("body").width()-t,t>1&&n("head").append('")),o="",n.each(a.buttons,function(t,e){o+=a.btnTpl[e]||""}),e=n(i.translate(i,a.baseTpl.replace("{{BUTTONS}}",o))).addClass("fancybox-is-hidden").attr("id","fancybox-container-"+i.id).addClass(a.baseClass).data("FancyBox",i).prependTo(a.parentEl),i.$refs={container:e},["bg","inner","infobar","toolbar","stage","caption"].forEach(function(t){i.$refs[t]=e.find(".fancybox-"+t)}),(!a.arrows||i.group.length<2)&&e.find(".fancybox-navigation").remove(),a.infobar||i.$refs.infobar.remove(),a.toolbar||i.$refs.toolbar.remove(),i.trigger("onInit"),i.activate(),i.jumpTo(i.currIndex)},translate:function(t,e){var n=t.opts.i18n[t.opts.lang];return e.replace(/\{\{(\w+)\}\}/g,function(t,e){var i=n[e];return i===o?t:i})},createGroup:function(t){var e=this,i=n.makeArray(t);n.each(i,function(t,i){var a,s,r,c,l={},u={},d=[];n.isPlainObject(i)?(l=i,u=i.opts||i):"object"===n.type(i)&&n(i).length?(a=n(i),d=a.data(),u="options"in d?d.options:{},u="object"===n.type(u)?u:{},l.src="src"in d?d.src:u.src||a.attr("href"),["width","height","thumb","type","filter"].forEach(function(t){t in d&&(u[t]=d[t])}),"srcset"in d&&(u.image={srcset:d.srcset}),u.$orig=a,l.type||l.src||(l.type="inline",l.src=i)):l={type:"html",src:i+""},l.opts=n.extend(!0,{},e.opts,u),n.fancybox.isMobile&&(l.opts=n.extend(!0,{},l.opts,l.opts.mobile)),s=l.type||l.opts.type,r=l.src||"",!s&&r&&(r.match(/(^data:image\/[a-z0-9+\/=]*,)|(\.(jp(e|g|eg)|gif|png|bmp|webp|svg|ico)((\?|#).*)?$)/i)?s="image":r.match(/\.(pdf)((\?|#).*)?$/i)?s="pdf":"#"===r.charAt(0)&&(s="inline")),l.type=s,l.index=e.group.length,l.opts.$orig&&!l.opts.$orig.length&&delete l.opts.$orig,!l.opts.$thumb&&l.opts.$orig&&(l.opts.$thumb=l.opts.$orig.find("img:first")),l.opts.$thumb&&!l.opts.$thumb.length&&delete l.opts.$thumb,"function"===n.type(l.opts.caption)?l.opts.caption=l.opts.caption.apply(i,[e,l]):"caption"in d&&(l.opts.caption=d.caption),l.opts.caption=l.opts.caption===o?"":l.opts.caption+"","ajax"===s&&(c=r.split(/\s+/,2),c.length>1&&(l.src=c.shift(),l.opts.filter=c.shift())),"auto"==l.opts.smallBtn&&(n.inArray(s,["html","inline","ajax"])>-1?(l.opts.toolbar=!1,l.opts.smallBtn=!0):l.opts.smallBtn=!1),"pdf"===s&&(l.type="iframe",l.opts.iframe.preload=!1),l.opts.modal&&(l.opts=n.extend(!0,l.opts,{infobar:0,toolbar:0,smallBtn:0,keyboard:0,slideShow:0,fullScreen:0,thumbs:0,touch:0,clickContent:!1,clickSlide:!1,clickOutside:!1,dblclickContent:!1,dblclickSlide:!1,dblclickOutside:!1})),e.group.push(l)})},addEvents:function(){var o=this;o.removeEvents(),o.$refs.container.on("click.fb-close","[data-fancybox-close]",function(t){t.stopPropagation(),t.preventDefault(),o.close(t)}).on("click.fb-prev touchend.fb-prev","[data-fancybox-prev]",function(t){t.stopPropagation(),t.preventDefault(),o.previous()}).on("click.fb-next touchend.fb-next","[data-fancybox-next]",function(t){t.stopPropagation(),t.preventDefault(),o.next()}),s.on("orientationchange.fb resize.fb",function(t){t&&t.originalEvent&&"resize"===t.originalEvent.type?u(function(){o.update()}):(o.$refs.stage.hide(),setTimeout(function(){o.$refs.stage.show(),o.update()},500))}),r.on("focusin.fb",function(t){var i=n.fancybox?n.fancybox.getInstance():null;i.isClosing||!i.current||!i.current.opts.trapFocus||n(t.target).hasClass("fancybox-container")||n(t.target).is(e)||i&&"fixed"!==n(t.target).css("position")&&!i.$refs.container.has(t.target).length&&(t.stopPropagation(),i.focus(),s.scrollTop(o.scrollTop).scrollLeft(o.scrollLeft))}),r.on("keydown.fb",function(t){var e=o.current,i=t.keyCode||t.which;if(e&&e.opts.keyboard&&!n(t.target).is("input")&&!n(t.target).is("textarea"))return 8===i||27===i?(t.preventDefault(),void o.close(t)):37===i||38===i?(t.preventDefault(),void o.previous()):39===i||40===i?(t.preventDefault(),void o.next()):void o.trigger("afterKeydown",t,i)}),o.group[o.currIndex].opts.idleTime&&(o.idleSecondsCounter=0,r.on("mousemove.fb-idle mouseenter.fb-idle mouseleave.fb-idle mousedown.fb-idle touchstart.fb-idle touchmove.fb-idle scroll.fb-idle keydown.fb-idle",function(){o.idleSecondsCounter=0,o.isIdle&&o.showControls(),o.isIdle=!1}),o.idleInterval=t.setInterval(function(){o.idleSecondsCounter++,o.idleSecondsCounter>=o.group[o.currIndex].opts.idleTime&&(o.isIdle=!0,o.idleSecondsCounter=0,o.hideControls())},1e3))},removeEvents:function(){var e=this;s.off("orientationchange.fb resize.fb"),r.off("focusin.fb keydown.fb .fb-idle"),this.$refs.container.off(".fb-close .fb-prev .fb-next"),e.idleInterval&&(t.clearInterval(e.idleInterval),e.idleInterval=null)},previous:function(t){return this.jumpTo(this.currPos-1,t)},next:function(t){return this.jumpTo(this.currPos+1,t)},jumpTo:function(t,e,i){var a,s,r,c,l,u,d,h=this,p=h.group.length;if(!(h.isSliding||h.isClosing||h.isAnimating&&h.firstRun)){if(t=parseInt(t,10),s=h.current?h.current.opts.loop:h.opts.loop,!s&&(t<0||t>=p))return!1;if(a=h.firstRun=null===h.firstRun,!(p<2&&!a&&h.isSliding)){if(c=h.current,h.prevIndex=h.currIndex,h.prevPos=h.currPos,r=h.createSlide(t),p>1&&((s||r.index>0)&&h.createSlide(t-1),(s||r.indexr.pos?"next":"previous"),c.$slide.removeClass("fancybox-slide--complete fancybox-slide--current fancybox-slide--next fancybox-slide--previous"),c.isComplete=!1,e&&(r.isMoved||r.opts.transitionEffect)&&(r.isMoved?c.$slide.addClass(d):(d="fancybox-animated "+d+" fancybox-fx-"+r.opts.transitionEffect,n.fancybox.animate(c.$slide,d,e,function(){c.$slide.removeClass(d).removeAttr("style")}))))}}},createSlide:function(t){var e,o,i=this;return o=t%i.group.length,o=o<0?i.group.length+o:o,!i.slides[t]&&i.group[o]&&(e=n('
').appendTo(i.$refs.stage),i.slides[t]=n.extend(!0,{},i.group[o],{pos:t,$slide:e,isLoaded:!1}),i.updateSlide(i.slides[t])),i.slides[t]},scaleToActual:function(t,e,i){var a,s,r,c,l,u=this,d=u.current,f=d.$content,h=parseInt(d.$slide.width(),10),p=parseInt(d.$slide.height(),10),g=d.width,b=d.height;"image"!=d.type||d.hasError||!f||u.isAnimating||(n.fancybox.stop(f),u.isAnimating=!0,t=t===o?.5*h:t,e=e===o?.5*p:e,a=n.fancybox.getTranslate(f),c=g/a.width,l=b/a.height,s=.5*h-.5*g,r=.5*p-.5*b,g>h&&(s=a.left*c-(t*c-t),s>0&&(s=0),sp&&(r=a.top*l-(e*l-e),r>0&&(r=0),rt.width||o.height>t.height))},isScaledDown:function(){var t=this,e=t.current,o=e.$content,i=!1;return o&&(i=n.fancybox.getTranslate(o),i=i.width1||Math.abs(n.height()-o.height)>1),o},loadSlide:function(t){var e,o,i,a=this;if(!t.isLoading&&!t.isLoaded){switch(t.isLoading=!0,a.trigger("beforeLoad",t),e=t.type,o=t.$slide,o.off("refresh").trigger("onReset").addClass("fancybox-slide--"+(e||"unknown")).addClass(t.opts.slideClass),e){case"image":a.setImage(t);break;case"iframe":a.setIframe(t);break;case"html":a.setContent(t,t.src||t.content);break;case"inline":n(t.src).length?a.setContent(t,n(t.src)):a.setError(t);break;case"ajax":a.showLoading(t),i=n.ajax(n.extend({},t.opts.ajax.settings,{url:t.src,success:function(e,n){"success"===n&&a.setContent(t,e)},error:function(e,n){e&&"abort"!==n&&a.setError(t)}})),o.one("onReset",function(){i.abort()});break;default:a.setError(t)}return!0}},setImage:function(e){var o,i,a,s,r=this,c=e.opts.image.srcset;if(c){a=t.devicePixelRatio||1,s=t.innerWidth*a,i=c.split(",").map(function(t){var e={};return t.trim().split(/\s+/).forEach(function(t,n){var o=parseInt(t.substring(0,t.length-1),10);return 0===n?e.url=t:void(o&&(e.value=o,e.postfix=t[t.length-1]))}),e}),i.sort(function(t,e){return t.value-e.value});for(var l=0;l=s||"x"===u.postfix&&u.value>=a){o=u;break}}!o&&i.length&&(o=i[i.length-1]),o&&(e.src=o.url,e.width&&e.height&&"w"==o.postfix&&(e.height=e.width/e.height*o.value,e.width=o.value))}e.$content=n('
').addClass("fancybox-is-hidden").appendTo(e.$slide),e.opts.preload!==!1&&e.opts.width&&e.opts.height&&(e.opts.thumb||e.opts.$thumb)?(e.width=e.opts.width,e.height=e.opts.height,e.$ghost=n("").one("error",function(){n(this).remove(),e.$ghost=null,r.setBigImage(e)}).one("load",function(){r.afterLoad(e),r.setBigImage(e)}).addClass("fancybox-image").appendTo(e.$content).attr("src",e.opts.thumb||e.opts.$thumb.attr("src"))):r.setBigImage(e)},setBigImage:function(t){var e=this,o=n("");t.$image=o.one("error",function(){e.setError(t)}).one("load",function(){clearTimeout(t.timouts),t.timouts=null,e.isClosing||(t.width=this.naturalWidth,t.height=this.naturalHeight,t.opts.image.srcset&&o.attr("sizes","100vw").attr("srcset",t.opts.image.srcset),e.hideLoading(t),t.$ghost?t.timouts=setTimeout(function(){t.timouts=null,t.$ghost.hide()},Math.min(300,Math.max(1e3,t.height/1600))):e.afterLoad(t))}).addClass("fancybox-image").attr("src",t.src).appendTo(t.$content),(o[0].complete||"complete"==o[0].readyState)&&o[0].naturalWidth&&o[0].naturalHeight?o.trigger("load"):o[0].error?o.trigger("error"):t.timouts=setTimeout(function(){o[0].complete||t.hasError||e.showLoading(t)},100)},setIframe:function(t){var e,i=this,a=t.opts.iframe,s=t.$slide;t.$content=n('
').css(a.css).appendTo(s),e=n(a.tpl.replace(/\{rnd\}/g,(new Date).getTime())).attr(a.attr).appendTo(t.$content),a.preload?(i.showLoading(t),e.on("load.fb error.fb",function(e){this.isReady=1,t.$slide.trigger("refresh"),i.afterLoad(t)}),s.on("refresh.fb",function(){var n,i,s,r=t.$content,c=a.css.width,l=a.css.height;if(1===e[0].isReady){try{i=e.contents(),s=i.find("body")}catch(t){}s&&s.length&&(c===o&&(n=e[0].contentWindow.document.documentElement.scrollWidth,c=Math.ceil(s.outerWidth(!0)+(r.width()-n)),c+=r.outerWidth()-r.innerWidth()),l===o&&(l=Math.ceil(s.outerHeight(!0)),l+=r.outerHeight()-r.innerHeight()),c&&r.width(c),l&&r.height(l)),r.removeClass("fancybox-is-hidden")}})):this.afterLoad(t),e.attr("src",t.src),t.opts.smallBtn===!0&&t.$content.prepend(i.translate(t,t.opts.btnTpl.smallBtn)),s.one("onReset",function(){try{n(this).find("iframe").hide().attr("src","//about:blank")}catch(t){}n(this).empty(),t.isLoaded=!1})},setContent:function(t,e){var o=this;o.isClosing||(o.hideLoading(t),t.$slide.empty(),l(e)&&e.parent().length?(e.parent(".fancybox-slide--inline").trigger("onReset"),t.$placeholder=n("
").hide().insertAfter(e),e.css("display","inline-block")):t.hasError||("string"===n.type(e)&&(e=n("
").append(n.trim(e)).contents(),3===e[0].nodeType&&(e=n("
").html(e))),t.opts.filter&&(e=n("
").html(e).find(t.opts.filter))),t.$slide.one("onReset",function(){t.$placeholder&&(t.$placeholder.after(e.hide()).remove(),t.$placeholder=null),t.$smallBtn&&(t.$smallBtn.remove(),t.$smallBtn=null),t.hasError||(n(this).empty(),t.isLoaded=!1)}),t.$content=n(e).appendTo(t.$slide),t.opts.smallBtn&&!t.$smallBtn&&(t.$smallBtn=n(o.translate(t,t.opts.btnTpl.smallBtn)).appendTo(t.$content.filter("div").first())),this.afterLoad(t))},setError:function(t){t.hasError=!0,t.$slide.removeClass("fancybox-slide--"+t.type),this.setContent(t,this.translate(t,t.opts.errorTpl))},showLoading:function(t){var e=this;t=t||e.current,t&&!t.$spinner&&(t.$spinner=n(e.opts.spinnerTpl).appendTo(t.$slide))},hideLoading:function(t){var e=this;t=t||e.current,t&&t.$spinner&&(t.$spinner.remove(),delete t.$spinner)},afterLoad:function(t){var e=this;e.isClosing||(t.isLoading=!1,t.isLoaded=!0,e.trigger("afterLoad",t),e.hideLoading(t),t.opts.protect&&t.$content&&!t.hasError&&(t.$content.on("contextmenu.fb",function(t){return 2==t.button&&t.preventDefault(),!0}),"image"===t.type&&n('
').appendTo(t.$content)),e.revealContent(t))},revealContent:function(t){var e,i,a,s,r,c=this,l=t.$slide,u=!1;return e=t.opts[c.firstRun?"animationEffect":"transitionEffect"],a=t.opts[c.firstRun?"animationDuration":"transitionDuration"],a=parseInt(t.forcedDuration===o?a:t.forcedDuration,10),!t.isMoved&&t.pos===c.currPos&&a||(e=!1),"zoom"!==e||t.pos===c.currPos&&a&&"image"===t.type&&!t.hasError&&(u=c.getThumbPos(t))||(e="fade"),"zoom"===e?(r=c.getFitPos(t),r.scaleX=r.width/u.width,r.scaleY=r.height/u.height,delete r.width,delete r.height,s=t.opts.zoomOpacity,"auto"==s&&(s=Math.abs(t.width/t.height-u.width/u.height)>.1),s&&(u.opacity=.1,r.opacity=1),n.fancybox.setTranslate(t.$content.removeClass("fancybox-is-hidden"),u),f(t.$content),void n.fancybox.animate(t.$content,r,a,function(){c.complete()})):(c.updateSlide(t),e?(n.fancybox.stop(l),i="fancybox-animated fancybox-slide--"+(t.pos>c.prevPos?"next":"previous")+" fancybox-fx-"+e,l.removeAttr("style").removeClass("fancybox-slide--current fancybox-slide--next fancybox-slide--previous").addClass(i),t.$content.removeClass("fancybox-is-hidden"),f(l),void n.fancybox.animate(l,"fancybox-slide--current",a,function(e){l.removeClass(i).removeAttr("style"),t.pos===c.currPos&&c.complete()},!0)):(f(l),t.$content.removeClass("fancybox-is-hidden"),void(t.pos===c.currPos&&c.complete())))},getThumbPos:function(o){var i,a=this,s=!1,r=function(e){for(var o,i=e[0],a=i.getBoundingClientRect(),s=[];null!==i.parentElement;)"hidden"!==n(i.parentElement).css("overflow")&&"auto"!==n(i.parentElement).css("overflow")||s.push(i.parentElement.getBoundingClientRect()),i=i.parentElement;return o=s.every(function(t){var e=Math.min(a.right,t.right)-Math.max(a.left,t.left),n=Math.min(a.bottom,t.bottom)-Math.max(a.top,t.top);return e>0&&n>0}),o&&a.bottom>0&&a.right>0&&a.left=t.currPos-1&&o.pos<=t.currPos+1?i[o.pos]=o:o&&(n.fancybox.stop(o.$slide),o.$slide.off().remove())}),t.slides=i,t.updateCursor(),t.trigger("afterShow"),(n(e.activeElement).is("[disabled]")||o.opts.autoFocus&&"image"!=o.type&&"iframe"!==o.type)&&t.focus())},preload:function(){var t,e,n=this;n.group.length<2||(t=n.slides[n.currPos+1],e=n.slides[n.currPos-1],t&&"image"===t.type&&n.loadSlide(t),e&&"image"===e.type&&n.loadSlide(e))},focus:function(){var t,e=this.current;this.isClosing||(e&&e.isComplete&&(t=e.$slide.find("input[autofocus]:enabled:visible:first"),t.length||(t=e.$slide.find("button,:input,[tabindex],a").filter(":enabled:visible:first"))),t=t&&t.length?t:this.$refs.container,t.focus())},activate:function(){var t=this;n(".fancybox-container").each(function(){var e=n(this).data("FancyBox");e&&e.uid!==t.uid&&!e.isClosing&&e.trigger("onDeactivate")}),t.current&&(t.$refs.container.index()>0&&t.$refs.container.prependTo(e.body),t.updateControls()),t.trigger("onActivate"),t.addEvents()},close:function(t,e){var o,i,a,s,r,c,l=this,f=l.current,h=function(){l.cleanUp(t)};return!l.isClosing&&(l.isClosing=!0,l.trigger("beforeClose",t)===!1?(l.isClosing=!1,u(function(){l.update()}),!1):(l.removeEvents(),f.timouts&&clearTimeout(f.timouts),a=f.$content,o=f.opts.animationEffect,i=n.isNumeric(e)?e:o?f.opts.animationDuration:0,f.$slide.off(d).removeClass("fancybox-slide--complete fancybox-slide--next fancybox-slide--previous fancybox-animated"),f.$slide.siblings().trigger("onReset").remove(),i&&l.$refs.container.removeClass("fancybox-is-open").addClass("fancybox-is-closing"),l.hideLoading(f),l.hideControls(),l.updateCursor(),"zoom"!==o||t!==!0&&a&&i&&"image"===f.type&&!f.hasError&&(c=l.getThumbPos(f))||(o="fade"),"zoom"===o?(n.fancybox.stop(a),r=n.fancybox.getTranslate(a),r.width=r.width*r.scaleX,r.height=r.height*r.scaleY,s=f.opts.zoomOpacity,"auto"==s&&(s=Math.abs(f.width/f.height-c.width/c.height)>.1),s&&(c.opacity=0),r.scaleX=r.width/c.width,r.scaleY=r.height/c.height,r.width=c.width,r.height=c.height,n.fancybox.setTranslate(f.$content,r),n.fancybox.animate(f.$content,c,i,h),!0):(o&&i?t===!0?setTimeout(h,i):n.fancybox.animate(f.$slide.removeClass("fancybox-slide--current"),"fancybox-animated fancybox-slide--previous fancybox-fx-"+o,i,h):h(),!0)))},cleanUp:function(t){var e,o=this;o.current.$slide.trigger("onReset"),o.$refs.container.empty().remove(),o.trigger("afterClose",t),o.$lastFocus&&o.current.opts.backFocus&&o.$lastFocus.focus(),o.current=null,e=n.fancybox.getInstance(),e?e.activate():(s.scrollTop(o.scrollTop).scrollLeft(o.scrollLeft),n("html").removeClass("fancybox-enabled"),n("#fancybox-style-noscroll").remove())},trigger:function(t,e){var o,i=Array.prototype.slice.call(arguments,1),a=this,s=e&&e.opts?e:a.current;return s?i.unshift(s):s=a,i.unshift(a),n.isFunction(s.opts[t])&&(o=s.opts[t].apply(s,i)),o===!1?o:void("afterClose"===t?r.trigger(t+".fb",i):a.$refs.container.trigger(t+".fb",i))},updateControls:function(t){var e=this,o=e.current,i=o.index,a=o.opts,s=a.caption,r=e.$refs.caption;o.$slide.trigger("refresh"),e.$caption=s&&s.length?r.html(s):null,e.isHiddenControls||e.showControls(),n("[data-fancybox-count]").html(e.group.length),n("[data-fancybox-index]").html(i+1),n("[data-fancybox-prev]").prop("disabled",!a.loop&&i<=0),n("[data-fancybox-next]").prop("disabled",!a.loop&&i>=e.group.length-1)},hideControls:function(){this.isHiddenControls=!0,this.$refs.container.removeClass("fancybox-show-infobar fancybox-show-toolbar fancybox-show-caption fancybox-show-nav")},showControls:function(){var t=this,e=t.current?t.current.opts:t.opts,n=t.$refs.container;t.isHiddenControls=!1,t.idleSecondsCounter=0,n.toggleClass("fancybox-show-toolbar",!(!e.toolbar||!e.buttons)).toggleClass("fancybox-show-infobar",!!(e.infobar&&t.group.length>1)).toggleClass("fancybox-show-nav",!!(e.arrows&&t.group.length>1)).toggleClass("fancybox-is-modal",!!e.modal),t.$caption?n.addClass("fancybox-show-caption "):n.removeClass("fancybox-show-caption")},toggleControls:function(){this.isHiddenControls?this.showControls():this.hideControls()}}),n.fancybox={version:"3.1.28",defaults:a,getInstance:function(t){var e=n('.fancybox-container:not(".fancybox-is-closing"):first').data("FancyBox"),o=Array.prototype.slice.call(arguments,1);return e instanceof h&&("string"===n.type(t)?e[t].apply(e,o):"function"===n.type(t)&&t.apply(e,o),e)},open:function(t,e,n){return new h(t,e,n)},close:function(t){var e=this.getInstance();e&&(e.close(),t===!0&&this.close())},destroy:function(){this.close(!0),r.off("click.fb-start")},isMobile:e.createTouch!==o&&/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent),use3d:function(){var n=e.createElement("div");return t.getComputedStyle&&t.getComputedStyle(n).getPropertyValue("transform")&&!(e.documentMode&&e.documentMode<11)}(),getTranslate:function(t){var e;if(!t||!t.length)return!1;if(e=t.eq(0).css("transform"),e&&e.indexOf("matrix")!==-1?(e=e.split("(")[1],e=e.split(")")[0],e=e.split(",")):e=[],e.length)e=e.length>10?[e[13],e[12],e[0],e[5]]:[e[5],e[4],e[0],e[3]],e=e.map(parseFloat);else{e=[0,0,1,1];var n=/\.*translate\((.*)px,(.*)px\)/i,o=n.exec(t.eq(0).attr("style"));o&&(e[0]=parseFloat(o[2]),e[1]=parseFloat(o[1]))}return{top:e[0],left:e[1],scaleX:e[2],scaleY:e[3],opacity:parseFloat(t.css("opacity")),width:t.width(),height:t.height()}},setTranslate:function(t,e){var n="",i={};if(t&&e)return e.left===o&&e.top===o||(n=(e.left===o?t.position().left:e.left)+"px, "+(e.top===o?t.position().top:e.top)+"px",n=this.use3d?"translate3d("+n+", 0px)":"translate("+n+")"),e.scaleX!==o&&e.scaleY!==o&&(n=(n.length?n+" ":"")+"scale("+e.scaleX+", "+e.scaleY+")"),n.length&&(i.transform=n),e.opacity!==o&&(i.opacity=e.opacity),e.width!==o&&(i.width=e.width),e.height!==o&&(i.height=e.height),t.css(i)},animate:function(t,e,i,a,s){var r=d||"transitionend";n.isFunction(i)&&(a=i,i=null),n.isPlainObject(e)||t.removeAttr("style"),t.on(r,function(i){(!i||!i.originalEvent||t.is(i.originalEvent.target)&&"z-index"!=i.originalEvent.propertyName)&&(t.off(r),n.isPlainObject(e)?e.scaleX!==o&&e.scaleY!==o&&(t.css("transition-duration","0ms"),e.width=Math.round(t.width()*e.scaleX),e.height=Math.round(t.height()*e.scaleY),e.scaleX=1,e.scaleY=1,n.fancybox.setTranslate(t,e)):s!==!0&&t.removeClass(e),n.isFunction(a)&&a(i))}),n.isNumeric(i)&&t.css("transition-duration",i+"ms"),n.isPlainObject(e)?n.fancybox.setTranslate(t,e):t.addClass(e),t.data("timer",setTimeout(function(){t.trigger("transitionend")},i+16))},stop:function(t){clearTimeout(t.data("timer")),t.off(d)}},n.fn.fancybox=function(t){var e;return t=t||{},e=t.selector||!1,e?n("body").off("click.fb-start",e).on("click.fb-start",e,{options:t},i):this.off("click.fb-start").on("click.fb-start",{items:this,options:t},i),this},r.on("click.fb-start","[data-fancybox]",i)}}(window,document,window.jQuery||jQuery),function(t){"use strict";var e=function(e,n,o){if(e)return o=o||"","object"===t.type(o)&&(o=t.param(o,!0)),t.each(n,function(t,n){e=e.replace("$"+t,n||"")}),o.length&&(e+=(e.indexOf("?")>0?"&":"?")+o),e},n={youtube:{matcher:/(youtube\.com|youtu\.be|youtube\-nocookie\.com)\/(watch\?(.*&)?v=|v\/|u\/|embed\/?)?(videoseries\?list=(.*)|[\w-]{11}|\?listType=(.*)&list=(.*))(.*)/i,params:{autoplay:1,autohide:1,fs:1,rel:0,hd:1,wmode:"transparent",enablejsapi:1,html5:1},paramPlace:8,type:"iframe",url:"//www.youtube.com/embed/$4",thumb:"//img.youtube.com/vi/$4/hqdefault.jpg"},vimeo:{matcher:/^.+vimeo.com\/(.*\/)?([\d]+)(.*)?/,params:{autoplay:1,hd:1,show_title:1,show_byline:1,show_portrait:0,fullscreen:1,api:1},paramPlace:3,type:"iframe",url:"//player.vimeo.com/video/$2"},metacafe:{matcher:/metacafe.com\/watch\/(\d+)\/(.*)?/,type:"iframe",url:"//www.metacafe.com/embed/$1/?ap=1"},dailymotion:{matcher:/dailymotion.com\/video\/(.*)\/?(.*)/,params:{additionalInfos:0,autoStart:1},type:"iframe",url:"//www.dailymotion.com/embed/video/$1"},vine:{matcher:/vine.co\/v\/([a-zA-Z0-9\?\=\-]+)/,type:"iframe",url:"//vine.co/v/$1/embed/simple"},instagram:{matcher:/(instagr\.am|instagram\.com)\/p\/([a-zA-Z0-9_\-]+)\/?/i,type:"image",url:"//$1/p/$2/media/?size=l"},gmap_place:{matcher:/(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(((maps\/(place\/(.*)\/)?\@(.*),(\d+.?\d+?)z))|(\?ll=))(.*)?/i,type:"iframe",url:function(t){return"//maps.google."+t[2]+"/?ll="+(t[9]?t[9]+"&z="+Math.floor(t[10])+(t[12]?t[12].replace(/^\//,"&"):""):t[12])+"&output="+(t[12]&&t[12].indexOf("layer=c")>0?"svembed":"embed")}},gmap_search:{matcher:/(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(maps\/search\/)(.*)/i,type:"iframe",url:function(t){return"//maps.google."+t[2]+"/maps?q="+t[5].replace("query=","q=").replace("api=1","")+"&output=embed"}}};t(document).on("onInit.fb",function(o,i){t.each(i.group,function(o,i){var a,s,r,c,l,u,d,f=i.src||"",h=!1;i.type||(a=t.extend(!0,{},n,i.opts.media),t.each(a,function(n,o){if(r=f.match(o.matcher),u={},d=n,r){if(h=o.type,o.paramPlace&&r[o.paramPlace]){l=r[o.paramPlace],"?"==l[0]&&(l=l.substring(1)),l=l.split("&");for(var a=0;ae.clientHeight,a=("scroll"===o||"auto"===o)&&e.scrollWidth>e.clientWidth;return i||a},l=function(t){for(var e=!1;;){if(e=c(t.get(0)))break;if(t=t.parent(),!t.length||t.hasClass("fancybox-stage")||t.is("body"))break}return e},u=function(t){var e=this;e.instance=t,e.$bg=t.$refs.bg,e.$stage=t.$refs.stage,e.$container=t.$refs.container,e.destroy(),e.$container.on("touchstart.fb.touch mousedown.fb.touch",n.proxy(e,"ontouchstart"))};u.prototype.destroy=function(){this.$container.off(".fb.touch")},u.prototype.ontouchstart=function(o){var i=this,c=n(o.target),u=i.instance,d=u.current,f=d.$content,h="touchstart"==o.type;if(h&&i.$container.off("mousedown.fb.touch"),!d||i.instance.isAnimating||i.instance.isClosing)return o.stopPropagation(),void o.preventDefault();if((!o.originalEvent||2!=o.originalEvent.button)&&c.length&&!r(c)&&!r(c.parent())&&!(o.originalEvent.clientX>c[0].clientWidth+c.offset().left)&&(i.startPoints=a(o),i.startPoints&&!(i.startPoints.length>1&&u.isSliding))){if(i.$target=c,i.$content=f,i.canTap=!0,n(e).off(".fb.touch"),n(e).on(h?"touchend.fb.touch touchcancel.fb.touch":"mouseup.fb.touch mouseleave.fb.touch",n.proxy(i,"ontouchend")),n(e).on(h?"touchmove.fb.touch":"mousemove.fb.touch",n.proxy(i,"ontouchmove")),!u.current.opts.touch&&!u.canPan()||!c.is(i.$stage)&&!i.$stage.find(c).length)return void(c.is("img")&&o.preventDefault());o.stopPropagation(),n.fancybox.isMobile&&(l(i.$target)||l(i.$target.parent()))||o.preventDefault(),i.canvasWidth=Math.round(d.$slide[0].clientWidth),i.canvasHeight=Math.round(d.$slide[0].clientHeight),i.startTime=(new Date).getTime(),i.distanceX=i.distanceY=i.distance=0,i.isPanning=!1,i.isSwiping=!1,i.isZooming=!1,i.sliderStartPos=i.sliderLastPos||{top:0,left:0},i.contentStartPos=n.fancybox.getTranslate(i.$content),i.contentLastPos=null,1!==i.startPoints.length||i.isZooming||(i.canTap=!u.isSliding,"image"===d.type&&(i.contentStartPos.width>i.canvasWidth+1||i.contentStartPos.height>i.canvasHeight+1)?(n.fancybox.stop(i.$content),i.$content.css("transition-duration","0ms"),i.isPanning=!0):i.isSwiping=!0,i.$container.addClass("fancybox-controls--isGrabbing")),2!==i.startPoints.length||u.isAnimating||d.hasError||"image"!==d.type||!d.isLoaded&&!d.$ghost||(i.isZooming=!0,i.isSwiping=!1,i.isPanning=!1,n.fancybox.stop(i.$content),i.$content.css("transition-duration","0ms"),i.centerPointStartX=.5*(i.startPoints[0].x+i.startPoints[1].x)-n(t).scrollLeft(),i.centerPointStartY=.5*(i.startPoints[0].y+i.startPoints[1].y)-n(t).scrollTop(),i.percentageOfImageAtPinchPointX=(i.centerPointStartX-i.contentStartPos.left)/i.contentStartPos.width,i.percentageOfImageAtPinchPointY=(i.centerPointStartY-i.contentStartPos.top)/i.contentStartPos.height,i.startDistanceBetweenFingers=s(i.startPoints[0],i.startPoints[1]))}},u.prototype.ontouchmove=function(t){var e=this;if(e.newPoints=a(t),n.fancybox.isMobile&&(l(e.$target)||l(e.$target.parent())))return t.stopPropagation(),void(e.canTap=!1);if((e.instance.current.opts.touch||e.instance.canPan())&&e.newPoints&&e.newPoints.length&&(e.distanceX=s(e.newPoints[0],e.startPoints[0],"x"),e.distanceY=s(e.newPoints[0],e.startPoints[0],"y"),e.distance=s(e.newPoints[0],e.startPoints[0]),e.distance>0)){if(!e.$target.is(e.$stage)&&!e.$stage.find(e.$target).length)return;t.stopPropagation(),t.preventDefault(),e.isSwiping?e.onSwipe():e.isPanning?e.onPan():e.isZooming&&e.onZoom()}},u.prototype.onSwipe=function(){var e,a=this,s=a.isSwiping,r=a.sliderStartPos.left||0;s===!0?Math.abs(a.distance)>10&&(a.canTap=!1,a.instance.group.length<2&&a.instance.opts.touch.vertical?a.isSwiping="y":a.instance.isSliding||a.instance.opts.touch.vertical===!1||"auto"===a.instance.opts.touch.vertical&&n(t).width()>800?a.isSwiping="x":(e=Math.abs(180*Math.atan2(a.distanceY,a.distanceX)/Math.PI),a.isSwiping=e>45&&e<135?"y":"x"),a.instance.isSliding=a.isSwiping,a.startPoints=a.newPoints,n.each(a.instance.slides,function(t,e){n.fancybox.stop(e.$slide),e.$slide.css("transition-duration","0ms"),e.inTransition=!1,e.pos===a.instance.current.pos&&(a.sliderStartPos.left=n.fancybox.getTranslate(e.$slide).left)}),a.instance.SlideShow&&a.instance.SlideShow.isActive&&a.instance.SlideShow.stop()):("x"==s&&(a.distanceX>0&&(a.instance.group.length<2||0===a.instance.current.index&&!a.instance.current.opts.loop)?r+=Math.pow(a.distanceX,.8):a.distanceX<0&&(a.instance.group.length<2||a.instance.current.index===a.instance.group.length-1&&!a.instance.current.opts.loop)?r-=Math.pow(-a.distanceX,.8):r+=a.distanceX),a.sliderLastPos={top:"x"==s?0:a.sliderStartPos.top+a.distanceY,left:r},a.requestId&&(i(a.requestId),a.requestId=null),a.requestId=o(function(){a.sliderLastPos&&(n.each(a.instance.slides,function(t,e){var o=e.pos-a.instance.currPos;n.fancybox.setTranslate(e.$slide,{top:a.sliderLastPos.top,left:a.sliderLastPos.left+o*a.canvasWidth+o*e.opts.gutter})}),a.$container.addClass("fancybox-is-sliding"))}))},u.prototype.onPan=function(){var t,e,a,s=this;s.canTap=!1,t=s.contentStartPos.width>s.canvasWidth?s.contentStartPos.left+s.distanceX:s.contentStartPos.left,e=s.contentStartPos.top+s.distanceY,a=s.limitMovement(t,e,s.contentStartPos.width,s.contentStartPos.height),a.scaleX=s.contentStartPos.scaleX,a.scaleY=s.contentStartPos.scaleY,s.contentLastPos=a,s.requestId&&(i(s.requestId),s.requestId=null),s.requestId=o(function(){n.fancybox.setTranslate(s.$content,s.contentLastPos)})},u.prototype.limitMovement=function(t,e,n,o){var i,a,s,r,c=this,l=c.canvasWidth,u=c.canvasHeight,d=c.contentStartPos.left,f=c.contentStartPos.top,h=c.distanceX,p=c.distanceY;return i=Math.max(0,.5*l-.5*n),a=Math.max(0,.5*u-.5*o),s=Math.min(l-n,.5*l-.5*n),r=Math.min(u-o,.5*u-.5*o),n>l&&(h>0&&t>i&&(t=i-1+Math.pow(-i+d+h,.8)||0),h<0&&tu&&(p>0&&e>a&&(e=a-1+Math.pow(-a+f+p,.8)||0),p<0&&ea?(t=t>0?0:t,t=ts?(e=e>0?0:e,e=e50?(n.fancybox.animate(e.instance.current.$slide,{top:e.sliderStartPos.top+e.distanceY+150*e.velocityY,opacity:0},150),o=e.instance.close(!0,300)):"x"==t&&e.distanceX>50&&e.instance.group.length>1?o=e.instance.previous(e.speedX):"x"==t&&e.distanceX<-50&&e.instance.group.length>1&&(o=e.instance.next(e.speedX)),o!==!1||"x"!=t&&"y"!=t||e.instance.jumpTo(e.instance.current.index,150),e.$container.removeClass("fancybox-is-sliding")},u.prototype.endPanning=function(){var t,e,o,i=this;i.contentLastPos&&(i.instance.current.opts.touch.momentum===!1?(t=i.contentLastPos.left,e=i.contentLastPos.top):(t=i.contentLastPos.left+i.velocityX*i.speed,e=i.contentLastPos.top+i.velocityY*i.speed),o=i.limitPosition(t,e,i.contentStartPos.width,i.contentStartPos.height),o.width=i.contentStartPos.width,o.height=i.contentStartPos.height,n.fancybox.animate(i.$content,o,330))},u.prototype.endZooming=function(){var t,e,o,i,a=this,s=a.instance.current,r=a.newWidth,c=a.newHeight;a.contentLastPos&&(t=a.contentLastPos.left,e=a.contentLastPos.top,i={top:e,left:t,width:r,height:c,scaleX:1,scaleY:1},n.fancybox.setTranslate(a.$content,i),rs.width||c>s.height?a.instance.scaleToActual(a.centerPointStartX,a.centerPointStartY,150):(o=a.limitPosition(t,e,r,c),n.fancybox.setTranslate(a.content,n.fancybox.getTranslate(a.$content)),n.fancybox.animate(a.$content,o,150)))},u.prototype.onTap=function(t){var e,o=this,i=n(t.target),s=o.instance,r=s.current,c=t&&a(t)||o.startPoints,l=c[0]?c[0].x-o.$stage.offset().left:0,u=c[0]?c[0].y-o.$stage.offset().top:0,d=function(e){var i=r.opts[e];if(n.isFunction(i)&&(i=i.apply(s,[r,t])),i)switch(i){case"close":s.close(o.startEvent);break;case"toggleControls":s.toggleControls(!0);break;case"next":s.next();break;case"nextOrClose":s.group.length>1?s.next():s.close(o.startEvent);break;case"zoom":"image"==r.type&&(r.isLoaded||r.$ghost)&&(s.canPan()?s.scaleToFit():s.isScaledDown()?s.scaleToActual(l,u):s.group.length<2&&s.close(o.startEvent))}};if(!(t.originalEvent&&2==t.originalEvent.button||s.isSliding||l>i[0].clientWidth+i.offset().left)){if(i.is(".fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-container"))e="Outside";else if(i.is(".fancybox-slide"))e="Slide";else{if(!s.current.$content||!s.current.$content.has(t.target).length)return;e="Content"}if(o.tapped){if(clearTimeout(o.tapped),o.tapped=null,Math.abs(l-o.tapX)>50||Math.abs(u-o.tapY)>50||s.isSliding)return this;d("dblclick"+e)}else o.tapX=l,o.tapY=u,r.opts["dblclick"+e]&&r.opts["dblclick"+e]!==r.opts["click"+e]?o.tapped=setTimeout(function(){o.tapped=null,d("click"+e)},300):d("click"+e);return this}},n(e).on("onActivate.fb",function(t,e){e&&!e.Guestures&&(e.Guestures=new u(e))}),n(e).on("beforeClose.fb",function(t,e){e&&e.Guestures&&e.Guestures.destroy()})}(window,document,window.jQuery),function(t,e){"use strict";var n=function(t){this.instance=t,this.init()};e.extend(n.prototype,{timer:null,isActive:!1,$button:null,speed:3e3,init:function(){var t=this;t.$button=t.instance.$refs.toolbar.find("[data-fancybox-play]").on("click",function(){t.toggle()}),(t.instance.group.length<2||!t.instance.group[t.instance.currIndex].opts.slideShow)&&t.$button.hide()},set:function(){var t=this;t.instance&&t.instance.current&&(t.instance.current.opts.loop||t.instance.currIndex1&&t.instance.group[t.instance.currIndex].opts.thumbs&&("image"==e.type||e.opts.thumb||e.opts.$thumb)&&("image"==n.type||n.opts.thumb||n.opts.$thumb)?(t.$button.on("click",function(){t.toggle()}),t.isActive=!0):(t.$button.hide(),t.isActive=!1)},create:function(){var t,n,o=this.instance;this.$grid=e('
').appendTo(o.$refs.container),t="
    ",e.each(o.group,function(e,o){n=o.opts.thumb||(o.opts.$thumb?o.opts.$thumb.attr("src"):null),n||"image"!==o.type||(n=o.src),n&&n.length&&(t+='
  • ')}),t+="
",this.$list=e(t).appendTo(this.$grid).on("click","li",function(){o.jumpTo(e(this).data("index"))}),this.$list.find("img").hide().one("load",function(){var t,n,o,i,a=e(this).parent().removeClass("fancybox-thumbs-loading"),s=a.outerWidth(),r=a.outerHeight();t=this.naturalWidth||this.width,n=this.naturalHeight||this.height,o=t/s,i=n/r,o>=1&&i>=1&&(o>i?(t/=i,n=r):(t=s,n/=o)),e(this).css({width:Math.floor(t),height:Math.floor(n),"margin-top":Math.min(0,Math.floor(.3*r-.3*n)),"margin-left":Math.min(0,Math.floor(.5*s-.5*t))}).show()}).each(function(){this.src=e(this).data("src")})},focus:function(){this.instance.current&&this.$list.children().removeClass("fancybox-thumbs-active").filter('[data-index="'+this.instance.current.index+'"]').addClass("fancybox-thumbs-active").focus()},close:function(){this.$grid.hide()},update:function(){this.instance.$refs.container.toggleClass("fancybox-show-thumbs",this.isVisible),this.isVisible?(this.$grid||this.create(),this.instance.trigger("onThumbsShow"),this.focus()):this.$grid&&this.instance.trigger("onThumbsHide"),this.instance.update()},hide:function(){this.isVisible=!1,this.update()},show:function(){this.isVisible=!0,this.update()},toggle:function(){this.isVisible=!this.isVisible,this.update()}}),e(t).on({"onInit.fb":function(t,e){e&&!e.Thumbs&&(e.Thumbs=new n(e))},"beforeShow.fb":function(t,e,n,o){var i=e&&e.Thumbs;if(i&&i.isActive){if(n.modal)return i.$button.hide(),void i.hide();o&&n.opts.thumbs.autoStart===!0&&i.show(),i.isVisible&&i.focus()}},"afterKeydown.fb":function(t,e,n,o,i){var a=e&&e.Thumbs;a&&a.isActive&&71===i&&(o.preventDefault(),a.toggle())},"beforeClose.fb":function(t,e){var n=e&&e.Thumbs;n&&n.isVisible&&e.opts.thumbs.hideOnClose!==!1&&n.close()}})}(document,window.jQuery),function(t,e,n){"use strict";function o(){var t=e.location.hash.substr(1),n=t.split("-"),o=n.length>1&&/^\+?\d+$/.test(n[n.length-1])?parseInt(n.pop(-1),10)||1:1,i=n.join("-");return o<1&&(o=1),{hash:t,index:o,gallery:i}}function i(t){var e;""!==t.gallery&&(e=n("[data-fancybox='"+n.escapeSelector(t.gallery)+"']").eq(t.index-1),e.length||(e=n("#"+n.escapeSelector(t.gallery))),e.length&&(s=!1,e.trigger("click")))}function a(t){var e;return!!t&&(e=t.current?t.current.opts:t.opts,e.hash||(e.$orig?e.$orig.data("fancybox"):""))}n.escapeSelector||(n.escapeSelector=function(t){var e=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\x80-\uFFFF\w-]/g,n=function(t,e){return e?"\0"===t?"�":t.slice(0,-1)+"\\"+t.charCodeAt(t.length-1).toString(16)+" ":"\\"+t};return(t+"").replace(e,n)});var s=!0,r=null,c=null;n(function(){setTimeout(function(){n.fancybox.defaults.hash!==!1&&(n(t).on({"onInit.fb":function(t,e){var n,i;e.group[e.currIndex].opts.hash!==!1&&(n=o(),i=a(e),i&&n.gallery&&i==n.gallery&&(e.currIndex=n.index-1))},"beforeShow.fb":function(n,o,i){var l;i&&i.opts.hash!==!1&&(l=a(o),l&&""!==l&&(e.location.hash.indexOf(l)<0&&(o.opts.origHash=e.location.hash),r=l+(o.group.length>1?"-"+(i.index+1):""),"replaceState"in e.history?(c&&clearTimeout(c),c=setTimeout(function(){e.history[s?"pushState":"replaceState"]({},t.title,e.location.pathname+e.location.search+"#"+r),c=null,s=!1},300)):e.location.hash=r))},"beforeClose.fb":function(o,i,s){var l,u;c&&clearTimeout(c),s.opts.hash!==!1&&(l=a(i),u=i&&i.opts.origHash?i.opts.origHash:"",l&&""!==l&&("replaceState"in history?e.history.replaceState({},t.title,e.location.pathname+e.location.search+u):(e.location.hash=u,n(e).scrollTop(i.scrollTop).scrollLeft(i.scrollLeft))),r=null)}}),n(e).on("hashchange.fb",function(){var t=o();n.fancybox.getInstance()?!r||r===t.gallery+"-"+t.index||1===t.index&&r==t.gallery||(r=null,n.fancybox.close()):""!==t.gallery&&i(t)}),i(o()))},50)})}(document,window,window.jQuery); \ No newline at end of file diff --git a/package.json b/package.json index 955af5ff..6a6e41db 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "@fancyapps/fancybox", "description": "Touch enabled, responsive and fully customizable jQuery lightbox script", - "version": "3.1.27", + "version": "3.1.28", "homepage": "http://fancyapps.com/fancybox/", "main": "./dist/jquery.fancybox.js", "author": "fancyApps", diff --git a/src/js/core.js b/src/js/core.js index faf62b9c..6626b2cd 100644 --- a/src/js/core.js +++ b/src/js/core.js @@ -2913,12 +2913,11 @@ var target = e.currentTarget, opts = e.data ? e.data.options : {}, items = opts.selector ? $( opts.selector ) : ( e.data ? e.data.items : [] ), - value = $(target).attr( 'data-fancybox' ) || '', + value = $( target ).attr( 'data-fancybox' ) || '', index = 0, active = $.fancybox.getInstance(); e.preventDefault(); - e.stopPropagation(); // Avoid opening multiple times if ( active && active.current.opts.$orig.is( target ) ) { diff --git a/src/js/thumbs.js b/src/js/thumbs.js index abbd2f47..30b0b1db 100644 --- a/src/js/thumbs.js +++ b/src/js/thumbs.js @@ -77,7 +77,7 @@ this.$list.find('img').hide().one('load', function() { - var $parent = $(this).parent().removeClass('fancybox-thumbs-loading'), + var $parent = $(this).parent().removeClass( 'fancybox-thumbs-loading' ), thumbWidth = $parent.outerWidth(), thumbHeight = $parent.outerHeight(), width, @@ -88,12 +88,12 @@ width = this.naturalWidth || this.width; height = this.naturalHeight || this.height; - //Calculate thumbnail width/height and center it + // Calculate thumbnail width/height and center it widthRatio = width / thumbWidth; heightRatio = height / thumbHeight; - if (widthRatio >= 1 && heightRatio >= 1) { + if ( widthRatio >= 1 && heightRatio >= 1 ) { if (widthRatio > heightRatio) { width = width / heightRatio; height = thumbHeight; @@ -123,9 +123,9 @@ if ( this.instance.current ) { this.$list .children() - .removeClass('fancybox-thumbs-active') - .filter('[data-index="' + this.instance.current.index + '"]') - .addClass('fancybox-thumbs-active') + .removeClass( 'fancybox-thumbs-active' ) + .filter( '[data-index="' + this.instance.current.index + '"]' ) + .addClass( 'fancybox-thumbs-active' ) .focus(); } @@ -198,7 +198,7 @@ return; } - if ( firstRun && instance.opts.thumbs.autoStart === true ) { + if ( firstRun && item.opts.thumbs.autoStart === true ) { Thumbs.show(); } From cb73667298523e1261ebd2856f7ca959fd5b7d94 Mon Sep 17 00:00:00 2001 From: Janis Skarnelis Date: Mon, 6 Nov 2017 17:34:05 +0200 Subject: [PATCH 13/56] New `Share` module; Some layout/CSS changes; bugfixes --- dist/jquery.fancybox.css | 574 +++++++++++++++---------------- dist/jquery.fancybox.js | 630 +++++++++++++++++++++-------------- dist/jquery.fancybox.min.css | 2 +- dist/jquery.fancybox.min.js | 6 +- package.json | 2 +- src/css/core.css | 363 +++++++++----------- src/css/share.css | 53 +++ src/css/thumbs.css | 188 +++++------ src/js/core.js | 284 +++++++++------- src/js/fullscreen.js | 46 ++- src/js/guestures.js | 15 +- src/js/hash.js | 164 +++++---- src/js/media.js | 4 +- src/js/share.js | 57 ++++ src/js/slideshow.js | 38 ++- src/js/thumbs.js | 17 +- 16 files changed, 1315 insertions(+), 1128 deletions(-) create mode 100644 src/css/share.css create mode 100644 src/js/share.js diff --git a/dist/jquery.fancybox.css b/dist/jquery.fancybox.css index 0b8f9103..3e7df722 100644 --- a/dist/jquery.fancybox.css +++ b/dist/jquery.fancybox.css @@ -1,10 +1,11 @@ @charset "UTF-8"; -.fancybox-enabled { +body.fancybox-active { overflow: hidden; } -.fancybox-enabled body { - overflow: visible; - height: 100%; } +body.fancybox-iosfix { + position: fixed; + left: 0; + right: 0; } .fancybox-is-hidden { position: absolute; @@ -23,7 +24,8 @@ -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateZ(0); - transform: translateZ(0); } + transform: translateZ(0); + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; } /* Make sure that the first one is on the top */ .fancybox-container ~ .fancybox-container { @@ -74,18 +76,14 @@ .fancybox-infobar { top: 0; - left: 50%; - margin-left: -79px; } - -.fancybox-infobar__body { - display: inline-block; - width: 70px; - line-height: 44px; + left: 0; font-size: 13px; - font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; + padding: 0 10px; + height: 44px; + min-width: 44px; + line-height: 44px; + color: #ccc; text-align: center; - color: #ddd; - background-color: rgba(30, 30, 30, 0.7); pointer-events: none; -webkit-user-select: none; -moz-user-select: none; @@ -93,11 +91,14 @@ user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; - -webkit-font-smoothing: subpixel-antialiased; } + -webkit-font-smoothing: subpixel-antialiased; + mix-blend-mode: exclusion; } .fancybox-toolbar { top: 0; - right: 0; } + right: 0; + margin: 0; + padding: 0; } .fancybox-stage { overflow: hidden; @@ -125,9 +126,7 @@ backface-visibility: hidden; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; - transition-property: transform, opacity, -webkit-transform; - -webkit-transform-style: preserve-3d; - transform-style: preserve-3d; } + transition-property: transform, opacity, -webkit-transform; } .fancybox-slide::before { content: ''; @@ -159,7 +158,7 @@ .fancybox-slide--next { z-index: 99995; } -.fancybox-slide > div { +.fancybox-slide > * { display: inline-block; position: relative; padding: 24px; @@ -171,6 +170,14 @@ overflow: auto; box-sizing: border-box; } +.fancybox-slide > title, +.fancybox-slide > style, +.fancybox-slide > meta, +.fancybox-slide > link, +.fancybox-slide > script, +.fancybox-slide > base { + display: none; } + .fancybox-slide .fancybox-image-wrap { position: absolute; top: 0; @@ -260,8 +267,98 @@ margin: 0; padding: 0; color: #444; - font: 16px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; } + font-size: 16px; + line-height: 20px; } + +.fancybox-slide--iframe .fancybox-close-small { + top: 0; + right: -44px; } + +.fancybox-slide--iframe .fancybox-close-small:after { + font-size: 35px; + color: #aaa; } + +.fancybox-slide--iframe .fancybox-close-small:hover:after { + color: #fff; + background: transparent; } + +/* Buttons */ +.fancybox-button { + box-sizing: border-box; + display: inline-block; + vertical-align: top; + width: 44px; + height: 44px; + margin: 0; + padding: 10px; + border: 0; + border-radius: 0; + background: rgba(30, 30, 30, 0.6); + color: #ccc; + transition: color .3s ease; + cursor: pointer; } + +.fancybox-button[disabled] { + cursor: default; + opacity: 0.6; } + +.fancybox-button:hover:not([disabled]) { + color: #fff; } + +.fancybox-button svg { + display: block; + position: relative; + overflow: visible; + shape-rendering: geometricPrecision; } + +.fancybox-button svg path { + fill: currentColor; + stroke: currentColor; + stroke-linejoin: round; + stroke-width: 3; } + +.fancybox-button--share svg path { + stroke-width: 1; } + +.fancybox-button--play svg path:nth-child(2) { + display: none; } + +.fancybox-button--pause svg path:nth-child(1) { + display: none; } + +/* Navigation arrows */ +.fancybox-navigation { + display: none; } +.fancybox-show-nav .fancybox-navigation { + display: block; } + +.fancybox-navigation button { + position: absolute; + top: 50%; + margin: -50px 0 0 0; + z-index: 99997; + background: transparent; + width: 60px; + height: 100px; + padding: 17px; } + +.fancybox-navigation button:before { + content: ""; + position: absolute; + top: 30px; + right: 10px; + width: 40px; + height: 40px; + background: rgba(30, 30, 30, 0.6); } + +.fancybox-navigation .fancybox-button--arrow_left { + left: 0; } + +.fancybox-navigation .fancybox-button--arrow_right { + right: 0; } + +/* Close button on the top right corner of html content */ .fancybox-close-small { position: absolute; top: 0; @@ -272,7 +369,6 @@ margin: 0; border: 0; border-radius: 0; - outline: none; background: transparent; z-index: 10; cursor: pointer; } @@ -290,11 +386,14 @@ text-align: center; border-radius: 50%; border-width: 0; - background: #fff; - transition: background .25s; + background-color: transparent; + transition: background-color .25s; box-sizing: border-box; z-index: 2; } +.fancybox-close-small:focus { + outline: none; } + .fancybox-close-small:focus:after { outline: 1px dotted #888; } @@ -302,24 +401,12 @@ color: #555; background: #eee; } -.fancybox-slide--iframe .fancybox-close-small { - top: 0; - right: -44px; } - -.fancybox-slide--iframe .fancybox-close-small:after { - background: transparent; - font-size: 35px; - color: #aaa; } - -.fancybox-slide--iframe .fancybox-close-small:hover:after { - color: #fff; } - /* Caption */ .fancybox-caption-wrap { bottom: 0; left: 0; right: 0; - padding: 60px 30px 0 30px; + padding: 60px 2vw 0 2vw; background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.1) 20%, rgba(0, 0, 0, 0.2) 40%, rgba(0, 0, 0, 0.6) 80%, rgba(0, 0, 0, 0.8) 100%); pointer-events: none; } @@ -327,7 +414,6 @@ padding: 30px 0; border-top: 1px solid rgba(255, 255, 255, 0.4); font-size: 14px; - font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; color: #fff; line-height: 20px; -webkit-text-size-adjust: none; } @@ -335,153 +421,14 @@ .fancybox-caption a, .fancybox-caption button, .fancybox-caption select { - pointer-events: all; } + pointer-events: all; + position: relative; + /* Fix IE11 */ } .fancybox-caption a { color: #fff; text-decoration: underline; } -/* Buttons */ -.fancybox-button { - display: inline-block; - position: relative; - margin: 0; - padding: 0; - border: 0; - width: 44px; - height: 44px; - line-height: 44px; - text-align: center; - background: transparent; - color: #ddd; - border-radius: 0; - cursor: pointer; - vertical-align: top; - outline: none; } - -.fancybox-button[disabled] { - cursor: default; - pointer-events: none; } - -.fancybox-infobar__body, .fancybox-button { - background: rgba(30, 30, 30, 0.6); } - -.fancybox-button:hover:not([disabled]) { - color: #fff; - background: rgba(0, 0, 0, 0.8); } - -.fancybox-button::before, -.fancybox-button::after { - content: ''; - pointer-events: none; - position: absolute; - background-color: currentColor; - color: currentColor; - opacity: 0.9; - box-sizing: border-box; - display: inline-block; } - -.fancybox-button[disabled]::before, -.fancybox-button[disabled]::after { - opacity: 0.3; } - -.fancybox-button--left::after, -.fancybox-button--right::after { - top: 18px; - width: 6px; - height: 6px; - background: transparent; - border-top: solid 2px currentColor; - border-right: solid 2px currentColor; } - -.fancybox-button--left::after { - left: 20px; - -webkit-transform: rotate(-135deg); - -ms-transform: rotate(-135deg); - transform: rotate(-135deg); } - -.fancybox-button--right::after { - right: 20px; - -webkit-transform: rotate(45deg); - -ms-transform: rotate(45deg); - transform: rotate(45deg); } - -.fancybox-button--left { - border-bottom-left-radius: 5px; } - -.fancybox-button--right { - border-bottom-right-radius: 5px; } - -.fancybox-button--close::before, .fancybox-button--close::after { - content: ''; - display: inline-block; - position: absolute; - height: 2px; - width: 16px; - top: calc(50% - 1px); - left: calc(50% - 8px); } - -.fancybox-button--close::before { - -webkit-transform: rotate(45deg); - -ms-transform: rotate(45deg); - transform: rotate(45deg); } - -.fancybox-button--close::after { - -webkit-transform: rotate(-45deg); - -ms-transform: rotate(-45deg); - transform: rotate(-45deg); } - -/* Navigation arrows */ -.fancybox-arrow { - position: absolute; - top: 50%; - margin: -50px 0 0 0; - height: 100px; - width: 54px; - padding: 0; - border: 0; - outline: none; - background: none; - cursor: pointer; - z-index: 99995; - opacity: 0; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - transition: opacity .25s; } - -.fancybox-arrow::after { - content: ''; - position: absolute; - top: 28px; - width: 44px; - height: 44px; - background-color: rgba(30, 30, 30, 0.8); - background-image: url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjRkZGRkZGIiBoZWlnaHQ9IjQ4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSI0OCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gICAgPHBhdGggZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIvPiAgICA8cGF0aCBkPSJNMTIgNGwtMS40MSAxLjQxTDE2LjE3IDExSDR2MmgxMi4xN2wtNS41OCA1LjU5TDEyIDIwbDgtOHoiLz48L3N2Zz4=); - background-repeat: no-repeat; - background-position: center center; - background-size: 24px 24px; } - -.fancybox-arrow--right { - right: 0; } - -.fancybox-arrow--left { - left: 0; - -webkit-transform: scaleX(-1); - -ms-transform: scaleX(-1); - transform: scaleX(-1); } - -.fancybox-arrow--right::after, -.fancybox-arrow--left::after { - left: 0; } - -.fancybox-show-nav .fancybox-arrow { - opacity: 0.6; } - -.fancybox-show-nav .fancybox-arrow[disabled] { - opacity: 0.3; } - /* Loading indicator */ .fancybox-slide > .fancybox-loading { border: 6px solid rgba(100, 100, 100, 0.4); @@ -495,8 +442,8 @@ position: absolute; top: 50%; left: 50%; - margin-top: -25px; - margin-left: -25px; + margin-top: -30px; + margin-left: -30px; z-index: 99999; } @-webkit-keyframes fancybox-rotate { @@ -608,141 +555,146 @@ -webkit-transform: translate3d(0, 0, 0) scale(1); transform: translate3d(0, 0, 0) scale(1); } -/* Styling for Small-Screen Devices */ -@media all and (max-width: 800px) { - .fancybox-infobar { - left: 0; - margin-left: 0; } - .fancybox-button--left, - .fancybox-button--right { - display: none !important; } - .fancybox-caption { - padding: 20px 0; - margin: 0; } } - -/* Fullscreen */ -.fancybox-button--fullscreen::before { - width: 15px; - height: 11px; - left: calc(50% - 7px); - top: calc(50% - 6px); - border: 2px solid; - background: none; } - -/* Slideshow button */ -.fancybox-button--play::before, -.fancybox-button--pause::before { - top: calc(50% - 6px); - left: calc(50% - 4px); - background: transparent; } +/* Share */ +.fancybox-share { + padding: 30px; + border-radius: 3px; + background: #f4f4f4; + max-width: 90%; } + +.fancybox-share h1 { + color: #222; + margin: 0 0 20px 0; + font-size: 33px; + font-weight: 700; + text-align: center; } + +.fancybox-share p { + margin: 0; + padding: 0; + text-align: center; } -.fancybox-button--play::before { - width: 0; - height: 0; - border-top: 6px inset transparent; - border-bottom: 6px inset transparent; - border-left: 10px solid; - border-radius: 1px; } +.fancybox-share_button { + display: inline-block; + text-decoration: none; + margin: 0 10px 10px 0; + padding: 10px 20px; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); + border-radius: 3px; + background: #fff; + white-space: nowrap; + font-size: 16px; + line-height: 23px; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + min-width: 140px; + color: #888; + transition: all .2s; } + +.fancybox-share_button:focus, +.fancybox-share_button:hover { + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); + text-decoration: none; + color: #555; } -.fancybox-button--pause::before { - width: 7px; - height: 11px; - border-style: solid; - border-width: 0 2px 0 2px; } +.fancybox-share_button svg { + margin-right: 5px; + width: 23px; + height: 23px; + vertical-align: top; } /* Thumbs */ .fancybox-thumbs { - display: none; } + display: none; + position: absolute; + top: 0; + bottom: 0; + right: 0; + width: 212px; + margin: 0; + padding: 2px; + background: #fff; + -webkit-tap-highlight-color: transparent; + -webkit-overflow-scrolling: touch; + -ms-overflow-style: -ms-autohiding-scrollbar; + box-sizing: border-box; + z-index: 99995; } -.fancybox-button--thumbs { - display: none; } +.fancybox-show-thumbs .fancybox-thumbs { + display: block; } + +.fancybox-show-thumbs .fancybox-inner { + right: 212px; } -@media all and (min-width: 800px) { - .fancybox-button--thumbs { - display: inline-block; } - .fancybox-button--thumbs span { - font-size: 23px; } - .fancybox-button--thumbs::before { - width: 3px; - height: 3px; - top: calc(50% - 2px); - left: calc(50% - 2px); - box-shadow: 0 -4px 0, -4px -4px 0, 4px -4px 0, 0 0 0 32px inset, -4px 0 0, 4px 0 0, 0 4px 0, -4px 4px 0, 4px 4px 0; } +.fancybox-thumbs > ul { + list-style: none; + position: absolute; + position: relative; + width: 100%; + height: 100%; + margin: 0; + padding: 0; + overflow-x: hidden; + overflow-y: auto; + font-size: 0; + white-space: nowrap; } + +.fancybox-thumbs > ul > li { + float: left; + overflow: hidden; + padding: 0; + margin: 2px; + width: 100px; + height: 75px; + max-width: calc(50% - 4px); + max-height: calc(100% - 8px); + position: relative; + cursor: pointer; + outline: none; + -webkit-tap-highlight-color: transparent; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; + box-sizing: border-box; } + +li.fancybox-thumbs-loading { + background: rgba(0, 0, 0, 0.1); } + +.fancybox-thumbs > ul > li > img { + position: absolute; + top: 0; + left: 0; + min-width: 100%; + min-height: 100%; + max-width: none; + max-height: none; + -webkit-touch-callout: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; } + +.fancybox-thumbs > ul > li:before { + content: ''; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + border: 4px solid #4ea7f9; + z-index: 99991; + opacity: 0; + transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94); } + +.fancybox-thumbs > ul > li.fancybox-thumbs-active:before { + opacity: 1; } + +/* Styling for Small-Screen Devices */ +@media all and (max-width: 800px) { .fancybox-thumbs { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: auto; - width: 220px; - margin: 0; - padding: 5px 5px 0 0; - background: #fff; - word-break: normal; - -webkit-tap-highlight-color: transparent; - -webkit-overflow-scrolling: touch; - -ms-overflow-style: -ms-autohiding-scrollbar; - box-sizing: border-box; - z-index: 99995; } - .fancybox-show-thumbs .fancybox-thumbs { - display: block; } + width: 110px; } .fancybox-show-thumbs .fancybox-inner { - right: 220px; } - .fancybox-thumbs > ul { - list-style: none; - position: absolute; - position: relative; - width: 100%; - height: 100%; - margin: 0; - padding: 0; - overflow-x: hidden; - overflow-y: auto; - font-size: 0; } + right: 110px; } .fancybox-thumbs > ul > li { - float: left; - overflow: hidden; - max-width: 50%; - padding: 0; - margin: 0; - width: 105px; - height: 75px; - position: relative; - cursor: pointer; - outline: none; - border: 5px solid transparent; - border-top-width: 0; - border-right-width: 0; - -webkit-tap-highlight-color: transparent; - -webkit-backface-visibility: hidden; - backface-visibility: hidden; - box-sizing: border-box; } - li.fancybox-thumbs-loading { - background: rgba(0, 0, 0, 0.1); } - .fancybox-thumbs > ul > li > img { - position: absolute; - top: 0; - left: 0; - min-width: 100%; - min-height: 100%; - max-width: none; - max-height: none; - -webkit-touch-callout: none; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; } - .fancybox-thumbs > ul > li:before { - content: ''; - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - border-radius: 2px; - border: 4px solid #4ea7f9; - z-index: 99991; - opacity: 0; - transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94); } - .fancybox-thumbs > ul > li.fancybox-thumbs-active:before { - opacity: 1; } } + max-width: calc(100% - 10px); } } diff --git a/dist/jquery.fancybox.js b/dist/jquery.fancybox.js index f991ac2c..b2edd988 100644 --- a/dist/jquery.fancybox.js +++ b/dist/jquery.fancybox.js @@ -1,5 +1,5 @@ // ================================================== -// fancyBox v3.1.28 +// fancyBox v3.2.0 // // Licensed GPLv3 for open source use // or fancyBox Commercial License for commercial use @@ -23,7 +23,7 @@ if ( $.fn.fancybox ) { - $.error('fancyBox already initialized'); + 'console' in window && console.log( 'fancyBox already initialized' ); return; } @@ -49,7 +49,7 @@ arrows : true, // Should display infobar (counter and arrows at the top) - infobar : false, + infobar : true, // Should display toolbar (buttons at the top) toolbar : true, @@ -61,11 +61,13 @@ 'slideShow', 'fullScreen', 'thumbs', + //'download', + 'share', 'close' ], // Detect "idle" time in seconds - idleTime : 4, + idleTime : 3, // Should display buttons at top right corner of the content // If 'auto' - they will be created for content having type 'html', 'inline' or 'ajax' @@ -83,7 +85,7 @@ // Wait for images to load before displaying // Requires predefined image dimensions // If 'auto' - will zoom in thumbnail if 'width' and 'height' attributes are found - preload : "auto", + preload : "auto" }, @@ -132,7 +134,7 @@ animationEffect : "zoom", // Duration in ms for open/close animation - animationDuration : 366, + animationDuration : 500, // Should image change opacity while zooming // If opacity is 'auto', then opacity will be changed if image and thumbnail have different aspect ratios @@ -166,23 +168,12 @@ '
' + '
' + '
' + - '' + - '
' + - ' / ' + - '
' + - '' + - '
' + - '
' + - '{{BUTTONS}}' + - '
' + - '
' + - '
' + + '
{{buttons}}
' + + '
{{arrows}}
' + '
' + - '
' + - '
' + - '
' + + '
' + '
' + '
', @@ -193,14 +184,35 @@ errorTpl : '

{{ERROR}}

', btnTpl : { - slideShow : '', - fullScreen : '', - thumbs : '', - close : '', + + download : '' + + '' + + '' + + '' + + '', + + close : '', // This small close button will be appended to your html/inline/ajax content by default, // if "smallBtn" option is not set to false - smallBtn : '' + smallBtn : '', + + // Arrows + arrowLeft : '', + + arrowRight : '', }, // Container is injected into this element @@ -211,7 +223,7 @@ // ============== // Try to focus on the first focusable element after opening - autoFocus : true, + autoFocus : false, // Put focus back to active element after closing backFocus : true, @@ -350,7 +362,9 @@ PLAY_START : 'Start slideshow', PLAY_STOP : 'Pause slideshow', FULL_SCREEN : 'Full screen', - THUMBS : 'Thumbnails' + THUMBS : 'Thumbnails', + DOWNLOAD : 'Download', + SHARE : 'Share' }, 'de' : { CLOSE : 'Schliessen', @@ -360,7 +374,9 @@ PLAY_START : 'Diaschau starten', PLAY_STOP : 'Diaschau beenden', FULL_SCREEN : 'Vollbild', - THUMBS : 'Vorschaubilder' + THUMBS : 'Vorschaubilder', + DOWNLOAD : 'Herunterladen', + SHARE : 'Teilen' } } @@ -434,7 +450,11 @@ var FancyBox = function( content, opts, index ) { var self = this; - self.opts = $.extend( true, { index : index }, defaults, opts || {} ); + self.opts = $.extend( true, { index : index }, defaults, opts || {} ); + + if ( $.fancybox.isMobile ) { + self.opts = $.extend( true, {}, self.opts, self.opts.mobile ); + } // Exclude buttons option from deep merging if ( opts && $.isArray( opts.buttons ) ) { @@ -475,11 +495,13 @@ // ==================== init : function() { - var self = this; - - var testWidth, $container, buttonStr; - - var firstItemOpts = self.group[ self.currIndex ].opts; + var self = this, + firstItem = self.group[ self.currIndex ], + firstItemOpts = firstItem.opts, + scrollbarWidth = $.fancybox.scrollbarWidth, + $scrollDiv, + $container, + buttonStr; self.scrollTop = $D.scrollTop(); self.scrollLeft = $D.scrollLeft(); @@ -488,17 +510,33 @@ // Hide scrollbars // =============== - if ( !$.fancybox.getInstance() && !$.fancybox.isMobile && $( 'body' ).css('overflow') !== 'hidden' ) { - testWidth = $( 'body' ).width(); + if ( !$.fancybox.getInstance() ) { + + $( 'body' ).addClass( 'fancybox-active' ); + + // iOS hack + if ( /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream ) { + + // iOS has problems for input elements inside fixed containers, + // the workaround is to apply `position: fixed` to `` element, + // unfortunately, this makes it lose the scrollbars and forces address bar to appear. + + if ( firstItem.type !== 'image' ) { + $( 'body' ).css( 'top', $( 'body' ).scrollTop() * -1 ).addClass( 'fancybox-iosfix' ); + } + + } else if ( !$.fancybox.isMobile && document.body.scrollHeight > window.innerHeight ) { + + if ( scrollbarWidth === undefined ) { + $scrollDiv = $('
').appendTo( 'body' ); - $( 'html' ).addClass( 'fancybox-enabled' ); + scrollbarWidth = $.fancybox.scrollbarWidth = $scrollDiv[0].offsetWidth - $scrollDiv[0].clientWidth; - // Compare body width after applying "overflow: hidden" - testWidth = $( 'body' ).width() - testWidth; + $scrollDiv.remove(); + } - // If width has changed - compensate missing scrollbars by adding right margin - if ( testWidth > 1 ) { - $( 'head' ).append( '' ); + $( 'head' ).append( '' ); + $( 'body' ).addClass( 'compensate-for-scrollbar' ); } } @@ -515,9 +553,15 @@ // Create markup from base template, it will be initially hidden to // avoid unnecessary work like painting while initializing is not complete - $container = $( self.translate( self, firstItemOpts.baseTpl.replace( '\{\{BUTTONS\}\}', buttonStr ) ) ) + $container = $( + self.translate( self, + firstItemOpts.baseTpl + .replace( '\{\{buttons\}\}', buttonStr ) + .replace( '\{\{arrows\}\}', firstItemOpts.btnTpl.arrowLeft + firstItemOpts.btnTpl.arrowRight ) + ) + ) + .attr( 'id', 'fancybox-container-' + self.id ) .addClass( 'fancybox-is-hidden' ) - .attr('id', 'fancybox-container-' + self.id) .addClass( firstItemOpts.baseClass ) .data( 'FancyBox', self ) .prependTo( firstItemOpts.parentEl ); @@ -531,19 +575,6 @@ self.$refs[ item ] = $container.find( '.fancybox-' + item ); }); - // Check for redundant elements - if ( !firstItemOpts.arrows || self.group.length < 2 ) { - $container.find('.fancybox-navigation').remove(); - } - - if ( !firstItemOpts.infobar ) { - self.$refs.infobar.remove(); - } - - if ( !firstItemOpts.toolbar ) { - self.$refs.toolbar.remove(); - } - self.trigger( 'onInit' ); // Bring to front and enable events @@ -602,28 +633,19 @@ } else if ( $.type( item ) === 'object' && $( item ).length ) { - // Here we propbably have jQuery collection returned by some selector - + // Here we probably have jQuery collection returned by some selector $item = $( item ); - data = $item.data(); - - opts = 'options' in data ? data.options : {}; - opts = $.type( opts ) === 'object' ? opts : {}; - - obj.src = 'src' in data ? data.src : ( opts.src || $item.attr( 'href' ) ); - [ 'width', 'height', 'thumb', 'type', 'filter' ].forEach(function(item) { - if ( item in data ) { - opts[ item ] = data[ item ]; - } - }); - - if ( 'srcset' in data ) { - opts.image = { srcset : data.srcset }; - } + opts = $item.data(); + opts = $.extend( {}, opts, opts.options || {} ); + // Here we store clicked element opts.$orig = $item; + obj.src = opts.src || $item.attr( 'href' ); + + // Assume that simple syntax is used, for example: + // `$.fancybox.open( $("#test"), {} );` if ( !obj.type && !obj.src ) { obj.type = 'inline'; obj.src = item; @@ -632,7 +654,7 @@ } else { // Assume we have a simple html code, for example: - // $.fancybox.open( '

Hi!

' ); + // $.fancybox.open( '

Hi!

' ); obj = { type : 'html', @@ -644,8 +666,9 @@ // Each gallery object has full collection of options obj.opts = $.extend( true, {}, self.opts, opts ); - if ( $.fancybox.isMobile ) { - obj.opts = $.extend( true, {}, obj.opts, obj.opts.mobile ); + // Do not merge buttons array + if ( $.isArray( opts.buttons ) ) { + obj.opts.buttons = opts.buttons; } @@ -689,15 +712,14 @@ } // Caption is a "special" option, it can be passed as a method - if ( $.type( obj.opts.caption ) === 'function' ) { - obj.opts.caption = obj.opts.caption.apply( item, [ self, obj ] ); - - } else if ( 'caption' in data ) { - obj.opts.caption = data.caption; + if ( $.type( self.opts.caption ) === 'function' ) { + obj.opts.caption = self.opts.caption.apply( item, [ self, obj ] ); } - // Make sure we have caption as a string - obj.opts.caption = obj.opts.caption === undefined ? '' : obj.opts.caption + ''; + // Make sure we have caption as a string or jQuery object + if ( !obj.opts.caption instanceof jQuery ) { + obj.opts.caption = obj.opts.caption === undefined ? '' : obj.opts.caption + ''; + } // Check if url contains "filter" used to filter the content // Example: "ajax.html #something" @@ -822,7 +844,7 @@ self.$refs.stage.show(); self.update(); - }, 500); + }, 600); } @@ -896,7 +918,7 @@ if ( self.group[ self.currIndex ].opts.idleTime ) { self.idleSecondsCounter = 0; - $D.on('mousemove.fb-idle mouseenter.fb-idle mouseleave.fb-idle mousedown.fb-idle touchstart.fb-idle touchmove.fb-idle scroll.fb-idle keydown.fb-idle', function() { + $D.on('mousemove.fb-idle mouseleave.fb-idle mousedown.fb-idle touchstart.fb-idle touchmove.fb-idle scroll.fb-idle keydown.fb-idle', function(e) { self.idleSecondsCounter = 0; if ( self.isIdle ) { @@ -1372,7 +1394,7 @@ var self = this; var isScaledDown; - var $container = self.$refs.container.removeClass('fancybox-is-zoomable fancybox-can-zoomIn fancybox-can-drag fancybox-can-zoomOut'); + var $container = self.$refs.container.removeClass( 'fancybox-is-zoomable fancybox-can-zoomIn fancybox-can-drag fancybox-can-zoomOut' ); if ( !self.current || self.isClosing ) { return; @@ -1392,7 +1414,7 @@ if ( isScaledDown ) { // If image is scaled down, then, obviously, it can be zoomed to full size - $container.addClass('fancybox-can-zoomIn'); + $container.addClass( 'fancybox-can-zoomIn' ); } else { @@ -1400,16 +1422,16 @@ // If image size ir largen than available available and touch module is not disable, // then user can do panning - $container.addClass('fancybox-can-drag'); + $container.addClass( 'fancybox-can-drag' ); } else { - $container.addClass('fancybox-can-zoomOut'); + $container.addClass( 'fancybox-can-zoomOut' ); } } } else if ( self.current.opts.touch ) { - $container.addClass('fancybox-can-drag'); + $container.addClass( 'fancybox-can-drag' ); } }, @@ -1604,7 +1626,7 @@ setImage : function( slide ) { var self = this; - var srcset = slide.opts.image.srcset; + var srcset = slide.opts.srcset || slide.opts.image.srcset; var found, temp, pxRatio, windowWidth; @@ -2153,7 +2175,7 @@ $.fancybox.stop( $slide ); - effectClassName = 'fancybox-animated fancybox-slide--' + ( slide.pos > self.prevPos ? 'next' : 'previous' ) + ' fancybox-fx-' + effect; + effectClassName = 'fancybox-animated fancybox-slide--' + ( slide.pos >= self.prevPos ? 'next' : 'previous' ) + ' fancybox-fx-' + effect; $slide.removeAttr( 'style' ).removeClass( 'fancybox-slide--current fancybox-slide--next fancybox-slide--previous' ).addClass( effectClassName ); @@ -2347,17 +2369,19 @@ var instance = $(this).data( 'FancyBox' ); // Skip self and closing instances - if (instance && instance.uid !== self.uid && !instance.isClosing) { + if (instance && instance.id !== self.id && !instance.isClosing) { instance.trigger( 'onDeactivate' ); } }); - if ( self.current ) { + if ( self.current || self.isIdle ) { if ( self.$refs.container.index() > 0 ) { self.$refs.container.prependTo( document.body ); } + self.update(); + self.updateControls(); } @@ -2489,8 +2513,10 @@ // ============================================= cleanUp : function( e ) { - var self = this, - instance; + var self = this, + $body = $( 'body' ), + instance, + offset; self.current.$slide.trigger( 'onReset' ); @@ -2512,11 +2538,20 @@ instance.activate(); } else { + $W.scrollTop( self.scrollTop ).scrollLeft( self.scrollLeft ); - $( 'html' ).removeClass( 'fancybox-enabled' ); + $body.removeClass( 'fancybox-active compensate-for-scrollbar' ); + + if ( $body.hasClass( 'fancybox-iosfix' ) ) { + + offset = parseInt(document.body.style.top, 10); + + $body.removeClass( 'fancybox-iosfix' ).css( 'top', '' ).scrollTop( offset * -1 ); + } $( '#fancybox-style-noscroll' ).remove(); + } }, @@ -2565,18 +2600,17 @@ var self = this; - var current = self.current; - var index = current.index; - var opts = current.opts; - var caption = opts.caption; - var $caption = self.$refs.caption; + var current = self.current, + index = current.index, + caption = current.opts.caption, + $caption = self.$refs.caption; // Recalculate content dimensions current.$slide.trigger( 'refresh' ); self.$caption = caption && caption.length ? $caption.html( caption ) : null; - if ( !self.isHiddenControls ) { + if ( !self.isHiddenControls && !self.isIdle ) { self.showControls(); } @@ -2584,9 +2618,14 @@ $('[data-fancybox-count]').html( self.group.length ); $('[data-fancybox-index]').html( index + 1 ); - $('[data-fancybox-prev]').prop('disabled', ( !opts.loop && index <= 0 ) ); - $('[data-fancybox-next]').prop('disabled', ( !opts.loop && index >= self.group.length - 1 ) ); + $('[data-fancybox-prev]').prop( 'disabled', ( !current.opts.loop && index <= 0 ) ); + $('[data-fancybox-next]').prop( 'disabled', ( !current.opts.loop && index >= self.group.length - 1 ) ); + if ( current.type === 'image' ) { + $('[data-fancybox-download]').attr( 'href', current.opts.image.src || current.src ); + } else { + $('[data-fancybox-download]').hide(); + } }, // Hide toolbar and caption @@ -2596,12 +2635,11 @@ this.isHiddenControls = true; - this.$refs.container.removeClass('fancybox-show-infobar fancybox-show-toolbar fancybox-show-caption fancybox-show-nav'); + this.$refs.container.removeClass( 'fancybox-show-infobar fancybox-show-toolbar fancybox-show-caption fancybox-show-nav' ); }, showControls : function() { - var self = this; var opts = self.current ? self.current.opts : self.opts; var $container = self.$refs.container; @@ -2610,10 +2648,10 @@ self.idleSecondsCounter = 0; $container - .toggleClass('fancybox-show-toolbar', !!( opts.toolbar && opts.buttons ) ) - .toggleClass('fancybox-show-infobar', !!( opts.infobar && self.group.length > 1 ) ) - .toggleClass('fancybox-show-nav', !!( opts.arrows && self.group.length > 1 ) ) - .toggleClass('fancybox-is-modal', !!opts.modal ); + .toggleClass( 'fancybox-show-toolbar', !!( opts.toolbar && opts.buttons ) ) + .toggleClass( 'fancybox-show-infobar', !!( opts.infobar && self.group.length > 1 ) ) + .toggleClass( 'fancybox-show-nav', !!( opts.arrows && self.group.length > 1 ) ) + .toggleClass( 'fancybox-is-modal', !!opts.modal ); if ( self.$caption ) { $container.addClass( 'fancybox-show-caption '); @@ -2629,7 +2667,6 @@ // ========================== toggleControls : function() { - if ( this.isHiddenControls ) { this.showControls(); @@ -2645,7 +2682,7 @@ $.fancybox = { - version : "3.1.28", + version : "3.2.0", defaults : defaults, @@ -2672,7 +2709,6 @@ } else if ( $.type( command ) === 'function' ) { command.apply( instance, args ); - } return instance; @@ -2736,7 +2772,6 @@ return window.getComputedStyle && window.getComputedStyle( div ).getPropertyValue('transform') && !(document.documentMode && document.documentMode < 11); }()), - // Helper function to get current visual state of an element // returns array[ top, left, horizontal-scale, vertical-scale, opacity ] // ===================================================================== @@ -2920,24 +2955,25 @@ // ============================================ function _run( e ) { - var target = e.currentTarget, + var $target = $( e.currentTarget ), opts = e.data ? e.data.options : {}, - items = opts.selector ? $( opts.selector ) : ( e.data ? e.data.items : [] ), - value = $( target ).attr( 'data-fancybox' ) || '', + value = $target.attr( 'data-fancybox' ) || '', index = 0, - active = $.fancybox.getInstance(); - - e.preventDefault(); + items = []; // Avoid opening multiple times - if ( active && active.current.opts.$orig.is( target ) ) { + if ( e.isDefaultPrevented() ) { return; } + e.preventDefault(); + // Get all related items and find index for clicked one if ( value ) { + items = opts.selector ? $( opts.selector ) : ( e.data ? e.data.items : [] ), items = items.length ? items.filter( '[data-fancybox="' + value + '"]' ) : $( '[data-fancybox="' + value + '"]' ); - index = items.index( target ); + + index = items.index( $target ); // Sometimes current item can not be found // (for example, when slider clones items) @@ -2946,7 +2982,7 @@ } } else { - items = [ target ]; + items = [ $target ]; } $.fancybox.open( items, opts, index ); @@ -3200,7 +3236,7 @@ item.opts.slideClass += ' fancybox-slide--' + ( provider == 'gmap_place' || provider == 'gmap_search' ? 'map' : 'video' ); } - } else { + } else if ( url ) { // If no content type is found, then set it to `image` as fallback item.type = 'image'; @@ -3210,7 +3246,7 @@ }); -}(window.jQuery)); +}( window.jQuery || jQuery )); // ========================================================================== // @@ -3280,7 +3316,7 @@ var isClickable = function( $el ) { - if ( $el.is('a,button,input,select,textarea,label') || $.isFunction( $el.get(0).onclick ) || $el.data('selectable') ) { + if ( $el.is('a,area,button,[role="button"],input,label,select,summary,textarea') || $.isFunction( $el.get(0).onclick ) || $el.data('selectable') ) { return true; } @@ -3391,13 +3427,14 @@ self.$target = $target; self.$content = $content; self.canTap = true; + self.opts = current.opts.touch; $(document).off( '.fb.touch' ); $(document).on( isTouchDevice ? 'touchend.fb.touch touchcancel.fb.touch' : 'mouseup.fb.touch mouseleave.fb.touch', $.proxy(self, "ontouchend")); $(document).on( isTouchDevice ? 'touchmove.fb.touch' : 'mousemove.fb.touch', $.proxy(self, "ontouchmove")); - if ( !(instance.current.opts.touch || instance.canPan() ) || !( $target.is( self.$stage ) || self.$stage.find( $target ).length ) ) { + if ( !(self.opts || instance.canPan() ) || !( $target.is( self.$stage ) || self.$stage.find( $target ).length ) ) { // Prevent ghosting if ( $target.is('img') ) { @@ -3481,7 +3518,7 @@ return; } - if ( !( self.instance.current.opts.touch || self.instance.canPan() ) || !self.newPoints || !self.newPoints.length ) { + if ( !( self.opts || self.instance.canPan() ) || !self.newPoints || !self.newPoints.length ) { return; } @@ -3528,10 +3565,10 @@ self.canTap = false; - if ( self.instance.group.length < 2 && self.instance.opts.touch.vertical ) { + if ( self.instance.group.length < 2 && self.opts.vertical ) { self.isSwiping = 'y'; - } else if ( self.instance.isSliding || self.instance.opts.touch.vertical === false || ( self.instance.opts.touch.vertical === 'auto' && $( window ).width() > 800 ) ) { + } else if ( self.instance.isSliding || self.opts.vertical === false || ( self.opts.vertical === 'auto' && $( window ).width() > 800 ) ) { self.isSwiping = 'x'; } else { @@ -3906,7 +3943,7 @@ return; } - if ( self.instance.current.opts.touch.momentum === false ) { + if ( self.opts.momentum === false ) { newOffsetX = self.contentLastPos.left; newOffsetY = self.contentLastPos.top; @@ -4132,7 +4169,7 @@ }); -}(window, document, window.jQuery)); +}( window, document, window.jQuery || jQuery )); // ========================================================================== // @@ -4146,6 +4183,22 @@ ;(function (document, $) { 'use strict'; + $.extend(true, $.fancybox.defaults, { + btnTpl : { + slideShow : + '' + }, + slideShow : { + autoStart : false, + speed : 3000 + } + }); + var SlideShow = function( instance ) { this.instance = instance; this.init(); @@ -4155,7 +4208,6 @@ timer : null, isActive : false, $button : null, - speed : 3000, init : function() { var self = this; @@ -4169,15 +4221,15 @@ } }, - set : function() { + set : function( force ) { var self = this; // Check if reached last element - if ( self.instance && self.instance.current && (self.instance.current.opts.loop || self.instance.currIndex < self.instance.group.length - 1 )) { + if ( self.instance && self.instance.current && (force === true || self.instance.current.opts.loop || self.instance.currIndex < self.instance.group.length - 1 )) { self.timer = setTimeout(function() { - self.instance.next(); + self.instance.jumpTo( (self.instance.currIndex + 1) % self.instance.group.length ); - }, self.instance.current.opts.slideShow.speed || self.speed); + }, self.instance.current.opts.slideShow.speed); } else { self.stop(); @@ -4199,17 +4251,15 @@ var self = this; var current = self.instance.current; - if ( self.instance && current && ( current.opts.loop || current.index < self.instance.group.length - 1 )) { - + if ( current ) { self.isActive = true; self.$button .attr( 'title', current.opts.i18n[ current.opts.lang ].PLAY_STOP ) + .removeClass( 'fancybox-button--play' ) .addClass( 'fancybox-button--pause' ); - if ( current.isComplete ) { - self.set(); - } + self.set( true ); } }, @@ -4221,7 +4271,8 @@ self.$button .attr( 'title', current.opts.i18n[ current.opts.lang ].PLAY_START ) - .removeClass( 'fancybox-button--pause' ); + .removeClass( 'fancybox-button--pause' ) + .addClass( 'fancybox-button--play' ); self.isActive = false; }, @@ -4303,7 +4354,7 @@ } }); -}(document, window.jQuery)); +}( document, window.jQuery || jQuery )); // ========================================================================== // @@ -4431,13 +4482,25 @@ } }; + $.extend(true, $.fancybox.defaults, { + btnTpl : { + fullScreen : + '' + }, + fullScreen : { + autoStart : false + } + }); + $(document).on({ 'onInit.fb' : function(e, instance) { var $container; - var $button = instance.$refs.toolbar.find('[data-fancybox-fullscreen]'); - - if ( instance && !instance.FullScreen && instance.group[ instance.currIndex ].opts.fullScreen ) { + if ( instance && instance.group[ instance.currIndex ].opts.fullScreen ) { $container = instance.$refs.container; $container.on('click.fb-fullscreen', '[data-fancybox-fullscreen]', function(e) { @@ -4456,8 +4519,8 @@ // Expose API instance.FullScreen = FullScreen; - } else { - $button.hide(); + } else if ( instance ) { + instance.$refs.toolbar.find('[data-fancybox-fullscreen]').hide(); } }, @@ -4481,22 +4544,28 @@ }); $(document).on(fn.fullscreenchange, function() { - var instance = $.fancybox.getInstance(); + var isFullscreen = FullScreen.isFullscreen(), + instance = $.fancybox.getInstance(); - // If image is zooming, then force to stop and reposition properly - if ( instance.current && instance.current.type === 'image' && instance.isAnimating ) { - instance.current.$content.css( 'transition', 'none' ); + if ( instance ) { - instance.isAnimating = false; + // If image is zooming, then force to stop and reposition properly + if ( instance.current && instance.current.type === 'image' && instance.isAnimating ) { + instance.current.$content.css( 'transition', 'none' ); - instance.update( true, true, 0 ); - } + instance.isAnimating = false; + + instance.update( true, true, 0 ); + } - instance.trigger('onFullscreenChange', FullScreen.isFullscreen() ); + instance.trigger( 'onFullscreenChange', isFullscreen ); + + instance.$refs.container.toggleClass( 'fancybox-is-fullscreen', isFullscreen ); + } }); -}(document, window.jQuery)); +}( document, window.jQuery || jQuery )); // ========================================================================== // @@ -4507,6 +4576,21 @@ ;(function (document, $) { 'use strict'; + $.extend(true, $.fancybox.defaults, { + btnTpl : { + thumbs : + '' + }, + thumbs : { + autoStart : false, + hideOnClose : true + } + }); + var FancyThumbs = function( instance ) { this.instance = instance; this.init(); @@ -4728,7 +4812,65 @@ }); -}(document, window.jQuery)); +}( document, window.jQuery || jQuery )); + +//// ========================================================================== +// +// Share +// Displays simple form for sharing current url +// +// ========================================================================== +;(function (document, $) { + 'use strict'; + $.extend(true, $.fancybox.defaults, { + btnTpl : { + share : + '' + }, + share : { + tpl : + '
' + + '

{{SHARE}}

' + + '

' + + '' + + '' + + 'Facebook' + + '' + + '' + + '' + + 'Pinterest' + + '' + + '' + + '' + + 'Twitter' + + '' + + '

' + + '
' + } + }); + + $(document).on('click', '[data-fancybox-share]', function() { + + var f = $.fancybox.getInstance(); + + if ( f ) { + $.fancybox.open({ + src : f.translate( f, f.current.opts.share.tpl.replace( /\{\{src\}\}/g, encodeURI( f.current.src ) ).replace( /\{\{descr\}\}/g, encodeURI( f.current.opts.caption || '' ) ) ), + type : 'html', + opts : { + autoFocus : false, + animationEffect : 'fade' + } + }); + } + + }); + +}( document, window.jQuery || jQuery )); // ========================================================================== // @@ -4827,129 +4969,119 @@ return opts.hash || ( opts.$orig ? opts.$orig.data( 'fancybox' ) : '' ); } - // Star when DOM becomes ready + // Start when DOM becomes ready $(function() { - // Small delay is used to allow other scripts to process "dom ready" event - setTimeout(function() { + // Update hash when opening/closing fancyBox + $(document).on({ + 'onInit.fb' : function( e, instance ) { + var url, gallery; - // Check if this module is not disabled - if ( $.fancybox.defaults.hash === false ) { - return; - } + if ( instance.group[ instance.currIndex ].opts.hash === false ) { + return; + } - // Update hash when opening/closing fancyBox - $(document).on({ - 'onInit.fb' : function( e, instance ) { - var url, gallery; + url = parseUrl(); + gallery = getGalleryID( instance ); - if ( instance.group[ instance.currIndex ].opts.hash === false ) { - return; - } + // Make sure gallery start index matches index from hash + if ( gallery && url.gallery && gallery == url.gallery ) { + instance.currIndex = url.index - 1; + } - url = parseUrl(); - gallery = getGalleryID( instance ); + }, - // Make sure gallery start index matches index from hash - if ( gallery && url.gallery && gallery == url.gallery ) { - instance.currIndex = url.index - 1; - } + 'beforeShow.fb' : function( e, instance, current ) { + var gallery; - }, + if ( !current || current.opts.hash === false ) { + return; + } - 'beforeShow.fb' : function( e, instance, current ) { - var gallery; + gallery = getGalleryID( instance ); - if ( !current || current.opts.hash === false ) { - return; - } + // Update window hash + if ( gallery && gallery !== '' ) { - gallery = getGalleryID( instance ); + if ( window.location.hash.indexOf( gallery ) < 0 ) { + instance.opts.origHash = window.location.hash; + } - // Update window hash - if ( gallery && gallery !== '' ) { + currentHash = gallery + ( instance.group.length > 1 ? '-' + ( current.index + 1 ) : '' ); - if ( window.location.hash.indexOf( gallery ) < 0 ) { - instance.opts.origHash = window.location.hash; - } + if ( 'replaceState' in window.history ) { + if ( timerID ) { + clearTimeout( timerID ); + } - currentHash = gallery + ( instance.group.length > 1 ? '-' + ( current.index + 1 ) : '' ); + timerID = setTimeout(function() { + window.history[ shouldCreateHistory ? 'pushState' : 'replaceState' ]( {} , document.title, window.location.pathname + window.location.search + '#' + currentHash ); - if ( 'replaceState' in window.history ) { - if ( timerID ) { - clearTimeout( timerID ); - } + timerID = null; - timerID = setTimeout(function() { - window.history[ shouldCreateHistory ? 'pushState' : 'replaceState' ]( {} , document.title, window.location.pathname + window.location.search + '#' + currentHash ); + shouldCreateHistory = false; - timerID = null; + }, 300); - shouldCreateHistory = false; + } else { + window.location.hash = currentHash; + } - }, 300); + } - } else { - window.location.hash = currentHash; - } + }, - } + 'beforeClose.fb' : function( e, instance, current ) { + var gallery, origHash; - }, + if ( timerID ) { + clearTimeout( timerID ); + } - 'beforeClose.fb' : function( e, instance, current ) { - var gallery, origHash; + if ( current.opts.hash === false ) { + return; + } - if ( timerID ) { - clearTimeout( timerID ); - } + gallery = getGalleryID( instance ); + origHash = instance && instance.opts.origHash ? instance.opts.origHash : ''; - if ( current.opts.hash === false ) { - return; - } + // Remove hash from location bar + if ( gallery && gallery !== '' ) { - gallery = getGalleryID( instance ); - origHash = instance && instance.opts.origHash ? instance.opts.origHash : ''; + if ( 'replaceState' in history ) { + window.history.replaceState( {} , document.title, window.location.pathname + window.location.search + origHash ); - // Remove hash from location bar - if ( gallery && gallery !== '' ) { + } else { + window.location.hash = origHash; - if ( 'replaceState' in history ) { - window.history.replaceState( {} , document.title, window.location.pathname + window.location.search + origHash ); + // Keep original scroll position + $( window ).scrollTop( instance.scrollTop ).scrollLeft( instance.scrollLeft ); + } + } - } else { - window.location.hash = origHash; + currentHash = null; + } + }); - // Keep original scroll position - $( window ).scrollTop( instance.scrollTop ).scrollLeft( instance.scrollLeft ); - } - } + // Check if need to close after url has changed + $(window).on('hashchange.fb', function() { + var url = parseUrl(); + if ( $.fancybox.getInstance() ) { + if ( currentHash && currentHash !== url.gallery + '-' + url.index && !( url.index === 1 && currentHash == url.gallery ) ) { currentHash = null; - } - }); - // Check if need to close after url has changed - $(window).on('hashchange.fb', function() { - var url = parseUrl(); - - if ( $.fancybox.getInstance() ) { - if ( currentHash && currentHash !== url.gallery + '-' + url.index && !( url.index === 1 && currentHash == url.gallery ) ) { - currentHash = null; - - $.fancybox.close(); - } - - } else if ( url.gallery !== '' ) { - triggerFromUrl( url ); + $.fancybox.close(); } - }); - // Check current hash and trigger click event on matching element to start fancyBox, if needed - triggerFromUrl( parseUrl() ); + } else if ( url.gallery !== '' ) { + triggerFromUrl( url ); + } + }); - }, 50); + // Check current hash and trigger click event on matching element to start fancyBox, if needed + triggerFromUrl( parseUrl() ); }); -}(document, window, window.jQuery)); +}( document, window, window.jQuery || jQuery )); diff --git a/dist/jquery.fancybox.min.css b/dist/jquery.fancybox.min.css index 2fa57f60..2823e194 100644 --- a/dist/jquery.fancybox.min.css +++ b/dist/jquery.fancybox.min.css @@ -1 +1 @@ -@charset "UTF-8";.fancybox-enabled{overflow:hidden}.fancybox-enabled body{overflow:visible;height:100%}.fancybox-is-hidden{position:absolute;top:-9999px;left:-9999px;visibility:hidden}.fancybox-container{position:fixed;top:0;left:0;width:100%;height:100%;z-index:99993;-webkit-tap-highlight-color:transparent;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:translateZ(0);transform:translateZ(0)}.fancybox-container~.fancybox-container{z-index:99992}.fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-stage{position:absolute;top:0;right:0;bottom:0;left:0}.fancybox-outer{overflow-y:auto;-webkit-overflow-scrolling:touch}.fancybox-bg{background:#1e1e1e;opacity:0;transition-duration:inherit;transition-property:opacity;transition-timing-function:cubic-bezier(.47,0,.74,.71)}.fancybox-is-open .fancybox-bg{opacity:.87;transition-timing-function:cubic-bezier(.22,.61,.36,1)}.fancybox-caption-wrap,.fancybox-infobar,.fancybox-toolbar{position:absolute;direction:ltr;z-index:99997;opacity:0;visibility:hidden;transition:opacity .25s,visibility 0s linear .25s;box-sizing:border-box}.fancybox-show-caption .fancybox-caption-wrap,.fancybox-show-infobar .fancybox-infobar,.fancybox-show-toolbar .fancybox-toolbar{opacity:1;visibility:visible;transition:opacity .25s,visibility 0s}.fancybox-infobar{top:0;left:50%;margin-left:-79px}.fancybox-infobar__body{display:inline-block;width:70px;line-height:44px;font-size:13px;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;text-align:center;color:#ddd;background-color:rgba(30,30,30,.7);pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:subpixel-antialiased}.fancybox-toolbar{top:0;right:0}.fancybox-stage{overflow:hidden;direction:ltr;z-index:99994;-webkit-transform:translateZ(0)}.fancybox-slide{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;padding:0;overflow:auto;outline:none;white-space:normal;box-sizing:border-box;text-align:center;z-index:99994;-webkit-overflow-scrolling:touch;display:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition-property:opacity,-webkit-transform;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.fancybox-slide:before{content:"";display:inline-block;vertical-align:middle;height:100%;width:0}.fancybox-is-sliding .fancybox-slide,.fancybox-slide--current,.fancybox-slide--next,.fancybox-slide--previous{display:block}.fancybox-slide--image{overflow:visible}.fancybox-slide--image:before{display:none}.fancybox-slide--video .fancybox-content,.fancybox-slide--video iframe{background:#000}.fancybox-slide--map .fancybox-content,.fancybox-slide--map iframe{background:#e5e3df}.fancybox-slide--next{z-index:99995}.fancybox-slide>div{display:inline-block;position:relative;padding:24px;margin:44px 0;border-width:0;vertical-align:middle;text-align:left;background-color:#fff;overflow:auto;box-sizing:border-box}.fancybox-slide .fancybox-image-wrap{position:absolute;top:0;left:0;margin:0;padding:0;border:0;z-index:99995;background:transparent;cursor:default;overflow:visible;-webkit-transform-origin:top left;transform-origin:top left;background-size:100% 100%;background-repeat:no-repeat;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-can-zoomOut .fancybox-image-wrap{cursor:zoom-out}.fancybox-can-zoomIn .fancybox-image-wrap{cursor:zoom-in}.fancybox-can-drag .fancybox-image-wrap{cursor:-webkit-grab;cursor:grab}.fancybox-is-dragging .fancybox-image-wrap{cursor:-webkit-grabbing;cursor:grabbing}.fancybox-image,.fancybox-spaceball{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;padding:0;border:0;max-width:none;max-height:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-spaceball{z-index:1}.fancybox-slide--iframe .fancybox-content{padding:0;width:80%;height:80%;max-width:calc(100% - 100px);max-height:calc(100% - 88px);overflow:visible;background:#fff}.fancybox-iframe{display:block;padding:0;border:0;height:100%}.fancybox-error,.fancybox-iframe{margin:0;width:100%;background:#fff}.fancybox-error{padding:40px;max-width:380px;cursor:default}.fancybox-error p{margin:0;padding:0;color:#444;font:16px/20px Helvetica Neue,Helvetica,Arial,sans-serif}.fancybox-close-small{position:absolute;top:0;right:0;width:44px;height:44px;padding:0;margin:0;border:0;border-radius:0;outline:none;background:transparent;z-index:10;cursor:pointer}.fancybox-close-small:after{content:"×";position:absolute;top:5px;right:5px;width:30px;height:30px;font:20px/30px Arial,Helvetica Neue,Helvetica,sans-serif;color:#888;font-weight:300;text-align:center;border-radius:50%;border-width:0;background:#fff;transition:background .25s;box-sizing:border-box;z-index:2}.fancybox-close-small:focus:after{outline:1px dotted #888}.fancybox-close-small:hover:after{color:#555;background:#eee}.fancybox-slide--iframe .fancybox-close-small{top:0;right:-44px}.fancybox-slide--iframe .fancybox-close-small:after{background:transparent;font-size:35px;color:#aaa}.fancybox-slide--iframe .fancybox-close-small:hover:after{color:#fff}.fancybox-caption-wrap{bottom:0;left:0;right:0;padding:60px 30px 0;background:linear-gradient(180deg,transparent 0,rgba(0,0,0,.1) 20%,rgba(0,0,0,.2) 40%,rgba(0,0,0,.6) 80%,rgba(0,0,0,.8));pointer-events:none}.fancybox-caption{padding:30px 0;border-top:1px solid hsla(0,0%,100%,.4);font-size:14px;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;color:#fff;line-height:20px;-webkit-text-size-adjust:none}.fancybox-caption a,.fancybox-caption button,.fancybox-caption select{pointer-events:all}.fancybox-caption a{color:#fff;text-decoration:underline}.fancybox-button{display:inline-block;position:relative;margin:0;padding:0;border:0;width:44px;height:44px;line-height:44px;text-align:center;background:transparent;color:#ddd;border-radius:0;cursor:pointer;vertical-align:top;outline:none}.fancybox-button[disabled]{cursor:default;pointer-events:none}.fancybox-button,.fancybox-infobar__body{background:rgba(30,30,30,.6)}.fancybox-button:hover:not([disabled]){color:#fff;background:rgba(0,0,0,.8)}.fancybox-button:after,.fancybox-button:before{content:"";pointer-events:none;position:absolute;background-color:currentColor;color:currentColor;opacity:.9;box-sizing:border-box;display:inline-block}.fancybox-button[disabled]:after,.fancybox-button[disabled]:before{opacity:.3}.fancybox-button--left:after,.fancybox-button--right:after{top:18px;width:6px;height:6px;background:transparent;border-top:2px solid currentColor;border-right:2px solid currentColor}.fancybox-button--left:after{left:20px;-webkit-transform:rotate(-135deg);transform:rotate(-135deg)}.fancybox-button--right:after{right:20px;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.fancybox-button--left{border-bottom-left-radius:5px}.fancybox-button--right{border-bottom-right-radius:5px}.fancybox-button--close:after,.fancybox-button--close:before{content:"";display:inline-block;position:absolute;height:2px;width:16px;top:calc(50% - 1px);left:calc(50% - 8px)}.fancybox-button--close:before{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.fancybox-button--close:after{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.fancybox-arrow{position:absolute;top:50%;margin:-50px 0 0;height:100px;width:54px;padding:0;border:0;outline:none;background:none;cursor:pointer;z-index:99995;opacity:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;transition:opacity .25s}.fancybox-arrow:after{content:"";position:absolute;top:28px;width:44px;height:44px;background-color:rgba(30,30,30,.8);background-image:url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjRkZGRkZGIiBoZWlnaHQ9IjQ4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSI0OCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gICAgPHBhdGggZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIvPiAgICA8cGF0aCBkPSJNMTIgNGwtMS40MSAxLjQxTDE2LjE3IDExSDR2MmgxMi4xN2wtNS41OCA1LjU5TDEyIDIwbDgtOHoiLz48L3N2Zz4=);background-repeat:no-repeat;background-position:50%;background-size:24px 24px}.fancybox-arrow--right{right:0}.fancybox-arrow--left{left:0;-webkit-transform:scaleX(-1);transform:scaleX(-1)}.fancybox-arrow--left:after,.fancybox-arrow--right:after{left:0}.fancybox-show-nav .fancybox-arrow{opacity:.6}.fancybox-show-nav .fancybox-arrow[disabled]{opacity:.3}.fancybox-slide>.fancybox-loading{border:6px solid hsla(0,0%,39%,.4);border-top:6px solid hsla(0,0%,100%,.6);border-radius:100%;height:50px;width:50px;-webkit-animation:a .8s infinite linear;animation:a .8s infinite linear;background:transparent;position:absolute;top:50%;left:50%;margin-top:-25px;margin-left:-25px;z-index:99999}@-webkit-keyframes a{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes a{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fancybox-animated{transition-timing-function:cubic-bezier(0,0,.25,1)}.fancybox-fx-slide.fancybox-slide--previous{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);opacity:0}.fancybox-fx-slide.fancybox-slide--next{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);opacity:0}.fancybox-fx-slide.fancybox-slide--current{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}.fancybox-fx-fade.fancybox-slide--next,.fancybox-fx-fade.fancybox-slide--previous{opacity:0;transition-timing-function:cubic-bezier(.19,1,.22,1)}.fancybox-fx-fade.fancybox-slide--current{opacity:1}.fancybox-fx-zoom-in-out.fancybox-slide--previous{-webkit-transform:scale3d(1.5,1.5,1.5);transform:scale3d(1.5,1.5,1.5);opacity:0}.fancybox-fx-zoom-in-out.fancybox-slide--next{-webkit-transform:scale3d(.5,.5,.5);transform:scale3d(.5,.5,.5);opacity:0}.fancybox-fx-zoom-in-out.fancybox-slide--current{-webkit-transform:scaleX(1);transform:scaleX(1);opacity:1}.fancybox-fx-rotate.fancybox-slide--previous{-webkit-transform:rotate(-1turn);transform:rotate(-1turn);opacity:0}.fancybox-fx-rotate.fancybox-slide--next{-webkit-transform:rotate(1turn);transform:rotate(1turn);opacity:0}.fancybox-fx-rotate.fancybox-slide--current{-webkit-transform:rotate(0deg);transform:rotate(0deg);opacity:1}.fancybox-fx-circular.fancybox-slide--previous{-webkit-transform:scale3d(0,0,0) translate3d(-100%,0,0);transform:scale3d(0,0,0) translate3d(-100%,0,0);opacity:0}.fancybox-fx-circular.fancybox-slide--next{-webkit-transform:scale3d(0,0,0) translate3d(100%,0,0);transform:scale3d(0,0,0) translate3d(100%,0,0);opacity:0}.fancybox-fx-circular.fancybox-slide--current{-webkit-transform:scaleX(1) translateZ(0);transform:scaleX(1) translateZ(0);opacity:1}.fancybox-fx-tube.fancybox-slide--previous{-webkit-transform:translate3d(-100%,0,0) scale(.1) skew(-10deg);transform:translate3d(-100%,0,0) scale(.1) skew(-10deg)}.fancybox-fx-tube.fancybox-slide--next{-webkit-transform:translate3d(100%,0,0) scale(.1) skew(10deg);transform:translate3d(100%,0,0) scale(.1) skew(10deg)}.fancybox-fx-tube.fancybox-slide--current{-webkit-transform:translateZ(0) scale(1);transform:translateZ(0) scale(1)}@media (max-width:800px){.fancybox-infobar{left:0;margin-left:0}.fancybox-button--left,.fancybox-button--right{display:none!important}.fancybox-caption{padding:20px 0;margin:0}}.fancybox-button--fullscreen:before{width:15px;height:11px;left:calc(50% - 7px);top:calc(50% - 6px);border:2px solid;background:none}.fancybox-button--pause:before,.fancybox-button--play:before{top:calc(50% - 6px);left:calc(50% - 4px);background:transparent}.fancybox-button--play:before{width:0;height:0;border-top:6px inset transparent;border-bottom:6px inset transparent;border-left:10px solid;border-radius:1px}.fancybox-button--pause:before{width:7px;height:11px;border-style:solid;border-width:0 2px}.fancybox-button--thumbs,.fancybox-thumbs{display:none}@media (min-width:800px){.fancybox-button--thumbs{display:inline-block}.fancybox-button--thumbs span{font-size:23px}.fancybox-button--thumbs:before{width:3px;height:3px;top:calc(50% - 2px);left:calc(50% - 2px);box-shadow:0 -4px 0,-4px -4px 0,4px -4px 0,inset 0 0 0 32px,-4px 0 0,4px 0 0,0 4px 0,-4px 4px 0,4px 4px 0}.fancybox-thumbs{position:absolute;top:0;right:0;bottom:0;left:auto;width:220px;margin:0;padding:5px 5px 0 0;background:#fff;word-break:normal;-webkit-tap-highlight-color:transparent;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;box-sizing:border-box;z-index:99995}.fancybox-show-thumbs .fancybox-thumbs{display:block}.fancybox-show-thumbs .fancybox-inner{right:220px}.fancybox-thumbs>ul{list-style:none;position:absolute;position:relative;width:100%;height:100%;margin:0;padding:0;overflow-x:hidden;overflow-y:auto;font-size:0}.fancybox-thumbs>ul>li{float:left;overflow:hidden;max-width:50%;padding:0;margin:0;width:105px;height:75px;position:relative;cursor:pointer;outline:none;border:5px solid transparent;border-top-width:0;border-right-width:0;-webkit-tap-highlight-color:transparent;-webkit-backface-visibility:hidden;backface-visibility:hidden;box-sizing:border-box}li.fancybox-thumbs-loading{background:rgba(0,0,0,.1)}.fancybox-thumbs>ul>li>img{position:absolute;top:0;left:0;min-width:100%;min-height:100%;max-width:none;max-height:none;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-thumbs>ul>li:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:2px;border:4px solid #4ea7f9;z-index:99991;opacity:0;transition:all .2s cubic-bezier(.25,.46,.45,.94)}.fancybox-thumbs>ul>li.fancybox-thumbs-active:before{opacity:1}} \ No newline at end of file +@charset "UTF-8";body.fancybox-active{overflow:hidden}body.fancybox-iosfix{position:fixed;left:0;right:0}.fancybox-is-hidden{position:absolute;top:-9999px;left:-9999px;visibility:hidden}.fancybox-container{position:fixed;top:0;left:0;width:100%;height:100%;z-index:99993;-webkit-tap-highlight-color:transparent;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:translateZ(0);transform:translateZ(0);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.fancybox-container~.fancybox-container{z-index:99992}.fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-stage{position:absolute;top:0;right:0;bottom:0;left:0}.fancybox-outer{overflow-y:auto;-webkit-overflow-scrolling:touch}.fancybox-bg{background:#1e1e1e;opacity:0;transition-duration:inherit;transition-property:opacity;transition-timing-function:cubic-bezier(.47,0,.74,.71)}.fancybox-is-open .fancybox-bg{opacity:.87;transition-timing-function:cubic-bezier(.22,.61,.36,1)}.fancybox-caption-wrap,.fancybox-infobar,.fancybox-toolbar{position:absolute;direction:ltr;z-index:99997;opacity:0;visibility:hidden;transition:opacity .25s,visibility 0s linear .25s;box-sizing:border-box}.fancybox-show-caption .fancybox-caption-wrap,.fancybox-show-infobar .fancybox-infobar,.fancybox-show-toolbar .fancybox-toolbar{opacity:1;visibility:visible;transition:opacity .25s,visibility 0s}.fancybox-infobar{top:0;left:0;font-size:13px;padding:0 10px;height:44px;min-width:44px;line-height:44px;color:#ccc;text-align:center;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:subpixel-antialiased;mix-blend-mode:exclusion}.fancybox-toolbar{top:0;right:0;margin:0;padding:0}.fancybox-stage{overflow:hidden;direction:ltr;z-index:99994;-webkit-transform:translateZ(0)}.fancybox-slide{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;padding:0;overflow:auto;outline:none;white-space:normal;box-sizing:border-box;text-align:center;z-index:99994;-webkit-overflow-scrolling:touch;display:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition-property:opacity,-webkit-transform;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform}.fancybox-slide:before{content:"";display:inline-block;vertical-align:middle;height:100%;width:0}.fancybox-is-sliding .fancybox-slide,.fancybox-slide--current,.fancybox-slide--next,.fancybox-slide--previous{display:block}.fancybox-slide--image{overflow:visible}.fancybox-slide--image:before{display:none}.fancybox-slide--video .fancybox-content,.fancybox-slide--video iframe{background:#000}.fancybox-slide--map .fancybox-content,.fancybox-slide--map iframe{background:#e5e3df}.fancybox-slide--next{z-index:99995}.fancybox-slide>*{display:inline-block;position:relative;padding:24px;margin:44px 0;border-width:0;vertical-align:middle;text-align:left;background-color:#fff;overflow:auto;box-sizing:border-box}.fancybox-slide>base,.fancybox-slide>link,.fancybox-slide>meta,.fancybox-slide>script,.fancybox-slide>style,.fancybox-slide>title{display:none}.fancybox-slide .fancybox-image-wrap{position:absolute;top:0;left:0;margin:0;padding:0;border:0;z-index:99995;background:transparent;cursor:default;overflow:visible;-webkit-transform-origin:top left;transform-origin:top left;background-size:100% 100%;background-repeat:no-repeat;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-can-zoomOut .fancybox-image-wrap{cursor:zoom-out}.fancybox-can-zoomIn .fancybox-image-wrap{cursor:zoom-in}.fancybox-can-drag .fancybox-image-wrap{cursor:-webkit-grab;cursor:grab}.fancybox-is-dragging .fancybox-image-wrap{cursor:-webkit-grabbing;cursor:grabbing}.fancybox-image,.fancybox-spaceball{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;padding:0;border:0;max-width:none;max-height:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-spaceball{z-index:1}.fancybox-slide--iframe .fancybox-content{padding:0;width:80%;height:80%;max-width:calc(100% - 100px);max-height:calc(100% - 88px);overflow:visible;background:#fff}.fancybox-iframe{display:block;padding:0;border:0;height:100%}.fancybox-error,.fancybox-iframe{margin:0;width:100%;background:#fff}.fancybox-error{padding:40px;max-width:380px;cursor:default}.fancybox-error p{margin:0;padding:0;color:#444;font-size:16px;line-height:20px}.fancybox-slide--iframe .fancybox-close-small{top:0;right:-44px}.fancybox-slide--iframe .fancybox-close-small:after{font-size:35px;color:#aaa}.fancybox-slide--iframe .fancybox-close-small:hover:after{color:#fff;background:transparent}.fancybox-button{box-sizing:border-box;display:inline-block;vertical-align:top;width:44px;height:44px;margin:0;padding:10px;border:0;border-radius:0;background:rgba(30,30,30,.6);color:#ccc;transition:color .3s ease;cursor:pointer}.fancybox-button[disabled]{cursor:default;opacity:.6}.fancybox-button:hover:not([disabled]){color:#fff}.fancybox-button svg{display:block;position:relative;overflow:visible;shape-rendering:geometricPrecision}.fancybox-button svg path{fill:currentColor;stroke:currentColor;stroke-linejoin:round;stroke-width:3}.fancybox-button--share svg path{stroke-width:1}.fancybox-button--pause svg path:nth-child(1),.fancybox-button--play svg path:nth-child(2),.fancybox-navigation{display:none}.fancybox-show-nav .fancybox-navigation{display:block}.fancybox-navigation button{position:absolute;top:50%;margin:-50px 0 0;z-index:99997;background:transparent;width:60px;height:100px;padding:17px}.fancybox-navigation button:before{content:"";position:absolute;top:30px;right:10px;width:40px;height:40px;background:rgba(30,30,30,.6)}.fancybox-navigation .fancybox-button--arrow_left{left:0}.fancybox-navigation .fancybox-button--arrow_right{right:0}.fancybox-close-small{position:absolute;top:0;right:0;width:44px;height:44px;padding:0;margin:0;border:0;border-radius:0;background:transparent;z-index:10;cursor:pointer}.fancybox-close-small:after{content:"×";position:absolute;top:5px;right:5px;width:30px;height:30px;font:20px/30px Arial,Helvetica Neue,Helvetica,sans-serif;color:#888;font-weight:300;text-align:center;border-radius:50%;border-width:0;background-color:transparent;transition:background-color .25s;box-sizing:border-box;z-index:2}.fancybox-close-small:focus{outline:none}.fancybox-close-small:focus:after{outline:1px dotted #888}.fancybox-close-small:hover:after{color:#555;background:#eee}.fancybox-caption-wrap{bottom:0;left:0;right:0;padding:60px 2vw 0;background:linear-gradient(180deg,transparent 0,rgba(0,0,0,.1) 20%,rgba(0,0,0,.2) 40%,rgba(0,0,0,.6) 80%,rgba(0,0,0,.8));pointer-events:none}.fancybox-caption{padding:30px 0;border-top:1px solid hsla(0,0%,100%,.4);font-size:14px;color:#fff;line-height:20px;-webkit-text-size-adjust:none}.fancybox-caption a,.fancybox-caption button,.fancybox-caption select{pointer-events:all;position:relative}.fancybox-caption a{color:#fff;text-decoration:underline}.fancybox-slide>.fancybox-loading{border:6px solid hsla(0,0%,39%,.4);border-top:6px solid hsla(0,0%,100%,.6);border-radius:100%;height:50px;width:50px;-webkit-animation:a .8s infinite linear;animation:a .8s infinite linear;background:transparent;position:absolute;top:50%;left:50%;margin-top:-30px;margin-left:-30px;z-index:99999}@-webkit-keyframes a{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes a{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fancybox-animated{transition-timing-function:cubic-bezier(0,0,.25,1)}.fancybox-fx-slide.fancybox-slide--previous{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);opacity:0}.fancybox-fx-slide.fancybox-slide--next{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);opacity:0}.fancybox-fx-slide.fancybox-slide--current{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}.fancybox-fx-fade.fancybox-slide--next,.fancybox-fx-fade.fancybox-slide--previous{opacity:0;transition-timing-function:cubic-bezier(.19,1,.22,1)}.fancybox-fx-fade.fancybox-slide--current{opacity:1}.fancybox-fx-zoom-in-out.fancybox-slide--previous{-webkit-transform:scale3d(1.5,1.5,1.5);transform:scale3d(1.5,1.5,1.5);opacity:0}.fancybox-fx-zoom-in-out.fancybox-slide--next{-webkit-transform:scale3d(.5,.5,.5);transform:scale3d(.5,.5,.5);opacity:0}.fancybox-fx-zoom-in-out.fancybox-slide--current{-webkit-transform:scaleX(1);transform:scaleX(1);opacity:1}.fancybox-fx-rotate.fancybox-slide--previous{-webkit-transform:rotate(-1turn);transform:rotate(-1turn);opacity:0}.fancybox-fx-rotate.fancybox-slide--next{-webkit-transform:rotate(1turn);transform:rotate(1turn);opacity:0}.fancybox-fx-rotate.fancybox-slide--current{-webkit-transform:rotate(0deg);transform:rotate(0deg);opacity:1}.fancybox-fx-circular.fancybox-slide--previous{-webkit-transform:scale3d(0,0,0) translate3d(-100%,0,0);transform:scale3d(0,0,0) translate3d(-100%,0,0);opacity:0}.fancybox-fx-circular.fancybox-slide--next{-webkit-transform:scale3d(0,0,0) translate3d(100%,0,0);transform:scale3d(0,0,0) translate3d(100%,0,0);opacity:0}.fancybox-fx-circular.fancybox-slide--current{-webkit-transform:scaleX(1) translateZ(0);transform:scaleX(1) translateZ(0);opacity:1}.fancybox-fx-tube.fancybox-slide--previous{-webkit-transform:translate3d(-100%,0,0) scale(.1) skew(-10deg);transform:translate3d(-100%,0,0) scale(.1) skew(-10deg)}.fancybox-fx-tube.fancybox-slide--next{-webkit-transform:translate3d(100%,0,0) scale(.1) skew(10deg);transform:translate3d(100%,0,0) scale(.1) skew(10deg)}.fancybox-fx-tube.fancybox-slide--current{-webkit-transform:translateZ(0) scale(1);transform:translateZ(0) scale(1)}.fancybox-share{padding:30px;border-radius:3px;background:#f4f4f4;max-width:90%}.fancybox-share h1{color:#222;margin:0 0 20px;font-size:33px;font-weight:700;text-align:center}.fancybox-share p{margin:0;padding:0;text-align:center}.fancybox-share_button{display:inline-block;text-decoration:none;margin:0 10px 10px 0;padding:10px 20px;box-shadow:0 1px 2px rgba(0,0,0,.2);border-radius:3px;background:#fff;white-space:nowrap;font-size:16px;line-height:23px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;min-width:140px;color:#888;transition:all .2s}.fancybox-share_button:focus,.fancybox-share_button:hover{box-shadow:0 1px 2px rgba(0,0,0,.5);text-decoration:none;color:#555}.fancybox-share_button svg{margin-right:5px;width:23px;height:23px;vertical-align:top}.fancybox-thumbs{display:none;position:absolute;top:0;bottom:0;right:0;width:212px;margin:0;padding:2px;background:#fff;-webkit-tap-highlight-color:transparent;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;box-sizing:border-box;z-index:99995}.fancybox-show-thumbs .fancybox-thumbs{display:block}.fancybox-show-thumbs .fancybox-inner{right:212px}.fancybox-thumbs>ul{list-style:none;position:absolute;position:relative;width:100%;height:100%;margin:0;padding:0;overflow-x:hidden;overflow-y:auto;font-size:0;white-space:nowrap}.fancybox-thumbs>ul>li{float:left;overflow:hidden;padding:0;margin:2px;width:100px;height:75px;max-width:calc(50% - 4px);max-height:calc(100% - 8px);position:relative;cursor:pointer;outline:none;-webkit-tap-highlight-color:transparent;-webkit-backface-visibility:hidden;backface-visibility:hidden;box-sizing:border-box}li.fancybox-thumbs-loading{background:rgba(0,0,0,.1)}.fancybox-thumbs>ul>li>img{position:absolute;top:0;left:0;min-width:100%;min-height:100%;max-width:none;max-height:none;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-thumbs>ul>li:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:4px solid #4ea7f9;z-index:99991;opacity:0;transition:all .2s cubic-bezier(.25,.46,.45,.94)}.fancybox-thumbs>ul>li.fancybox-thumbs-active:before{opacity:1}@media (max-width:800px){.fancybox-thumbs{width:110px}.fancybox-show-thumbs .fancybox-inner{right:110px}.fancybox-thumbs>ul>li{max-width:calc(100% - 10px)}} \ No newline at end of file diff --git a/dist/jquery.fancybox.min.js b/dist/jquery.fancybox.min.js index a361832d..03c5f74c 100644 --- a/dist/jquery.fancybox.min.js +++ b/dist/jquery.fancybox.min.js @@ -1,5 +1,5 @@ // ================================================== -// fancyBox v3.1.28 +// fancyBox v3.2.0 // // Licensed GPLv3 for open source use // or fancyBox Commercial License for commercial use @@ -8,5 +8,5 @@ // Copyright 2017 fancyApps // // ================================================== -!function(t,e,n,o){"use strict";function i(t){var e=t.currentTarget,o=t.data?t.data.options:{},i=o.selector?n(o.selector):t.data?t.data.items:[],a=n(e).attr("data-fancybox")||"",s=0,r=n.fancybox.getInstance();t.preventDefault(),r&&r.current.opts.$orig.is(e)||(a?(i=i.length?i.filter('[data-fancybox="'+a+'"]'):n('[data-fancybox="'+a+'"]'),s=i.index(e),s<0&&(s=0)):i=[e],n.fancybox.open(i,o,s))}if(n){if(n.fn.fancybox)return void n.error("fancyBox already initialized");var a={loop:!1,margin:[44,0],gutter:50,keyboard:!0,arrows:!0,infobar:!1,toolbar:!0,buttons:["slideShow","fullScreen","thumbs","close"],idleTime:4,smallBtn:"auto",protect:!1,modal:!1,image:{preload:"auto"},ajax:{settings:{data:{fancybox:!0}}},iframe:{tpl:'',preload:!0,css:{},attr:{scrolling:"auto"}},animationEffect:"zoom",animationDuration:366,zoomOpacity:"auto",transitionEffect:"fade",transitionDuration:366,slideClass:"",baseClass:"",baseTpl:'',spinnerTpl:'
',errorTpl:'

{{ERROR}}

',btnTpl:{slideShow:'',fullScreen:'',thumbs:'',close:'',smallBtn:''},parentEl:"body",autoFocus:!0,backFocus:!0,trapFocus:!0,fullScreen:{autoStart:!1},touch:{vertical:!0,momentum:!0},hash:null,media:{},slideShow:{autoStart:!1,speed:4e3},thumbs:{autoStart:!1,hideOnClose:!0},onInit:n.noop,beforeLoad:n.noop,afterLoad:n.noop,beforeShow:n.noop,afterShow:n.noop,beforeClose:n.noop,afterClose:n.noop,onActivate:n.noop,onDeactivate:n.noop,clickContent:function(t,e){return"image"===t.type&&"zoom"},clickSlide:"close",clickOutside:"close",dblclickContent:!1,dblclickSlide:!1,dblclickOutside:!1,mobile:{clickContent:function(t,e){return"image"===t.type&&"toggleControls"},clickSlide:function(t,e){return"image"===t.type?"toggleControls":"close"},dblclickContent:function(t,e){return"image"===t.type&&"zoom"},dblclickSlide:function(t,e){return"image"===t.type&&"zoom"}},lang:"en",i18n:{en:{CLOSE:"Close",NEXT:"Next",PREV:"Previous",ERROR:"The requested content cannot be loaded.
Please try again later.",PLAY_START:"Start slideshow",PLAY_STOP:"Pause slideshow",FULL_SCREEN:"Full screen",THUMBS:"Thumbnails"},de:{CLOSE:"Schliessen",NEXT:"Weiter",PREV:"Zurück",ERROR:"Die angeforderten Daten konnten nicht geladen werden.
Bitte versuchen Sie es später nochmal.",PLAY_START:"Diaschau starten",PLAY_STOP:"Diaschau beenden",FULL_SCREEN:"Vollbild",THUMBS:"Vorschaubilder"}}},s=n(t),r=n(e),c=0,l=function(t){return t&&t.hasOwnProperty&&t instanceof n},u=function(){return t.requestAnimationFrame||t.webkitRequestAnimationFrame||t.mozRequestAnimationFrame||t.oRequestAnimationFrame||function(e){return t.setTimeout(e,1e3/60)}}(),d=function(){var t,n=e.createElement("fakeelement"),i={transition:"transitionend",OTransition:"oTransitionEnd",MozTransition:"transitionend",WebkitTransition:"webkitTransitionEnd"};for(t in i)if(n.style[t]!==o)return i[t]}(),f=function(t){return t&&t.length&&t[0].offsetHeight},h=function(t,o,i){var s=this;s.opts=n.extend(!0,{index:i},a,o||{}),o&&n.isArray(o.buttons)&&(s.opts.buttons=o.buttons),s.id=s.opts.id||++c,s.group=[],s.currIndex=parseInt(s.opts.index,10)||0,s.prevIndex=null,s.prevPos=null,s.currPos=0,s.firstRun=null,s.createGroup(t),s.group.length&&(s.$lastFocus=n(e.activeElement).blur(),s.slides={},s.init(t))};n.extend(h.prototype,{init:function(){var t,e,o,i=this,a=i.group[i.currIndex].opts;i.scrollTop=r.scrollTop(),i.scrollLeft=r.scrollLeft(),n.fancybox.getInstance()||n.fancybox.isMobile||"hidden"===n("body").css("overflow")||(t=n("body").width(),n("html").addClass("fancybox-enabled"),t=n("body").width()-t,t>1&&n("head").append('")),o="",n.each(a.buttons,function(t,e){o+=a.btnTpl[e]||""}),e=n(i.translate(i,a.baseTpl.replace("{{BUTTONS}}",o))).addClass("fancybox-is-hidden").attr("id","fancybox-container-"+i.id).addClass(a.baseClass).data("FancyBox",i).prependTo(a.parentEl),i.$refs={container:e},["bg","inner","infobar","toolbar","stage","caption"].forEach(function(t){i.$refs[t]=e.find(".fancybox-"+t)}),(!a.arrows||i.group.length<2)&&e.find(".fancybox-navigation").remove(),a.infobar||i.$refs.infobar.remove(),a.toolbar||i.$refs.toolbar.remove(),i.trigger("onInit"),i.activate(),i.jumpTo(i.currIndex)},translate:function(t,e){var n=t.opts.i18n[t.opts.lang];return e.replace(/\{\{(\w+)\}\}/g,function(t,e){var i=n[e];return i===o?t:i})},createGroup:function(t){var e=this,i=n.makeArray(t);n.each(i,function(t,i){var a,s,r,c,l={},u={},d=[];n.isPlainObject(i)?(l=i,u=i.opts||i):"object"===n.type(i)&&n(i).length?(a=n(i),d=a.data(),u="options"in d?d.options:{},u="object"===n.type(u)?u:{},l.src="src"in d?d.src:u.src||a.attr("href"),["width","height","thumb","type","filter"].forEach(function(t){t in d&&(u[t]=d[t])}),"srcset"in d&&(u.image={srcset:d.srcset}),u.$orig=a,l.type||l.src||(l.type="inline",l.src=i)):l={type:"html",src:i+""},l.opts=n.extend(!0,{},e.opts,u),n.fancybox.isMobile&&(l.opts=n.extend(!0,{},l.opts,l.opts.mobile)),s=l.type||l.opts.type,r=l.src||"",!s&&r&&(r.match(/(^data:image\/[a-z0-9+\/=]*,)|(\.(jp(e|g|eg)|gif|png|bmp|webp|svg|ico)((\?|#).*)?$)/i)?s="image":r.match(/\.(pdf)((\?|#).*)?$/i)?s="pdf":"#"===r.charAt(0)&&(s="inline")),l.type=s,l.index=e.group.length,l.opts.$orig&&!l.opts.$orig.length&&delete l.opts.$orig,!l.opts.$thumb&&l.opts.$orig&&(l.opts.$thumb=l.opts.$orig.find("img:first")),l.opts.$thumb&&!l.opts.$thumb.length&&delete l.opts.$thumb,"function"===n.type(l.opts.caption)?l.opts.caption=l.opts.caption.apply(i,[e,l]):"caption"in d&&(l.opts.caption=d.caption),l.opts.caption=l.opts.caption===o?"":l.opts.caption+"","ajax"===s&&(c=r.split(/\s+/,2),c.length>1&&(l.src=c.shift(),l.opts.filter=c.shift())),"auto"==l.opts.smallBtn&&(n.inArray(s,["html","inline","ajax"])>-1?(l.opts.toolbar=!1,l.opts.smallBtn=!0):l.opts.smallBtn=!1),"pdf"===s&&(l.type="iframe",l.opts.iframe.preload=!1),l.opts.modal&&(l.opts=n.extend(!0,l.opts,{infobar:0,toolbar:0,smallBtn:0,keyboard:0,slideShow:0,fullScreen:0,thumbs:0,touch:0,clickContent:!1,clickSlide:!1,clickOutside:!1,dblclickContent:!1,dblclickSlide:!1,dblclickOutside:!1})),e.group.push(l)})},addEvents:function(){var o=this;o.removeEvents(),o.$refs.container.on("click.fb-close","[data-fancybox-close]",function(t){t.stopPropagation(),t.preventDefault(),o.close(t)}).on("click.fb-prev touchend.fb-prev","[data-fancybox-prev]",function(t){t.stopPropagation(),t.preventDefault(),o.previous()}).on("click.fb-next touchend.fb-next","[data-fancybox-next]",function(t){t.stopPropagation(),t.preventDefault(),o.next()}),s.on("orientationchange.fb resize.fb",function(t){t&&t.originalEvent&&"resize"===t.originalEvent.type?u(function(){o.update()}):(o.$refs.stage.hide(),setTimeout(function(){o.$refs.stage.show(),o.update()},500))}),r.on("focusin.fb",function(t){var i=n.fancybox?n.fancybox.getInstance():null;i.isClosing||!i.current||!i.current.opts.trapFocus||n(t.target).hasClass("fancybox-container")||n(t.target).is(e)||i&&"fixed"!==n(t.target).css("position")&&!i.$refs.container.has(t.target).length&&(t.stopPropagation(),i.focus(),s.scrollTop(o.scrollTop).scrollLeft(o.scrollLeft))}),r.on("keydown.fb",function(t){var e=o.current,i=t.keyCode||t.which;if(e&&e.opts.keyboard&&!n(t.target).is("input")&&!n(t.target).is("textarea"))return 8===i||27===i?(t.preventDefault(),void o.close(t)):37===i||38===i?(t.preventDefault(),void o.previous()):39===i||40===i?(t.preventDefault(),void o.next()):void o.trigger("afterKeydown",t,i)}),o.group[o.currIndex].opts.idleTime&&(o.idleSecondsCounter=0,r.on("mousemove.fb-idle mouseenter.fb-idle mouseleave.fb-idle mousedown.fb-idle touchstart.fb-idle touchmove.fb-idle scroll.fb-idle keydown.fb-idle",function(){o.idleSecondsCounter=0,o.isIdle&&o.showControls(),o.isIdle=!1}),o.idleInterval=t.setInterval(function(){o.idleSecondsCounter++,o.idleSecondsCounter>=o.group[o.currIndex].opts.idleTime&&(o.isIdle=!0,o.idleSecondsCounter=0,o.hideControls())},1e3))},removeEvents:function(){var e=this;s.off("orientationchange.fb resize.fb"),r.off("focusin.fb keydown.fb .fb-idle"),this.$refs.container.off(".fb-close .fb-prev .fb-next"),e.idleInterval&&(t.clearInterval(e.idleInterval),e.idleInterval=null)},previous:function(t){return this.jumpTo(this.currPos-1,t)},next:function(t){return this.jumpTo(this.currPos+1,t)},jumpTo:function(t,e,i){var a,s,r,c,l,u,d,h=this,p=h.group.length;if(!(h.isSliding||h.isClosing||h.isAnimating&&h.firstRun)){if(t=parseInt(t,10),s=h.current?h.current.opts.loop:h.opts.loop,!s&&(t<0||t>=p))return!1;if(a=h.firstRun=null===h.firstRun,!(p<2&&!a&&h.isSliding)){if(c=h.current,h.prevIndex=h.currIndex,h.prevPos=h.currPos,r=h.createSlide(t),p>1&&((s||r.index>0)&&h.createSlide(t-1),(s||r.indexr.pos?"next":"previous"),c.$slide.removeClass("fancybox-slide--complete fancybox-slide--current fancybox-slide--next fancybox-slide--previous"),c.isComplete=!1,e&&(r.isMoved||r.opts.transitionEffect)&&(r.isMoved?c.$slide.addClass(d):(d="fancybox-animated "+d+" fancybox-fx-"+r.opts.transitionEffect,n.fancybox.animate(c.$slide,d,e,function(){c.$slide.removeClass(d).removeAttr("style")}))))}}},createSlide:function(t){var e,o,i=this;return o=t%i.group.length,o=o<0?i.group.length+o:o,!i.slides[t]&&i.group[o]&&(e=n('
').appendTo(i.$refs.stage),i.slides[t]=n.extend(!0,{},i.group[o],{pos:t,$slide:e,isLoaded:!1}),i.updateSlide(i.slides[t])),i.slides[t]},scaleToActual:function(t,e,i){var a,s,r,c,l,u=this,d=u.current,f=d.$content,h=parseInt(d.$slide.width(),10),p=parseInt(d.$slide.height(),10),g=d.width,b=d.height;"image"!=d.type||d.hasError||!f||u.isAnimating||(n.fancybox.stop(f),u.isAnimating=!0,t=t===o?.5*h:t,e=e===o?.5*p:e,a=n.fancybox.getTranslate(f),c=g/a.width,l=b/a.height,s=.5*h-.5*g,r=.5*p-.5*b,g>h&&(s=a.left*c-(t*c-t),s>0&&(s=0),sp&&(r=a.top*l-(e*l-e),r>0&&(r=0),rt.width||o.height>t.height))},isScaledDown:function(){var t=this,e=t.current,o=e.$content,i=!1;return o&&(i=n.fancybox.getTranslate(o),i=i.width1||Math.abs(n.height()-o.height)>1),o},loadSlide:function(t){var e,o,i,a=this;if(!t.isLoading&&!t.isLoaded){switch(t.isLoading=!0,a.trigger("beforeLoad",t),e=t.type,o=t.$slide,o.off("refresh").trigger("onReset").addClass("fancybox-slide--"+(e||"unknown")).addClass(t.opts.slideClass),e){case"image":a.setImage(t);break;case"iframe":a.setIframe(t);break;case"html":a.setContent(t,t.src||t.content);break;case"inline":n(t.src).length?a.setContent(t,n(t.src)):a.setError(t);break;case"ajax":a.showLoading(t),i=n.ajax(n.extend({},t.opts.ajax.settings,{url:t.src,success:function(e,n){"success"===n&&a.setContent(t,e)},error:function(e,n){e&&"abort"!==n&&a.setError(t)}})),o.one("onReset",function(){i.abort()});break;default:a.setError(t)}return!0}},setImage:function(e){var o,i,a,s,r=this,c=e.opts.image.srcset;if(c){a=t.devicePixelRatio||1,s=t.innerWidth*a,i=c.split(",").map(function(t){var e={};return t.trim().split(/\s+/).forEach(function(t,n){var o=parseInt(t.substring(0,t.length-1),10);return 0===n?e.url=t:void(o&&(e.value=o,e.postfix=t[t.length-1]))}),e}),i.sort(function(t,e){return t.value-e.value});for(var l=0;l=s||"x"===u.postfix&&u.value>=a){o=u;break}}!o&&i.length&&(o=i[i.length-1]),o&&(e.src=o.url,e.width&&e.height&&"w"==o.postfix&&(e.height=e.width/e.height*o.value,e.width=o.value))}e.$content=n('
').addClass("fancybox-is-hidden").appendTo(e.$slide),e.opts.preload!==!1&&e.opts.width&&e.opts.height&&(e.opts.thumb||e.opts.$thumb)?(e.width=e.opts.width,e.height=e.opts.height,e.$ghost=n("").one("error",function(){n(this).remove(),e.$ghost=null,r.setBigImage(e)}).one("load",function(){r.afterLoad(e),r.setBigImage(e)}).addClass("fancybox-image").appendTo(e.$content).attr("src",e.opts.thumb||e.opts.$thumb.attr("src"))):r.setBigImage(e)},setBigImage:function(t){var e=this,o=n("");t.$image=o.one("error",function(){e.setError(t)}).one("load",function(){clearTimeout(t.timouts),t.timouts=null,e.isClosing||(t.width=this.naturalWidth,t.height=this.naturalHeight,t.opts.image.srcset&&o.attr("sizes","100vw").attr("srcset",t.opts.image.srcset),e.hideLoading(t),t.$ghost?t.timouts=setTimeout(function(){t.timouts=null,t.$ghost.hide()},Math.min(300,Math.max(1e3,t.height/1600))):e.afterLoad(t))}).addClass("fancybox-image").attr("src",t.src).appendTo(t.$content),(o[0].complete||"complete"==o[0].readyState)&&o[0].naturalWidth&&o[0].naturalHeight?o.trigger("load"):o[0].error?o.trigger("error"):t.timouts=setTimeout(function(){o[0].complete||t.hasError||e.showLoading(t)},100)},setIframe:function(t){var e,i=this,a=t.opts.iframe,s=t.$slide;t.$content=n('
').css(a.css).appendTo(s),e=n(a.tpl.replace(/\{rnd\}/g,(new Date).getTime())).attr(a.attr).appendTo(t.$content),a.preload?(i.showLoading(t),e.on("load.fb error.fb",function(e){this.isReady=1,t.$slide.trigger("refresh"),i.afterLoad(t)}),s.on("refresh.fb",function(){var n,i,s,r=t.$content,c=a.css.width,l=a.css.height;if(1===e[0].isReady){try{i=e.contents(),s=i.find("body")}catch(t){}s&&s.length&&(c===o&&(n=e[0].contentWindow.document.documentElement.scrollWidth,c=Math.ceil(s.outerWidth(!0)+(r.width()-n)),c+=r.outerWidth()-r.innerWidth()),l===o&&(l=Math.ceil(s.outerHeight(!0)),l+=r.outerHeight()-r.innerHeight()),c&&r.width(c),l&&r.height(l)),r.removeClass("fancybox-is-hidden")}})):this.afterLoad(t),e.attr("src",t.src),t.opts.smallBtn===!0&&t.$content.prepend(i.translate(t,t.opts.btnTpl.smallBtn)),s.one("onReset",function(){try{n(this).find("iframe").hide().attr("src","//about:blank")}catch(t){}n(this).empty(),t.isLoaded=!1})},setContent:function(t,e){var o=this;o.isClosing||(o.hideLoading(t),t.$slide.empty(),l(e)&&e.parent().length?(e.parent(".fancybox-slide--inline").trigger("onReset"),t.$placeholder=n("
").hide().insertAfter(e),e.css("display","inline-block")):t.hasError||("string"===n.type(e)&&(e=n("
").append(n.trim(e)).contents(),3===e[0].nodeType&&(e=n("
").html(e))),t.opts.filter&&(e=n("
").html(e).find(t.opts.filter))),t.$slide.one("onReset",function(){t.$placeholder&&(t.$placeholder.after(e.hide()).remove(),t.$placeholder=null),t.$smallBtn&&(t.$smallBtn.remove(),t.$smallBtn=null),t.hasError||(n(this).empty(),t.isLoaded=!1)}),t.$content=n(e).appendTo(t.$slide),t.opts.smallBtn&&!t.$smallBtn&&(t.$smallBtn=n(o.translate(t,t.opts.btnTpl.smallBtn)).appendTo(t.$content.filter("div").first())),this.afterLoad(t))},setError:function(t){t.hasError=!0,t.$slide.removeClass("fancybox-slide--"+t.type),this.setContent(t,this.translate(t,t.opts.errorTpl))},showLoading:function(t){var e=this;t=t||e.current,t&&!t.$spinner&&(t.$spinner=n(e.opts.spinnerTpl).appendTo(t.$slide))},hideLoading:function(t){var e=this;t=t||e.current,t&&t.$spinner&&(t.$spinner.remove(),delete t.$spinner)},afterLoad:function(t){var e=this;e.isClosing||(t.isLoading=!1,t.isLoaded=!0,e.trigger("afterLoad",t),e.hideLoading(t),t.opts.protect&&t.$content&&!t.hasError&&(t.$content.on("contextmenu.fb",function(t){return 2==t.button&&t.preventDefault(),!0}),"image"===t.type&&n('
').appendTo(t.$content)),e.revealContent(t))},revealContent:function(t){var e,i,a,s,r,c=this,l=t.$slide,u=!1;return e=t.opts[c.firstRun?"animationEffect":"transitionEffect"],a=t.opts[c.firstRun?"animationDuration":"transitionDuration"],a=parseInt(t.forcedDuration===o?a:t.forcedDuration,10),!t.isMoved&&t.pos===c.currPos&&a||(e=!1),"zoom"!==e||t.pos===c.currPos&&a&&"image"===t.type&&!t.hasError&&(u=c.getThumbPos(t))||(e="fade"),"zoom"===e?(r=c.getFitPos(t),r.scaleX=r.width/u.width,r.scaleY=r.height/u.height,delete r.width,delete r.height,s=t.opts.zoomOpacity,"auto"==s&&(s=Math.abs(t.width/t.height-u.width/u.height)>.1),s&&(u.opacity=.1,r.opacity=1),n.fancybox.setTranslate(t.$content.removeClass("fancybox-is-hidden"),u),f(t.$content),void n.fancybox.animate(t.$content,r,a,function(){c.complete()})):(c.updateSlide(t),e?(n.fancybox.stop(l),i="fancybox-animated fancybox-slide--"+(t.pos>c.prevPos?"next":"previous")+" fancybox-fx-"+e,l.removeAttr("style").removeClass("fancybox-slide--current fancybox-slide--next fancybox-slide--previous").addClass(i),t.$content.removeClass("fancybox-is-hidden"),f(l),void n.fancybox.animate(l,"fancybox-slide--current",a,function(e){l.removeClass(i).removeAttr("style"),t.pos===c.currPos&&c.complete()},!0)):(f(l),t.$content.removeClass("fancybox-is-hidden"),void(t.pos===c.currPos&&c.complete())))},getThumbPos:function(o){var i,a=this,s=!1,r=function(e){for(var o,i=e[0],a=i.getBoundingClientRect(),s=[];null!==i.parentElement;)"hidden"!==n(i.parentElement).css("overflow")&&"auto"!==n(i.parentElement).css("overflow")||s.push(i.parentElement.getBoundingClientRect()),i=i.parentElement;return o=s.every(function(t){var e=Math.min(a.right,t.right)-Math.max(a.left,t.left),n=Math.min(a.bottom,t.bottom)-Math.max(a.top,t.top);return e>0&&n>0}),o&&a.bottom>0&&a.right>0&&a.left=t.currPos-1&&o.pos<=t.currPos+1?i[o.pos]=o:o&&(n.fancybox.stop(o.$slide),o.$slide.off().remove())}),t.slides=i,t.updateCursor(),t.trigger("afterShow"),(n(e.activeElement).is("[disabled]")||o.opts.autoFocus&&"image"!=o.type&&"iframe"!==o.type)&&t.focus())},preload:function(){var t,e,n=this;n.group.length<2||(t=n.slides[n.currPos+1],e=n.slides[n.currPos-1],t&&"image"===t.type&&n.loadSlide(t),e&&"image"===e.type&&n.loadSlide(e))},focus:function(){var t,e=this.current;this.isClosing||(e&&e.isComplete&&(t=e.$slide.find("input[autofocus]:enabled:visible:first"),t.length||(t=e.$slide.find("button,:input,[tabindex],a").filter(":enabled:visible:first"))),t=t&&t.length?t:this.$refs.container,t.focus())},activate:function(){var t=this;n(".fancybox-container").each(function(){var e=n(this).data("FancyBox");e&&e.uid!==t.uid&&!e.isClosing&&e.trigger("onDeactivate")}),t.current&&(t.$refs.container.index()>0&&t.$refs.container.prependTo(e.body),t.updateControls()),t.trigger("onActivate"),t.addEvents()},close:function(t,e){var o,i,a,s,r,c,l=this,f=l.current,h=function(){l.cleanUp(t)};return!l.isClosing&&(l.isClosing=!0,l.trigger("beforeClose",t)===!1?(l.isClosing=!1,u(function(){l.update()}),!1):(l.removeEvents(),f.timouts&&clearTimeout(f.timouts),a=f.$content,o=f.opts.animationEffect,i=n.isNumeric(e)?e:o?f.opts.animationDuration:0,f.$slide.off(d).removeClass("fancybox-slide--complete fancybox-slide--next fancybox-slide--previous fancybox-animated"),f.$slide.siblings().trigger("onReset").remove(),i&&l.$refs.container.removeClass("fancybox-is-open").addClass("fancybox-is-closing"),l.hideLoading(f),l.hideControls(),l.updateCursor(),"zoom"!==o||t!==!0&&a&&i&&"image"===f.type&&!f.hasError&&(c=l.getThumbPos(f))||(o="fade"),"zoom"===o?(n.fancybox.stop(a),r=n.fancybox.getTranslate(a),r.width=r.width*r.scaleX,r.height=r.height*r.scaleY,s=f.opts.zoomOpacity,"auto"==s&&(s=Math.abs(f.width/f.height-c.width/c.height)>.1),s&&(c.opacity=0),r.scaleX=r.width/c.width,r.scaleY=r.height/c.height,r.width=c.width,r.height=c.height,n.fancybox.setTranslate(f.$content,r),n.fancybox.animate(f.$content,c,i,h),!0):(o&&i?t===!0?setTimeout(h,i):n.fancybox.animate(f.$slide.removeClass("fancybox-slide--current"),"fancybox-animated fancybox-slide--previous fancybox-fx-"+o,i,h):h(),!0)))},cleanUp:function(t){var e,o=this;o.current.$slide.trigger("onReset"),o.$refs.container.empty().remove(),o.trigger("afterClose",t),o.$lastFocus&&o.current.opts.backFocus&&o.$lastFocus.focus(),o.current=null,e=n.fancybox.getInstance(),e?e.activate():(s.scrollTop(o.scrollTop).scrollLeft(o.scrollLeft),n("html").removeClass("fancybox-enabled"),n("#fancybox-style-noscroll").remove())},trigger:function(t,e){var o,i=Array.prototype.slice.call(arguments,1),a=this,s=e&&e.opts?e:a.current;return s?i.unshift(s):s=a,i.unshift(a),n.isFunction(s.opts[t])&&(o=s.opts[t].apply(s,i)),o===!1?o:void("afterClose"===t?r.trigger(t+".fb",i):a.$refs.container.trigger(t+".fb",i))},updateControls:function(t){var e=this,o=e.current,i=o.index,a=o.opts,s=a.caption,r=e.$refs.caption;o.$slide.trigger("refresh"),e.$caption=s&&s.length?r.html(s):null,e.isHiddenControls||e.showControls(),n("[data-fancybox-count]").html(e.group.length),n("[data-fancybox-index]").html(i+1),n("[data-fancybox-prev]").prop("disabled",!a.loop&&i<=0),n("[data-fancybox-next]").prop("disabled",!a.loop&&i>=e.group.length-1)},hideControls:function(){this.isHiddenControls=!0,this.$refs.container.removeClass("fancybox-show-infobar fancybox-show-toolbar fancybox-show-caption fancybox-show-nav")},showControls:function(){var t=this,e=t.current?t.current.opts:t.opts,n=t.$refs.container;t.isHiddenControls=!1,t.idleSecondsCounter=0,n.toggleClass("fancybox-show-toolbar",!(!e.toolbar||!e.buttons)).toggleClass("fancybox-show-infobar",!!(e.infobar&&t.group.length>1)).toggleClass("fancybox-show-nav",!!(e.arrows&&t.group.length>1)).toggleClass("fancybox-is-modal",!!e.modal),t.$caption?n.addClass("fancybox-show-caption "):n.removeClass("fancybox-show-caption")},toggleControls:function(){this.isHiddenControls?this.showControls():this.hideControls()}}),n.fancybox={version:"3.1.28",defaults:a,getInstance:function(t){var e=n('.fancybox-container:not(".fancybox-is-closing"):first').data("FancyBox"),o=Array.prototype.slice.call(arguments,1);return e instanceof h&&("string"===n.type(t)?e[t].apply(e,o):"function"===n.type(t)&&t.apply(e,o),e)},open:function(t,e,n){return new h(t,e,n)},close:function(t){var e=this.getInstance();e&&(e.close(),t===!0&&this.close())},destroy:function(){this.close(!0),r.off("click.fb-start")},isMobile:e.createTouch!==o&&/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent),use3d:function(){var n=e.createElement("div");return t.getComputedStyle&&t.getComputedStyle(n).getPropertyValue("transform")&&!(e.documentMode&&e.documentMode<11)}(),getTranslate:function(t){var e;if(!t||!t.length)return!1;if(e=t.eq(0).css("transform"),e&&e.indexOf("matrix")!==-1?(e=e.split("(")[1],e=e.split(")")[0],e=e.split(",")):e=[],e.length)e=e.length>10?[e[13],e[12],e[0],e[5]]:[e[5],e[4],e[0],e[3]],e=e.map(parseFloat);else{e=[0,0,1,1];var n=/\.*translate\((.*)px,(.*)px\)/i,o=n.exec(t.eq(0).attr("style"));o&&(e[0]=parseFloat(o[2]),e[1]=parseFloat(o[1]))}return{top:e[0],left:e[1],scaleX:e[2],scaleY:e[3],opacity:parseFloat(t.css("opacity")),width:t.width(),height:t.height()}},setTranslate:function(t,e){var n="",i={};if(t&&e)return e.left===o&&e.top===o||(n=(e.left===o?t.position().left:e.left)+"px, "+(e.top===o?t.position().top:e.top)+"px",n=this.use3d?"translate3d("+n+", 0px)":"translate("+n+")"),e.scaleX!==o&&e.scaleY!==o&&(n=(n.length?n+" ":"")+"scale("+e.scaleX+", "+e.scaleY+")"),n.length&&(i.transform=n),e.opacity!==o&&(i.opacity=e.opacity),e.width!==o&&(i.width=e.width),e.height!==o&&(i.height=e.height),t.css(i)},animate:function(t,e,i,a,s){var r=d||"transitionend";n.isFunction(i)&&(a=i,i=null),n.isPlainObject(e)||t.removeAttr("style"),t.on(r,function(i){(!i||!i.originalEvent||t.is(i.originalEvent.target)&&"z-index"!=i.originalEvent.propertyName)&&(t.off(r),n.isPlainObject(e)?e.scaleX!==o&&e.scaleY!==o&&(t.css("transition-duration","0ms"),e.width=Math.round(t.width()*e.scaleX),e.height=Math.round(t.height()*e.scaleY),e.scaleX=1,e.scaleY=1,n.fancybox.setTranslate(t,e)):s!==!0&&t.removeClass(e),n.isFunction(a)&&a(i))}),n.isNumeric(i)&&t.css("transition-duration",i+"ms"),n.isPlainObject(e)?n.fancybox.setTranslate(t,e):t.addClass(e),t.data("timer",setTimeout(function(){t.trigger("transitionend")},i+16))},stop:function(t){clearTimeout(t.data("timer")),t.off(d)}},n.fn.fancybox=function(t){var e;return t=t||{},e=t.selector||!1,e?n("body").off("click.fb-start",e).on("click.fb-start",e,{options:t},i):this.off("click.fb-start").on("click.fb-start",{items:this,options:t},i),this},r.on("click.fb-start","[data-fancybox]",i)}}(window,document,window.jQuery||jQuery),function(t){"use strict";var e=function(e,n,o){if(e)return o=o||"","object"===t.type(o)&&(o=t.param(o,!0)),t.each(n,function(t,n){e=e.replace("$"+t,n||"")}),o.length&&(e+=(e.indexOf("?")>0?"&":"?")+o),e},n={youtube:{matcher:/(youtube\.com|youtu\.be|youtube\-nocookie\.com)\/(watch\?(.*&)?v=|v\/|u\/|embed\/?)?(videoseries\?list=(.*)|[\w-]{11}|\?listType=(.*)&list=(.*))(.*)/i,params:{autoplay:1,autohide:1,fs:1,rel:0,hd:1,wmode:"transparent",enablejsapi:1,html5:1},paramPlace:8,type:"iframe",url:"//www.youtube.com/embed/$4",thumb:"//img.youtube.com/vi/$4/hqdefault.jpg"},vimeo:{matcher:/^.+vimeo.com\/(.*\/)?([\d]+)(.*)?/,params:{autoplay:1,hd:1,show_title:1,show_byline:1,show_portrait:0,fullscreen:1,api:1},paramPlace:3,type:"iframe",url:"//player.vimeo.com/video/$2"},metacafe:{matcher:/metacafe.com\/watch\/(\d+)\/(.*)?/,type:"iframe",url:"//www.metacafe.com/embed/$1/?ap=1"},dailymotion:{matcher:/dailymotion.com\/video\/(.*)\/?(.*)/,params:{additionalInfos:0,autoStart:1},type:"iframe",url:"//www.dailymotion.com/embed/video/$1"},vine:{matcher:/vine.co\/v\/([a-zA-Z0-9\?\=\-]+)/,type:"iframe",url:"//vine.co/v/$1/embed/simple"},instagram:{matcher:/(instagr\.am|instagram\.com)\/p\/([a-zA-Z0-9_\-]+)\/?/i,type:"image",url:"//$1/p/$2/media/?size=l"},gmap_place:{matcher:/(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(((maps\/(place\/(.*)\/)?\@(.*),(\d+.?\d+?)z))|(\?ll=))(.*)?/i,type:"iframe",url:function(t){return"//maps.google."+t[2]+"/?ll="+(t[9]?t[9]+"&z="+Math.floor(t[10])+(t[12]?t[12].replace(/^\//,"&"):""):t[12])+"&output="+(t[12]&&t[12].indexOf("layer=c")>0?"svembed":"embed")}},gmap_search:{matcher:/(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(maps\/search\/)(.*)/i,type:"iframe",url:function(t){return"//maps.google."+t[2]+"/maps?q="+t[5].replace("query=","q=").replace("api=1","")+"&output=embed"}}};t(document).on("onInit.fb",function(o,i){t.each(i.group,function(o,i){var a,s,r,c,l,u,d,f=i.src||"",h=!1;i.type||(a=t.extend(!0,{},n,i.opts.media),t.each(a,function(n,o){if(r=f.match(o.matcher),u={},d=n,r){if(h=o.type,o.paramPlace&&r[o.paramPlace]){l=r[o.paramPlace],"?"==l[0]&&(l=l.substring(1)),l=l.split("&");for(var a=0;ae.clientHeight,a=("scroll"===o||"auto"===o)&&e.scrollWidth>e.clientWidth;return i||a},l=function(t){for(var e=!1;;){if(e=c(t.get(0)))break;if(t=t.parent(),!t.length||t.hasClass("fancybox-stage")||t.is("body"))break}return e},u=function(t){var e=this;e.instance=t,e.$bg=t.$refs.bg,e.$stage=t.$refs.stage,e.$container=t.$refs.container,e.destroy(),e.$container.on("touchstart.fb.touch mousedown.fb.touch",n.proxy(e,"ontouchstart"))};u.prototype.destroy=function(){this.$container.off(".fb.touch")},u.prototype.ontouchstart=function(o){var i=this,c=n(o.target),u=i.instance,d=u.current,f=d.$content,h="touchstart"==o.type;if(h&&i.$container.off("mousedown.fb.touch"),!d||i.instance.isAnimating||i.instance.isClosing)return o.stopPropagation(),void o.preventDefault();if((!o.originalEvent||2!=o.originalEvent.button)&&c.length&&!r(c)&&!r(c.parent())&&!(o.originalEvent.clientX>c[0].clientWidth+c.offset().left)&&(i.startPoints=a(o),i.startPoints&&!(i.startPoints.length>1&&u.isSliding))){if(i.$target=c,i.$content=f,i.canTap=!0,n(e).off(".fb.touch"),n(e).on(h?"touchend.fb.touch touchcancel.fb.touch":"mouseup.fb.touch mouseleave.fb.touch",n.proxy(i,"ontouchend")),n(e).on(h?"touchmove.fb.touch":"mousemove.fb.touch",n.proxy(i,"ontouchmove")),!u.current.opts.touch&&!u.canPan()||!c.is(i.$stage)&&!i.$stage.find(c).length)return void(c.is("img")&&o.preventDefault());o.stopPropagation(),n.fancybox.isMobile&&(l(i.$target)||l(i.$target.parent()))||o.preventDefault(),i.canvasWidth=Math.round(d.$slide[0].clientWidth),i.canvasHeight=Math.round(d.$slide[0].clientHeight),i.startTime=(new Date).getTime(),i.distanceX=i.distanceY=i.distance=0,i.isPanning=!1,i.isSwiping=!1,i.isZooming=!1,i.sliderStartPos=i.sliderLastPos||{top:0,left:0},i.contentStartPos=n.fancybox.getTranslate(i.$content),i.contentLastPos=null,1!==i.startPoints.length||i.isZooming||(i.canTap=!u.isSliding,"image"===d.type&&(i.contentStartPos.width>i.canvasWidth+1||i.contentStartPos.height>i.canvasHeight+1)?(n.fancybox.stop(i.$content),i.$content.css("transition-duration","0ms"),i.isPanning=!0):i.isSwiping=!0,i.$container.addClass("fancybox-controls--isGrabbing")),2!==i.startPoints.length||u.isAnimating||d.hasError||"image"!==d.type||!d.isLoaded&&!d.$ghost||(i.isZooming=!0,i.isSwiping=!1,i.isPanning=!1,n.fancybox.stop(i.$content),i.$content.css("transition-duration","0ms"),i.centerPointStartX=.5*(i.startPoints[0].x+i.startPoints[1].x)-n(t).scrollLeft(),i.centerPointStartY=.5*(i.startPoints[0].y+i.startPoints[1].y)-n(t).scrollTop(),i.percentageOfImageAtPinchPointX=(i.centerPointStartX-i.contentStartPos.left)/i.contentStartPos.width,i.percentageOfImageAtPinchPointY=(i.centerPointStartY-i.contentStartPos.top)/i.contentStartPos.height,i.startDistanceBetweenFingers=s(i.startPoints[0],i.startPoints[1]))}},u.prototype.ontouchmove=function(t){var e=this;if(e.newPoints=a(t),n.fancybox.isMobile&&(l(e.$target)||l(e.$target.parent())))return t.stopPropagation(),void(e.canTap=!1);if((e.instance.current.opts.touch||e.instance.canPan())&&e.newPoints&&e.newPoints.length&&(e.distanceX=s(e.newPoints[0],e.startPoints[0],"x"),e.distanceY=s(e.newPoints[0],e.startPoints[0],"y"),e.distance=s(e.newPoints[0],e.startPoints[0]),e.distance>0)){if(!e.$target.is(e.$stage)&&!e.$stage.find(e.$target).length)return;t.stopPropagation(),t.preventDefault(),e.isSwiping?e.onSwipe():e.isPanning?e.onPan():e.isZooming&&e.onZoom()}},u.prototype.onSwipe=function(){var e,a=this,s=a.isSwiping,r=a.sliderStartPos.left||0;s===!0?Math.abs(a.distance)>10&&(a.canTap=!1,a.instance.group.length<2&&a.instance.opts.touch.vertical?a.isSwiping="y":a.instance.isSliding||a.instance.opts.touch.vertical===!1||"auto"===a.instance.opts.touch.vertical&&n(t).width()>800?a.isSwiping="x":(e=Math.abs(180*Math.atan2(a.distanceY,a.distanceX)/Math.PI),a.isSwiping=e>45&&e<135?"y":"x"),a.instance.isSliding=a.isSwiping,a.startPoints=a.newPoints,n.each(a.instance.slides,function(t,e){n.fancybox.stop(e.$slide),e.$slide.css("transition-duration","0ms"),e.inTransition=!1,e.pos===a.instance.current.pos&&(a.sliderStartPos.left=n.fancybox.getTranslate(e.$slide).left)}),a.instance.SlideShow&&a.instance.SlideShow.isActive&&a.instance.SlideShow.stop()):("x"==s&&(a.distanceX>0&&(a.instance.group.length<2||0===a.instance.current.index&&!a.instance.current.opts.loop)?r+=Math.pow(a.distanceX,.8):a.distanceX<0&&(a.instance.group.length<2||a.instance.current.index===a.instance.group.length-1&&!a.instance.current.opts.loop)?r-=Math.pow(-a.distanceX,.8):r+=a.distanceX),a.sliderLastPos={top:"x"==s?0:a.sliderStartPos.top+a.distanceY,left:r},a.requestId&&(i(a.requestId),a.requestId=null),a.requestId=o(function(){a.sliderLastPos&&(n.each(a.instance.slides,function(t,e){var o=e.pos-a.instance.currPos;n.fancybox.setTranslate(e.$slide,{top:a.sliderLastPos.top,left:a.sliderLastPos.left+o*a.canvasWidth+o*e.opts.gutter})}),a.$container.addClass("fancybox-is-sliding"))}))},u.prototype.onPan=function(){var t,e,a,s=this;s.canTap=!1,t=s.contentStartPos.width>s.canvasWidth?s.contentStartPos.left+s.distanceX:s.contentStartPos.left,e=s.contentStartPos.top+s.distanceY,a=s.limitMovement(t,e,s.contentStartPos.width,s.contentStartPos.height),a.scaleX=s.contentStartPos.scaleX,a.scaleY=s.contentStartPos.scaleY,s.contentLastPos=a,s.requestId&&(i(s.requestId),s.requestId=null),s.requestId=o(function(){n.fancybox.setTranslate(s.$content,s.contentLastPos)})},u.prototype.limitMovement=function(t,e,n,o){var i,a,s,r,c=this,l=c.canvasWidth,u=c.canvasHeight,d=c.contentStartPos.left,f=c.contentStartPos.top,h=c.distanceX,p=c.distanceY;return i=Math.max(0,.5*l-.5*n),a=Math.max(0,.5*u-.5*o),s=Math.min(l-n,.5*l-.5*n),r=Math.min(u-o,.5*u-.5*o),n>l&&(h>0&&t>i&&(t=i-1+Math.pow(-i+d+h,.8)||0),h<0&&tu&&(p>0&&e>a&&(e=a-1+Math.pow(-a+f+p,.8)||0),p<0&&ea?(t=t>0?0:t,t=ts?(e=e>0?0:e,e=e50?(n.fancybox.animate(e.instance.current.$slide,{top:e.sliderStartPos.top+e.distanceY+150*e.velocityY,opacity:0},150),o=e.instance.close(!0,300)):"x"==t&&e.distanceX>50&&e.instance.group.length>1?o=e.instance.previous(e.speedX):"x"==t&&e.distanceX<-50&&e.instance.group.length>1&&(o=e.instance.next(e.speedX)),o!==!1||"x"!=t&&"y"!=t||e.instance.jumpTo(e.instance.current.index,150),e.$container.removeClass("fancybox-is-sliding")},u.prototype.endPanning=function(){var t,e,o,i=this;i.contentLastPos&&(i.instance.current.opts.touch.momentum===!1?(t=i.contentLastPos.left,e=i.contentLastPos.top):(t=i.contentLastPos.left+i.velocityX*i.speed,e=i.contentLastPos.top+i.velocityY*i.speed),o=i.limitPosition(t,e,i.contentStartPos.width,i.contentStartPos.height),o.width=i.contentStartPos.width,o.height=i.contentStartPos.height,n.fancybox.animate(i.$content,o,330))},u.prototype.endZooming=function(){var t,e,o,i,a=this,s=a.instance.current,r=a.newWidth,c=a.newHeight;a.contentLastPos&&(t=a.contentLastPos.left,e=a.contentLastPos.top,i={top:e,left:t,width:r,height:c,scaleX:1,scaleY:1},n.fancybox.setTranslate(a.$content,i),rs.width||c>s.height?a.instance.scaleToActual(a.centerPointStartX,a.centerPointStartY,150):(o=a.limitPosition(t,e,r,c),n.fancybox.setTranslate(a.content,n.fancybox.getTranslate(a.$content)),n.fancybox.animate(a.$content,o,150)))},u.prototype.onTap=function(t){var e,o=this,i=n(t.target),s=o.instance,r=s.current,c=t&&a(t)||o.startPoints,l=c[0]?c[0].x-o.$stage.offset().left:0,u=c[0]?c[0].y-o.$stage.offset().top:0,d=function(e){var i=r.opts[e];if(n.isFunction(i)&&(i=i.apply(s,[r,t])),i)switch(i){case"close":s.close(o.startEvent);break;case"toggleControls":s.toggleControls(!0);break;case"next":s.next();break;case"nextOrClose":s.group.length>1?s.next():s.close(o.startEvent);break;case"zoom":"image"==r.type&&(r.isLoaded||r.$ghost)&&(s.canPan()?s.scaleToFit():s.isScaledDown()?s.scaleToActual(l,u):s.group.length<2&&s.close(o.startEvent))}};if(!(t.originalEvent&&2==t.originalEvent.button||s.isSliding||l>i[0].clientWidth+i.offset().left)){if(i.is(".fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-container"))e="Outside";else if(i.is(".fancybox-slide"))e="Slide";else{if(!s.current.$content||!s.current.$content.has(t.target).length)return;e="Content"}if(o.tapped){if(clearTimeout(o.tapped),o.tapped=null,Math.abs(l-o.tapX)>50||Math.abs(u-o.tapY)>50||s.isSliding)return this;d("dblclick"+e)}else o.tapX=l,o.tapY=u,r.opts["dblclick"+e]&&r.opts["dblclick"+e]!==r.opts["click"+e]?o.tapped=setTimeout(function(){o.tapped=null,d("click"+e)},300):d("click"+e);return this}},n(e).on("onActivate.fb",function(t,e){e&&!e.Guestures&&(e.Guestures=new u(e))}),n(e).on("beforeClose.fb",function(t,e){e&&e.Guestures&&e.Guestures.destroy()})}(window,document,window.jQuery),function(t,e){"use strict";var n=function(t){this.instance=t,this.init()};e.extend(n.prototype,{timer:null,isActive:!1,$button:null,speed:3e3,init:function(){var t=this;t.$button=t.instance.$refs.toolbar.find("[data-fancybox-play]").on("click",function(){t.toggle()}),(t.instance.group.length<2||!t.instance.group[t.instance.currIndex].opts.slideShow)&&t.$button.hide()},set:function(){var t=this;t.instance&&t.instance.current&&(t.instance.current.opts.loop||t.instance.currIndex1&&t.instance.group[t.instance.currIndex].opts.thumbs&&("image"==e.type||e.opts.thumb||e.opts.$thumb)&&("image"==n.type||n.opts.thumb||n.opts.$thumb)?(t.$button.on("click",function(){t.toggle()}),t.isActive=!0):(t.$button.hide(),t.isActive=!1)},create:function(){var t,n,o=this.instance;this.$grid=e('
').appendTo(o.$refs.container),t="
    ",e.each(o.group,function(e,o){n=o.opts.thumb||(o.opts.$thumb?o.opts.$thumb.attr("src"):null),n||"image"!==o.type||(n=o.src),n&&n.length&&(t+='
  • ')}),t+="
",this.$list=e(t).appendTo(this.$grid).on("click","li",function(){o.jumpTo(e(this).data("index"))}),this.$list.find("img").hide().one("load",function(){var t,n,o,i,a=e(this).parent().removeClass("fancybox-thumbs-loading"),s=a.outerWidth(),r=a.outerHeight();t=this.naturalWidth||this.width,n=this.naturalHeight||this.height,o=t/s,i=n/r,o>=1&&i>=1&&(o>i?(t/=i,n=r):(t=s,n/=o)),e(this).css({width:Math.floor(t),height:Math.floor(n),"margin-top":Math.min(0,Math.floor(.3*r-.3*n)),"margin-left":Math.min(0,Math.floor(.5*s-.5*t))}).show()}).each(function(){this.src=e(this).data("src")})},focus:function(){this.instance.current&&this.$list.children().removeClass("fancybox-thumbs-active").filter('[data-index="'+this.instance.current.index+'"]').addClass("fancybox-thumbs-active").focus()},close:function(){this.$grid.hide()},update:function(){this.instance.$refs.container.toggleClass("fancybox-show-thumbs",this.isVisible),this.isVisible?(this.$grid||this.create(),this.instance.trigger("onThumbsShow"),this.focus()):this.$grid&&this.instance.trigger("onThumbsHide"),this.instance.update()},hide:function(){this.isVisible=!1,this.update()},show:function(){this.isVisible=!0,this.update()},toggle:function(){this.isVisible=!this.isVisible,this.update()}}),e(t).on({"onInit.fb":function(t,e){e&&!e.Thumbs&&(e.Thumbs=new n(e))},"beforeShow.fb":function(t,e,n,o){var i=e&&e.Thumbs;if(i&&i.isActive){if(n.modal)return i.$button.hide(),void i.hide();o&&n.opts.thumbs.autoStart===!0&&i.show(),i.isVisible&&i.focus()}},"afterKeydown.fb":function(t,e,n,o,i){var a=e&&e.Thumbs;a&&a.isActive&&71===i&&(o.preventDefault(),a.toggle())},"beforeClose.fb":function(t,e){var n=e&&e.Thumbs;n&&n.isVisible&&e.opts.thumbs.hideOnClose!==!1&&n.close()}})}(document,window.jQuery),function(t,e,n){"use strict";function o(){var t=e.location.hash.substr(1),n=t.split("-"),o=n.length>1&&/^\+?\d+$/.test(n[n.length-1])?parseInt(n.pop(-1),10)||1:1,i=n.join("-");return o<1&&(o=1),{hash:t,index:o,gallery:i}}function i(t){var e;""!==t.gallery&&(e=n("[data-fancybox='"+n.escapeSelector(t.gallery)+"']").eq(t.index-1),e.length||(e=n("#"+n.escapeSelector(t.gallery))),e.length&&(s=!1,e.trigger("click")))}function a(t){var e;return!!t&&(e=t.current?t.current.opts:t.opts,e.hash||(e.$orig?e.$orig.data("fancybox"):""))}n.escapeSelector||(n.escapeSelector=function(t){var e=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\x80-\uFFFF\w-]/g,n=function(t,e){return e?"\0"===t?"�":t.slice(0,-1)+"\\"+t.charCodeAt(t.length-1).toString(16)+" ":"\\"+t};return(t+"").replace(e,n)});var s=!0,r=null,c=null;n(function(){setTimeout(function(){n.fancybox.defaults.hash!==!1&&(n(t).on({"onInit.fb":function(t,e){var n,i;e.group[e.currIndex].opts.hash!==!1&&(n=o(),i=a(e),i&&n.gallery&&i==n.gallery&&(e.currIndex=n.index-1))},"beforeShow.fb":function(n,o,i){var l;i&&i.opts.hash!==!1&&(l=a(o),l&&""!==l&&(e.location.hash.indexOf(l)<0&&(o.opts.origHash=e.location.hash),r=l+(o.group.length>1?"-"+(i.index+1):""),"replaceState"in e.history?(c&&clearTimeout(c),c=setTimeout(function(){e.history[s?"pushState":"replaceState"]({},t.title,e.location.pathname+e.location.search+"#"+r),c=null,s=!1},300)):e.location.hash=r))},"beforeClose.fb":function(o,i,s){var l,u;c&&clearTimeout(c),s.opts.hash!==!1&&(l=a(i),u=i&&i.opts.origHash?i.opts.origHash:"",l&&""!==l&&("replaceState"in history?e.history.replaceState({},t.title,e.location.pathname+e.location.search+u):(e.location.hash=u,n(e).scrollTop(i.scrollTop).scrollLeft(i.scrollLeft))),r=null)}}),n(e).on("hashchange.fb",function(){var t=o();n.fancybox.getInstance()?!r||r===t.gallery+"-"+t.index||1===t.index&&r==t.gallery||(r=null,n.fancybox.close()):""!==t.gallery&&i(t)}),i(o()))},50)})}(document,window,window.jQuery); \ No newline at end of file +!function(t,e,n,o){"use strict";function i(t){var e=n(t.currentTarget),o=t.data?t.data.options:{},i=e.attr("data-fancybox")||"",a=0,s=[];t.isDefaultPrevented()||(t.preventDefault(),i?(s=o.selector?n(o.selector):t.data?t.data.items:[],s=s.length?s.filter('[data-fancybox="'+i+'"]'):n('[data-fancybox="'+i+'"]'),a=s.index(e),a<0&&(a=0)):s=[e],n.fancybox.open(s,o,a))}if(n){if(n.fn.fancybox)return void("console"in t&&console.log("fancyBox already initialized"));var a={loop:!1,margin:[44,0],gutter:50,keyboard:!0,arrows:!0,infobar:!0,toolbar:!0,buttons:["slideShow","fullScreen","thumbs","share","close"],idleTime:3,smallBtn:"auto",protect:!1,modal:!1,image:{preload:"auto"},ajax:{settings:{data:{fancybox:!0}}},iframe:{tpl:'',preload:!0,css:{},attr:{scrolling:"auto"}},animationEffect:"zoom",animationDuration:500,zoomOpacity:"auto",transitionEffect:"fade",transitionDuration:366,slideClass:"",baseClass:"",baseTpl:'',spinnerTpl:'
',errorTpl:'

{{ERROR}}

',btnTpl:{download:'',close:'',smallBtn:'',arrowLeft:'',arrowRight:''},parentEl:"body",autoFocus:!1,backFocus:!0,trapFocus:!0,fullScreen:{autoStart:!1},touch:{vertical:!0,momentum:!0},hash:null,media:{},slideShow:{autoStart:!1,speed:4e3},thumbs:{autoStart:!1,hideOnClose:!0},onInit:n.noop,beforeLoad:n.noop,afterLoad:n.noop,beforeShow:n.noop,afterShow:n.noop,beforeClose:n.noop,afterClose:n.noop,onActivate:n.noop,onDeactivate:n.noop,clickContent:function(t,e){return"image"===t.type&&"zoom"},clickSlide:"close",clickOutside:"close",dblclickContent:!1,dblclickSlide:!1,dblclickOutside:!1,mobile:{clickContent:function(t,e){return"image"===t.type&&"toggleControls"},clickSlide:function(t,e){return"image"===t.type?"toggleControls":"close"},dblclickContent:function(t,e){return"image"===t.type&&"zoom"},dblclickSlide:function(t,e){return"image"===t.type&&"zoom"}},lang:"en",i18n:{en:{CLOSE:"Close",NEXT:"Next",PREV:"Previous",ERROR:"The requested content cannot be loaded.
Please try again later.",PLAY_START:"Start slideshow",PLAY_STOP:"Pause slideshow",FULL_SCREEN:"Full screen",THUMBS:"Thumbnails",DOWNLOAD:"Download",SHARE:"Share"},de:{CLOSE:"Schliessen",NEXT:"Weiter",PREV:"Zurück",ERROR:"Die angeforderten Daten konnten nicht geladen werden.
Bitte versuchen Sie es später nochmal.",PLAY_START:"Diaschau starten",PLAY_STOP:"Diaschau beenden",FULL_SCREEN:"Vollbild",THUMBS:"Vorschaubilder",DOWNLOAD:"Herunterladen",SHARE:"Teilen"}}},s=n(t),r=n(e),c=0,l=function(t){return t&&t.hasOwnProperty&&t instanceof n},u=function(){return t.requestAnimationFrame||t.webkitRequestAnimationFrame||t.mozRequestAnimationFrame||t.oRequestAnimationFrame||function(e){return t.setTimeout(e,1e3/60)}}(),d=function(){var t,n=e.createElement("fakeelement"),i={transition:"transitionend",OTransition:"oTransitionEnd",MozTransition:"transitionend",WebkitTransition:"webkitTransitionEnd"};for(t in i)if(n.style[t]!==o)return i[t]}(),f=function(t){return t&&t.length&&t[0].offsetHeight},h=function(t,o,i){var s=this;s.opts=n.extend(!0,{index:i},a,o||{}),n.fancybox.isMobile&&(s.opts=n.extend(!0,{},s.opts,s.opts.mobile)),o&&n.isArray(o.buttons)&&(s.opts.buttons=o.buttons),s.id=s.opts.id||++c,s.group=[],s.currIndex=parseInt(s.opts.index,10)||0,s.prevIndex=null,s.prevPos=null,s.currPos=0,s.firstRun=null,s.createGroup(t),s.group.length&&(s.$lastFocus=n(e.activeElement).blur(),s.slides={},s.init(t))};n.extend(h.prototype,{init:function(){var i,a,s,c=this,l=c.group[c.currIndex],u=l.opts,d=n.fancybox.scrollbarWidth;c.scrollTop=r.scrollTop(),c.scrollLeft=r.scrollLeft(),n.fancybox.getInstance()||(n("body").addClass("fancybox-active"),/iPad|iPhone|iPod/.test(navigator.userAgent)&&!t.MSStream?"image"!==l.type&&n("body").css("top",n("body").scrollTop()*-1).addClass("fancybox-iosfix"):!n.fancybox.isMobile&&e.body.scrollHeight>t.innerHeight&&(d===o&&(i=n('
').appendTo("body"),d=n.fancybox.scrollbarWidth=i[0].offsetWidth-i[0].clientWidth,i.remove()),n("head").append('"),n("body").addClass("compensate-for-scrollbar"))),s="",n.each(u.buttons,function(t,e){s+=u.btnTpl[e]||""}),a=n(c.translate(c,u.baseTpl.replace("{{buttons}}",s).replace("{{arrows}}",u.btnTpl.arrowLeft+u.btnTpl.arrowRight))).attr("id","fancybox-container-"+c.id).addClass("fancybox-is-hidden").addClass(u.baseClass).data("FancyBox",c).prependTo(u.parentEl),c.$refs={container:a},["bg","inner","infobar","toolbar","stage","caption"].forEach(function(t){c.$refs[t]=a.find(".fancybox-"+t)}),c.trigger("onInit"),c.activate(),c.jumpTo(c.currIndex)},translate:function(t,e){var n=t.opts.i18n[t.opts.lang];return e.replace(/\{\{(\w+)\}\}/g,function(t,e){var i=n[e];return i===o?t:i})},createGroup:function(t){var e=this,i=n.makeArray(t);n.each(i,function(t,i){var a,s,r,c,l={},u={};n.isPlainObject(i)?(l=i,u=i.opts||i):"object"===n.type(i)&&n(i).length?(a=n(i),u=a.data(),u=n.extend({},u,u.options||{}),u.$orig=a,l.src=u.src||a.attr("href"),l.type||l.src||(l.type="inline",l.src=i)):l={type:"html",src:i+""},l.opts=n.extend(!0,{},e.opts,u),n.isArray(u.buttons)&&(l.opts.buttons=u.buttons),s=l.type||l.opts.type,r=l.src||"",!s&&r&&(r.match(/(^data:image\/[a-z0-9+\/=]*,)|(\.(jp(e|g|eg)|gif|png|bmp|webp|svg|ico)((\?|#).*)?$)/i)?s="image":r.match(/\.(pdf)((\?|#).*)?$/i)?s="pdf":"#"===r.charAt(0)&&(s="inline")),l.type=s,l.index=e.group.length,l.opts.$orig&&!l.opts.$orig.length&&delete l.opts.$orig,!l.opts.$thumb&&l.opts.$orig&&(l.opts.$thumb=l.opts.$orig.find("img:first")),l.opts.$thumb&&!l.opts.$thumb.length&&delete l.opts.$thumb,"function"===n.type(e.opts.caption)&&(l.opts.caption=e.opts.caption.apply(i,[e,l])),!l.opts.caption instanceof jQuery&&(l.opts.caption=l.opts.caption===o?"":l.opts.caption+""),"ajax"===s&&(c=r.split(/\s+/,2),c.length>1&&(l.src=c.shift(),l.opts.filter=c.shift())),"auto"==l.opts.smallBtn&&(n.inArray(s,["html","inline","ajax"])>-1?(l.opts.toolbar=!1,l.opts.smallBtn=!0):l.opts.smallBtn=!1),"pdf"===s&&(l.type="iframe",l.opts.iframe.preload=!1),l.opts.modal&&(l.opts=n.extend(!0,l.opts,{infobar:0,toolbar:0,smallBtn:0,keyboard:0,slideShow:0,fullScreen:0,thumbs:0,touch:0,clickContent:!1,clickSlide:!1,clickOutside:!1,dblclickContent:!1,dblclickSlide:!1,dblclickOutside:!1})),e.group.push(l)})},addEvents:function(){var o=this;o.removeEvents(),o.$refs.container.on("click.fb-close","[data-fancybox-close]",function(t){t.stopPropagation(),t.preventDefault(),o.close(t)}).on("click.fb-prev touchend.fb-prev","[data-fancybox-prev]",function(t){t.stopPropagation(),t.preventDefault(),o.previous()}).on("click.fb-next touchend.fb-next","[data-fancybox-next]",function(t){t.stopPropagation(),t.preventDefault(),o.next()}),s.on("orientationchange.fb resize.fb",function(t){t&&t.originalEvent&&"resize"===t.originalEvent.type?u(function(){o.update()}):(o.$refs.stage.hide(),setTimeout(function(){o.$refs.stage.show(),o.update()},600))}),r.on("focusin.fb",function(t){var i=n.fancybox?n.fancybox.getInstance():null;i.isClosing||!i.current||!i.current.opts.trapFocus||n(t.target).hasClass("fancybox-container")||n(t.target).is(e)||i&&"fixed"!==n(t.target).css("position")&&!i.$refs.container.has(t.target).length&&(t.stopPropagation(),i.focus(),s.scrollTop(o.scrollTop).scrollLeft(o.scrollLeft))}),r.on("keydown.fb",function(t){var e=o.current,i=t.keyCode||t.which;if(e&&e.opts.keyboard&&!n(t.target).is("input")&&!n(t.target).is("textarea"))return 8===i||27===i?(t.preventDefault(),void o.close(t)):37===i||38===i?(t.preventDefault(),void o.previous()):39===i||40===i?(t.preventDefault(),void o.next()):void o.trigger("afterKeydown",t,i)}),o.group[o.currIndex].opts.idleTime&&(o.idleSecondsCounter=0,r.on("mousemove.fb-idle mouseleave.fb-idle mousedown.fb-idle touchstart.fb-idle touchmove.fb-idle scroll.fb-idle keydown.fb-idle",function(t){o.idleSecondsCounter=0,o.isIdle&&o.showControls(),o.isIdle=!1}),o.idleInterval=t.setInterval(function(){o.idleSecondsCounter++,o.idleSecondsCounter>=o.group[o.currIndex].opts.idleTime&&(o.isIdle=!0,o.idleSecondsCounter=0,o.hideControls())},1e3))},removeEvents:function(){var e=this;s.off("orientationchange.fb resize.fb"),r.off("focusin.fb keydown.fb .fb-idle"),this.$refs.container.off(".fb-close .fb-prev .fb-next"),e.idleInterval&&(t.clearInterval(e.idleInterval),e.idleInterval=null)},previous:function(t){return this.jumpTo(this.currPos-1,t)},next:function(t){return this.jumpTo(this.currPos+1,t)},jumpTo:function(t,e,i){var a,s,r,c,l,u,d,h=this,p=h.group.length;if(!(h.isSliding||h.isClosing||h.isAnimating&&h.firstRun)){if(t=parseInt(t,10),s=h.current?h.current.opts.loop:h.opts.loop,!s&&(t<0||t>=p))return!1;if(a=h.firstRun=null===h.firstRun,!(p<2&&!a&&h.isSliding)){if(c=h.current,h.prevIndex=h.currIndex,h.prevPos=h.currPos,r=h.createSlide(t),p>1&&((s||r.index>0)&&h.createSlide(t-1),(s||r.indexr.pos?"next":"previous"),c.$slide.removeClass("fancybox-slide--complete fancybox-slide--current fancybox-slide--next fancybox-slide--previous"),c.isComplete=!1,e&&(r.isMoved||r.opts.transitionEffect)&&(r.isMoved?c.$slide.addClass(d):(d="fancybox-animated "+d+" fancybox-fx-"+r.opts.transitionEffect,n.fancybox.animate(c.$slide,d,e,function(){c.$slide.removeClass(d).removeAttr("style")}))))}}},createSlide:function(t){var e,o,i=this;return o=t%i.group.length,o=o<0?i.group.length+o:o,!i.slides[t]&&i.group[o]&&(e=n('
').appendTo(i.$refs.stage),i.slides[t]=n.extend(!0,{},i.group[o],{pos:t,$slide:e,isLoaded:!1}),i.updateSlide(i.slides[t])),i.slides[t]},scaleToActual:function(t,e,i){var a,s,r,c,l,u=this,d=u.current,f=d.$content,h=parseInt(d.$slide.width(),10),p=parseInt(d.$slide.height(),10),g=d.width,b=d.height;"image"!=d.type||d.hasError||!f||u.isAnimating||(n.fancybox.stop(f),u.isAnimating=!0,t=t===o?.5*h:t,e=e===o?.5*p:e,a=n.fancybox.getTranslate(f),c=g/a.width,l=b/a.height,s=.5*h-.5*g,r=.5*p-.5*b,g>h&&(s=a.left*c-(t*c-t),s>0&&(s=0),sp&&(r=a.top*l-(e*l-e),r>0&&(r=0),rt.width||o.height>t.height))},isScaledDown:function(){var t=this,e=t.current,o=e.$content,i=!1;return o&&(i=n.fancybox.getTranslate(o),i=i.width1||Math.abs(n.height()-o.height)>1),o},loadSlide:function(t){var e,o,i,a=this;if(!t.isLoading&&!t.isLoaded){switch(t.isLoading=!0,a.trigger("beforeLoad",t),e=t.type,o=t.$slide,o.off("refresh").trigger("onReset").addClass("fancybox-slide--"+(e||"unknown")).addClass(t.opts.slideClass),e){case"image":a.setImage(t);break;case"iframe":a.setIframe(t);break;case"html":a.setContent(t,t.src||t.content);break;case"inline":n(t.src).length?a.setContent(t,n(t.src)):a.setError(t);break;case"ajax":a.showLoading(t),i=n.ajax(n.extend({},t.opts.ajax.settings,{url:t.src,success:function(e,n){"success"===n&&a.setContent(t,e)},error:function(e,n){e&&"abort"!==n&&a.setError(t)}})),o.one("onReset",function(){i.abort()});break;default:a.setError(t)}return!0}},setImage:function(e){var o,i,a,s,r=this,c=e.opts.srcset||e.opts.image.srcset;if(c){a=t.devicePixelRatio||1,s=t.innerWidth*a,i=c.split(",").map(function(t){var e={};return t.trim().split(/\s+/).forEach(function(t,n){var o=parseInt(t.substring(0,t.length-1),10);return 0===n?e.url=t:void(o&&(e.value=o,e.postfix=t[t.length-1]))}),e}),i.sort(function(t,e){return t.value-e.value});for(var l=0;l=s||"x"===u.postfix&&u.value>=a){o=u;break}}!o&&i.length&&(o=i[i.length-1]),o&&(e.src=o.url,e.width&&e.height&&"w"==o.postfix&&(e.height=e.width/e.height*o.value,e.width=o.value))}e.$content=n('
').addClass("fancybox-is-hidden").appendTo(e.$slide),e.opts.preload!==!1&&e.opts.width&&e.opts.height&&(e.opts.thumb||e.opts.$thumb)?(e.width=e.opts.width,e.height=e.opts.height,e.$ghost=n("").one("error",function(){n(this).remove(),e.$ghost=null,r.setBigImage(e)}).one("load",function(){r.afterLoad(e),r.setBigImage(e)}).addClass("fancybox-image").appendTo(e.$content).attr("src",e.opts.thumb||e.opts.$thumb.attr("src"))):r.setBigImage(e)},setBigImage:function(t){var e=this,o=n("");t.$image=o.one("error",function(){e.setError(t)}).one("load",function(){clearTimeout(t.timouts),t.timouts=null,e.isClosing||(t.width=this.naturalWidth,t.height=this.naturalHeight,t.opts.image.srcset&&o.attr("sizes","100vw").attr("srcset",t.opts.image.srcset),e.hideLoading(t),t.$ghost?t.timouts=setTimeout(function(){t.timouts=null,t.$ghost.hide()},Math.min(300,Math.max(1e3,t.height/1600))):e.afterLoad(t))}).addClass("fancybox-image").attr("src",t.src).appendTo(t.$content),(o[0].complete||"complete"==o[0].readyState)&&o[0].naturalWidth&&o[0].naturalHeight?o.trigger("load"):o[0].error?o.trigger("error"):t.timouts=setTimeout(function(){o[0].complete||t.hasError||e.showLoading(t)},100)},setIframe:function(t){var e,i=this,a=t.opts.iframe,s=t.$slide;t.$content=n('
').css(a.css).appendTo(s),e=n(a.tpl.replace(/\{rnd\}/g,(new Date).getTime())).attr(a.attr).appendTo(t.$content),a.preload?(i.showLoading(t),e.on("load.fb error.fb",function(e){this.isReady=1,t.$slide.trigger("refresh"),i.afterLoad(t)}),s.on("refresh.fb",function(){var n,i,s,r=t.$content,c=a.css.width,l=a.css.height;if(1===e[0].isReady){try{i=e.contents(),s=i.find("body")}catch(t){}s&&s.length&&(c===o&&(n=e[0].contentWindow.document.documentElement.scrollWidth,c=Math.ceil(s.outerWidth(!0)+(r.width()-n)),c+=r.outerWidth()-r.innerWidth()),l===o&&(l=Math.ceil(s.outerHeight(!0)),l+=r.outerHeight()-r.innerHeight()),c&&r.width(c),l&&r.height(l)),r.removeClass("fancybox-is-hidden")}})):this.afterLoad(t),e.attr("src",t.src),t.opts.smallBtn===!0&&t.$content.prepend(i.translate(t,t.opts.btnTpl.smallBtn)),s.one("onReset",function(){try{n(this).find("iframe").hide().attr("src","//about:blank")}catch(t){}n(this).empty(),t.isLoaded=!1})},setContent:function(t,e){var o=this;o.isClosing||(o.hideLoading(t),t.$slide.empty(),l(e)&&e.parent().length?(e.parent(".fancybox-slide--inline").trigger("onReset"),t.$placeholder=n("
").hide().insertAfter(e),e.css("display","inline-block")):t.hasError||("string"===n.type(e)&&(e=n("
").append(n.trim(e)).contents(),3===e[0].nodeType&&(e=n("
").html(e))),t.opts.filter&&(e=n("
").html(e).find(t.opts.filter))),t.$slide.one("onReset",function(){t.$placeholder&&(t.$placeholder.after(e.hide()).remove(),t.$placeholder=null),t.$smallBtn&&(t.$smallBtn.remove(),t.$smallBtn=null),t.hasError||(n(this).empty(),t.isLoaded=!1)}),t.$content=n(e).appendTo(t.$slide),t.opts.smallBtn&&!t.$smallBtn&&(t.$smallBtn=n(o.translate(t,t.opts.btnTpl.smallBtn)).appendTo(t.$content.filter("div").first())),this.afterLoad(t))},setError:function(t){t.hasError=!0,t.$slide.removeClass("fancybox-slide--"+t.type),this.setContent(t,this.translate(t,t.opts.errorTpl))},showLoading:function(t){var e=this;t=t||e.current,t&&!t.$spinner&&(t.$spinner=n(e.opts.spinnerTpl).appendTo(t.$slide))},hideLoading:function(t){var e=this;t=t||e.current,t&&t.$spinner&&(t.$spinner.remove(),delete t.$spinner)},afterLoad:function(t){var e=this;e.isClosing||(t.isLoading=!1,t.isLoaded=!0,e.trigger("afterLoad",t),e.hideLoading(t),t.opts.protect&&t.$content&&!t.hasError&&(t.$content.on("contextmenu.fb",function(t){return 2==t.button&&t.preventDefault(),!0}),"image"===t.type&&n('
').appendTo(t.$content)),e.revealContent(t))},revealContent:function(t){var e,i,a,s,r,c=this,l=t.$slide,u=!1;return e=t.opts[c.firstRun?"animationEffect":"transitionEffect"],a=t.opts[c.firstRun?"animationDuration":"transitionDuration"],a=parseInt(t.forcedDuration===o?a:t.forcedDuration,10),!t.isMoved&&t.pos===c.currPos&&a||(e=!1),"zoom"!==e||t.pos===c.currPos&&a&&"image"===t.type&&!t.hasError&&(u=c.getThumbPos(t))||(e="fade"),"zoom"===e?(r=c.getFitPos(t),r.scaleX=r.width/u.width,r.scaleY=r.height/u.height,delete r.width,delete r.height,s=t.opts.zoomOpacity,"auto"==s&&(s=Math.abs(t.width/t.height-u.width/u.height)>.1),s&&(u.opacity=.1,r.opacity=1),n.fancybox.setTranslate(t.$content.removeClass("fancybox-is-hidden"),u),f(t.$content),void n.fancybox.animate(t.$content,r,a,function(){c.complete()})):(c.updateSlide(t),e?(n.fancybox.stop(l),i="fancybox-animated fancybox-slide--"+(t.pos>=c.prevPos?"next":"previous")+" fancybox-fx-"+e,l.removeAttr("style").removeClass("fancybox-slide--current fancybox-slide--next fancybox-slide--previous").addClass(i),t.$content.removeClass("fancybox-is-hidden"),f(l),void n.fancybox.animate(l,"fancybox-slide--current",a,function(e){l.removeClass(i).removeAttr("style"),t.pos===c.currPos&&c.complete()},!0)):(f(l),t.$content.removeClass("fancybox-is-hidden"),void(t.pos===c.currPos&&c.complete())))},getThumbPos:function(o){var i,a=this,s=!1,r=function(e){for(var o,i=e[0],a=i.getBoundingClientRect(),s=[];null!==i.parentElement;)"hidden"!==n(i.parentElement).css("overflow")&&"auto"!==n(i.parentElement).css("overflow")||s.push(i.parentElement.getBoundingClientRect()),i=i.parentElement;return o=s.every(function(t){var e=Math.min(a.right,t.right)-Math.max(a.left,t.left),n=Math.min(a.bottom,t.bottom)-Math.max(a.top,t.top);return e>0&&n>0}),o&&a.bottom>0&&a.right>0&&a.left=t.currPos-1&&o.pos<=t.currPos+1?i[o.pos]=o:o&&(n.fancybox.stop(o.$slide),o.$slide.off().remove())}),t.slides=i,t.updateCursor(),t.trigger("afterShow"),(n(e.activeElement).is("[disabled]")||o.opts.autoFocus&&"image"!=o.type&&"iframe"!==o.type)&&t.focus())},preload:function(){var t,e,n=this;n.group.length<2||(t=n.slides[n.currPos+1],e=n.slides[n.currPos-1],t&&"image"===t.type&&n.loadSlide(t),e&&"image"===e.type&&n.loadSlide(e))},focus:function(){var t,e=this.current;this.isClosing||(e&&e.isComplete&&(t=e.$slide.find("input[autofocus]:enabled:visible:first"),t.length||(t=e.$slide.find("button,:input,[tabindex],a").filter(":enabled:visible:first"))),t=t&&t.length?t:this.$refs.container,t.focus())},activate:function(){var t=this;n(".fancybox-container").each(function(){var e=n(this).data("FancyBox");e&&e.id!==t.id&&!e.isClosing&&e.trigger("onDeactivate")}),(t.current||t.isIdle)&&(t.$refs.container.index()>0&&t.$refs.container.prependTo(e.body),t.update(),t.updateControls()),t.trigger("onActivate"),t.addEvents()},close:function(t,e){var o,i,a,s,r,c,l=this,f=l.current,h=function(){l.cleanUp(t)};return!l.isClosing&&(l.isClosing=!0,l.trigger("beforeClose",t)===!1?(l.isClosing=!1,u(function(){l.update()}),!1):(l.removeEvents(),f.timouts&&clearTimeout(f.timouts),a=f.$content,o=f.opts.animationEffect,i=n.isNumeric(e)?e:o?f.opts.animationDuration:0,f.$slide.off(d).removeClass("fancybox-slide--complete fancybox-slide--next fancybox-slide--previous fancybox-animated"),f.$slide.siblings().trigger("onReset").remove(),i&&l.$refs.container.removeClass("fancybox-is-open").addClass("fancybox-is-closing"),l.hideLoading(f),l.hideControls(),l.updateCursor(),"zoom"!==o||t!==!0&&a&&i&&"image"===f.type&&!f.hasError&&(c=l.getThumbPos(f))||(o="fade"),"zoom"===o?(n.fancybox.stop(a),r=n.fancybox.getTranslate(a),r.width=r.width*r.scaleX,r.height=r.height*r.scaleY,s=f.opts.zoomOpacity,"auto"==s&&(s=Math.abs(f.width/f.height-c.width/c.height)>.1),s&&(c.opacity=0),r.scaleX=r.width/c.width,r.scaleY=r.height/c.height,r.width=c.width,r.height=c.height,n.fancybox.setTranslate(f.$content,r),n.fancybox.animate(f.$content,c,i,h),!0):(o&&i?t===!0?setTimeout(h,i):n.fancybox.animate(f.$slide.removeClass("fancybox-slide--current"),"fancybox-animated fancybox-slide--previous fancybox-fx-"+o,i,h):h(),!0)))},cleanUp:function(t){var o,i,a=this,r=n("body");a.current.$slide.trigger("onReset"),a.$refs.container.empty().remove(),a.trigger("afterClose",t),a.$lastFocus&&a.current.opts.backFocus&&a.$lastFocus.focus(),a.current=null,o=n.fancybox.getInstance(),o?o.activate():(s.scrollTop(a.scrollTop).scrollLeft(a.scrollLeft),r.removeClass("fancybox-active compensate-for-scrollbar"),r.hasClass("fancybox-iosfix")&&(i=parseInt(e.body.style.top,10),r.removeClass("fancybox-iosfix").css("top","").scrollTop(i*-1)),n("#fancybox-style-noscroll").remove())},trigger:function(t,e){var o,i=Array.prototype.slice.call(arguments,1),a=this,s=e&&e.opts?e:a.current;return s?i.unshift(s):s=a,i.unshift(a),n.isFunction(s.opts[t])&&(o=s.opts[t].apply(s,i)),o===!1?o:void("afterClose"===t?r.trigger(t+".fb",i):a.$refs.container.trigger(t+".fb",i))},updateControls:function(t){var e=this,o=e.current,i=o.index,a=o.opts.caption,s=e.$refs.caption;o.$slide.trigger("refresh"),e.$caption=a&&a.length?s.html(a):null,e.isHiddenControls||e.isIdle||e.showControls(),n("[data-fancybox-count]").html(e.group.length),n("[data-fancybox-index]").html(i+1),n("[data-fancybox-prev]").prop("disabled",!o.opts.loop&&i<=0),n("[data-fancybox-next]").prop("disabled",!o.opts.loop&&i>=e.group.length-1),"image"===o.type?n("[data-fancybox-download]").attr("href",o.opts.image.src||o.src):n("[data-fancybox-download]").hide()},hideControls:function(){this.isHiddenControls=!0,this.$refs.container.removeClass("fancybox-show-infobar fancybox-show-toolbar fancybox-show-caption fancybox-show-nav")},showControls:function(){var t=this,e=t.current?t.current.opts:t.opts,n=t.$refs.container;t.isHiddenControls=!1,t.idleSecondsCounter=0,n.toggleClass("fancybox-show-toolbar",!(!e.toolbar||!e.buttons)).toggleClass("fancybox-show-infobar",!!(e.infobar&&t.group.length>1)).toggleClass("fancybox-show-nav",!!(e.arrows&&t.group.length>1)).toggleClass("fancybox-is-modal",!!e.modal),t.$caption?n.addClass("fancybox-show-caption "):n.removeClass("fancybox-show-caption")},toggleControls:function(){this.isHiddenControls?this.showControls():this.hideControls()}}),n.fancybox={version:"3.2.0",defaults:a,getInstance:function(t){var e=n('.fancybox-container:not(".fancybox-is-closing"):first').data("FancyBox"),o=Array.prototype.slice.call(arguments,1);return e instanceof h&&("string"===n.type(t)?e[t].apply(e,o):"function"===n.type(t)&&t.apply(e,o),e)},open:function(t,e,n){return new h(t,e,n)},close:function(t){var e=this.getInstance();e&&(e.close(),t===!0&&this.close())},destroy:function(){this.close(!0),r.off("click.fb-start")},isMobile:e.createTouch!==o&&/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent),use3d:function(){var n=e.createElement("div");return t.getComputedStyle&&t.getComputedStyle(n).getPropertyValue("transform")&&!(e.documentMode&&e.documentMode<11)}(),getTranslate:function(t){var e;if(!t||!t.length)return!1;if(e=t.eq(0).css("transform"),e&&e.indexOf("matrix")!==-1?(e=e.split("(")[1],e=e.split(")")[0],e=e.split(",")):e=[],e.length)e=e.length>10?[e[13],e[12],e[0],e[5]]:[e[5],e[4],e[0],e[3]],e=e.map(parseFloat);else{e=[0,0,1,1];var n=/\.*translate\((.*)px,(.*)px\)/i,o=n.exec(t.eq(0).attr("style"));o&&(e[0]=parseFloat(o[2]),e[1]=parseFloat(o[1]))}return{top:e[0],left:e[1],scaleX:e[2],scaleY:e[3],opacity:parseFloat(t.css("opacity")),width:t.width(),height:t.height()}},setTranslate:function(t,e){var n="",i={};if(t&&e)return e.left===o&&e.top===o||(n=(e.left===o?t.position().left:e.left)+"px, "+(e.top===o?t.position().top:e.top)+"px",n=this.use3d?"translate3d("+n+", 0px)":"translate("+n+")"),e.scaleX!==o&&e.scaleY!==o&&(n=(n.length?n+" ":"")+"scale("+e.scaleX+", "+e.scaleY+")"),n.length&&(i.transform=n),e.opacity!==o&&(i.opacity=e.opacity),e.width!==o&&(i.width=e.width),e.height!==o&&(i.height=e.height),t.css(i)},animate:function(t,e,i,a,s){var r=d||"transitionend";n.isFunction(i)&&(a=i,i=null),n.isPlainObject(e)||t.removeAttr("style"),t.on(r,function(i){(!i||!i.originalEvent||t.is(i.originalEvent.target)&&"z-index"!=i.originalEvent.propertyName)&&(t.off(r),n.isPlainObject(e)?e.scaleX!==o&&e.scaleY!==o&&(t.css("transition-duration","0ms"),e.width=Math.round(t.width()*e.scaleX),e.height=Math.round(t.height()*e.scaleY),e.scaleX=1,e.scaleY=1,n.fancybox.setTranslate(t,e)):s!==!0&&t.removeClass(e),n.isFunction(a)&&a(i))}),n.isNumeric(i)&&t.css("transition-duration",i+"ms"),n.isPlainObject(e)?n.fancybox.setTranslate(t,e):t.addClass(e),t.data("timer",setTimeout(function(){t.trigger("transitionend")},i+16))},stop:function(t){clearTimeout(t.data("timer")),t.off(d)}},n.fn.fancybox=function(t){var e;return t=t||{},e=t.selector||!1,e?n("body").off("click.fb-start",e).on("click.fb-start",e,{options:t},i):this.off("click.fb-start").on("click.fb-start",{items:this,options:t},i),this},r.on("click.fb-start","[data-fancybox]",i)}}(window,document,window.jQuery||jQuery),function(t){"use strict";var e=function(e,n,o){if(e)return o=o||"","object"===t.type(o)&&(o=t.param(o,!0)),t.each(n,function(t,n){e=e.replace("$"+t,n||"")}),o.length&&(e+=(e.indexOf("?")>0?"&":"?")+o),e},n={youtube:{matcher:/(youtube\.com|youtu\.be|youtube\-nocookie\.com)\/(watch\?(.*&)?v=|v\/|u\/|embed\/?)?(videoseries\?list=(.*)|[\w-]{11}|\?listType=(.*)&list=(.*))(.*)/i,params:{autoplay:1,autohide:1,fs:1,rel:0,hd:1,wmode:"transparent",enablejsapi:1,html5:1},paramPlace:8,type:"iframe",url:"//www.youtube.com/embed/$4",thumb:"//img.youtube.com/vi/$4/hqdefault.jpg"},vimeo:{matcher:/^.+vimeo.com\/(.*\/)?([\d]+)(.*)?/,params:{autoplay:1,hd:1,show_title:1,show_byline:1,show_portrait:0,fullscreen:1,api:1},paramPlace:3,type:"iframe",url:"//player.vimeo.com/video/$2"},metacafe:{matcher:/metacafe.com\/watch\/(\d+)\/(.*)?/,type:"iframe",url:"//www.metacafe.com/embed/$1/?ap=1"},dailymotion:{matcher:/dailymotion.com\/video\/(.*)\/?(.*)/,params:{additionalInfos:0,autoStart:1},type:"iframe",url:"//www.dailymotion.com/embed/video/$1"},vine:{matcher:/vine.co\/v\/([a-zA-Z0-9\?\=\-]+)/,type:"iframe",url:"//vine.co/v/$1/embed/simple"},instagram:{matcher:/(instagr\.am|instagram\.com)\/p\/([a-zA-Z0-9_\-]+)\/?/i,type:"image",url:"//$1/p/$2/media/?size=l"},gmap_place:{matcher:/(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(((maps\/(place\/(.*)\/)?\@(.*),(\d+.?\d+?)z))|(\?ll=))(.*)?/i,type:"iframe",url:function(t){return"//maps.google."+t[2]+"/?ll="+(t[9]?t[9]+"&z="+Math.floor(t[10])+(t[12]?t[12].replace(/^\//,"&"):""):t[12])+"&output="+(t[12]&&t[12].indexOf("layer=c")>0?"svembed":"embed")}},gmap_search:{matcher:/(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(maps\/search\/)(.*)/i,type:"iframe",url:function(t){return"//maps.google."+t[2]+"/maps?q="+t[5].replace("query=","q=").replace("api=1","")+"&output=embed"}}};t(document).on("onInit.fb",function(o,i){t.each(i.group,function(o,i){var a,s,r,c,l,u,d,f=i.src||"",h=!1;i.type||(a=t.extend(!0,{},n,i.opts.media),t.each(a,function(n,o){if(r=f.match(o.matcher),u={},d=n,r){if(h=o.type,o.paramPlace&&r[o.paramPlace]){l=r[o.paramPlace],"?"==l[0]&&(l=l.substring(1)),l=l.split("&"); +for(var a=0;ae.clientHeight,a=("scroll"===o||"auto"===o)&&e.scrollWidth>e.clientWidth;return i||a},l=function(t){for(var e=!1;;){if(e=c(t.get(0)))break;if(t=t.parent(),!t.length||t.hasClass("fancybox-stage")||t.is("body"))break}return e},u=function(t){var e=this;e.instance=t,e.$bg=t.$refs.bg,e.$stage=t.$refs.stage,e.$container=t.$refs.container,e.destroy(),e.$container.on("touchstart.fb.touch mousedown.fb.touch",n.proxy(e,"ontouchstart"))};u.prototype.destroy=function(){this.$container.off(".fb.touch")},u.prototype.ontouchstart=function(o){var i=this,c=n(o.target),u=i.instance,d=u.current,f=d.$content,h="touchstart"==o.type;if(h&&i.$container.off("mousedown.fb.touch"),!d||i.instance.isAnimating||i.instance.isClosing)return o.stopPropagation(),void o.preventDefault();if((!o.originalEvent||2!=o.originalEvent.button)&&c.length&&!r(c)&&!r(c.parent())&&!(o.originalEvent.clientX>c[0].clientWidth+c.offset().left)&&(i.startPoints=a(o),i.startPoints&&!(i.startPoints.length>1&&u.isSliding))){if(i.$target=c,i.$content=f,i.canTap=!0,i.opts=d.opts.touch,n(e).off(".fb.touch"),n(e).on(h?"touchend.fb.touch touchcancel.fb.touch":"mouseup.fb.touch mouseleave.fb.touch",n.proxy(i,"ontouchend")),n(e).on(h?"touchmove.fb.touch":"mousemove.fb.touch",n.proxy(i,"ontouchmove")),!i.opts&&!u.canPan()||!c.is(i.$stage)&&!i.$stage.find(c).length)return void(c.is("img")&&o.preventDefault());o.stopPropagation(),n.fancybox.isMobile&&(l(i.$target)||l(i.$target.parent()))||o.preventDefault(),i.canvasWidth=Math.round(d.$slide[0].clientWidth),i.canvasHeight=Math.round(d.$slide[0].clientHeight),i.startTime=(new Date).getTime(),i.distanceX=i.distanceY=i.distance=0,i.isPanning=!1,i.isSwiping=!1,i.isZooming=!1,i.sliderStartPos=i.sliderLastPos||{top:0,left:0},i.contentStartPos=n.fancybox.getTranslate(i.$content),i.contentLastPos=null,1!==i.startPoints.length||i.isZooming||(i.canTap=!u.isSliding,"image"===d.type&&(i.contentStartPos.width>i.canvasWidth+1||i.contentStartPos.height>i.canvasHeight+1)?(n.fancybox.stop(i.$content),i.$content.css("transition-duration","0ms"),i.isPanning=!0):i.isSwiping=!0,i.$container.addClass("fancybox-controls--isGrabbing")),2!==i.startPoints.length||u.isAnimating||d.hasError||"image"!==d.type||!d.isLoaded&&!d.$ghost||(i.isZooming=!0,i.isSwiping=!1,i.isPanning=!1,n.fancybox.stop(i.$content),i.$content.css("transition-duration","0ms"),i.centerPointStartX=.5*(i.startPoints[0].x+i.startPoints[1].x)-n(t).scrollLeft(),i.centerPointStartY=.5*(i.startPoints[0].y+i.startPoints[1].y)-n(t).scrollTop(),i.percentageOfImageAtPinchPointX=(i.centerPointStartX-i.contentStartPos.left)/i.contentStartPos.width,i.percentageOfImageAtPinchPointY=(i.centerPointStartY-i.contentStartPos.top)/i.contentStartPos.height,i.startDistanceBetweenFingers=s(i.startPoints[0],i.startPoints[1]))}},u.prototype.ontouchmove=function(t){var e=this;if(e.newPoints=a(t),n.fancybox.isMobile&&(l(e.$target)||l(e.$target.parent())))return t.stopPropagation(),void(e.canTap=!1);if((e.opts||e.instance.canPan())&&e.newPoints&&e.newPoints.length&&(e.distanceX=s(e.newPoints[0],e.startPoints[0],"x"),e.distanceY=s(e.newPoints[0],e.startPoints[0],"y"),e.distance=s(e.newPoints[0],e.startPoints[0]),e.distance>0)){if(!e.$target.is(e.$stage)&&!e.$stage.find(e.$target).length)return;t.stopPropagation(),t.preventDefault(),e.isSwiping?e.onSwipe():e.isPanning?e.onPan():e.isZooming&&e.onZoom()}},u.prototype.onSwipe=function(){var e,a=this,s=a.isSwiping,r=a.sliderStartPos.left||0;s===!0?Math.abs(a.distance)>10&&(a.canTap=!1,a.instance.group.length<2&&a.opts.vertical?a.isSwiping="y":a.instance.isSliding||a.opts.vertical===!1||"auto"===a.opts.vertical&&n(t).width()>800?a.isSwiping="x":(e=Math.abs(180*Math.atan2(a.distanceY,a.distanceX)/Math.PI),a.isSwiping=e>45&&e<135?"y":"x"),a.instance.isSliding=a.isSwiping,a.startPoints=a.newPoints,n.each(a.instance.slides,function(t,e){n.fancybox.stop(e.$slide),e.$slide.css("transition-duration","0ms"),e.inTransition=!1,e.pos===a.instance.current.pos&&(a.sliderStartPos.left=n.fancybox.getTranslate(e.$slide).left)}),a.instance.SlideShow&&a.instance.SlideShow.isActive&&a.instance.SlideShow.stop()):("x"==s&&(a.distanceX>0&&(a.instance.group.length<2||0===a.instance.current.index&&!a.instance.current.opts.loop)?r+=Math.pow(a.distanceX,.8):a.distanceX<0&&(a.instance.group.length<2||a.instance.current.index===a.instance.group.length-1&&!a.instance.current.opts.loop)?r-=Math.pow(-a.distanceX,.8):r+=a.distanceX),a.sliderLastPos={top:"x"==s?0:a.sliderStartPos.top+a.distanceY,left:r},a.requestId&&(i(a.requestId),a.requestId=null),a.requestId=o(function(){a.sliderLastPos&&(n.each(a.instance.slides,function(t,e){var o=e.pos-a.instance.currPos;n.fancybox.setTranslate(e.$slide,{top:a.sliderLastPos.top,left:a.sliderLastPos.left+o*a.canvasWidth+o*e.opts.gutter})}),a.$container.addClass("fancybox-is-sliding"))}))},u.prototype.onPan=function(){var t,e,a,s=this;s.canTap=!1,t=s.contentStartPos.width>s.canvasWidth?s.contentStartPos.left+s.distanceX:s.contentStartPos.left,e=s.contentStartPos.top+s.distanceY,a=s.limitMovement(t,e,s.contentStartPos.width,s.contentStartPos.height),a.scaleX=s.contentStartPos.scaleX,a.scaleY=s.contentStartPos.scaleY,s.contentLastPos=a,s.requestId&&(i(s.requestId),s.requestId=null),s.requestId=o(function(){n.fancybox.setTranslate(s.$content,s.contentLastPos)})},u.prototype.limitMovement=function(t,e,n,o){var i,a,s,r,c=this,l=c.canvasWidth,u=c.canvasHeight,d=c.contentStartPos.left,f=c.contentStartPos.top,h=c.distanceX,p=c.distanceY;return i=Math.max(0,.5*l-.5*n),a=Math.max(0,.5*u-.5*o),s=Math.min(l-n,.5*l-.5*n),r=Math.min(u-o,.5*u-.5*o),n>l&&(h>0&&t>i&&(t=i-1+Math.pow(-i+d+h,.8)||0),h<0&&tu&&(p>0&&e>a&&(e=a-1+Math.pow(-a+f+p,.8)||0),p<0&&ea?(t=t>0?0:t,t=ts?(e=e>0?0:e,e=e50?(n.fancybox.animate(e.instance.current.$slide,{top:e.sliderStartPos.top+e.distanceY+150*e.velocityY,opacity:0},150),o=e.instance.close(!0,300)):"x"==t&&e.distanceX>50&&e.instance.group.length>1?o=e.instance.previous(e.speedX):"x"==t&&e.distanceX<-50&&e.instance.group.length>1&&(o=e.instance.next(e.speedX)),o!==!1||"x"!=t&&"y"!=t||e.instance.jumpTo(e.instance.current.index,150),e.$container.removeClass("fancybox-is-sliding")},u.prototype.endPanning=function(){var t,e,o,i=this;i.contentLastPos&&(i.opts.momentum===!1?(t=i.contentLastPos.left,e=i.contentLastPos.top):(t=i.contentLastPos.left+i.velocityX*i.speed,e=i.contentLastPos.top+i.velocityY*i.speed),o=i.limitPosition(t,e,i.contentStartPos.width,i.contentStartPos.height),o.width=i.contentStartPos.width,o.height=i.contentStartPos.height,n.fancybox.animate(i.$content,o,330))},u.prototype.endZooming=function(){var t,e,o,i,a=this,s=a.instance.current,r=a.newWidth,c=a.newHeight;a.contentLastPos&&(t=a.contentLastPos.left,e=a.contentLastPos.top,i={top:e,left:t,width:r,height:c,scaleX:1,scaleY:1},n.fancybox.setTranslate(a.$content,i),rs.width||c>s.height?a.instance.scaleToActual(a.centerPointStartX,a.centerPointStartY,150):(o=a.limitPosition(t,e,r,c),n.fancybox.setTranslate(a.content,n.fancybox.getTranslate(a.$content)),n.fancybox.animate(a.$content,o,150)))},u.prototype.onTap=function(t){var e,o=this,i=n(t.target),s=o.instance,r=s.current,c=t&&a(t)||o.startPoints,l=c[0]?c[0].x-o.$stage.offset().left:0,u=c[0]?c[0].y-o.$stage.offset().top:0,d=function(e){var i=r.opts[e];if(n.isFunction(i)&&(i=i.apply(s,[r,t])),i)switch(i){case"close":s.close(o.startEvent);break;case"toggleControls":s.toggleControls(!0);break;case"next":s.next();break;case"nextOrClose":s.group.length>1?s.next():s.close(o.startEvent);break;case"zoom":"image"==r.type&&(r.isLoaded||r.$ghost)&&(s.canPan()?s.scaleToFit():s.isScaledDown()?s.scaleToActual(l,u):s.group.length<2&&s.close(o.startEvent))}};if(!(t.originalEvent&&2==t.originalEvent.button||s.isSliding||l>i[0].clientWidth+i.offset().left)){if(i.is(".fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-container"))e="Outside";else if(i.is(".fancybox-slide"))e="Slide";else{if(!s.current.$content||!s.current.$content.has(t.target).length)return;e="Content"}if(o.tapped){if(clearTimeout(o.tapped),o.tapped=null,Math.abs(l-o.tapX)>50||Math.abs(u-o.tapY)>50||s.isSliding)return this;d("dblclick"+e)}else o.tapX=l,o.tapY=u,r.opts["dblclick"+e]&&r.opts["dblclick"+e]!==r.opts["click"+e]?o.tapped=setTimeout(function(){o.tapped=null,d("click"+e)},300):d("click"+e);return this}},n(e).on("onActivate.fb",function(t,e){e&&!e.Guestures&&(e.Guestures=new u(e))}),n(e).on("beforeClose.fb",function(t,e){e&&e.Guestures&&e.Guestures.destroy()})}(window,document,window.jQuery||jQuery),function(t,e){"use strict";e.extend(!0,e.fancybox.defaults,{btnTpl:{slideShow:''},slideShow:{autoStart:!1,speed:3e3}});var n=function(t){this.instance=t,this.init()};e.extend(n.prototype,{timer:null,isActive:!1,$button:null,init:function(){var t=this;t.$button=t.instance.$refs.toolbar.find("[data-fancybox-play]").on("click",function(){t.toggle()}),(t.instance.group.length<2||!t.instance.group[t.instance.currIndex].opts.slideShow)&&t.$button.hide()},set:function(t){var e=this;e.instance&&e.instance.current&&(t===!0||e.instance.current.opts.loop||e.instance.currIndex'},fullScreen:{autoStart:!1}}),e(t).on({"onInit.fb":function(t,e){var n;e&&e.group[e.currIndex].opts.fullScreen?(n=e.$refs.container,n.on("click.fb-fullscreen","[data-fancybox-fullscreen]",function(t){t.stopPropagation(),t.preventDefault(),o.toggle(n[0])}),e.opts.fullScreen&&e.opts.fullScreen.autoStart===!0&&o.request(n[0]),e.FullScreen=o):e&&e.$refs.toolbar.find("[data-fancybox-fullscreen]").hide()},"afterKeydown.fb":function(t,e,n,o,i){e&&e.FullScreen&&70===i&&(o.preventDefault(),e.FullScreen.toggle(e.$refs.container[0]))},"beforeClose.fb":function(t){t&&t.FullScreen&&o.exit()}}),e(t).on(n.fullscreenchange,function(){var t=o.isFullscreen(),n=e.fancybox.getInstance();n&&(n.current&&"image"===n.current.type&&n.isAnimating&&(n.current.$content.css("transition","none"),n.isAnimating=!1,n.update(!0,!0,0)),n.trigger("onFullscreenChange",t),n.$refs.container.toggleClass("fancybox-is-fullscreen",t))})}(document,window.jQuery||jQuery),function(t,e){"use strict";e.extend(!0,e.fancybox.defaults,{btnTpl:{thumbs:''},thumbs:{autoStart:!1,hideOnClose:!0}});var n=function(t){this.instance=t,this.init()};e.extend(n.prototype,{$button:null,$grid:null,$list:null,isVisible:!1,init:function(){var t=this,e=t.instance.group[0],n=t.instance.group[1];t.$button=t.instance.$refs.toolbar.find("[data-fancybox-thumbs]"),t.instance.group.length>1&&t.instance.group[t.instance.currIndex].opts.thumbs&&("image"==e.type||e.opts.thumb||e.opts.$thumb)&&("image"==n.type||n.opts.thumb||n.opts.$thumb)?(t.$button.on("click",function(){t.toggle()}),t.isActive=!0):(t.$button.hide(),t.isActive=!1)},create:function(){var t,n,o=this.instance;this.$grid=e('
').appendTo(o.$refs.container),t="
    ",e.each(o.group,function(e,o){n=o.opts.thumb||(o.opts.$thumb?o.opts.$thumb.attr("src"):null),n||"image"!==o.type||(n=o.src),n&&n.length&&(t+='
  • ')}),t+="
",this.$list=e(t).appendTo(this.$grid).on("click","li",function(){o.jumpTo(e(this).data("index"))}),this.$list.find("img").hide().one("load",function(){var t,n,o,i,a=e(this).parent().removeClass("fancybox-thumbs-loading"),s=a.outerWidth(),r=a.outerHeight();t=this.naturalWidth||this.width,n=this.naturalHeight||this.height,o=t/s,i=n/r,o>=1&&i>=1&&(o>i?(t/=i,n=r):(t=s,n/=o)),e(this).css({width:Math.floor(t),height:Math.floor(n),"margin-top":Math.min(0,Math.floor(.3*r-.3*n)),"margin-left":Math.min(0,Math.floor(.5*s-.5*t))}).show()}).each(function(){this.src=e(this).data("src")})},focus:function(){this.instance.current&&this.$list.children().removeClass("fancybox-thumbs-active").filter('[data-index="'+this.instance.current.index+'"]').addClass("fancybox-thumbs-active").focus()},close:function(){this.$grid.hide()},update:function(){this.instance.$refs.container.toggleClass("fancybox-show-thumbs",this.isVisible),this.isVisible?(this.$grid||this.create(),this.instance.trigger("onThumbsShow"),this.focus()):this.$grid&&this.instance.trigger("onThumbsHide"),this.instance.update()},hide:function(){this.isVisible=!1,this.update()},show:function(){this.isVisible=!0,this.update()},toggle:function(){this.isVisible=!this.isVisible,this.update()}}),e(t).on({"onInit.fb":function(t,e){e&&!e.Thumbs&&(e.Thumbs=new n(e))},"beforeShow.fb":function(t,e,n,o){var i=e&&e.Thumbs;if(i&&i.isActive){if(n.modal)return i.$button.hide(),void i.hide();o&&n.opts.thumbs.autoStart===!0&&i.show(),i.isVisible&&i.focus()}},"afterKeydown.fb":function(t,e,n,o,i){var a=e&&e.Thumbs;a&&a.isActive&&71===i&&(o.preventDefault(),a.toggle())},"beforeClose.fb":function(t,e){var n=e&&e.Thumbs;n&&n.isVisible&&e.opts.thumbs.hideOnClose!==!1&&n.close()}})}(document,window.jQuery||jQuery),function(t,e){"use strict";e.extend(!0,e.fancybox.defaults,{btnTpl:{share:''},share:{tpl:''}}),e(t).on("click","[data-fancybox-share]",function(){var t=e.fancybox.getInstance();t&&e.fancybox.open({src:t.translate(t,t.current.opts.share.tpl.replace(/\{\{src\}\}/g,encodeURI(t.current.src)).replace(/\{\{descr\}\}/g,encodeURI(t.current.opts.caption||""))),type:"html",opts:{autoFocus:!1,animationEffect:"fade"}})})}(document,window.jQuery||jQuery),function(t,e,n){"use strict";function o(){var t=e.location.hash.substr(1),n=t.split("-"),o=n.length>1&&/^\+?\d+$/.test(n[n.length-1])?parseInt(n.pop(-1),10)||1:1,i=n.join("-");return o<1&&(o=1),{hash:t,index:o,gallery:i}}function i(t){var e;""!==t.gallery&&(e=n("[data-fancybox='"+n.escapeSelector(t.gallery)+"']").eq(t.index-1),e.length||(e=n("#"+n.escapeSelector(t.gallery))),e.length&&(s=!1,e.trigger("click")))}function a(t){var e;return!!t&&(e=t.current?t.current.opts:t.opts,e.hash||(e.$orig?e.$orig.data("fancybox"):""))}n.escapeSelector||(n.escapeSelector=function(t){var e=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\x80-\uFFFF\w-]/g,n=function(t,e){return e?"\0"===t?"�":t.slice(0,-1)+"\\"+t.charCodeAt(t.length-1).toString(16)+" ":"\\"+t};return(t+"").replace(e,n)});var s=!0,r=null,c=null;n(function(){n(t).on({"onInit.fb":function(t,e){var n,i;e.group[e.currIndex].opts.hash!==!1&&(n=o(),i=a(e),i&&n.gallery&&i==n.gallery&&(e.currIndex=n.index-1))},"beforeShow.fb":function(n,o,i){var l;i&&i.opts.hash!==!1&&(l=a(o),l&&""!==l&&(e.location.hash.indexOf(l)<0&&(o.opts.origHash=e.location.hash),r=l+(o.group.length>1?"-"+(i.index+1):""),"replaceState"in e.history?(c&&clearTimeout(c),c=setTimeout(function(){e.history[s?"pushState":"replaceState"]({},t.title,e.location.pathname+e.location.search+"#"+r),c=null,s=!1},300)):e.location.hash=r))},"beforeClose.fb":function(o,i,s){var l,u;c&&clearTimeout(c),s.opts.hash!==!1&&(l=a(i),u=i&&i.opts.origHash?i.opts.origHash:"",l&&""!==l&&("replaceState"in history?e.history.replaceState({},t.title,e.location.pathname+e.location.search+u):(e.location.hash=u,n(e).scrollTop(i.scrollTop).scrollLeft(i.scrollLeft))),r=null)}}),n(e).on("hashchange.fb",function(){var t=o();n.fancybox.getInstance()?!r||r===t.gallery+"-"+t.index||1===t.index&&r==t.gallery||(r=null,n.fancybox.close()):""!==t.gallery&&i(t)}),i(o())})}(document,window,window.jQuery||jQuery); \ No newline at end of file diff --git a/package.json b/package.json index 6a6e41db..bee34e98 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "@fancyapps/fancybox", "description": "Touch enabled, responsive and fully customizable jQuery lightbox script", - "version": "3.1.28", + "version": "3.2.0", "homepage": "http://fancyapps.com/fancybox/", "main": "./dist/jquery.fancybox.js", "author": "fancyApps", diff --git a/src/css/core.css b/src/css/core.css index 823f11f7..ad2e1b9a 100644 --- a/src/css/core.css +++ b/src/css/core.css @@ -1,10 +1,11 @@ -.fancybox-enabled { +body.fancybox-active { overflow: hidden; } -.fancybox-enabled body { - overflow: visible; - height: 100%; +body.fancybox-iosfix { + position: fixed; + left: 0; + right: 0; } .fancybox-is-hidden { @@ -24,6 +25,7 @@ -webkit-tap-highlight-color: rgba(0,0,0,0); backface-visibility: hidden; transform: translateZ(0); + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; } /* Make sure that the first one is on the top */ @@ -82,29 +84,27 @@ .fancybox-infobar { top: 0; - left : 50%; - margin-left: -79px; -} - -.fancybox-infobar__body { - display: inline-block; - width: 70px; - line-height: 44px; + left: 0; font-size: 13px; - font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; + padding: 0 10px; + height: 44px; + min-width: 44px; + line-height: 44px; + color: #ccc; text-align: center; - color: #ddd; - background-color: rgba(30,30,30,0.7); pointer-events: none; user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-font-smoothing: subpixel-antialiased; + mix-blend-mode: exclusion; } .fancybox-toolbar { top: 0; right: 0; + margin: 0; + padding: 0; } .fancybox-stage { @@ -132,7 +132,6 @@ display: none; backface-visibility: hidden; transition-property: transform, opacity; - transform-style: preserve-3d; } .fancybox-slide::before { @@ -172,7 +171,7 @@ z-index: 99995; } -.fancybox-slide > div { +.fancybox-slide > * { display: inline-block; position: relative; padding: 24px; @@ -185,6 +184,15 @@ box-sizing: border-box; } +.fancybox-slide > title, +.fancybox-slide > style, +.fancybox-slide > meta, +.fancybox-slide > link, +.fancybox-slide > script, +.fancybox-slide > base { + display: none; +} + .fancybox-slide .fancybox-image-wrap { position: absolute; top: 0; @@ -271,9 +279,122 @@ margin: 0; padding: 0; color: #444; - font: 16px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; + font-size: 16px; + line-height: 20px; +} + +.fancybox-slide--iframe .fancybox-close-small { + top : 0; + right : -44px; +} + +.fancybox-slide--iframe .fancybox-close-small:after { + font-size: 35px; + color: #aaa; +} + +.fancybox-slide--iframe .fancybox-close-small:hover:after { + color: #fff; + background: transparent; +} + + +/* Buttons */ + +.fancybox-button { + box-sizing: border-box; + display: inline-block; + vertical-align: top; + width: 44px; + height: 44px; + margin: 0; + padding: 10px; + border: 0; + border-radius: 0; + background: rgba(30,30,30,0.6); + color: #ccc; + transition: color .3s ease; + cursor: pointer; +} + +.fancybox-button[disabled] { + cursor: default; + opacity: 0.6; +} + +.fancybox-button:hover:not([disabled]) { + color: #fff; +} + +.fancybox-button svg { + display: block; + position: relative; + overflow: visible; + shape-rendering: geometricPrecision; +} + +.fancybox-button svg path { + fill: currentColor; + stroke: currentColor; + stroke-linejoin: round; + stroke-width: 3; } +.fancybox-button--share svg path { + stroke-width: 1; +} + +.fancybox-button--play svg path:nth-child(2) { + display: none; +} + +.fancybox-button--pause svg path:nth-child(1) { + display: none; +} + + +/* Navigation arrows */ + +.fancybox-navigation { + display: none; +} + +.fancybox-show-nav .fancybox-navigation { + display: block; +} + +.fancybox-navigation button { + position: absolute; + top: 50%; + margin: -50px 0 0 0; + z-index: 99997; + background: transparent; + width: 60px; + height: 100px; + padding: 17px; +} + +.fancybox-navigation button:before { + content: ""; + position: absolute; + top: 30px; + right: 10px; + width: 40px; + height: 40px; + background: rgba(30,30,30,0.6); +} + +.fancybox-navigation .fancybox-button--arrow_left { + left: 0; +} + +.fancybox-navigation .fancybox-button--arrow_right { + right: 0; +} + + +/* Close button on the top right corner of html content */ + .fancybox-close-small { position: absolute; top: 0; @@ -284,7 +405,6 @@ margin: 0; border: 0; border-radius: 0; - outline: none; background: transparent; z-index: 10; cursor: pointer; @@ -303,12 +423,16 @@ text-align: center; border-radius: 50%; border-width: 0; - background: #fff; - transition: background .25s; + background-color: transparent; + transition: background-color .25s; box-sizing: border-box; z-index: 2; } +.fancybox-close-small:focus { + outline: none; +} + .fancybox-close-small:focus:after { outline: 1px dotted #888; } @@ -318,21 +442,6 @@ background: #eee; } -.fancybox-slide--iframe .fancybox-close-small { - top : 0; - right : -44px; -} - -.fancybox-slide--iframe .fancybox-close-small:after { - background: transparent; - font-size: 35px; - color: #aaa; -} - -.fancybox-slide--iframe .fancybox-close-small:hover:after { - color: #fff; -} - /* Caption */ @@ -340,7 +449,7 @@ bottom: 0; left: 0; right: 0; - padding: 60px 30px 0 30px; + padding: 60px 2vw 0 2vw; background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.1) 20%, rgba(0,0,0,0.2) 40%,rgba(0,0,0,0.6) 80%, rgba(0,0,0,0.8) 100%); pointer-events: none; } @@ -349,7 +458,6 @@ padding: 30px 0; border-top: 1px solid rgba(255,255,255,0.4); font-size: 14px; - font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; color: #fff; line-height: 20px; -webkit-text-size-adjust: none; @@ -359,6 +467,7 @@ .fancybox-caption button, .fancybox-caption select { pointer-events: all; + position: relative; /* Fix IE11 */ } .fancybox-caption a { @@ -367,159 +476,6 @@ } -/* Buttons */ - -.fancybox-button { - display: inline-block; - position: relative; - margin: 0; - padding: 0; - border: 0; - width: 44px; - height: 44px; - line-height: 44px; - text-align: center; - background: transparent; - color: #ddd; - border-radius: 0; - cursor: pointer; - vertical-align: top; - outline: none; -} - -.fancybox-button[disabled] { - cursor: default; - pointer-events: none; -} - -.fancybox-infobar__body, .fancybox-button { - background: rgba(30,30,30,0.6); -} - -.fancybox-button:hover:not([disabled]) { - color: #fff; - background: rgba(0,0,0,0.8); -} - -.fancybox-button::before, -.fancybox-button::after { - content: ''; - pointer-events: none; - position: absolute; - background-color: currentColor; - color: currentColor; - opacity: 0.9; - box-sizing: border-box; - display: inline-block; -} - -.fancybox-button[disabled]::before, -.fancybox-button[disabled]::after { - opacity: 0.3; -} - -.fancybox-button--left::after, -.fancybox-button--right::after { - top: 18px; - width: 6px; - height: 6px; - background: transparent; - border-top: solid 2px currentColor; - border-right: solid 2px currentColor; -} - -.fancybox-button--left::after { - left: 20px; - transform: rotate(-135deg); -} - -.fancybox-button--right::after { - right: 20px; - transform: rotate(45deg); -} - -.fancybox-button--left { - border-bottom-left-radius: 5px; -} - -.fancybox-button--right { - border-bottom-right-radius: 5px; -} - -.fancybox-button--close::before, .fancybox-button--close::after { - content: ''; - display: inline-block; - position: absolute; - height: 2px; - width: 16px; - top: calc(50% - 1px); - left: calc(50% - 8px); -} - -.fancybox-button--close::before { - transform: rotate(45deg); -} - -.fancybox-button--close::after { - transform: rotate(-45deg); -} - - -/* Navigation arrows */ - -.fancybox-arrow { - position: absolute; - top: 50%; - margin: -50px 0 0 0; - height: 100px; - width: 54px; - padding: 0; - border: 0; - outline: none; - background: none; - cursor: pointer; - z-index: 99995; - opacity: 0; - user-select: none; - transition: opacity .25s; -} - -.fancybox-arrow::after { - content : ''; - position: absolute; - top: 28px; - width: 44px; - height: 44px; - background-color: rgba(30,30,30,0.8); - background-image: url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjRkZGRkZGIiBoZWlnaHQ9IjQ4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSI0OCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gICAgPHBhdGggZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIvPiAgICA8cGF0aCBkPSJNMTIgNGwtMS40MSAxLjQxTDE2LjE3IDExSDR2MmgxMi4xN2wtNS41OCA1LjU5TDEyIDIwbDgtOHoiLz48L3N2Zz4=); - background-repeat: no-repeat; - background-position: center center; - background-size: 24px 24px; -} - -.fancybox-arrow--right { - right: 0; -} - -.fancybox-arrow--left { - left: 0; - transform: scaleX(-1); -} - -.fancybox-arrow--right::after, -.fancybox-arrow--left::after { - left: 0; -} - -.fancybox-show-nav .fancybox-arrow { - opacity: 0.6; -} - -.fancybox-show-nav .fancybox-arrow[disabled] { - opacity: 0.3; -} - - /* Loading indicator */ .fancybox-slide > .fancybox-loading { @@ -533,8 +489,8 @@ position: absolute; top: 50%; left: 50%; - margin-top: -25px; - margin-left: -25px; + margin-top: -30px; + margin-left: -30px; z-index: 99999; } @@ -643,24 +599,3 @@ .fancybox-fx-tube.fancybox-slide--current { transform: translate3d(0, 0, 0) scale(1); } - - -/* Styling for Small-Screen Devices */ - -@media all and (max-width: 800px) { - - .fancybox-infobar { - left: 0; - margin-left: 0; - } - - .fancybox-button--left, - .fancybox-button--right { - display: none !important; - } - - .fancybox-caption { - padding: 20px 0; - margin: 0; - } -} diff --git a/src/css/share.css b/src/css/share.css new file mode 100644 index 00000000..ff34996d --- /dev/null +++ b/src/css/share.css @@ -0,0 +1,53 @@ +/* Share */ + +.fancybox-share { + padding: 30px; + border-radius: 3px; + background: #f4f4f4; + max-width: 90%; +} + +.fancybox-share h1 { + color: #222; + margin: 0 0 20px 0; + font-size: 33px; + font-weight: 700; + text-align: center; +} + +.fancybox-share p { + margin: 0; + padding: 0; + text-align: center; +} + +.fancybox-share_button { + display: inline-block; + text-decoration: none; + margin: 0 10px 10px 0; + padding: 10px 20px; + box-shadow: 0 1px 2px rgba(0,0,0,0.2); + border-radius: 3px; + background: #fff; + white-space: nowrap; + font-size: 16px; + line-height: 23px; + user-select: none; + min-width: 140px; + color: #888; + transition: all .2s; +} + +.fancybox-share_button:focus, +.fancybox-share_button:hover { + box-shadow: 0 1px 2px rgba(0,0,0,0.5); + text-decoration: none; + color: #555; +} + +.fancybox-share_button svg { + margin-right: 5px; + width: 23px; + height: 23px; + vertical-align: top; +} diff --git a/src/css/thumbs.css b/src/css/thumbs.css index 215e5f7f..e39652e0 100644 --- a/src/css/thumbs.css +++ b/src/css/thumbs.css @@ -3,120 +3,104 @@ .fancybox-thumbs { display: none; + position: absolute; + top: 0; + bottom: 0; + right: 0; + width: 212px; + margin: 0; + padding: 2px; + background: #fff; + -webkit-tap-highlight-color: rgba(0,0,0,0); + -webkit-overflow-scrolling: touch; + -ms-overflow-style: -ms-autohiding-scrollbar; + box-sizing: border-box; + z-index: 99995; } -.fancybox-button--thumbs { - display: none; +.fancybox-show-thumbs .fancybox-thumbs { + display: block; } -@media all and (min-width: 800px) { - - .fancybox-button--thumbs { - display: inline-block; - } - - .fancybox-button--thumbs span { - font-size: 23px; - } - - .fancybox-button--thumbs::before { - width: 3px; - height: 3px; - top: calc(50% - 2px); - left: calc(50% - 2px); - box-shadow: 0 -4px 0, -4px -4px 0, 4px -4px 0, 0 0 0 32px inset, -4px 0 0, 4px 0 0, 0 4px 0, -4px 4px 0, 4px 4px 0; - } - - .fancybox-thumbs { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: auto; - width: 220px; - margin: 0; - padding: 5px 5px 0 0; - background: #fff; - word-break: normal; - -webkit-tap-highlight-color: rgba(0,0,0,0); - -webkit-overflow-scrolling: touch; - -ms-overflow-style: -ms-autohiding-scrollbar; - box-sizing: border-box; - z-index: 99995; - } +.fancybox-show-thumbs .fancybox-inner { + right: 212px; +} - .fancybox-show-thumbs .fancybox-thumbs { - display: block; - } +.fancybox-thumbs > ul { + list-style: none; + position: absolute; + position: relative; + width: 100%; + height: 100%; + margin: 0; + padding: 0; + overflow-x: hidden; + overflow-y: auto; + font-size: 0; + white-space: nowrap; +} - .fancybox-show-thumbs .fancybox-inner { - right: 220px; - } +.fancybox-thumbs > ul > li { + float: left; + overflow: hidden; + padding: 0; + margin: 2px; + width: 100px; + height: 75px; + max-width: calc(50% - 4px); + max-height: calc(100% - 8px); + position: relative; + cursor: pointer; + outline: none; + -webkit-tap-highlight-color: transparent; + backface-visibility: hidden; + box-sizing: border-box; +} - .fancybox-thumbs > ul { - list-style: none; - position: absolute; - position: relative; - width: 100%; - height: 100%; - margin: 0; - padding: 0; - overflow-x: hidden; - overflow-y: auto; - font-size: 0; - } +li.fancybox-thumbs-loading { + background: rgba(0,0,0,0.1); +} - .fancybox-thumbs > ul > li { - float: left; - overflow: hidden; - max-width: 50%; - padding: 0; - margin: 0; - width: 105px; - height: 75px; - position: relative; - cursor: pointer; - outline: none; - border: 5px solid transparent; - border-top-width: 0; - border-right-width: 0; - -webkit-tap-highlight-color: transparent; - backface-visibility: hidden; - box-sizing: border-box; - } +.fancybox-thumbs > ul > li > img { + position: absolute; + top: 0; + left: 0; + min-width: 100%; + min-height: 100%; + max-width: none; + max-height: none; + -webkit-touch-callout: none; + user-select: none; +} - li.fancybox-thumbs-loading { - background: rgba(0,0,0,0.1); - } +.fancybox-thumbs > ul > li:before { + content: ''; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + border: 4px solid #4ea7f9; + z-index: 99991; + opacity: 0; + transition: all 0.2s cubic-bezier(.25,.46,.45,.94); +} - .fancybox-thumbs > ul > li > img { - position: absolute; - top: 0; - left: 0; - min-width: 100%; - min-height: 100%; - max-width: none; - max-height: none; - -webkit-touch-callout: none; - user-select: none; - } +.fancybox-thumbs > ul > li.fancybox-thumbs-active:before { + opacity: 1; +} - .fancybox-thumbs > ul > li:before { - content:''; - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - border-radius: 2px; - border: 4px solid #4ea7f9; - z-index: 99991; - opacity: 0; - transition: all 0.2s cubic-bezier(.25,.46,.45,.94); +/* Styling for Small-Screen Devices */ +@media all and (max-width: 800px) { + .fancybox-thumbs { + width: 110px; } - .fancybox-thumbs > ul > li.fancybox-thumbs-active:before { - opacity: 1; - } + .fancybox-show-thumbs .fancybox-inner { + right: 110px; + } + .fancybox-thumbs > ul > li { + max-width: calc(100% - 10px); + } } diff --git a/src/js/core.js b/src/js/core.js index 6626b2cd..fa787dcd 100644 --- a/src/js/core.js +++ b/src/js/core.js @@ -13,7 +13,7 @@ if ( $.fn.fancybox ) { - $.error('fancyBox already initialized'); + 'console' in window && console.log( 'fancyBox already initialized' ); return; } @@ -39,7 +39,7 @@ arrows : true, // Should display infobar (counter and arrows at the top) - infobar : false, + infobar : true, // Should display toolbar (buttons at the top) toolbar : true, @@ -51,11 +51,13 @@ 'slideShow', 'fullScreen', 'thumbs', + //'download', + 'share', 'close' ], // Detect "idle" time in seconds - idleTime : 4, + idleTime : 3, // Should display buttons at top right corner of the content // If 'auto' - they will be created for content having type 'html', 'inline' or 'ajax' @@ -73,7 +75,7 @@ // Wait for images to load before displaying // Requires predefined image dimensions // If 'auto' - will zoom in thumbnail if 'width' and 'height' attributes are found - preload : "auto", + preload : "auto" }, @@ -122,7 +124,7 @@ animationEffect : "zoom", // Duration in ms for open/close animation - animationDuration : 366, + animationDuration : 500, // Should image change opacity while zooming // If opacity is 'auto', then opacity will be changed if image and thumbnail have different aspect ratios @@ -156,23 +158,12 @@ '
' + '
' + '
' + - '' + - '
' + - ' / ' + - '
' + - '' + - '
' + - '
' + - '{{BUTTONS}}' + - '
' + - '
' + - '
' + + '
{{buttons}}
' + + '
{{arrows}}
' + '
' + - '
' + - '
' + - '
' + + '
' + '
' + '
', @@ -183,14 +174,35 @@ errorTpl : '

{{ERROR}}

', btnTpl : { - slideShow : '', - fullScreen : '', - thumbs : '', - close : '', + + download : '' + + '' + + '' + + '' + + '', + + close : '', // This small close button will be appended to your html/inline/ajax content by default, // if "smallBtn" option is not set to false - smallBtn : '' + smallBtn : '', + + // Arrows + arrowLeft : '', + + arrowRight : '', }, // Container is injected into this element @@ -201,7 +213,7 @@ // ============== // Try to focus on the first focusable element after opening - autoFocus : true, + autoFocus : false, // Put focus back to active element after closing backFocus : true, @@ -340,7 +352,9 @@ PLAY_START : 'Start slideshow', PLAY_STOP : 'Pause slideshow', FULL_SCREEN : 'Full screen', - THUMBS : 'Thumbnails' + THUMBS : 'Thumbnails', + DOWNLOAD : 'Download', + SHARE : 'Share' }, 'de' : { CLOSE : 'Schliessen', @@ -350,7 +364,9 @@ PLAY_START : 'Diaschau starten', PLAY_STOP : 'Diaschau beenden', FULL_SCREEN : 'Vollbild', - THUMBS : 'Vorschaubilder' + THUMBS : 'Vorschaubilder', + DOWNLOAD : 'Herunterladen', + SHARE : 'Teilen' } } @@ -424,7 +440,11 @@ var FancyBox = function( content, opts, index ) { var self = this; - self.opts = $.extend( true, { index : index }, defaults, opts || {} ); + self.opts = $.extend( true, { index : index }, defaults, opts || {} ); + + if ( $.fancybox.isMobile ) { + self.opts = $.extend( true, {}, self.opts, self.opts.mobile ); + } // Exclude buttons option from deep merging if ( opts && $.isArray( opts.buttons ) ) { @@ -465,11 +485,13 @@ // ==================== init : function() { - var self = this; - - var testWidth, $container, buttonStr; - - var firstItemOpts = self.group[ self.currIndex ].opts; + var self = this, + firstItem = self.group[ self.currIndex ], + firstItemOpts = firstItem.opts, + scrollbarWidth = $.fancybox.scrollbarWidth, + $scrollDiv, + $container, + buttonStr; self.scrollTop = $D.scrollTop(); self.scrollLeft = $D.scrollLeft(); @@ -478,17 +500,33 @@ // Hide scrollbars // =============== - if ( !$.fancybox.getInstance() && !$.fancybox.isMobile && $( 'body' ).css('overflow') !== 'hidden' ) { - testWidth = $( 'body' ).width(); + if ( !$.fancybox.getInstance() ) { - $( 'html' ).addClass( 'fancybox-enabled' ); + $( 'body' ).addClass( 'fancybox-active' ); - // Compare body width after applying "overflow: hidden" - testWidth = $( 'body' ).width() - testWidth; + // iOS hack + if ( /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream ) { + + // iOS has problems for input elements inside fixed containers, + // the workaround is to apply `position: fixed` to `` element, + // unfortunately, this makes it lose the scrollbars and forces address bar to appear. + + if ( firstItem.type !== 'image' ) { + $( 'body' ).css( 'top', $( 'body' ).scrollTop() * -1 ).addClass( 'fancybox-iosfix' ); + } - // If width has changed - compensate missing scrollbars by adding right margin - if ( testWidth > 1 ) { - $( 'head' ).append( '' ); + } else if ( !$.fancybox.isMobile && document.body.scrollHeight > window.innerHeight ) { + + if ( scrollbarWidth === undefined ) { + $scrollDiv = $('
').appendTo( 'body' ); + + scrollbarWidth = $.fancybox.scrollbarWidth = $scrollDiv[0].offsetWidth - $scrollDiv[0].clientWidth; + + $scrollDiv.remove(); + } + + $( 'head' ).append( '' ); + $( 'body' ).addClass( 'compensate-for-scrollbar' ); } } @@ -505,9 +543,15 @@ // Create markup from base template, it will be initially hidden to // avoid unnecessary work like painting while initializing is not complete - $container = $( self.translate( self, firstItemOpts.baseTpl.replace( '\{\{BUTTONS\}\}', buttonStr ) ) ) + $container = $( + self.translate( self, + firstItemOpts.baseTpl + .replace( '\{\{buttons\}\}', buttonStr ) + .replace( '\{\{arrows\}\}', firstItemOpts.btnTpl.arrowLeft + firstItemOpts.btnTpl.arrowRight ) + ) + ) + .attr( 'id', 'fancybox-container-' + self.id ) .addClass( 'fancybox-is-hidden' ) - .attr('id', 'fancybox-container-' + self.id) .addClass( firstItemOpts.baseClass ) .data( 'FancyBox', self ) .prependTo( firstItemOpts.parentEl ); @@ -521,19 +565,6 @@ self.$refs[ item ] = $container.find( '.fancybox-' + item ); }); - // Check for redundant elements - if ( !firstItemOpts.arrows || self.group.length < 2 ) { - $container.find('.fancybox-navigation').remove(); - } - - if ( !firstItemOpts.infobar ) { - self.$refs.infobar.remove(); - } - - if ( !firstItemOpts.toolbar ) { - self.$refs.toolbar.remove(); - } - self.trigger( 'onInit' ); // Bring to front and enable events @@ -592,28 +623,19 @@ } else if ( $.type( item ) === 'object' && $( item ).length ) { - // Here we propbably have jQuery collection returned by some selector - + // Here we probably have jQuery collection returned by some selector $item = $( item ); - data = $item.data(); - - opts = 'options' in data ? data.options : {}; - opts = $.type( opts ) === 'object' ? opts : {}; - obj.src = 'src' in data ? data.src : ( opts.src || $item.attr( 'href' ) ); - - [ 'width', 'height', 'thumb', 'type', 'filter' ].forEach(function(item) { - if ( item in data ) { - opts[ item ] = data[ item ]; - } - }); - - if ( 'srcset' in data ) { - opts.image = { srcset : data.srcset }; - } + opts = $item.data(); + opts = $.extend( {}, opts, opts.options || {} ); + // Here we store clicked element opts.$orig = $item; + obj.src = opts.src || $item.attr( 'href' ); + + // Assume that simple syntax is used, for example: + // `$.fancybox.open( $("#test"), {} );` if ( !obj.type && !obj.src ) { obj.type = 'inline'; obj.src = item; @@ -622,7 +644,7 @@ } else { // Assume we have a simple html code, for example: - // $.fancybox.open( '

Hi!

' ); + // $.fancybox.open( '

Hi!

' ); obj = { type : 'html', @@ -634,8 +656,9 @@ // Each gallery object has full collection of options obj.opts = $.extend( true, {}, self.opts, opts ); - if ( $.fancybox.isMobile ) { - obj.opts = $.extend( true, {}, obj.opts, obj.opts.mobile ); + // Do not merge buttons array + if ( $.isArray( opts.buttons ) ) { + obj.opts.buttons = opts.buttons; } @@ -679,15 +702,14 @@ } // Caption is a "special" option, it can be passed as a method - if ( $.type( obj.opts.caption ) === 'function' ) { - obj.opts.caption = obj.opts.caption.apply( item, [ self, obj ] ); - - } else if ( 'caption' in data ) { - obj.opts.caption = data.caption; + if ( $.type( self.opts.caption ) === 'function' ) { + obj.opts.caption = self.opts.caption.apply( item, [ self, obj ] ); } - // Make sure we have caption as a string - obj.opts.caption = obj.opts.caption === undefined ? '' : obj.opts.caption + ''; + // Make sure we have caption as a string or jQuery object + if ( !obj.opts.caption instanceof jQuery ) { + obj.opts.caption = obj.opts.caption === undefined ? '' : obj.opts.caption + ''; + } // Check if url contains "filter" used to filter the content // Example: "ajax.html #something" @@ -812,7 +834,7 @@ self.$refs.stage.show(); self.update(); - }, 500); + }, 600); } @@ -886,7 +908,7 @@ if ( self.group[ self.currIndex ].opts.idleTime ) { self.idleSecondsCounter = 0; - $D.on('mousemove.fb-idle mouseenter.fb-idle mouseleave.fb-idle mousedown.fb-idle touchstart.fb-idle touchmove.fb-idle scroll.fb-idle keydown.fb-idle', function() { + $D.on('mousemove.fb-idle mouseleave.fb-idle mousedown.fb-idle touchstart.fb-idle touchmove.fb-idle scroll.fb-idle keydown.fb-idle', function(e) { self.idleSecondsCounter = 0; if ( self.isIdle ) { @@ -1362,7 +1384,7 @@ var self = this; var isScaledDown; - var $container = self.$refs.container.removeClass('fancybox-is-zoomable fancybox-can-zoomIn fancybox-can-drag fancybox-can-zoomOut'); + var $container = self.$refs.container.removeClass( 'fancybox-is-zoomable fancybox-can-zoomIn fancybox-can-drag fancybox-can-zoomOut' ); if ( !self.current || self.isClosing ) { return; @@ -1382,7 +1404,7 @@ if ( isScaledDown ) { // If image is scaled down, then, obviously, it can be zoomed to full size - $container.addClass('fancybox-can-zoomIn'); + $container.addClass( 'fancybox-can-zoomIn' ); } else { @@ -1390,16 +1412,16 @@ // If image size ir largen than available available and touch module is not disable, // then user can do panning - $container.addClass('fancybox-can-drag'); + $container.addClass( 'fancybox-can-drag' ); } else { - $container.addClass('fancybox-can-zoomOut'); + $container.addClass( 'fancybox-can-zoomOut' ); } } } else if ( self.current.opts.touch ) { - $container.addClass('fancybox-can-drag'); + $container.addClass( 'fancybox-can-drag' ); } }, @@ -1594,7 +1616,7 @@ setImage : function( slide ) { var self = this; - var srcset = slide.opts.image.srcset; + var srcset = slide.opts.srcset || slide.opts.image.srcset; var found, temp, pxRatio, windowWidth; @@ -2143,7 +2165,7 @@ $.fancybox.stop( $slide ); - effectClassName = 'fancybox-animated fancybox-slide--' + ( slide.pos > self.prevPos ? 'next' : 'previous' ) + ' fancybox-fx-' + effect; + effectClassName = 'fancybox-animated fancybox-slide--' + ( slide.pos >= self.prevPos ? 'next' : 'previous' ) + ' fancybox-fx-' + effect; $slide.removeAttr( 'style' ).removeClass( 'fancybox-slide--current fancybox-slide--next fancybox-slide--previous' ).addClass( effectClassName ); @@ -2337,17 +2359,19 @@ var instance = $(this).data( 'FancyBox' ); // Skip self and closing instances - if (instance && instance.uid !== self.uid && !instance.isClosing) { + if (instance && instance.id !== self.id && !instance.isClosing) { instance.trigger( 'onDeactivate' ); } }); - if ( self.current ) { + if ( self.current || self.isIdle ) { if ( self.$refs.container.index() > 0 ) { self.$refs.container.prependTo( document.body ); } + self.update(); + self.updateControls(); } @@ -2479,8 +2503,10 @@ // ============================================= cleanUp : function( e ) { - var self = this, - instance; + var self = this, + $body = $( 'body' ), + instance, + offset; self.current.$slide.trigger( 'onReset' ); @@ -2502,11 +2528,20 @@ instance.activate(); } else { + $W.scrollTop( self.scrollTop ).scrollLeft( self.scrollLeft ); - $( 'html' ).removeClass( 'fancybox-enabled' ); + $body.removeClass( 'fancybox-active compensate-for-scrollbar' ); + + if ( $body.hasClass( 'fancybox-iosfix' ) ) { + + offset = parseInt(document.body.style.top, 10); + + $body.removeClass( 'fancybox-iosfix' ).css( 'top', '' ).scrollTop( offset * -1 ); + } $( '#fancybox-style-noscroll' ).remove(); + } }, @@ -2555,18 +2590,17 @@ var self = this; - var current = self.current; - var index = current.index; - var opts = current.opts; - var caption = opts.caption; - var $caption = self.$refs.caption; + var current = self.current, + index = current.index, + caption = current.opts.caption, + $caption = self.$refs.caption; // Recalculate content dimensions current.$slide.trigger( 'refresh' ); self.$caption = caption && caption.length ? $caption.html( caption ) : null; - if ( !self.isHiddenControls ) { + if ( !self.isHiddenControls && !self.isIdle ) { self.showControls(); } @@ -2574,9 +2608,14 @@ $('[data-fancybox-count]').html( self.group.length ); $('[data-fancybox-index]').html( index + 1 ); - $('[data-fancybox-prev]').prop('disabled', ( !opts.loop && index <= 0 ) ); - $('[data-fancybox-next]').prop('disabled', ( !opts.loop && index >= self.group.length - 1 ) ); + $('[data-fancybox-prev]').prop( 'disabled', ( !current.opts.loop && index <= 0 ) ); + $('[data-fancybox-next]').prop( 'disabled', ( !current.opts.loop && index >= self.group.length - 1 ) ); + if ( current.type === 'image' ) { + $('[data-fancybox-download]').attr( 'href', current.opts.image.src || current.src ); + } else { + $('[data-fancybox-download]').hide(); + } }, // Hide toolbar and caption @@ -2586,12 +2625,11 @@ this.isHiddenControls = true; - this.$refs.container.removeClass('fancybox-show-infobar fancybox-show-toolbar fancybox-show-caption fancybox-show-nav'); + this.$refs.container.removeClass( 'fancybox-show-infobar fancybox-show-toolbar fancybox-show-caption fancybox-show-nav' ); }, showControls : function() { - var self = this; var opts = self.current ? self.current.opts : self.opts; var $container = self.$refs.container; @@ -2600,10 +2638,10 @@ self.idleSecondsCounter = 0; $container - .toggleClass('fancybox-show-toolbar', !!( opts.toolbar && opts.buttons ) ) - .toggleClass('fancybox-show-infobar', !!( opts.infobar && self.group.length > 1 ) ) - .toggleClass('fancybox-show-nav', !!( opts.arrows && self.group.length > 1 ) ) - .toggleClass('fancybox-is-modal', !!opts.modal ); + .toggleClass( 'fancybox-show-toolbar', !!( opts.toolbar && opts.buttons ) ) + .toggleClass( 'fancybox-show-infobar', !!( opts.infobar && self.group.length > 1 ) ) + .toggleClass( 'fancybox-show-nav', !!( opts.arrows && self.group.length > 1 ) ) + .toggleClass( 'fancybox-is-modal', !!opts.modal ); if ( self.$caption ) { $container.addClass( 'fancybox-show-caption '); @@ -2619,7 +2657,6 @@ // ========================== toggleControls : function() { - if ( this.isHiddenControls ) { this.showControls(); @@ -2662,7 +2699,6 @@ } else if ( $.type( command ) === 'function' ) { command.apply( instance, args ); - } return instance; @@ -2726,7 +2762,6 @@ return window.getComputedStyle && window.getComputedStyle( div ).getPropertyValue('transform') && !(document.documentMode && document.documentMode < 11); }()), - // Helper function to get current visual state of an element // returns array[ top, left, horizontal-scale, vertical-scale, opacity ] // ===================================================================== @@ -2910,24 +2945,25 @@ // ============================================ function _run( e ) { - var target = e.currentTarget, + var $target = $( e.currentTarget ), opts = e.data ? e.data.options : {}, - items = opts.selector ? $( opts.selector ) : ( e.data ? e.data.items : [] ), - value = $( target ).attr( 'data-fancybox' ) || '', + value = $target.attr( 'data-fancybox' ) || '', index = 0, - active = $.fancybox.getInstance(); - - e.preventDefault(); + items = []; // Avoid opening multiple times - if ( active && active.current.opts.$orig.is( target ) ) { + if ( e.isDefaultPrevented() ) { return; } + e.preventDefault(); + // Get all related items and find index for clicked one if ( value ) { + items = opts.selector ? $( opts.selector ) : ( e.data ? e.data.items : [] ), items = items.length ? items.filter( '[data-fancybox="' + value + '"]' ) : $( '[data-fancybox="' + value + '"]' ); - index = items.index( target ); + + index = items.index( $target ); // Sometimes current item can not be found // (for example, when slider clones items) @@ -2936,7 +2972,7 @@ } } else { - items = [ target ]; + items = [ $target ]; } $.fancybox.open( items, opts, index ); diff --git a/src/js/fullscreen.js b/src/js/fullscreen.js index 3af3fe48..27143ef6 100644 --- a/src/js/fullscreen.js +++ b/src/js/fullscreen.js @@ -124,13 +124,25 @@ } }; + $.extend(true, $.fancybox.defaults, { + btnTpl : { + fullScreen : + '' + }, + fullScreen : { + autoStart : false + } + }); + $(document).on({ 'onInit.fb' : function(e, instance) { var $container; - var $button = instance.$refs.toolbar.find('[data-fancybox-fullscreen]'); - - if ( instance && !instance.FullScreen && instance.group[ instance.currIndex ].opts.fullScreen ) { + if ( instance && instance.group[ instance.currIndex ].opts.fullScreen ) { $container = instance.$refs.container; $container.on('click.fb-fullscreen', '[data-fancybox-fullscreen]', function(e) { @@ -149,8 +161,8 @@ // Expose API instance.FullScreen = FullScreen; - } else { - $button.hide(); + } else if ( instance ) { + instance.$refs.toolbar.find('[data-fancybox-fullscreen]').hide(); } }, @@ -174,19 +186,25 @@ }); $(document).on(fn.fullscreenchange, function() { - var instance = $.fancybox.getInstance(); + var isFullscreen = FullScreen.isFullscreen(), + instance = $.fancybox.getInstance(); - // If image is zooming, then force to stop and reposition properly - if ( instance.current && instance.current.type === 'image' && instance.isAnimating ) { - instance.current.$content.css( 'transition', 'none' ); + if ( instance ) { - instance.isAnimating = false; + // If image is zooming, then force to stop and reposition properly + if ( instance.current && instance.current.type === 'image' && instance.isAnimating ) { + instance.current.$content.css( 'transition', 'none' ); - instance.update( true, true, 0 ); - } + instance.isAnimating = false; + + instance.update( true, true, 0 ); + } - instance.trigger('onFullscreenChange', FullScreen.isFullscreen() ); + instance.trigger( 'onFullscreenChange', isFullscreen ); + + instance.$refs.container.toggleClass( 'fancybox-is-fullscreen', isFullscreen ); + } }); -}(document, window.jQuery)); +}( document, window.jQuery || jQuery )); diff --git a/src/js/guestures.js b/src/js/guestures.js index 61a37ce8..accef19e 100644 --- a/src/js/guestures.js +++ b/src/js/guestures.js @@ -66,7 +66,7 @@ var isClickable = function( $el ) { - if ( $el.is('a,button,input,select,textarea,label') || $.isFunction( $el.get(0).onclick ) || $el.data('selectable') ) { + if ( $el.is('a,area,button,[role="button"],input,label,select,summary,textarea') || $.isFunction( $el.get(0).onclick ) || $el.data('selectable') ) { return true; } @@ -177,13 +177,14 @@ self.$target = $target; self.$content = $content; self.canTap = true; + self.opts = current.opts.touch; $(document).off( '.fb.touch' ); $(document).on( isTouchDevice ? 'touchend.fb.touch touchcancel.fb.touch' : 'mouseup.fb.touch mouseleave.fb.touch', $.proxy(self, "ontouchend")); $(document).on( isTouchDevice ? 'touchmove.fb.touch' : 'mousemove.fb.touch', $.proxy(self, "ontouchmove")); - if ( !(instance.current.opts.touch || instance.canPan() ) || !( $target.is( self.$stage ) || self.$stage.find( $target ).length ) ) { + if ( !(self.opts || instance.canPan() ) || !( $target.is( self.$stage ) || self.$stage.find( $target ).length ) ) { // Prevent ghosting if ( $target.is('img') ) { @@ -267,7 +268,7 @@ return; } - if ( !( self.instance.current.opts.touch || self.instance.canPan() ) || !self.newPoints || !self.newPoints.length ) { + if ( !( self.opts || self.instance.canPan() ) || !self.newPoints || !self.newPoints.length ) { return; } @@ -314,10 +315,10 @@ self.canTap = false; - if ( self.instance.group.length < 2 && self.instance.opts.touch.vertical ) { + if ( self.instance.group.length < 2 && self.opts.vertical ) { self.isSwiping = 'y'; - } else if ( self.instance.isSliding || self.instance.opts.touch.vertical === false || ( self.instance.opts.touch.vertical === 'auto' && $( window ).width() > 800 ) ) { + } else if ( self.instance.isSliding || self.opts.vertical === false || ( self.opts.vertical === 'auto' && $( window ).width() > 800 ) ) { self.isSwiping = 'x'; } else { @@ -692,7 +693,7 @@ return; } - if ( self.instance.current.opts.touch.momentum === false ) { + if ( self.opts.momentum === false ) { newOffsetX = self.contentLastPos.left; newOffsetY = self.contentLastPos.top; @@ -918,4 +919,4 @@ }); -}(window, document, window.jQuery)); +}( window, document, window.jQuery || jQuery )); diff --git a/src/js/hash.js b/src/js/hash.js index ea2037fe..9caeee0e 100644 --- a/src/js/hash.js +++ b/src/js/hash.js @@ -95,129 +95,119 @@ return opts.hash || ( opts.$orig ? opts.$orig.data( 'fancybox' ) : '' ); } - // Star when DOM becomes ready + // Start when DOM becomes ready $(function() { - // Small delay is used to allow other scripts to process "dom ready" event - setTimeout(function() { + // Update hash when opening/closing fancyBox + $(document).on({ + 'onInit.fb' : function( e, instance ) { + var url, gallery; - // Check if this module is not disabled - if ( $.fancybox.defaults.hash === false ) { - return; - } + if ( instance.group[ instance.currIndex ].opts.hash === false ) { + return; + } - // Update hash when opening/closing fancyBox - $(document).on({ - 'onInit.fb' : function( e, instance ) { - var url, gallery; + url = parseUrl(); + gallery = getGalleryID( instance ); - if ( instance.group[ instance.currIndex ].opts.hash === false ) { - return; - } + // Make sure gallery start index matches index from hash + if ( gallery && url.gallery && gallery == url.gallery ) { + instance.currIndex = url.index - 1; + } - url = parseUrl(); - gallery = getGalleryID( instance ); + }, - // Make sure gallery start index matches index from hash - if ( gallery && url.gallery && gallery == url.gallery ) { - instance.currIndex = url.index - 1; - } + 'beforeShow.fb' : function( e, instance, current ) { + var gallery; - }, + if ( !current || current.opts.hash === false ) { + return; + } - 'beforeShow.fb' : function( e, instance, current ) { - var gallery; + gallery = getGalleryID( instance ); - if ( !current || current.opts.hash === false ) { - return; - } + // Update window hash + if ( gallery && gallery !== '' ) { - gallery = getGalleryID( instance ); + if ( window.location.hash.indexOf( gallery ) < 0 ) { + instance.opts.origHash = window.location.hash; + } - // Update window hash - if ( gallery && gallery !== '' ) { + currentHash = gallery + ( instance.group.length > 1 ? '-' + ( current.index + 1 ) : '' ); - if ( window.location.hash.indexOf( gallery ) < 0 ) { - instance.opts.origHash = window.location.hash; - } + if ( 'replaceState' in window.history ) { + if ( timerID ) { + clearTimeout( timerID ); + } - currentHash = gallery + ( instance.group.length > 1 ? '-' + ( current.index + 1 ) : '' ); + timerID = setTimeout(function() { + window.history[ shouldCreateHistory ? 'pushState' : 'replaceState' ]( {} , document.title, window.location.pathname + window.location.search + '#' + currentHash ); - if ( 'replaceState' in window.history ) { - if ( timerID ) { - clearTimeout( timerID ); - } + timerID = null; - timerID = setTimeout(function() { - window.history[ shouldCreateHistory ? 'pushState' : 'replaceState' ]( {} , document.title, window.location.pathname + window.location.search + '#' + currentHash ); + shouldCreateHistory = false; - timerID = null; + }, 300); - shouldCreateHistory = false; + } else { + window.location.hash = currentHash; + } - }, 300); + } - } else { - window.location.hash = currentHash; - } + }, - } + 'beforeClose.fb' : function( e, instance, current ) { + var gallery, origHash; - }, + if ( timerID ) { + clearTimeout( timerID ); + } - 'beforeClose.fb' : function( e, instance, current ) { - var gallery, origHash; + if ( current.opts.hash === false ) { + return; + } - if ( timerID ) { - clearTimeout( timerID ); - } + gallery = getGalleryID( instance ); + origHash = instance && instance.opts.origHash ? instance.opts.origHash : ''; - if ( current.opts.hash === false ) { - return; - } + // Remove hash from location bar + if ( gallery && gallery !== '' ) { - gallery = getGalleryID( instance ); - origHash = instance && instance.opts.origHash ? instance.opts.origHash : ''; + if ( 'replaceState' in history ) { + window.history.replaceState( {} , document.title, window.location.pathname + window.location.search + origHash ); - // Remove hash from location bar - if ( gallery && gallery !== '' ) { + } else { + window.location.hash = origHash; - if ( 'replaceState' in history ) { - window.history.replaceState( {} , document.title, window.location.pathname + window.location.search + origHash ); + // Keep original scroll position + $( window ).scrollTop( instance.scrollTop ).scrollLeft( instance.scrollLeft ); + } + } - } else { - window.location.hash = origHash; + currentHash = null; + } + }); - // Keep original scroll position - $( window ).scrollTop( instance.scrollTop ).scrollLeft( instance.scrollLeft ); - } - } + // Check if need to close after url has changed + $(window).on('hashchange.fb', function() { + var url = parseUrl(); + if ( $.fancybox.getInstance() ) { + if ( currentHash && currentHash !== url.gallery + '-' + url.index && !( url.index === 1 && currentHash == url.gallery ) ) { currentHash = null; - } - }); - // Check if need to close after url has changed - $(window).on('hashchange.fb', function() { - var url = parseUrl(); - - if ( $.fancybox.getInstance() ) { - if ( currentHash && currentHash !== url.gallery + '-' + url.index && !( url.index === 1 && currentHash == url.gallery ) ) { - currentHash = null; - - $.fancybox.close(); - } - - } else if ( url.gallery !== '' ) { - triggerFromUrl( url ); + $.fancybox.close(); } - }); - // Check current hash and trigger click event on matching element to start fancyBox, if needed - triggerFromUrl( parseUrl() ); + } else if ( url.gallery !== '' ) { + triggerFromUrl( url ); + } + }); - }, 50); + // Check current hash and trigger click event on matching element to start fancyBox, if needed + triggerFromUrl( parseUrl() ); }); -}(document, window, window.jQuery)); +}( document, window, window.jQuery || jQuery )); diff --git a/src/js/media.js b/src/js/media.js index fb993474..8daa2445 100644 --- a/src/js/media.js +++ b/src/js/media.js @@ -210,7 +210,7 @@ item.opts.slideClass += ' fancybox-slide--' + ( provider == 'gmap_place' || provider == 'gmap_search' ? 'map' : 'video' ); } - } else { + } else if ( url ) { // If no content type is found, then set it to `image` as fallback item.type = 'image'; @@ -220,4 +220,4 @@ }); -}(window.jQuery)); +}( window.jQuery || jQuery )); diff --git a/src/js/share.js b/src/js/share.js new file mode 100644 index 00000000..446f0a5b --- /dev/null +++ b/src/js/share.js @@ -0,0 +1,57 @@ +//// ========================================================================== +// +// Share +// Displays simple form for sharing current url +// +// ========================================================================== +;(function (document, $) { + 'use strict'; + $.extend(true, $.fancybox.defaults, { + btnTpl : { + share : + '' + }, + share : { + tpl : + '
' + + '

{{SHARE}}

' + + '

' + + '' + + '' + + 'Facebook' + + '' + + '' + + '' + + 'Pinterest' + + '' + + '' + + '' + + 'Twitter' + + '' + + '

' + + '
' + } + }); + + $(document).on('click', '[data-fancybox-share]', function() { + + var f = $.fancybox.getInstance(); + + if ( f ) { + $.fancybox.open({ + src : f.translate( f, f.current.opts.share.tpl.replace( /\{\{src\}\}/g, encodeURI( f.current.src ) ).replace( /\{\{descr\}\}/g, encodeURI( f.current.opts.caption || '' ) ) ), + type : 'html', + opts : { + autoFocus : false, + animationEffect : 'fade' + } + }); + } + + }); + +}( document, window.jQuery || jQuery )); diff --git a/src/js/slideshow.js b/src/js/slideshow.js index b839cf41..b3d52016 100644 --- a/src/js/slideshow.js +++ b/src/js/slideshow.js @@ -10,6 +10,22 @@ ;(function (document, $) { 'use strict'; + $.extend(true, $.fancybox.defaults, { + btnTpl : { + slideShow : + '' + }, + slideShow : { + autoStart : false, + speed : 3000 + } + }); + var SlideShow = function( instance ) { this.instance = instance; this.init(); @@ -19,7 +35,6 @@ timer : null, isActive : false, $button : null, - speed : 3000, init : function() { var self = this; @@ -33,15 +48,15 @@ } }, - set : function() { + set : function( force ) { var self = this; // Check if reached last element - if ( self.instance && self.instance.current && (self.instance.current.opts.loop || self.instance.currIndex < self.instance.group.length - 1 )) { + if ( self.instance && self.instance.current && (force === true || self.instance.current.opts.loop || self.instance.currIndex < self.instance.group.length - 1 )) { self.timer = setTimeout(function() { - self.instance.next(); + self.instance.jumpTo( (self.instance.currIndex + 1) % self.instance.group.length ); - }, self.instance.current.opts.slideShow.speed || self.speed); + }, self.instance.current.opts.slideShow.speed); } else { self.stop(); @@ -63,17 +78,15 @@ var self = this; var current = self.instance.current; - if ( self.instance && current && ( current.opts.loop || current.index < self.instance.group.length - 1 )) { - + if ( current ) { self.isActive = true; self.$button .attr( 'title', current.opts.i18n[ current.opts.lang ].PLAY_STOP ) + .removeClass( 'fancybox-button--play' ) .addClass( 'fancybox-button--pause' ); - if ( current.isComplete ) { - self.set(); - } + self.set( true ); } }, @@ -85,7 +98,8 @@ self.$button .attr( 'title', current.opts.i18n[ current.opts.lang ].PLAY_START ) - .removeClass( 'fancybox-button--pause' ); + .removeClass( 'fancybox-button--pause' ) + .addClass( 'fancybox-button--play' ); self.isActive = false; }, @@ -167,4 +181,4 @@ } }); -}(document, window.jQuery)); +}( document, window.jQuery || jQuery )); diff --git a/src/js/thumbs.js b/src/js/thumbs.js index 30b0b1db..1f052f78 100644 --- a/src/js/thumbs.js +++ b/src/js/thumbs.js @@ -7,6 +7,21 @@ ;(function (document, $) { 'use strict'; + $.extend(true, $.fancybox.defaults, { + btnTpl : { + thumbs : + '' + }, + thumbs : { + autoStart : false, + hideOnClose : true + } + }); + var FancyThumbs = function( instance ) { this.instance = instance; this.init(); @@ -228,4 +243,4 @@ }); -}(document, window.jQuery)); +}( document, window.jQuery || jQuery )); From 2148f301d5c57193ea46ebaf1e3b36308775a768 Mon Sep 17 00:00:00 2001 From: Janis Skarnelis Date: Mon, 6 Nov 2017 17:45:43 +0200 Subject: [PATCH 14/56] Updated to v3.2 --- docs/index.html | 246 +++++++++++++++++++++++++++--------------------- 1 file changed, 138 insertions(+), 108 deletions(-) diff --git a/docs/index.html b/docs/index.html index 436ece52..70fab19f 100644 --- a/docs/index.html +++ b/docs/index.html @@ -91,10 +91,6 @@ border-bottom: 1px solid #eee; } - h2:first-of-type { - margin-top: 0; - } - h3 { margin-top: 2em; font-size: 1.25em; @@ -402,7 +398,8 @@

Important

  • If you already have jQuery on your page, you shouldn't include it second time
  • Do not include both fancybox.js and fancybox.min.js files
  • - Some functionality (ajax, iframes, etc) will not work when you're opening local files on your computer, + Some functionality (ajax, iframes, etc) will not work + when you're opening local file directly on your browser, the code must be running on a web server
  • @@ -422,11 +419,11 @@

    Package Managers

    fancyBox can also be installed via Bower or npm.

    -
    # Bower
    -bower install fancybox --save
    -
    -# NPM
    +
    # NPM
     npm install @fancyapps/fancybox --save
    +
    +# Bower
    +bower install fancybox --save
     
    @@ -449,6 +446,10 @@

    Initialize with data attributes

    <img src="thumbnail.jpg" alt="" /> </a>
    +

    + View demo on CodePen +

    +

    If you choose this method, default settings will be applied. See Options section for examples how to customize by changing defaults or using data-options attribute. @@ -466,6 +467,9 @@

    Initialize with JavaScript

    }); </script>
    +

    + View demo on CodePen +

    Using this method, click event handler is attached only to the currently selected elements. @@ -479,7 +483,7 @@

    Initialize with JavaScript

    });

    - View demo on CodePen + View demo on CodePen

    Manual calling of fancyBox

    @@ -492,6 +496,10 @@

    Manual calling of fancyBox

    $.fancybox.open('<div class="message"><h2>Hello!</h2><p>You are awesome!</p></div>');
    +

    + View demo on CodePen +

    +

    See API section for more information and examples.

    @@ -512,15 +520,18 @@

    Grouping

    </a> +

    + View demo on CodePen +

    -

    Important

    +

    Important

    -

    - fancyBox attempts to automatically detect the type of content based on the given url. +

    + fancyBox attempts to automatically detect the type of content based on the given url. - If it cannot be detected, the type can also be set manually using data-type attribute: + If it cannot be detected, the type can also be set manually using data-type attribute: -

    <a href="images.php?id=123" data-type="image" data-caption="Caption">
    +				
    <a href="images.php?id=123" data-type="image" data-caption="Caption">
     	Show image
     </a>

    @@ -547,7 +558,7 @@

    Images

    </a>

    - View demo on CodePen + View demo on CodePen

    @@ -566,7 +577,7 @@

    Images

    <img src="thumbnail.jpg" /> </a>

    - View demo on CodePen + View demo on CodePen

    @@ -578,7 +589,7 @@

    Images

    <img src="thumbnail.jpg" /> </a>

    - View demo on CodePen + View demo on CodePen

    @@ -591,7 +602,7 @@

    Images

    });

    - View demo on CodePen + View demo on CodePen

    Inline HTML

    @@ -610,10 +621,10 @@

    Inline HTML

    <a data-fancybox data-src="#hidden-content" href="javascript:;">
    -	Hidden div
    +	Trigger the fancyBox
     </a>

    - View demo on CodePen + View demo on CodePen

    @@ -631,7 +642,7 @@

    Ajax

    AJAX content </a>

    - View demo on CodePen + View demo on CodePen

    @@ -643,7 +654,7 @@

    Ajax

    </a>

    - View demo on CodePen + View demo on CodePen

    Iframe

    @@ -662,7 +673,7 @@

    Iframe

    </a>

    - View demo on CodePen + View demo on CodePen

    @@ -723,7 +734,7 @@

    Iframe

    })

    - View demo on CodePen + View demo on CodePen

    @@ -755,7 +766,7 @@

    Embedding

    Instagram photo </a>

    - View demo on CodePen + View demo on CodePen

    Video dimensions

    @@ -771,7 +782,7 @@

    Video dimensions

    max-height : 80%; }

    - View demo on CodePen + View demo on CodePen

    @@ -796,7 +807,7 @@

    Video parameters

    Vimeo video - custom color </a>

    - View demo on CodePen + View demo on CodePen

    @@ -814,7 +825,7 @@

    Video parameters

    } });

    - View demo on CodePen + View demo on CodePen

    + - pre, code { - background: #F4F5F6; - color: #66676E; - } + + + - pre { - padding: 1em; - margin-bottom: 1.5em; - overflow: auto; - min-height: 56px; - max-height: 70vh; - -moz-tab-size: 4; - tab-size: 4; - } + + - -
    -
    -

    fancyBox3 Documentation

    - - -
    -
    - -
    - - - -
    - - - -

    Introduction

    - -

    - fancyBox is a JavaScript library used to present images, videos and any html content in an elegant way. - It has all features you would expect - touch enabled, responsive and fully customizable. -

    - -

    - -

    - Dependencies -

    - -

    - jQuery 3+ is preferred, but fancyBox works with jQuery 1.9.1+ and jQuery 2+ -

    - -

    Important

    - -

    - If you experience issues with image zooming, then update jQuery to the latest (at least v3.2.1). -

    - -

    Compatibility

    - -

    - fancyBox includes support for touch gestures and even supports pinch gestures for zooming. - It is perfectly suited for both mobile and desktop browsers. -

    - -

    - fancyBox has been tested in following browsers/devices: -

    - -
      -
    • Chrome
    • -
    • Firefox
    • -
    • IE10/11
    • -
    • Edge
    • -
    • iOS Safari
    • -
    • Nexus 7 Chrome
    • -
    - -

    Setup

    - -

    - You can install fancyBox by linking .css and .js to your html file. - - Make sure you also load the jQuery library. - Below is a basic HTML template to use as an example: -

    - -
    <!DOCTYPE html>
    +
    +    
    +
    + +
    +
    + +
    +
    +
    +
    + +
    +
    + +
    + +
    +

    Introduction

    + +

    + Get started with fancybox, probably the world’s most popular lightbox script. +

    +
    +
    + +

    + Dependencies +

    + +

    + jQuery 3+ is preferred, but fancybox works with jQuery 1.9.1+ and jQuery 2+ +

    + +

    Compatibility

    + +

    + fancybox includes support for touch gestures and even supports pinch gestures for zooming. It is perfectly suited for both + mobile and desktop browsers. +

    + +

    + fancybox has been tested in following browsers/devices: +

    + +
      +
    • Chrome
    • +
    • Firefox
    • +
    • IE10/11
    • +
    • Edge
    • +
    • iOS Safari
    • +
    • Nexus 7 Chrome
    • +
    + +
    + +
    + +

    Setup

    + +

    + You can install fancybox by linking + .css and + .js files to your html file. Make sure you also load the jQuery library. Below is a basic HTML template + to use as an example: +

    + +
    <!DOCTYPE html>
     <html>
     <head>
     	<meta charset="utf-8">
    @@ -390,309 +311,428 @@ 

    Setup

    </body> </html>
    +

    Download fancybox

    -

    Important

    - -
      -
    • Make sure you add the jQuery library first
    • -
    • If you already have jQuery on your page, you shouldn't include it second time
    • -
    • Do not include both fancybox.js and fancybox.min.js files
    • -
    • - Some functionality (ajax, iframes, etc) will not work - when you're opening local file directly on your browser, - the code must be running on a web server -
    • -
    - -

    Download fancyBox

    +

    + Download the latest version of fancybox on + GitHub. +
    Or just link directly to fancybox files on cdnjs - + https://cdnjs.com/libraries/fancybox. +

    -

    - You can download the latest version of fancyBox on GitHub. -
    - Or just link directly to fancyBox files on cdnjs - https://cdnjs.com/libraries/fancybox. -

    +

    Package Managers

    +

    + fancybox is also available on npm and Bower. +

    -

    Package Managers

    - -

    - fancyBox can also be installed via Bower or npm. -

    - -
    # NPM
    +                    
    # NPM
     npm install @fancyapps/fancybox --save
     
     # Bower
     bower install fancybox --save
     
    +

    + Important +

    - -

    How to Use

    +
    +

    How to Use

    -

    Initialize with data attributes

    +

    Initialize with data attributes

    -

    - The most basic way to use fancyBox is by adding the data-fancybox attribute to a link. - A caption can be added using the data-caption attribute. Example: -

    +

    + The most basic way to use fancybox is by adding the + data-fancybox attribute to your element. This will automatically bind click event that will start fancybox. Use + href or + data-src attribute to specify source of your content. Example: +

    -
    <a href="image.jpg" data-fancybox data-caption="My caption">
    +                    
    <a href="image.jpg" data-fancybox data-caption="Caption for single image">
     	<img src="thumbnail.jpg" alt="" />
     </a>
    -

    - View demo on CodePen -

    - -

    - If you choose this method, default settings will be applied. - See Options section for examples how to customize by changing defaults or using data-options attribute. -

    - -

    Initialize with JavaScript

    +

    + View demo on CodePen +

    -

    - Select elements with a jQuery selector and call the fancybox method: -

    +

    + If you have a group of items, you can use the same attribute + data-fancybox value for each of them to create a gallery. Each group should have a unique value. Example: +

    -
    <script type="text/javascript">
    -	$("[data-fancybox]").fancybox({
    -		// Options will go here
    -	});
    -</script>
    - -

    - View demo on CodePen -

    - -

    - Using this method, click event handler is attached only to the currently selected elements. -
    - To attach click event listener for elements that exist now or in the future, use selector option. Example: -

    - -
    $().fancybox({
    -  selector : '[data-fancybox="images"]',
    -  loop     : true
    -});
    - -

    - View demo on CodePen -

    - -

    Manual calling of fancyBox

    - -

    - fancyBox can be activated at any point within Javascript and therefore does not necessarily need a trigger element. - - Example of displaying a simple message: -

    - -
    $.fancybox.open('<div class="message"><h2>Hello!</h2><p>You are awesome!</p></div>');
    - -

    - View demo on CodePen -

    - -

    - See API section for more information and examples. -

    - -

    Grouping

    - -

    - If you have a group of items, you can use the same attribute data-fancybox value for each of them to create a gallery. - Each group should have a unique value: -

    - -
    <a href="image_1.jpg" data-fancybox="group" data-caption="Caption #1">
    +                    
    <a href="image_1.jpg" data-fancybox="gallery" data-caption="Caption #1">
     	<img src="thumbnail_1.jpg" alt="" />
     </a>
     
    -<a href="image_2.jpg" data-fancybox="group" data-caption="Caption #2">
    +<a href="image_2.jpg" data-fancybox="gallery" data-caption="Caption #2">
     	<img src="thumbnail_2.jpg" alt="" />
     </a>
     
    +

    + View demo on CodePen +

    -

    - View demo on CodePen -

    - -

    Important

    +

    + If you choose this method, default settings will be applied. See + options section for examples how to customize by changing defaults or using + data-options attribute. +

    -

    - fancyBox attempts to automatically detect the type of content based on the given url. +

    Initialize with JavaScript

    - If it cannot be detected, the type can also be set manually using data-type attribute: +

    + Select your elements with a jQuery selector (you can use any valid selector) and call the + fancybox method: +

    -
    <a href="images.php?id=123" data-type="image" data-caption="Caption">
    -	Show image
    -</a>
    -

    +
    $('[data-fancybox="gallery"]').fancybox({
    +	// Options will go here
    +});
    +
    +

    + View demo on CodePen +

    +

    + Sometimes you might need to bind fancybox to dynamically added elements. Use + selector option to attach click event listener for elements that exist now or in the future. Example: +

    - -

    Media types

    +
    +
    +

    Media types

    -

    Images

    +

    Images

    -

    - The standard way of using fancyBox is with a number of thumbnail images that link to larger images: -

    +

    + The standard way of using fancybox is with a number of thumbnail images that link to larger images: +

    -
    <a href="image.jpg" data-fancybox="images" data-caption="My caption">
    +                    
    <a href="image.jpg" data-fancybox="images" data-caption="My caption">
     	<img src="thumbnail.jpg" alt="" />
     </a>
    -

    - View demo on CodePen -

    +

    + View demo on CodePen +

    -

    - By default, fancyBox fully preloads an image before displaying it. - You can choose to display the image right away. - It will render and show the full size image while the data is being received. - To do so, some attributes are necessary: -

    +

    + By default, fancybox fully preloads an image before displaying it. You can choose to display the image right away. It will + render and show the full size image while the data is being received. To do so, some attributes are + necessary: +

    -
      -
    • data-width - the real width of the image
    • -
    • data-height - the real height of the image
    • -
    +
      +
    • + data-width   - the real width of the image
    • +
    • + data-height - the real height of the image
    • +
    -
    <a href="image.jpg" data-fancybox="images" data-width="2048" data-height="1365">
    +                    
    <a href="image.jpg" data-fancybox="images" data-width="2048" data-height="1365">
         <img src="thumbnail.jpg" />
     </a>
    -

    - View demo on CodePen -

    +

    + View demo on CodePen +

    + +

    + You can also use these + width and + height properties to control size of the image. This can be used to make images look sharper on retina + displays. Example: +

    + +
    $('[data-fancybox="images"]').fancybox({
    +    afterLoad : function(instance, current) {
    +        var pixelRatio = window.devicePixelRatio || 1;
    +
    +        if ( pixelRatio > 1.5 ) {
    +            current.width  = current.width  / pixelRatio;
    +            current.height = current.height / pixelRatio;
    +        }
    +    }
    +});
    + +

    + View demo on CodePen +

    -

    - fancyBox supports "scrset" so I can display different images based on viewport width. You can use this to improve download times for mobile users and over time save bandwidth. - Example: -

    +

    + fancybox supports "srcset" so it can display different images based on viewport width. You can use this to improve download + times for mobile users and over time save bandwidth. Example: +

    -
    <a href="medium.jpg" data-fancybox="images" data-srcset="large.jpg 1600w, medium.jpg 1200w, small.jpg 640w">
    +                    
    <a href="medium.jpg" data-fancybox="images" data-srcset="large.jpg 1600w, medium.jpg 1200w, small.jpg 640w">
     	<img src="thumbnail.jpg" />
     </a>
    -

    - View demo on CodePen -

    +

    + View demo on CodePen +

    -

    - It is also possible to protect images from downloading by right-click. - While this does not protect from truly determined users, it should discourage the vast majority from ripping off your files. -

    +

    + It is also possible to protect images from downloading by right-click. While this does not protect from truly determined + users, it should discourage the vast majority from ripping off your files. Optionally, put the watermark + over image. +

    -
    $('[data-fancybox]').fancybox({
    +                    
    $('[data-fancybox]').fancybox({
     	protect: true
     });
    -

    - View demo on CodePen -

    +

    + View demo on CodePen +

    + +

    Video

    + +

    + YouTube and Vimeo videos can be used with fancyBox by just providing the page URL. Link to MP4 video directly or use trigger + element to display hidden + <video> element. +

    -

    Inline HTML

    +

    + Use + data-width and + data-height attributes to customize video dimensions and + data-ratio for the aspect ratio. +

    -

    - For inline content, create a hidden element with unique id: -

    +
    <a data-fancybox href="https://www.youtube.com/watch?v=_sI_Ps7JSEk">
    +    YouTube video
    +</a>
    +
    +<a data-fancybox href="https://vimeo.com/191947042">
    +    Vimeo video
    +</a>
     
    -			
    <div style="display: none;" id="hidden-content">
    +<a data-fancybox data-width="640" data-height="360" href="video.mp4">
    +    Direct link to MP4 video
    +</a>
    +
    +<a data-fancybox href="#myVideo">
    +    HTML5 video element
    +</a>
    +
    +<video width="640" height="320" controls id="myVideo" style="display:none;">
    +    <source src="https://www.html5rocks.com/en/tutorials/video/basics/Chrome_ImF.mp4" type="video/mp4">
    +    <source src="https://www.html5rocks.com/en/tutorials/video/basics/Chrome_ImF.webm" type="video/webm">
    +    <source src="https://www.html5rocks.com/en/tutorials/video/basics/Chrome_ImF.ogv" type="video/ogg">
    +    Your browser doesn't support HTML5 video tag.
    +</video>
    +

    + View demo on CodePen +

    + +

    + Controlling YouTube & Vimeo video via URL parameters: +

    + +
    <a data-fancybox href="https://www.youtube.com/watch?v=_sI_Ps7JSEk&amp;autoplay=1&amp;rel=0&amp;controls=0&amp;showinfo=0">
    +    YouTube video - hide controls and info
    +</a>
    +
    +<a data-fancybox href="https://vimeo.com/191947042?color=f00">
    +    Vimeo video - custom color
    +</a>
    +

    + View demo on CodePen +

    + +

    + Via JavaScript: +

    + +
    $('[data-fancybox]').fancybox({
    +    youtube : {
    +        controls : 0,
    +        showinfo : 0
    +    },
    +    vimeo : {
    +        color : 'f00'
    +    }
    +});
    +

    + View demo on CodePen +

    + + + +

    Inline HTML

    + +

    + For inline content, create a hidden element with unique id: +

    + +
    <div style="display: none;" id="hidden-content">
     	<h2>Hello</h2>
     	<p>You are awesome.</p>
     </div>
    -

    - And then simply create a link having data-src attribute that matches ID of the element you want to open (preceded by a hash mark (#); in this example - #hidden-content): -

    +

    + And then simply create a link having + data-src attribute that matches ID of the element you want to open (preceded by a hash mark (#); in this + example - + #hidden-content): +

    -
    <a data-fancybox data-src="#hidden-content" href="javascript:;">
    -	Trigger the fancyBox
    +                    
    <a data-fancybox data-src="#hidden-content" href="javascript:;">
    +	Trigger the fancybox
     </a>
    -

    - View demo on CodePen -

    +

    + View demo on CodePen +

    -

    - The script will append small close button (if you have not disabled by smallBtn:false) - and will not apply any styles except for centering. Therefore you can easily set custom dimensions using CSS. -

    +

    + The script will append small close button (if you have not disabled by + smallBtn:false) and will not apply any styles except for centering. Therefore you can easily set custom dimensions + using CSS. +

    -

    Ajax

    +

    Ajax

    -

    - To load content via AJAX, you need to add a data-type="ajax" attribute to your link: -

    +

    + To load content via AJAX, you need to add a + data-type="ajax" attribute to your link: +

    -
    <a data-fancybox data-type="ajax" data-src="my_page.com/path/to/ajax/" href="javascript:;">
    +                    
    <a data-fancybox data-type="ajax" data-src="my_page.com/path/to/ajax/" href="javascript:;">
     	AJAX content
     </a>
    -

    - View demo on CodePen -

    +

    + View demo on CodePen +

    -

    - Additionally it is possible to define a selector with the data-filter attribute to show only a part of the response. The selector can be any string, that is a valid jQuery selector: -

    +

    + Additionally it is possible to define a selector with the + data-filter attribute to show only a part of the response. The selector can be any string, that is a valid jQuery + selector: +

    -
    <a data-fancybox data-type="ajax" data-src="my_page.com/path/to/ajax/" data-filter="#two" href="javascript:;">
    +                    
    <a data-fancybox data-type="ajax" data-src="my_page.com/path/to/ajax/" data-filter="#two" href="javascript:;">
     	AJAX content
     </a>
     
    -

    - View demo on CodePen -

    +

    + View demo on CodePen +

    -

    Iframe

    +

    Iframe

    -

    - If the content can be shown on a page, and placement in an iframe is not blocked by script or security configuration of that page, - it can be presented in a fancyBox: -

    +

    + If the content can be shown on a page, and placement in an iframe is not blocked by script or security configuration of that + page, it can be presented in a fancybox: +

    -
    <a data-fancybox data-type="iframe" data-src="http://codepen.io/fancyapps/full/jyEGGG/" href="javascript:;">
    +                    
    <a data-fancybox data-type="iframe" data-src="http://codepen.io/fancyapps/full/jyEGGG/" href="javascript:;">
     	Webpage
     </a>
     
     <a data-fancybox data-type="iframe" data-src="https://mozilla.github.io/pdf.js/web/viewer.html" href="javascript:;">
    -	Sample PDF
    +    Sample PDF file 
     </a>
     
    -

    - View demo on CodePen -

    +

    + View demo on CodePen +

    -

    - To access and control fancyBox in parent window from inside an iframe: -

    +

    + To access and control fancybox in parent window from inside an iframe: +

    -
    // Adjust iframe height according to the contents
    +                    
    // Adjust iframe height according to the contents
     parent.jQuery.fancybox.getInstance().update();
     
    -// Close current fancyBox instance
    +// Close current fancybox instance
     parent.jQuery.fancybox.getInstance().close();
    -

    - Iframe dimensions can be controlled by CSS: -

    +

    + Iframe dimensions can be controlled by CSS: +

    -
    .fancybox-slide--iframe .fancybox-content {
    +                    
    .fancybox-slide--iframe .fancybox-content {
     	width  : 800px;
     	height : 600px;
     	max-width  : 80%;
    @@ -700,12 +740,11 @@ 

    Iframe

    margin: 0; }
    +

    + These CSS rules can be overridden by JS, if needed: +

    -

    - These CSS rules can be overridden by JS, if needed: -

    - -
    $("[data-fancybox]").fancybox({
    +                    
    $("[data-fancybox]").fancybox({
     	iframe : {
     		css : {
     			width : '600px'
    @@ -713,19 +752,18 @@ 

    Iframe

    } });
    +

    + If you have not disabled iframe preloading (using + preload option), then the script will atempt to calculate content dimensions and will adjust width/height + of iframe to fit with content in it. Keep in mind, that due to + same origin policy, there are some limitations. +

    -

    - If you have not disabled iframe preloading (using preload option), then the script will atempt to - calculate content dimensions and will adjust width/height of iframe to fit with content in it. - Keep in mind, that due to same origin policy, - there are some limitations. -

    - -

    - This example will disable iframe preloading and will display small close button next to iframe instead of the toolbar: -

    +

    + This example will disable iframe preloading and will display small close button next to iframe instead of the toolbar: +

    -
    $('[data-fancybox]').fancybox({
    +                    
    $('[data-fancybox]').fancybox({
     	toolbar  : false,
     	smallBtn : true,
     	iframe : {
    @@ -733,209 +771,108 @@ 

    Iframe

    } })
    -

    - View demo on CodePen -

    - - - -

    Embedding

    - -

    - Supported sites can be used with fancyBox by just providing the page URL: -

    - -
    <a data-fancybox href="https://www.youtube.com/watch?v=_sI_Ps7JSEk">
    -  YouTube video
    -</a>
    -
    -<a data-fancybox href="https://vimeo.com/191947042">
    -  Vimeo video
    -</a>
    -
    -<a data-fancybox href="https://www.google.com/maps/search/Empire+State+Building/">
    -	Google Map
    -</a>
    -
    -<a data-fancybox href="https://www.instagram.com/p/BNXYW8-goPI/?taken-by=jamesrelfdyer" data-caption="<span title=&quot;Edited&quot;>balloon rides at dawn ✨🎈<br>was such a magical experience floating over napa valley as the golden light hit the hills.<br><a href=&quot;https://www.instagram.com/jamesrelfdyer/&quot;>@jamesrelfdyer</a></span>">
    -	Instagram photo
    -</a>
    -

    - View demo on CodePen -

    - -

    Video dimensions

    - -

    - Resize video display with the following CSS: -

    - -
    .fancybox-slide--video .fancybox-content {
    -	width  : 800px;
    -	height : 600px;
    -	max-width  : 80%;
    -	max-height : 80%;
    -}
    -

    - View demo on CodePen -

    - -

    - Obviously, you can choose any size you like, any combination with min/max values. -
    - Aspect ratio lock for videos is not implemented yet, but if you wish, you can use this snippet. -

    - - - -

    Video parameters

    - -

    - Controlling a video via URL parameters: -

    - -
    <a data-fancybox href="https://www.youtube.com/watch?v=_sI_Ps7JSEk&amp;autoplay=1&amp;rel=0&amp;controls=0&amp;showinfo=0">
    -  YouTube video - hide controls and info
    -</a>
    -
    -<a data-fancybox href="https://vimeo.com/191947042?color=f00">
    -  Vimeo video - custom color
    -</a>
    -

    - View demo on CodePen -

    - - -

    - Via JavaScript: -

    - -
    $('[data-fancybox]').fancybox({
    -	youtube : {
    -		controls : 0,
    -		showinfo : 0
    -	},
    -	vimeo : {
    -		color : 'f00'
    -	}
    -});
    -

    - View demo on CodePen -

    +

    + View demo on CodePen +

    - -

    Options

    - -

    - Quick reference for all default options as defined in the source: -

    - -
    var defaults = {
    +                    

    + Quick reference for all default options as defined in the source: +

    +
    var defaults = {
         // Enable infinite gallery navigation
    -    loop : false,
    -
    -    // Space around image, ignored if zoomed-in or viewport width is smaller than 800px
    -    margin : [44, 0],
    +    loop: false,
     
         // Horizontal space between slides
    -    gutter : 50,
    +    gutter: 50,
     
         // Enable keyboard navigation
    -    keyboard : true,
    +    keyboard: true,
     
         // Should display navigation arrows at the screen edges
    -    arrows : true,
    +    arrows: true,
     
    -    // Should display infobar (counter and arrows at the top)
    -    infobar : true,
    +    // Should display counter at the top left corner
    +    infobar: true,
    +
    +    // Should display close button (using `btnTpl.smallBtn` template) over the content
    +    // Can be true, false, "auto"
    +    // If "auto" - will be automatically enabled for "html", "inline" or "ajax" items
    +    smallBtn: "auto",
     
         // Should display toolbar (buttons at the top)
    -    toolbar : true,
    +    // Can be true, false, "auto"
    +    // If "auto" - will be automatically hidden if "smallBtn" is enabled
    +    toolbar: "auto",
     
         // What buttons should appear in the top right corner.
         // Buttons will be created using templates from `btnTpl` option
         // and they will be placed into toolbar (class="fancybox-toolbar"` element)
    -    buttons : [
    -        'slideShow',
    -        'fullScreen',
    -        'thumbs',
    -        'share',
    +    buttons: [
    +        "zoom",
    +        //'share',
    +        //'slideShow',
    +        //'fullScreen',
             //'download',
    -        //'zoom',
    -        'close'
    +        "thumbs",
    +        "close"
         ],
     
         // Detect "idle" time in seconds
    -    idleTime : 3,
    -
    -    // Should display buttons at top right corner of the content
    -    // If 'auto' - they will be created for content having type 'html', 'inline' or 'ajax'
    -    // Use template from `btnTpl.smallBtn` for customization
    -    smallBtn : 'auto',
    +    idleTime: 3,
     
         // Disable right-click and use simple image protection for images
    -    protect : false,
    +    protect: false,
     
         // Shortcut to make content "modal" - disable keyboard navigtion, hide buttons, etc
    -    modal : false,
    -
    -    image : {
    +    modal: false,
     
    +    image: {
             // Wait for images to load before displaying
    -        // Requires predefined image dimensions
    -        // If 'auto' - will zoom in thumbnail if 'width' and 'height' attributes are found
    -        preload : "auto"
    -
    +        //   true  - wait for image to load and then display;
    +        //   false - display thumbnail and load the full-sized image over top,
    +        //           requires predefined image dimensions (`data-width` and `data-height` attributes)
    +        preload: false
         },
     
    -    ajax : {
    -
    +    ajax: {
             // Object containing settings for ajax request
    -        settings : {
    -
    +        settings: {
                 // This helps to indicate that request comes from the modal
                 // Feel free to change naming
    -            data : {
    -                fancybox : true
    +            data: {
    +                fancybox: true
                 }
             }
    -
         },
     
    -    iframe : {
    -
    +    iframe: {
             // Iframe template
    -        tpl : '<iframe id="fancybox-frame{rnd}" name="fancybox-frame{rnd}" class="fancybox-iframe" frameborder="0" vspace="0" hspace="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen allowtransparency="true" src=""></iframe>',
    +        tpl:
    +            '<iframe id="fancybox-frame{rnd}" name="fancybox-frame{rnd}" class="fancybox-iframe" frameborder="0" vspace="0" hspace="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen allowtransparency="true" src=""></iframe>',
     
             // Preload iframe before displaying it
             // This allows to calculate iframe content width and height
             // (note: Due to "Same Origin Policy", you can't get cross domain data).
    -        preload : true,
    +        preload: true,
     
             // Custom CSS styling for iframe wrapping element
             // You can use this to set custom iframe dimensions
    -        css : {},
    +        css: {},
     
             // Iframe tag attributes
    -        attr : {
    -            scrolling : 'auto'
    +        attr: {
    +            scrolling: "auto"
             }
    -
         },
     
         // Default content type if cannot be detected automatically
    -    defaultType : 'image',
    +    defaultType: "image",
     
         // Open/close animation type
         // Possible values:
    @@ -944,14 +881,14 @@ 

    Options

    // "fade" // "zoom-in-out" // - animationEffect : "zoom", + animationEffect: "zoom", // Duration in ms for open/close animation - animationDuration : 500, + animationDuration: 366, // Should image change opacity while zooming // If opacity is "auto", then opacity will be changed if image and thumbnail have different aspect ratios - zoomOpacity : "auto", + zoomOpacity: "auto", // Transition effect between slides // @@ -964,109 +901,112 @@

    Options

    // "zoom-in-out' // "rotate' // - transitionEffect : "fade", + transitionEffect: "fade", // Duration in ms for transition animation - transitionDuration : 366, + transitionDuration: 366, // Custom CSS class for slide element - slideClass : '', + slideClass: "", // Custom CSS class for layout - baseClass : '', + baseClass: "", // Base template for layout - baseTpl : + baseTpl: '<div class="fancybox-container" role="dialog" tabindex="-1">' + - '<div class="fancybox-bg"></div>' + - '<div class="fancybox-inner">' + - '<div class="fancybox-infobar">' + - '<span data-fancybox-index></span>&nbsp;/&nbsp;<span data-fancybox-count></span>' + - '</div>' + - '<div class="fancybox-toolbar">{{buttons}}</div>' + - '<div class="fancybox-navigation">{{arrows}}</div>' + - '<div class="fancybox-stage"></div>' + - '<div class="fancybox-caption-wrap"><div class="fancybox-caption"></div></div>' + - '</div>' + - '</div>', + '<div class="fancybox-bg"></div>' + + '<div class="fancybox-inner">' + + '<div class="fancybox-infobar">' + + "<span data-fancybox-index></span>&nbsp;/&nbsp;<span data-fancybox-count></span>" + + "</div>" + + '<div class="fancybox-toolbar">{{buttons}}</div>' + + '<div class="fancybox-navigation">{{arrows}}</div>' + + '<div class="fancybox-stage"></div>' + + '<div class="fancybox-caption"></div>' + + "</div>" + + "</div>", // Loading indicator template - spinnerTpl : '<div class="fancybox-loading"></div>', + spinnerTpl: '<div class="fancybox-loading"></div>', // Error message template - errorTpl : '<div class="fancybox-error"><p>{{ERROR}}<p></div>', - - btnTpl : { - - download : '<a download data-fancybox-download class="fancybox-button fancybox-button--download" title="{{DOWNLOAD}}">' + - '<svg viewBox="0 0 40 40">' + - '<path d="M20,23 L20,8 L20,23 L13,16 L20,23 L27,16 L20,23 M26,28 L13,28 L27,28 L14,28" />' + - '</svg>' + - '</a>', - - zoom : '<button data-fancybox-zoom class="fancybox-button fancybox-button--zoom" title="{{ZOOM}}">' + - '<svg viewBox="0 0 40 40">' + - '<path d="M 18,17 m-8,0 a 8,8 0 1,0 16,0 a 8,8 0 1,0 -16,0 M25,23 L31,29 L25,23" />' + - '</svg>' + - '</button>', - - close : '<button data-fancybox-close class="fancybox-button fancybox-button--close" title="{{CLOSE}}">' + - '<svg viewBox="0 0 40 40">' + - '<path d="M10,10 L30,30 M30,10 L10,30" />' + - '</svg>' + - '</button>', + errorTpl: '<div class="fancybox-error"><p>{{ERROR}}</p></div>', + + btnTpl: { + download: + '<a download data-fancybox-download class="fancybox-button fancybox-button--download" title="{{DOWNLOAD}}">' + + '<svg viewBox="0 0 40 40">' + + '<path d="M13,16 L20,23 L27,16 M20,7 L20,23 M10,24 L10,28 L30,28 L30,24" />' + + "</svg>" + + "</a>", + + zoom: + '<button data-fancybox-zoom class="fancybox-button fancybox-button--zoom" title="{{ZOOM}}">' + + '<svg viewBox="0 0 40 40">' + + '<path d="M18,17 m-8,0 a8,8 0 1,0 16,0 a8,8 0 1,0 -16,0 M24,22 L31,29" />' + + "</svg>" + + "</button>", + + close: + '<button data-fancybox-close class="fancybox-button fancybox-button--close" title="{{CLOSE}}">' + + '<svg viewBox="0 0 40 40">' + + '<path d="M10,10 L30,30 M30,10 L10,30" />' + + "</svg>" + + "</button>", // This small close button will be appended to your html/inline/ajax content by default, // if "smallBtn" option is not set to false - smallBtn : '<button data-fancybox-close class="fancybox-close-small" title="{{CLOSE}}"></button>', + smallBtn: + '<button data-fancybox-close class="fancybox-close-small" title="{{CLOSE}}"><svg viewBox="0 0 32 32"><path d="M10,10 L22,22 M22,10 L10,22"></path></svg></button>', // Arrows - arrowLeft : '<button data-fancybox-prev class="fancybox-button fancybox-button--arrow_left" title="{{PREV}}">' + - '<svg viewBox="0 0 40 40">' + - '<path d="M10,20 L30,20 L10,20 L18,28 L10,20 L18,12 L10,20"></path>' + - '</svg>' + - '</button>', - - arrowRight : '<button data-fancybox-next class="fancybox-button fancybox-button--arrow_right" title="{{NEXT}}">' + - '<svg viewBox="0 0 40 40">' + - '<path d="M30,20 L10,20 L30,20 L22,28 L30,20 L22,12 L30,20"></path>' + - '</svg>' + - '</button>' + arrowLeft: + '<button data-fancybox-prev class="fancybox-button fancybox-button--arrow_left" title="{{PREV}}">' + + '<svg viewBox="0 0 40 40">' + + '<path d="M18,12 L10,20 L18,28 M10,20 L30,20"></path>' + + "</svg>" + + "</button>", + + arrowRight: + '<button data-fancybox-next class="fancybox-button fancybox-button--arrow_right" title="{{NEXT}}">' + + '<svg viewBox="0 0 40 40">' + + '<path d="M10,20 L30,20 M22,12 L30,20 L22,28"></path>' + + "</svg>" + + "</button>" }, // Container is injected into this element - parentEl : 'body', - + parentEl: "body", // Focus handling // ============== // Try to focus on the first focusable element after opening - autoFocus : false, + autoFocus: false, // Put focus back to active element after closing - backFocus : true, + backFocus: true, // Do not let user to focus on element outside modal content - trapFocus : true, - + trapFocus: true, // Module specific options // ======================= - fullScreen : { - autoStart : false, + fullScreen: { + autoStart: false }, // Set `touch: false` to disable dragging/swiping - touch : { - vertical : true, // Allow to drag content vertically - momentum : true // Continue movement after releasing mouse/touch when panning + touch: { + vertical: true, // Allow to drag content vertically + momentum: true // Continue movement after releasing mouse/touch when panning }, // Hash value when initializing manually, // set `false` to disable hash change - hash : null, + hash: null, // Customize or add new media types // Example: @@ -1079,23 +1019,23 @@

    Options

    } } */ - media : {}, + media: {}, - slideShow : { - autoStart : false, - speed : 4000 + slideShow: { + autoStart: false, + speed: 4000 }, - thumbs : { - autoStart : false, // Display thumbnails on opening - hideOnClose : true, // Hide thumbnail grid when closing animation starts - parentEl : '.fancybox-container', // Container is injected into this element - axis : 'y' // Vertical (y) or horizontal (x) scrolling + thumbs: { + autoStart: false, // Display thumbnails on opening + hideOnClose: true, // Hide thumbnail grid when closing animation starts + parentEl: ".fancybox-container", // Container is injected into this element + axis: "y" // Vertical (y) or horizontal (x) scrolling }, // Use mousewheel to navigate gallery // If 'auto' - enabled for images only - wheel : 'auto', + wheel: "auto", // Callbacks //========== @@ -1104,25 +1044,24 @@

    Options

    // Example: /* afterShow: function( instance, current ) { - console.info( 'Clicked element:' ); - console.info( current.opts.$orig ); + console.info( 'Clicked element:' ); + console.info( current.opts.$orig ); } */ - onInit : $.noop, // When instance has been initialized - - beforeLoad : $.noop, // Before the content of a slide is being loaded - afterLoad : $.noop, // When the content of a slide is done loading + onInit: $.noop, // When instance has been initialized - beforeShow : $.noop, // Before open animation starts - afterShow : $.noop, // When content is done loading and animating + beforeLoad: $.noop, // Before the content of a slide is being loaded + afterLoad: $.noop, // When the content of a slide is done loading - beforeClose : $.noop, // Before the instance attempts to close. Return false to cancel the close. - afterClose : $.noop, // After instance has been closed + beforeShow: $.noop, // Before open animation starts + afterShow: $.noop, // When content is done loading and animating - onActivate : $.noop, // When instance is brought to front - onDeactivate : $.noop, // When other instance has been activated + beforeClose: $.noop, // Before the instance attempts to close. Return false to cancel the close. + afterClose: $.noop, // After instance has been closed + onActivate: $.noop, // When instance is brought to front + onDeactivate: $.noop, // When other instance has been activated // Interaction // =========== @@ -1139,168 +1078,160 @@

    Options

    // false - do nothing // Clicked on the content - clickContent : function( current, event ) { - return current.type === 'image' ? 'zoom' : false; + clickContent: function(current, event) { + return current.type === "image" ? "zoom" : false; }, // Clicked on the slide - clickSlide : 'close', + clickSlide: "close", - // Clicked on the background (backdrop) element - clickOutside : 'close', + // Clicked on the background (backdrop) element; + // if you have not changed the layout, then most likely you need to use `clickSlide` option + clickOutside: "close", // Same as previous two, but for double click - dblclickContent : false, - dblclickSlide : false, - dblclickOutside : false, - + dblclickContent: false, + dblclickSlide: false, + dblclickOutside: false, // Custom options when mobile device is detected // ============================================= - mobile : { - idleTime : false, - margin : 0, + mobile: { + idleTime: false, - clickContent : function( current, event ) { - return current.type === 'image' ? 'toggleControls' : false; + clickContent: function(current, event) { + return current.type === "image" ? "toggleControls" : false; }, - clickSlide : function( current, event ) { - return current.type === 'image' ? 'toggleControls' : 'close'; + clickSlide: function(current, event) { + return current.type === "image" ? "toggleControls" : "close"; }, - dblclickContent : function( current, event ) { - return current.type === 'image' ? 'zoom' : false; + dblclickContent: function(current, event) { + return current.type === "image" ? "zoom" : false; }, - dblclickSlide : function( current, event ) { - return current.type === 'image' ? 'zoom' : false; + dblclickSlide: function(current, event) { + return current.type === "image" ? "zoom" : false; } }, - // Internationalization - // ============ - - lang : 'en', - i18n : { - 'en' : { - CLOSE : 'Close', - NEXT : 'Next', - PREV : 'Previous', - ERROR : 'The requested content cannot be loaded. <br/> Please try again later.', - PLAY_START : 'Start slideshow', - PLAY_STOP : 'Pause slideshow', - FULL_SCREEN : 'Full screen', - THUMBS : 'Thumbnails', - DOWNLOAD : 'Download', - SHARE : 'Share', - ZOOM : 'Zoom' + // ==================== + + lang: "en", + i18n: { + en: { + CLOSE: "Close", + NEXT: "Next", + PREV: "Previous", + ERROR: "The requested content cannot be loaded. <br/> Please try again later.", + PLAY_START: "Start slideshow", + PLAY_STOP: "Pause slideshow", + FULL_SCREEN: "Full screen", + THUMBS: "Thumbnails", + DOWNLOAD: "Download", + SHARE: "Share", + ZOOM: "Zoom" }, - 'de' : { - CLOSE : 'Schliessen', - NEXT : 'Weiter', - PREV : 'Zurück', - ERROR : 'Die angeforderten Daten konnten nicht geladen werden. <br/> Bitte versuchen Sie es später nochmal.', - PLAY_START : 'Diaschau starten', - PLAY_STOP : 'Diaschau beenden', - FULL_SCREEN : 'Vollbild', - THUMBS : 'Vorschaubilder', - DOWNLOAD : 'Herunterladen', - SHARE : 'Teilen', - ZOOM : 'Maßstab' + de: { + CLOSE: "Schliessen", + NEXT: "Weiter", + PREV: "Zurück", + ERROR: "Die angeforderten Daten konnten nicht geladen werden. <br/> Bitte versuchen Sie es später nochmal.", + PLAY_START: "Diaschau starten", + PLAY_STOP: "Diaschau beenden", + FULL_SCREEN: "Vollbild", + THUMBS: "Vorschaubilder", + DOWNLOAD: "Herunterladen", + SHARE: "Teilen", + ZOOM: "Maßstab" } } - }; -
    +
    -

    - Set instance options by passing a valid object to fancybox() method: -

    +

    + Set instance options by passing a valid object to + fancybox() method: +

    -
    $("[data-fancybox]").fancybox({
    +                    
    $("[data-fancybox]").fancybox({
     	thumbs : {
     		autoStart : true
     	}
     });
    -

    - Plugin options / defaults are exposed in $.fancybox.defaults namespace so you can easily adjust them globally: +

    + Plugin options / defaults are exposed in + $.fancybox.defaults namespace so you can easily adjust them globally: -

    +

    -
    $.fancybox.defaults.animationEffect = "fade";
    +
    $.fancybox.defaults.animationEffect = "fade";
    -

    - Custom options for each element individually can be set by adding a data-options - attribute to the element. +

    + Custom options for each element individually can be set by adding a + data-options attribute to the element. This attribute should contain the properly formatted JSON object. +

    +

    + It is also possible to quickly set any option using + parameterized name of the selected option, for example, + animationEffect would be + data-animation-effect: +

    - This attribute should contain the properly formatted JSON object: -

    +
    <a data-fancybox data-options='{"caption" : "My caption", "src" : "https://codepen.io/about/", "type" : "iframe"}' href="javascript:;" class="btn btn-primary">
    +    Example #1
    +</a>
     
    -				
    <a data-fancybox data-options='{"caption" : "My caption", "src" : "https://codepen.io/about/", "type" : "iframe"}' href="javascript:;" class="btn">
    -	Open external page
    +<a data-fancybox data-animation-effect="false" href="https://source.unsplash.com/0JYgd2QuMfw/1500x1000" class="btn btn-primary">
    +    Example #2
     </a>
     
    -

    - View demo on CodePen -

    - - - - -

    API

    +

    API

    -

    - The fancyBox API offers a couple of methods to control fancyBox. +

    + The fancybox API offers a couple of methods to control fancybox. This gives you the ability to extend the plugin and to integrate + it with other web application components. +

    - This gives you the ability to extend the plugin and to integrate it with other web application components. -

    +

    Core methods

    -

    Core methods

    +

    + Core methods are methods which affect/handle instances: +

    -

    - Core methods are methods which affect/handle instances: -

    - -
    // Close only the currently active or all fancyBox instances
    -$.fancybox.close( true );
    -
    -// Open the fancyBox right away
    +                    
    // Start new fancybox instance
     $.fancybox.open( items, opts, index );
    -
    - -

    - Gallery items can be collection of jQuery objects or array containing plain objects. This can be used, for example, to create custom click event. -

    +// Get refrence to currently active fancybox instance +$.fancybox.getInstance(); -
    var $links = $('.fancybox');
    +// Close currently active fancybox instance (pass `true` to close all instances) 
    +$.fancybox.close();
     
    -$links.on('click', function() {
    -
    -	$.fancybox.open( $links, {
    -		// Custom options
    -	}, $links.index( this ) );
    -
    -	return false;
    -});
    +// Close all instances and unbind all events +$.fancybox.destroy(); +
    +

    Starting facybox

    -

    - When creating group objects manually, each item should follow this pattern: -

    +

    + When creating group objects manually, each item should follow this pattern: +

    -
    {
    +                    
    {
     	src  : '' // Source of the content
     	type : '' // Content type: image|inline|ajax|iframe|html (optional)
     	opts : {} // Object containing item options (optional)
    @@ -1308,35 +1239,37 @@ 

    Core methods

    -

    - Example of opening image gallery programmatically: -

    +

    + Example of opening image gallery programmatically: +

    -
    $.fancybox.open([
    +                    
    $.fancybox.open([
     	{
     		src  : '1_b.jpg',
     		opts : {
    -			caption : 'First caption'
    +			caption : 'First caption',
    +			thumb   : '1_s.jpg'
     		}
     	},
     	{
     		src  : '2_b.jpg',
     		opts : {
    -			caption : 'Second caption'
    +			caption : 'Second caption',
    +			thumb   : '2_s.jpg'
     		}
     	}
     ], {
     	loop : false
     });
    -

    - View demo on CodePen -

    +

    + View demo on CodePen +

    -

    - It is also possible to pass only one object. Example of opening inline content: -

    +

    + It is also possible to pass only one object. Example of opening inline content: +

    -
    $.fancybox.open({
    +                    
    $.fancybox.open({
     	src  : '#hidden-content',
     	type : 'inline',
     	opts : {
    @@ -1346,53 +1279,70 @@ 

    Core methods

    } });
    -

    - View demo on CodePen -

    +

    + View demo on CodePen +

    + +

    + If you wish to display some html content (for example, a message), then you can use a simpler syntax. It is advised to use + a wrapper around your content. +

    + +
    $.fancybox.open('<div class="message"><h2>Hello!</h2><p>You are awesome!</p></div>');
    +

    + View demo on CodePen +

    + +

    + Group items can be collection of jQuery objects, too. This can be used, for example, to create custom click event: +

    + +
    var $links = $('.fancybox');
    +    
    +$links.on('click', function() {
     
    -				

    - If you wish to display some html content (for example, a message), then you can use a simpler syntax. - It is advised to use a wrapper around your content. -

    + $.fancybox.open( $links, { + // Custom options + }, $links.index( this ) ); -
    $.fancybox.open('<div class="message"><h2>Hello!</h2><p>You are awesome!</p></div>');
    -

    - View demo on CodePen -

    + return false; +});
    +

    Instance methods

    +

    + In order to use these methods, you need an instance of the plugin's object. There are 3 common ways to get the reference. +

    -

    Instance methods

    +

    + 1) Using API method to get currently active instance: +

    -

    - In order to use these methods, you need an instance of the plugin's object. -

    +
    var instance = $.fancybox.getInstance();
    -
    var instance = $.fancybox.open(
    +                    

    + 2) While starting fancybox programmatically: +

    +
    var instance = $.fancybox.open(
     	// Your content and options
     );
    -

    - Get reference to currently active instance: -

    - -
    var instance = $.fancybox.getInstance();
    -

    - The first argument of the callback is reference to instance: -

    +

    + 3) From within the callback - first argument is always a reference to current instance: +

    -
    $("[data-fancybox]").fancybox({
    +                    
    $("[data-fancybox]").fancybox({
     	afterShow : function( instance, current ) {
     		console.info( instance );
     	}
     });
    -

    - Once you have a reference to fancyBox instance the following methods are available: -

    +

    + Once you have a reference to fancybox instance the following methods are available: +

    -
    // Go to next gallery item
    +                    
    // Go to next gallery item
     instance.next( duration );
     
     // Go to previous gallery item
    @@ -1442,28 +1392,25 @@ 

    Instance methods

    -

    - You can also do something like this: -

    +

    + You can also do something like this: +

    -
    $.fancybox.getInstance().jumpTo(1);
    +
    $.fancybox.getInstance().jumpTo(1);
    -

    - or simply: -

    +

    + or simply: +

    -
    $.fancybox.getInstance('jumpTo', 1);
    +
    $.fancybox.getInstance('jumpTo', 1);
    +

    Events

    +

    + fancybox fires several events: +

    - -

    Events

    - -

    - fancyBox fires several events: -

    - -
    beforeLoad   : Before the content of a slide is being loaded
    +                    
    beforeLoad   : Before the content of a slide is being loaded
     afterLoad    : When the content of a slide is done loading
     
     beforeShow   : Before open animation starts
    @@ -1476,12 +1423,11 @@ 

    Events

    onActivate : When instance is brought to front onDeactivate : When other instance has been activated
    +

    + Event callbacks can be set as function properties of the options object passed to fancybox initialization function: +

    -

    - Event callbacks can be set as function properties of the options object passed to fancyBox initialization function: -

    - -
    <script type="text/javascript">
    +                    
    <script type="text/javascript">
     	$("[data-fancybox]").fancybox({
     		afterShow: function( instance, slide ) {
     
    @@ -1504,50 +1450,54 @@ 

    Events

    }); </script>
    -

    - Each callback receives two parameters - current fancyBox instance and current gallery object, if exists. -

    - -

    - It is also possible to attach event handler for all instances. - To prevent interfering with other scripts, these events have been namespaced to .fb. - These handlers receive 3 parameters - event, current fancyBox instance and current gallery object. -

    -

    - Here is an example of binding to the afterShow event: -

    - -
    $(document).on('afterShow.fb', function( e, instance, slide ) {
    +                    

    + Each callback receives two parameters - current fancybox instance and current gallery object, if exists. +

    + +

    + It is also possible to attach event handler for all instances. To prevent interfering with other scripts, these events have + been namespaced to + .fb. These handlers receive 3 parameters - event, current fancybox instance and current gallery object. +

    +

    + Here is an example of binding to the + afterShow event: +

    + +
    $(document).on('afterShow.fb', function( e, instance, slide ) {
     	// Your code goes here
     });
    -

    - If you wish to prevent closing of the modal (for example, after form submit), you can use beforeClose - callback. Simply return false: -

    +

    + If you wish to prevent closing of the modal (for example, after form submit), you can use + beforeClose callback. Simply return + false: +

    -
    beforeClose : function( instance, current, e ) {
    +                    
    beforeClose : function( instance, current, e ) {
     	if ( $('#my-field').val() == '' ) {
     		return false;
     	}
     }
     
    -

    Modules

    +
    +
    +

    Modules

    -

    - fancyBox code is split into several files (modules) that extend core functionality. - You can build your own fancyBox version by excluding unnecessary modules, if needed. - Each one has their own js and/or css files. -

    +

    + fancybox code is split into several files (modules) that extend core functionality. You can build your own fancybox version + by excluding unnecessary modules, if needed. Each one has their own + js and/or + css files. +

    -

    - Some modules can be customized and controlled programmatically. - List of all possible options: -

    +

    + Some modules can be customized and controlled programmatically. List of all possible options: +

    -
    fullScreen : {
    +                    
    fullScreen : {
     	autoStart : false,
     },
     
    @@ -1587,41 +1537,43 @@ 

    Modules

    -

    - Example (show thumbnails on start): -

    +

    + Example (show thumbnails on start): +

    -
    $('[data-fancybox="images"]').fancybox({
    +                    
    $('[data-fancybox="images"]').fancybox({
     	thumbs : {
     		autoStart : true
     	}
     })
    -

    - View demo on CodePen -

    +

    + View demo on CodePen +

    -

    - If you would inspect fancyBox instance object, you would find that same keys ar captialized - these are references for each module object. - Also, you would notice that fancyBox uses common naming convention to prefix jQuery objects with $. -

    +

    + If you would inspect fancybox instance object, you would find that same keys ar captialized - these are references for each + module object. Also, you would notice that fancybox uses common naming convention to prefix jQuery + objects with + $. +

    -

    - This is how you, for example, can access thumbnail grid element: -

    +

    + This is how you, for example, can access thumbnail grid element: +

    -
    $.fancybox.getInstance().Thumbs.$grid
    +
    $.fancybox.getInstance().Thumbs.$grid
    -

    - This example shows how to call method that toggles thumbnails: -

    +

    + This example shows how to call method that toggles thumbnails: +

    -
    $.fancybox.getInstance().Thumbs.toggle();
    +
    $.fancybox.getInstance().Thumbs.toggle();
    -

    - List of available methods: -

    +

    + List of available methods: +

    -
    Thumbs.focus()
    +                    
    Thumbs.focus()
     Thumbs.update();
     Thumbs.hide();
     Thumbs.show();
    @@ -1638,61 +1590,62 @@ 

    Modules

    SlideShow.toggle();
    -

    - If you wish to disable hash module, use this snippet (after including JS file): -

    - -
    $.fancybox.defaults.hash = false;
    - - -
    +
    -
    +
    -

    FAQ

    +

    FAQ

    -

    1. Opening/closing causes fixed element to jump

    +

    + #1 Opening/closing causes fixed element to jump

    -

    - Simply add compensate-for-scrollbar CSS class to your fixed positioned elements. - Example of using Bootstrap navbar component: -

    +

    + Simply add + compensate-for-scrollbar CSS class to your fixed positioned elements. Example of using Bootstrap navbar component: +

    -
    <nav class="navbar navbar-inverse navbar-fixed-top compensate-for-scrollbar">
    +                    
    <nav class="navbar navbar-inverse navbar-fixed-top compensate-for-scrollbar">
     	<div class="container">
     		..
     	</div>
     </nav>
    -

    - View demo on CodePen -

    +

    + View demo on CodePen +

    -

    - The script measures width of the scrollbar and creates compensate-for-scrollbar CSS class - that uses this value for margin-right property. - Therefore, if your element has width:100%, you should positon it using left and right properties instead. Example: -

    +

    + The script measures width of the scrollbar and creates + compensate-for-scrollbar CSS class that uses this value for + margin-right property. Therefore, if your element has + width:100%, you should positon it using + left and + right properties instead. Example: +

    -
    .navbar {
    +                    
    .navbar {
     	position: fixed;
     	top: 0;
     	left: 0;
     	right: 0;
     }
    -

    2. How to customize caption

    +

    + #2 How to customize caption

    -

    - You can use caption option that accepts a function and is called for each group element. Example of appending image download link: -

    +

    + You can use + caption option that accepts a function and is called for each group element. Example of appending image + download link: +

    -
    $( '[data-fancybox="images"]' ).fancybox({
    +                    
    $( '[data-fancybox="images"]' ).fancybox({
         caption : function( instance, item ) {
             var caption = $(this).data('caption') || '';
     
    @@ -1703,16 +1656,16 @@ 

    2. How to customize caption

    return caption; } });
    -

    - View demo on CodePen -

    +

    + View demo on CodePen +

    -

    - Add current image index and image count (the total number of images in the gallery) right in the caption: -

    +

    + Add current image index and image count (the total number of images in the gallery) right in the caption: +

    -
    $( '[data-fancybox="images"]' ).fancybox({
    +                    
    $( '[data-fancybox="images"]' ).fancybox({
         infobar : false,
         caption : function( instance, item ) {
             var caption = $(this).data('caption') || '';
    @@ -1720,33 +1673,33 @@ 

    2. How to customize caption

    return ( caption.length ? caption + '<br />' : '' ) + 'Image <span data-fancybox-index></span> of <span data-fancybox-count></span>'; } });
    -

    - View demo on CodePen -

    +

    + View demo on CodePen +

    +

    + Inside + caption method, + this refers to the clicked element. Example of using different source for caption: +

    - -

    - Inside caption method, this refers to the clicked element. Example of using different source for caption: -

    - -
    $( '[data-fancybox]' ).fancybox({
    +                    
    $( '[data-fancybox]' ).fancybox({
     	caption : function( instance, item ) {
     		return $(this).find('figcaption').html();
     	}
     });
    -

    - View demo on CodePen -

    +

    + View demo on CodePen +

    +

    + #3 How to create custom button in the toolbar

    -

    3. How to create custom button in the toolbar

    +

    + Example of creating reusable button: +

    -

    - Example of creating reusable button: -

    - -
    // Create template for the button
    +                    
    // Create template for the button
     $.fancybox.defaults.btnTpl.fb = '<button data-fancybox-fb class="fancybox-button fancybox-button--fb" title="Facebook">' +
         '<svg viewBox="0 0 24 24">' +
             '<path d="M22.676 0H1.324C.594 0 0 .593 0 1.324v21.352C0 23.408.593 24 1.324 24h11.494v-9.294h-3.13v-3.62h3.13V8.41c0-3.1 1.894-4.785 4.66-4.785 1.324 0 2.463.097 2.795.14v3.24h-1.92c-1.5 0-1.793.722-1.793 1.772v2.31h3.584l-.465 3.63h-3.12V24h6.115c.733 0 1.325-.592 1.325-1.324V1.324C24 .594 23.408 0 22.676 0"/>' +
    @@ -1755,155 +1708,150 @@ 

    3. How to create custom button in the toolbar

    // Make button clickable using event delegation $('body').on('click', '[data-fancybox-fb]', function() { - window.open("https://www.facebook.com/sharer/sharer.php?u="+encodeURIComponent(window.location.href)+"&t="+encodeURIComponent(document.title), '','left=0,top=0,width=600,height=300,menubar=no,toolbar=no,resizable=yes,scrollbars=yes'); + window.open("https://www.facebook.com/sharer/sharer.php?u="+encodeURIComponent(window.location.href)+"&t="+encodeURIComponent(document.title), '','left=0,top=0,width=600,height=300,menubar=no,toolbar=no,resizable=yes,scrollbars=yes'); }); // Customize buttons $( '[data-fancybox="images"]' ).fancybox({ - buttons : [ - 'fb', - 'close' - ] + buttons : [ + 'fb', + 'close' + ] });
    -

    - View demo on CodePen -

    - -

    4. How to reposition thumbnail grid

    - -

    - There is currenty no JS option to change thumbnail grid position. - But fancyBox is designed so that you can use CSS to change position or dimension for each block - (e.g., content area, caption or thumbnail grid). - This gives you freedom to completely change the look and feel of the modal window, if needed. - - View demo on CodePen -

    +

    + View demo on CodePen +

    -

    5. How to disable touch gestures/swiping

    +

    + #4 How to reposition thumbnail grid

    -

    - When you want to make your content selectable or clickable, you have two options: -

    +

    + There is currenty no JS option to change thumbnail grid position. But fancybox is designed so that you can use CSS to change + position or dimension for each block (e.g., content area, caption or thumbnail grid). This gives + you freedom to completely change the look and feel of the modal window, if needed. -

      -
    • - disable touch gestures completely by setting touch:false -
    • -
    • - add data-selectable="true" attribute to your html element -
    • -
    + View demo on CodePen +

    -

    - View demo on CodePen -

    +

    + #5 How to disable touch gestures/swiping

    +

    + When you want to make your content selectable or clickable, you have two options: +

    -
    +
      +
    • + disable touch gestures completely by setting + touch:false +
    • +
    • + add + data-selectable="true" attribute to your html element +
    • +
    +

    + View demo on CodePen +

    -
    - + - - + - + + \ No newline at end of file diff --git a/package.json b/package.json index ad8943c1..abbe080d 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "@fancyapps/fancybox", "description": "Touch enabled, responsive and fully customizable jQuery lightbox script", - "version": "3.2.10", + "version": "3.3.0", "homepage": "http://fancyapps.com/fancybox/", "main": "./dist/jquery.fancybox.js", "author": "fancyApps", diff --git a/src/css/core.css b/src/css/core.css index a89c022d..6763a78a 100644 --- a/src/css/core.css +++ b/src/css/core.css @@ -1,342 +1,364 @@ -body.fancybox-active { - overflow: hidden; +body.compensate-for-scrollbar { + overflow: hidden; } -body.fancybox-iosfix { - position: fixed; +.fancybox-active { + height: auto; +} + +.fancybox-iosfix { + height: 100%; left: 0; - right: 0; + overflow: hidden; + position: fixed; + width: 100%; } .fancybox-is-hidden { - position: absolute; - top: -9999px; - left: -9999px; - visibility: hidden; + left: -9999px; + margin: 0; + position: absolute !important; + top: -9999px; + visibility: hidden; } .fancybox-container { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - z-index: 99992; - -webkit-tap-highlight-color: rgba(0,0,0,0); - backface-visibility: hidden; - transform: translateZ(0); - font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; + backface-visibility: hidden; + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', + 'Segoe UI Emoji', 'Segoe UI Symbol'; + height: 100%; + left: 0; + position: fixed; + -webkit-tap-highlight-color: transparent; + top: 0; + transform: translateZ(0); + width: 100%; + z-index: 99992; +} + +.fancybox-container * { + box-sizing: border-box; } .fancybox-outer, .fancybox-inner, .fancybox-bg, .fancybox-stage { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; + bottom: 0; + left: 0; + position: absolute; + right: 0; + top: 0; } .fancybox-outer { - overflow-y: auto; - -webkit-overflow-scrolling: touch; + -webkit-overflow-scrolling: touch; + overflow-y: auto; } .fancybox-bg { - background: rgb(30,30,30); - opacity: 0; - transition-duration: inherit; - transition-property: opacity; - transition-timing-function: cubic-bezier(.47,0,.74,.71); + background: rgb(30, 30, 30); + opacity: 0; + transition-duration: inherit; + transition-property: opacity; + transition-timing-function: cubic-bezier(.47, 0, .74, .71); } .fancybox-is-open .fancybox-bg { - opacity: 0.87; - transition-timing-function: cubic-bezier(.22,.61,.36,1); + opacity: .87; + transition-timing-function: cubic-bezier(.22, .61, .36, 1); } .fancybox-infobar, .fancybox-toolbar, -.fancybox-caption-wrap { - position: absolute; - direction: ltr; - z-index: 99997; - opacity: 0; - visibility: hidden; - transition: opacity .25s, visibility 0s linear .25s; - box-sizing: border-box; +.fancybox-caption, +.fancybox-navigation .fancybox-button { + direction: ltr; + opacity: 0; + position: absolute; + transition: opacity .25s, visibility 0s linear .25s; + visibility: hidden; + z-index: 99997; } .fancybox-show-infobar .fancybox-infobar, .fancybox-show-toolbar .fancybox-toolbar, -.fancybox-show-caption .fancybox-caption-wrap { - opacity: 1; - visibility: visible; - transition: opacity .25s, visibility 0s; +.fancybox-show-caption .fancybox-caption, +.fancybox-show-nav .fancybox-navigation .fancybox-button { + opacity: 1; + transition: opacity .25s, visibility 0s; + visibility: visible; } .fancybox-infobar { - top: 0; - left: 0; - font-size: 13px; - padding: 0 10px; - height: 44px; - min-width: 44px; - line-height: 44px; - color: #ccc; - text-align: center; - pointer-events: none; - user-select: none; - -webkit-touch-callout: none; - -webkit-tap-highlight-color: rgba(0,0,0,0); - -webkit-font-smoothing: subpixel-antialiased; - mix-blend-mode: exclusion; + color: #ccc; + font-size: 13px; + -webkit-font-smoothing: subpixel-antialiased; + height: 44px; + left: 0; + line-height: 44px; + min-width: 44px; + mix-blend-mode: difference; + padding: 0 10px; + pointer-events: none; + text-align: center; + top: 0; + -webkit-touch-callout: none; + user-select: none; } .fancybox-toolbar { - top: 0; - right: 0; - margin: 0; - padding: 0; + right: 0; + top: 0; } .fancybox-stage { - overflow: hidden; - direction: ltr; - z-index: 99994; - -webkit-transform: translate3d(0, 0, 0); + direction: ltr; + overflow: visible; + -webkit-transform: translate3d(0, 0, 0); + z-index: 99994; } -.fancybox-is-closing .fancybox-stage { - overflow: visible; +.fancybox-is-open .fancybox-stage { + overflow: hidden; } .fancybox-slide { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - margin: 0; - padding: 0; - overflow: auto; - outline: none; - white-space: normal; - box-sizing: border-box; - text-align: center; - z-index: 99994; - -webkit-overflow-scrolling: touch; - display: none; - backface-visibility: hidden; - transition-property: transform, opacity; + backface-visibility: hidden; + display: none; + height: 100%; + left: 0; + outline: none; + overflow: auto; + -webkit-overflow-scrolling: touch; + padding: 44px; + position: absolute; + text-align: center; + top: 0; + transition-property: transform, opacity; + white-space: normal; + width: 100%; + z-index: 99994; } .fancybox-slide::before { - content: ''; - display: inline-block; - vertical-align: middle; - height: 100%; - width: 0; + content: ''; + display: inline-block; + height: 100%; + margin-right: -.25em; + vertical-align: middle; + width: 0; } .fancybox-is-sliding .fancybox-slide, .fancybox-slide--previous, .fancybox-slide--current, .fancybox-slide--next { - display: block; + display: block; +} + +.fancybox-slide--next { + z-index: 99995; } .fancybox-slide--image { - overflow: visible; + overflow: visible; + padding: 44px 0; } .fancybox-slide--image::before { - display: none; + display: none; } -.fancybox-slide--video .fancybox-content, -.fancybox-slide--video iframe { - background: #000; +.fancybox-slide--html { + padding: 6px 6px 0 6px; } -.fancybox-slide--map .fancybox-content, -.fancybox-slide--map iframe { - background: #E5E3DF; +.fancybox-slide--iframe { + padding: 44px 44px 0; } -.fancybox-slide--next { - z-index: 99995; +.fancybox-content { + background: #fff; + display: inline-block; + margin: 0 0 6px 0; + max-width: 100%; + overflow: auto; + padding: 0; + padding: 24px; + position: relative; + text-align: left; + vertical-align: middle; +} + +.fancybox-slide--image .fancybox-content { + animation-timing-function: cubic-bezier(.5, 0, .14, 1); + backface-visibility: hidden; + background: transparent; + background-repeat: no-repeat; + background-size: 100% 100%; + left: 0; + margin: 0; + max-width: none; + overflow: visible; + padding: 0; + position: absolute; + top: 0; + transform-origin: top left; + transition-property: transform, opacity; + user-select: none; + z-index: 99995; } -.fancybox-slide > * { - display: inline-block; - position: relative; - padding: 24px; - margin: 44px 0 44px; - border-width: 0; - vertical-align: middle; - text-align: left; - background-color: #fff; - overflow: auto; - box-sizing: border-box; +.fancybox-can-zoomOut .fancybox-content { + cursor: zoom-out; } -.fancybox-slide > title, -.fancybox-slide > style, -.fancybox-slide > meta, -.fancybox-slide > link, -.fancybox-slide > script, -.fancybox-slide > base { - display: none; +.fancybox-can-zoomIn .fancybox-content { + cursor: zoom-in; } -.fancybox-slide .fancybox-image-wrap { - position: absolute; - top: 0; - left: 0; - margin: 0; - padding: 0; - border: 0; - z-index: 99995; - background: transparent; - cursor: default; - overflow: visible; - transform-origin: top left; - background-size: 100% 100%; - background-repeat: no-repeat; - backface-visibility: hidden; - user-select: none; - transition-property: transform, opacity; +.fancybox-can-drag .fancybox-content { + cursor: grab; } -.fancybox-can-zoomOut .fancybox-image-wrap { - cursor: zoom-out; +.fancybox-is-dragging .fancybox-content { + cursor: grabbing; } -.fancybox-can-zoomIn .fancybox-image-wrap { - cursor: zoom-in; +.fancybox-container [data-selectable='true'] { + cursor: text; } -.fancybox-can-drag .fancybox-image-wrap { - cursor: grab; +.fancybox-image, +.fancybox-spaceball { + background: transparent; + border: 0; + height: 100%; + left: 0; + margin: 0; + max-height: none; + max-width: none; + padding: 0; + position: absolute; + top: 0; + user-select: none; + width: 100%; } -.fancybox-is-dragging .fancybox-image-wrap { - cursor: grabbing; +.fancybox-spaceball { + z-index: 1; } -.fancybox-image, -.fancybox-spaceball { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - margin: 0; - padding: 0; - border: 0; - max-width: none; - max-height: none; - user-select: none; +.fancybox-slide--html .fancybox-content { + margin-bottom: 6px; } - .fancybox-spaceball { - z-index: 1; +.fancybox-slide--video .fancybox-content, +.fancybox-slide--map .fancybox-content, +.fancybox-slide--iframe .fancybox-content { + height: 100%; + margin: 0; + overflow: visible; + padding: 0; + width: 100%; +} + +.fancybox-slide--video .fancybox-content { + background: #000; +} + +.fancybox-slide--map .fancybox-content { + background: #e5e3df; } .fancybox-slide--iframe .fancybox-content { - padding: 0; - width: 80%; - height: 80%; - max-width: calc(100% - 100px); - max-height: calc(100% - 88px); - overflow: visible; - background: #fff; + background: #fff; + height: calc(100% - 44px); + margin-bottom: 44px; } +.fancybox-video, .fancybox-iframe { - display: block; - margin: 0; - padding: 0; - border: 0; - width: 100%; - height: 100%; - background: #fff; + background: transparent; + border: 0; + height: 100%; + margin: 0; + overflow: hidden; + padding: 0; + width: 100%; +} + +.fancybox-iframe { + vertical-align: top; } .fancybox-error { - margin: 0; - padding: 40px; - width: 100%; - max-width: 380px; - background: #fff; - cursor: default; + background: #fff; + cursor: default; + max-width: 400px; + padding: 40px; + width: 100%; } .fancybox-error p { - margin: 0; - padding: 0; - color: #444; - font-size: 16px; - line-height: 20px; + color: #444; + font-size: 16px; + line-height: 20px; + margin: 0; + padding: 0; } - /* Buttons */ .fancybox-button { - box-sizing: border-box; + background: rgba(30, 30, 30, .6); + border: 0; + border-radius: 0; + cursor: pointer; display: inline-block; - vertical-align: top; - width: 44px; height: 44px; margin: 0; + outline: none; padding: 10px; - border: 0; - border-radius: 0; - background: rgba(30,30,30,0.6); - transition: color .3s ease; - cursor: pointer; - outline: none; + transition: color .2s; + vertical-align: top; + width: 44px; } .fancybox-button, .fancybox-button:visited, .fancybox-button:link { - color: #ccc; + color: #ccc; } .fancybox-button:focus, .fancybox-button:hover { - color: #fff; + color: #fff; } -.fancybox-button[disabled] { - color: #ccc; - cursor: default; - opacity: 0.6; +.fancybox-button.disabled, +.fancybox-button.disabled:hover, +.fancybox-button[disabled], +.fancybox-button[disabled]:hover { + color: #888; + cursor: default; } .fancybox-button svg { display: block; - position: relative; overflow: visible; + position: relative; shape-rendering: geometricPrecision; } .fancybox-button svg path { - fill: currentColor; + fill: transparent; stroke: currentColor; stroke-linejoin: round; stroke-width: 3; } -.fancybox-button--share svg path { - stroke-width: 1; -} - .fancybox-button--play svg path:nth-child(2) { display: none; } @@ -345,275 +367,276 @@ body.fancybox-iosfix { display: none; } -.fancybox-button--zoom svg path { - fill: transparent; +.fancybox-button--play svg path, +.fancybox-button--share svg path, +.fancybox-button--thumbs svg path { + fill: currentColor; } +.fancybox-button--share svg path { + stroke-width: 1; +} /* Navigation arrows */ -.fancybox-navigation { - display: none; +.fancybox-navigation .fancybox-button { + height: 38px; + opacity: 0; + padding: 6px; + position: absolute; + top: 50%; + width: 38px; } -.fancybox-show-nav .fancybox-navigation { - display: block; +.fancybox-show-nav .fancybox-navigation .fancybox-button { + transition: opacity .25s, visibility 0s, color .25s; } -.fancybox-navigation button { +.fancybox-navigation .fancybox-button::after { + content: ''; + left: -25px; + padding: 50px; position: absolute; - top: 50%; - margin: -50px 0 0 0; - z-index: 99997; - background: transparent; - width: 60px; - height: 100px; - padding: 17px; -} - -.fancybox-navigation button:before { - content: ""; - position: absolute; - top: 30px; - right: 10px; - width: 40px; - height: 40px; - background: rgba(30,30,30,0.6); + top: -25px; } .fancybox-navigation .fancybox-button--arrow_left { - left: 0; + left: 6px; } .fancybox-navigation .fancybox-button--arrow_right { - right: 0; + right: 6px; } /* Close button on the top right corner of html content */ .fancybox-close-small { - position: absolute; - top: 0; - right: 0; - width: 40px; - height: 40px; - padding: 0; - margin: 0; - border: 0; - border-radius: 0; - background: transparent; - z-index: 10; - cursor: pointer; -} - -.fancybox-close-small:after { - content: '×'; - position: absolute; - top : 5px; - right: 5px; - width: 30px; - height: 30px; - font: 22px/30px Arial,"Helvetica Neue",Helvetica,sans-serif; - color: #888; - font-weight: 300; - text-align: center; - border-radius: 50%; - border-width: 0; - background-color: transparent; - transition: background-color .25s; - box-sizing: border-box; - z-index: 2; + background: transparent; + border: 0; + border-radius: 0; + color: #555; + cursor: pointer; + height: 44px; + margin: 0; + padding: 6px; + position: absolute; + right: 0; + top: 0; + width: 44px; + z-index: 10; } -.fancybox-close-small:focus { - outline: none; +.fancybox-close-small svg { + fill: transparent; + opacity: .8; + stroke: currentColor; + stroke-width: 1.5; + transition: stroke .1s; } -.fancybox-close-small:focus:after { - outline: 1px dotted #888; +.fancybox-close-small:focus { + outline: none; } -.fancybox-close-small:hover:after { - color: #555; - background: #eee; +.fancybox-close-small:hover svg { + opacity: 1; } .fancybox-slide--image .fancybox-close-small, +.fancybox-slide--video .fancybox-close-small, .fancybox-slide--iframe .fancybox-close-small { - top: 0; - right: -40px; -} - -.fancybox-slide--image .fancybox-close-small:after, -.fancybox-slide--iframe .fancybox-close-small:after { - font-size: 35px; - color: #aaa; + color: #ccc; + padding: 5px; + right: -12px; + top: -44px; } -.fancybox-slide--image .fancybox-close-small:hover:after, -.fancybox-slide--iframe .fancybox-close-small:hover:after { - color: #fff; - background: transparent; +.fancybox-slide--image .fancybox-close-small:hover svg, +.fancybox-slide--video .fancybox-close-small:hover svg, +.fancybox-slide--iframe .fancybox-close-small:hover svg { + background: transparent; + color: #fff; } .fancybox-is-scaling .fancybox-close-small, .fancybox-is-zoomable.fancybox-can-drag .fancybox-close-small { - display: none; + display: none; } /* Caption */ -.fancybox-caption-wrap { - bottom: 0; - left: 0; - right: 0; - padding: 60px 2vw 0 2vw; - background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.1) 20%, rgba(0,0,0,0.2) 40%,rgba(0,0,0,0.6) 80%, rgba(0,0,0,0.8) 100%); - pointer-events: none; +.fancybox-caption { + bottom: 0; + color: #fff; + font-size: 14px; + font-weight: 400; + left: 0; + line-height: 1.5; + padding: 25px 44px 25px 44px; + right: 0; } -.fancybox-caption { - padding: 30px 0; - border-top: 1px solid rgba(255,255,255,0.4); - font-size: 14px; - color: #fff; - line-height: 20px; - -webkit-text-size-adjust: none; +.fancybox-caption::before { + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAEtCAQAAABjBcL7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAHRJREFUKM+Vk8EOgDAIQ0vj/3+xBw8qIZZueFnIKC90MCAI8DlrkHGeqqGIU6lVigrBtpCWqeRWoHDNqs0F7VNVBVxmHRlvoVqjaYkdnDIaivH2HqZ5+oZj3JUzWB+cOz4G48Bg+tsJ/tqu4dLC/4Xb+0GcF5BwBC0AA53qAAAAAElFTkSuQmCC); + background-repeat: repeat-x; + background-size: contain; + bottom: 0; + content: ''; + display: block; + left: 0; + pointer-events: none; + position: absolute; + right: 0; + top: -25px; + z-index: -1; } -.fancybox-caption a, -.fancybox-caption button, -.fancybox-caption select { - pointer-events: all; - position: relative; /* Fix IE11 */ +.fancybox-caption::after { + border-bottom: 1px solid rgba(255, 255, 255, .3); + content: ''; + display: block; + left: 44px; + position: absolute; + right: 44px; + top: 0; } -.fancybox-caption a { - color: #fff; - text-decoration: underline; +.fancybox-caption a, +.fancybox-caption a:link, +.fancybox-caption a:visited { + color: #ccc; + text-decoration: none; } +.fancybox-caption a:hover { + color: #fff; + text-decoration: underline; +} /* Loading indicator */ -.fancybox-slide > .fancybox-loading { - border: 6px solid rgba(100, 100, 100, .4); - border-top: 6px solid rgba(255, 255, 255, .6); - border-radius: 100%; - height: 50px; - width: 50px; - animation: fancybox-rotate .8s infinite linear; - background: transparent; - position: absolute; - top: 50%; - left: 50%; - margin-top: -30px; - margin-left: -30px; - z-index: 99999; +.fancybox-loading { + animation: fancybox-rotate .8s infinite linear; + background: transparent; + border: 6px solid rgba(100, 100, 100, .5); + border-radius: 100%; + border-top-color: #fff; + height: 60px; + left: 50%; + margin: -30px 0 0 -30px; + opacity: .6; + padding: 0; + position: absolute; + top: 50%; + width: 60px; + z-index: 99999; } @keyframes fancybox-rotate { - from { transform: rotate( 0deg ); } - to { transform: rotate( 359deg ); } + from { + transform: rotate(0deg); + } + to { + transform: rotate(359deg); + } } - /* Transition effects */ .fancybox-animated { - transition-timing-function: cubic-bezier(0, 0, 0.25, 1); + transition-timing-function: cubic-bezier(0, 0, .25, 1); } /* transitionEffect: slide */ .fancybox-fx-slide.fancybox-slide--previous { - transform: translate3d(-100%, 0, 0); - opacity: 0; + opacity: 0; + transform: translate3d(-100%, 0, 0); } .fancybox-fx-slide.fancybox-slide--next { - transform: translate3d(100%, 0, 0); - opacity: 0; + opacity: 0; + transform: translate3d(100%, 0, 0); } .fancybox-fx-slide.fancybox-slide--current { - transform: translate3d(0, 0, 0); - opacity: 1; + opacity: 1; + transform: translate3d(0, 0, 0); } /* transitionEffect: fade */ .fancybox-fx-fade.fancybox-slide--previous, .fancybox-fx-fade.fancybox-slide--next { - opacity: 0; - transition-timing-function: cubic-bezier(.19,1,.22,1); + opacity: 0; + transition-timing-function: cubic-bezier(.19, 1, .22, 1); } .fancybox-fx-fade.fancybox-slide--current { - opacity: 1; + opacity: 1; } /* transitionEffect: zoom-in-out */ .fancybox-fx-zoom-in-out.fancybox-slide--previous { - transform: scale3d(1.5, 1.5, 1.5); - opacity: 0; + opacity: 0; + transform: scale3d(1.5, 1.5, 1.5); } .fancybox-fx-zoom-in-out.fancybox-slide--next { - transform: scale3d(0.5, 0.5, 0.5); - opacity: 0; + opacity: 0; + transform: scale3d(.5, .5, .5); } .fancybox-fx-zoom-in-out.fancybox-slide--current { - transform: scale3d(1, 1, 1); - opacity: 1; + opacity: 1; + transform: scale3d(1, 1, 1); } /* transitionEffect: rotate */ .fancybox-fx-rotate.fancybox-slide--previous { - transform: rotate(-360deg); - opacity: 0; + opacity: 0; + transform: rotate(-360deg); } .fancybox-fx-rotate.fancybox-slide--next { - transform: rotate(360deg); - opacity: 0; + opacity: 0; + transform: rotate(360deg); } .fancybox-fx-rotate.fancybox-slide--current { - transform: rotate(0deg); - opacity: 1; + opacity: 1; + transform: rotate(0deg); } /* transitionEffect: circular */ .fancybox-fx-circular.fancybox-slide--previous { - transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0); - opacity: 0; + opacity: 0; + transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0); } .fancybox-fx-circular.fancybox-slide--next { - transform: scale3d(0, 0, 0) translate3d(100%, 0, 0); - opacity: 0; + opacity: 0; + transform: scale3d(0, 0, 0) translate3d(100%, 0, 0); } .fancybox-fx-circular.fancybox-slide--current { - transform: scale3d(1, 1, 1) translate3d(0, 0, 0); - opacity: 1; + opacity: 1; + transform: scale3d(1, 1, 1) translate3d(0, 0, 0); } /* transitionEffect: tube */ .fancybox-fx-tube.fancybox-slide--previous { - transform: translate3d(-100%, 0, 0) scale(0.1) skew(-10deg); + transform: translate3d(-100%, 0, 0) scale(.1) skew(-10deg); } .fancybox-fx-tube.fancybox-slide--next { - transform: translate3d(100%, 0, 0) scale(0.1) skew(10deg); + transform: translate3d(100%, 0, 0) scale(.1) skew(10deg); } .fancybox-fx-tube.fancybox-slide--current { - transform: translate3d(0, 0, 0) scale(1); + transform: translate3d(0, 0, 0) scale(1); } diff --git a/src/css/share.css b/src/css/share.css index 6a87afa8..d6c0393c 100644 --- a/src/css/share.css +++ b/src/css/share.css @@ -1,18 +1,18 @@ /* Share */ .fancybox-share { - padding: 30px; - border-radius: 3px; background: #f4f4f4; + border-radius: 3px; max-width: 90%; + padding: 30px; text-align: center; } .fancybox-share h1 { color: #222; - margin: 0 0 20px 0; font-size: 35px; font-weight: 700; + margin: 0 0 20px 0; } .fancybox-share p { @@ -20,26 +20,25 @@ padding: 0; } -p.fancybox-share__links { - margin-right: -10px; -} - .fancybox-share__button { - display: inline-block; - text-decoration: none; - margin: 0 10px 10px 0; - padding: 0 15px; - min-width: 130px; border: 0; border-radius: 3px; - background: #fff; - white-space: nowrap; + display: inline-block; font-size: 14px; font-weight: 700; line-height: 40px; + margin: 0 5px 10px 5px; + min-width: 130px; + padding: 0 15px; + text-decoration: none; + transition: all .2s; user-select: none; + white-space: nowrap; +} + +.fancybox-share__button:visited, +.fancybox-share__button:link { color: #fff; - transition: all .2s; } .fancybox-share__button:hover { @@ -71,12 +70,12 @@ p.fancybox-share__links { } .fancybox-share__button svg { - position: relative; - top: -1px; - width: 25px; height: 25px; margin-right: 7px; + position: relative; + top: -1px; vertical-align: middle; + width: 25px; } .fancybox-share__button svg path { @@ -84,14 +83,14 @@ p.fancybox-share__links { } .fancybox-share__input { - box-sizing: border-box; - width: 100%; - margin: 10px 0 0 0; - padding: 10px 15px; background: transparent; + border: 0; + border-bottom: 1px solid #d7d7d7; + border-radius: 0; color: #5d5b5b; font-size: 14px; + margin: 10px 0 0 0; outline: none; - border: 0; - border-bottom: 2px solid #d7d7d7; + padding: 10px 15px; + width: 100%; } diff --git a/src/css/thumbs.css b/src/css/thumbs.css index 23386240..7a263d4b 100644 --- a/src/css/thumbs.css +++ b/src/css/thumbs.css @@ -1,26 +1,24 @@ - /* Thumbs */ .fancybox-thumbs { + background: #fff; + bottom: 0; display: none; - position: absolute; + margin: 0; + -webkit-overflow-scrolling: touch; + -ms-overflow-style: -ms-autohiding-scrollbar; + padding: 2px 2px 4px 2px; + position: absolute; + right: 0; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); top: 0; - bottom: 0; - right: 0; width: 212px; - margin: 0; - padding: 2px 2px 4px 2px; - background: #fff; - -webkit-tap-highlight-color: rgba(0,0,0,0); - -webkit-overflow-scrolling: touch; - -ms-overflow-style: -ms-autohiding-scrollbar; - box-sizing: border-box; - z-index: 99995; + z-index: 99995; } .fancybox-thumbs-x { - overflow-y: hidden; overflow-x: auto; + overflow-y: hidden; } .fancybox-show-thumbs .fancybox-thumbs { @@ -32,21 +30,21 @@ } .fancybox-thumbs > ul { - list-style: none; - position: absolute; - position: relative; - width: 100%; - height: 100%; - margin: 0; - padding: 0; + font-size: 0; + height: 100%; + list-style: none; + margin: 0; overflow-x: hidden; overflow-y: auto; - font-size: 0; + padding: 0; + position: absolute; + position: relative; white-space: nowrap; + width: 100%; } .fancybox-thumbs-x > ul { - overflow : hidden; + overflow: hidden; } .fancybox-thumbs-y > ul::-webkit-scrollbar { @@ -56,7 +54,7 @@ .fancybox-thumbs-y > ul::-webkit-scrollbar-track { background: #fff; border-radius: 10px; - box-shadow: inset 0 0 6px rgba(0,0,0,0.3); + box-shadow: inset 0 0 6px rgba(0, 0, 0, .3); } .fancybox-thumbs-y > ul::-webkit-scrollbar-thumb { @@ -65,63 +63,57 @@ } .fancybox-thumbs > ul > li { - float: left; - overflow: hidden; - padding: 0; - margin: 2px; - width: 100px; - height: 75px; - max-width: calc(50% - 4px); - max-height: calc(100% - 8px); - position: relative; - cursor: pointer; - outline: none; - -webkit-tap-highlight-color: transparent; backface-visibility: hidden; - box-sizing: border-box; + cursor: pointer; + float: left; + height: 75px; + margin: 2px; + max-height: calc(100% - 8px); + max-width: calc(50% - 4px); + outline: none; + overflow: hidden; + padding: 0; + position: relative; + -webkit-tap-highlight-color: transparent; + width: 100px; } -li.fancybox-thumbs-loading { - background: rgba(0,0,0,0.1); +.fancybox-thumbs-loading { + background: rgba(0, 0, 0, .1); } -.fancybox-thumbs > ul > li > img { - position: absolute; - top: 0; - left: 0; - max-width: none; - max-height: none; - -webkit-touch-callout: none; - user-select: none; +.fancybox-thumbs > ul > li { + background-position: center center; + background-repeat: no-repeat; + background-size: cover; } .fancybox-thumbs > ul > li:before { - content: ''; - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - border: 4px solid #4ea7f9; - z-index: 99991; - opacity: 0; - transition: all 0.2s cubic-bezier(.25,.46,.45,.94); + border: 4px solid #4ea7f9; + bottom: 0; + content: ''; + left: 0; + opacity: 0; + position: absolute; + right: 0; + top: 0; + transition: all .2s cubic-bezier(.25, .46, .45, .94); + z-index: 99991; } -.fancybox-thumbs > ul > li.fancybox-thumbs-active:before { - opacity: 1; +.fancybox-thumbs .fancybox-thumbs-active:before { + opacity: 1; } /* Styling for Small-Screen Devices */ -@media all and (max-width: 800px) { - .fancybox-thumbs { - width: 110px; - } +@media all and (max-width: 800px) { + .fancybox-thumbs { + width: 110px; + } .fancybox-show-thumbs .fancybox-inner { right: 110px; } - .fancybox-thumbs > ul > li { max-width: calc(100% - 10px); } diff --git a/src/js/core.js b/src/js/core.js index 712b814c..49962cf6 100644 --- a/src/js/core.js +++ b/src/js/core.js @@ -1,259 +1,256 @@ -;(function (window, document, $, undefined) { - 'use strict'; - - // If there's no jQuery, fancyBox can't work - // ========================================= - - if ( !$ ) { - return; - } - - // Check if fancyBox is already initialized - // ======================================== - - if ( $.fn.fancybox ) { - - if ( 'console' in window ) { - console.log( 'fancyBox already initialized' ); +(function(window, document, $, undefined) { + "use strict"; + + window.console = window.console || { + info: function(stuff) {} + }; + + // If there's no jQuery, fancyBox can't work + // ========================================= + + if (!$) { + return; + } + + // Check if fancyBox is already initialized + // ======================================== + + if ($.fn.fancybox) { + console.info("fancyBox already initialized"); + + return; + } + + // Private default settings + // ======================== + + var defaults = { + // Enable infinite gallery navigation + loop: false, + + // Horizontal space between slides + gutter: 50, + + // Enable keyboard navigation + keyboard: true, + + // Should display navigation arrows at the screen edges + arrows: true, + + // Should display counter at the top left corner + infobar: true, + + // Should display close button (using `btnTpl.smallBtn` template) over the content + // Can be true, false, "auto" + // If "auto" - will be automatically enabled for "html", "inline" or "ajax" items + smallBtn: "auto", + + // Should display toolbar (buttons at the top) + // Can be true, false, "auto" + // If "auto" - will be automatically hidden if "smallBtn" is enabled + toolbar: "auto", + + // What buttons should appear in the top right corner. + // Buttons will be created using templates from `btnTpl` option + // and they will be placed into toolbar (class="fancybox-toolbar"` element) + buttons: [ + "zoom", + //"share", + //"slideShow", + //"fullScreen", + //"download", + "thumbs", + "close" + ], + + // Detect "idle" time in seconds + idleTime: 3, + + // Disable right-click and use simple image protection for images + protect: false, + + // Shortcut to make content "modal" - disable keyboard navigtion, hide buttons, etc + modal: false, + + image: { + // Wait for images to load before displaying + // true - wait for image to load and then display; + // false - display thumbnail and load the full-sized image over top, + // requires predefined image dimensions (`data-width` and `data-height` attributes) + preload: false + }, + + ajax: { + // Object containing settings for ajax request + settings: { + // This helps to indicate that request comes from the modal + // Feel free to change naming + data: { + fancybox: true } - - return; - } - - // Private default settings - // ======================== - - var defaults = { - - // Enable infinite gallery navigation - loop : false, - - // Space around image, ignored if zoomed-in or viewport width is smaller than 800px - margin : [44, 0], - - // Horizontal space between slides - gutter : 50, - - // Enable keyboard navigation - keyboard : true, - - // Should display navigation arrows at the screen edges - arrows : true, - - // Should display infobar (counter and arrows at the top) - infobar : true, - - // Should display toolbar (buttons at the top) - toolbar : true, - - // What buttons should appear in the top right corner. - // Buttons will be created using templates from `btnTpl` option - // and they will be placed into toolbar (class="fancybox-toolbar"` element) - buttons : [ - 'slideShow', - 'fullScreen', - 'thumbs', - 'share', - //'download', - //'zoom', - 'close' - ], - - // Detect "idle" time in seconds - idleTime : 3, - - // Should display buttons at top right corner of the content - // If 'auto' - they will be created for content having type 'html', 'inline' or 'ajax' - // Use template from `btnTpl.smallBtn` for customization - smallBtn : 'auto', - - // Disable right-click and use simple image protection for images - protect : false, - - // Shortcut to make content "modal" - disable keyboard navigtion, hide buttons, etc - modal : false, - - image : { - - // Wait for images to load before displaying - // Requires predefined image dimensions - // If 'auto' - will zoom in thumbnail if 'width' and 'height' attributes are found - preload : "auto" - - }, - - ajax : { - - // Object containing settings for ajax request - settings : { - - // This helps to indicate that request comes from the modal - // Feel free to change naming - data : { - fancybox : true - } - } - - }, - - iframe : { - - // Iframe template - tpl : '', - - // Preload iframe before displaying it - // This allows to calculate iframe content width and height - // (note: Due to "Same Origin Policy", you can't get cross domain data). - preload : true, - - // Custom CSS styling for iframe wrapping element - // You can use this to set custom iframe dimensions - css : {}, - - // Iframe tag attributes - attr : { - scrolling : 'auto' - } - - }, - - // Default content type if cannot be detected automatically - defaultType : 'image', - - // Open/close animation type - // Possible values: - // false - disable - // "zoom" - zoom images from/to thumbnail - // "fade" - // "zoom-in-out" - // - animationEffect : "zoom", - - // Duration in ms for open/close animation - animationDuration : 500, - - // Should image change opacity while zooming - // If opacity is "auto", then opacity will be changed if image and thumbnail have different aspect ratios - zoomOpacity : "auto", - - // Transition effect between slides - // - // Possible values: - // false - disable - // "fade' - // "slide' - // "circular' - // "tube' - // "zoom-in-out' - // "rotate' - // - transitionEffect : "fade", - - // Duration in ms for transition animation - transitionDuration : 366, - - // Custom CSS class for slide element - slideClass : '', - - // Custom CSS class for layout - baseClass : '', - - // Base template for layout - baseTpl : - '', - - // Loading indicator template - spinnerTpl : '
    ', - - // Error message template - errorTpl : '

    {{ERROR}}

    ', - - btnTpl : { - - download : '' + - '' + - '' + - '' + - '', - - zoom : '', - - close : '', - - // This small close button will be appended to your html/inline/ajax content by default, - // if "smallBtn" option is not set to false - smallBtn : '', - - // Arrows - arrowLeft : '', - - arrowRight : '' - }, - - // Container is injected into this element - parentEl : 'body', - - - // Focus handling - // ============== - - // Try to focus on the first focusable element after opening - autoFocus : false, - - // Put focus back to active element after closing - backFocus : true, - - // Do not let user to focus on element outside modal content - trapFocus : true, - - - // Module specific options - // ======================= - - fullScreen : { - autoStart : false, - }, - - // Set `touch: false` to disable dragging/swiping - touch : { - vertical : true, // Allow to drag content vertically - momentum : true // Continue movement after releasing mouse/touch when panning - }, - - // Hash value when initializing manually, - // set `false` to disable hash change - hash : null, - - // Customize or add new media types - // Example: - /* + } + }, + + iframe: { + // Iframe template + tpl: + '', + + // Preload iframe before displaying it + // This allows to calculate iframe content width and height + // (note: Due to "Same Origin Policy", you can't get cross domain data). + preload: true, + + // Custom CSS styling for iframe wrapping element + // You can use this to set custom iframe dimensions + css: {}, + + // Iframe tag attributes + attr: { + scrolling: "auto" + } + }, + + // Default content type if cannot be detected automatically + defaultType: "image", + + // Open/close animation type + // Possible values: + // false - disable + // "zoom" - zoom images from/to thumbnail + // "fade" + // "zoom-in-out" + // + animationEffect: "zoom", + + // Duration in ms for open/close animation + animationDuration: 366, + + // Should image change opacity while zooming + // If opacity is "auto", then opacity will be changed if image and thumbnail have different aspect ratios + zoomOpacity: "auto", + + // Transition effect between slides + // + // Possible values: + // false - disable + // "fade' + // "slide' + // "circular' + // "tube' + // "zoom-in-out' + // "rotate' + // + transitionEffect: "fade", + + // Duration in ms for transition animation + transitionDuration: 366, + + // Custom CSS class for slide element + slideClass: "", + + // Custom CSS class for layout + baseClass: "", + + // Base template for layout + baseTpl: + '", + + // Loading indicator template + spinnerTpl: '
    ', + + // Error message template + errorTpl: '

    {{ERROR}}

    ', + + btnTpl: { + download: + '' + + '' + + '' + + "" + + "", + + zoom: + '", + + close: + '", + + // This small close button will be appended to your html/inline/ajax content by default, + // if "smallBtn" option is not set to false + smallBtn: + '', + + // Arrows + arrowLeft: + '' + + '' + + '' + + "" + + "", + + arrowRight: + '' + + '' + + '' + + "" + + "" + }, + + // Container is injected into this element + parentEl: "body", + + // Focus handling + // ============== + + // Try to focus on the first focusable element after opening + autoFocus: false, + + // Put focus back to active element after closing + backFocus: true, + + // Do not let user to focus on element outside modal content + trapFocus: true, + + // Module specific options + // ======================= + + fullScreen: { + autoStart: false + }, + + // Set `touch: false` to disable dragging/swiping + touch: { + vertical: true, // Allow to drag content vertically + momentum: true // Continue movement after releasing mouse/touch when panning + }, + + // Hash value when initializing manually, + // set `false` to disable hash change + hash: null, + + // Customize or add new media types + // Example: + /* media : { youtube : { params : { @@ -262,2836 +259,2825 @@ } } */ - media : {}, - - slideShow : { - autoStart : false, - speed : 4000 - }, - - thumbs : { - autoStart : false, // Display thumbnails on opening - hideOnClose : true, // Hide thumbnail grid when closing animation starts - parentEl : '.fancybox-container', // Container is injected into this element - axis : 'y' // Vertical (y) or horizontal (x) scrolling - }, - - // Use mousewheel to navigate gallery - // If 'auto' - enabled for images only - wheel : 'auto', - - // Callbacks - //========== - - // See Documentation/API/Events for more information - // Example: - /* - afterShow: function( instance, current ) { - console.info( 'Clicked element:' ); - console.info( current.opts.$orig ); - } - */ - - onInit : $.noop, // When instance has been initialized - - beforeLoad : $.noop, // Before the content of a slide is being loaded - afterLoad : $.noop, // When the content of a slide is done loading - - beforeShow : $.noop, // Before open animation starts - afterShow : $.noop, // When content is done loading and animating - - beforeClose : $.noop, // Before the instance attempts to close. Return false to cancel the close. - afterClose : $.noop, // After instance has been closed - - onActivate : $.noop, // When instance is brought to front - onDeactivate : $.noop, // When other instance has been activated - - - // Interaction - // =========== - - // Use options below to customize taken action when user clicks or double clicks on the fancyBox area, - // each option can be string or method that returns value. - // - // Possible values: - // "close" - close instance - // "next" - move to next gallery item - // "nextOrClose" - move to next gallery item or close if gallery has only one item - // "toggleControls" - show/hide controls - // "zoom" - zoom image (if loaded) - // false - do nothing - - // Clicked on the content - clickContent : function( current, event ) { - return current.type === 'image' ? 'zoom' : false; - }, - - // Clicked on the slide - clickSlide : 'close', - - // Clicked on the background (backdrop) element - clickOutside : 'close', - - // Same as previous two, but for double click - dblclickContent : false, - dblclickSlide : false, - dblclickOutside : false, - - - // Custom options when mobile device is detected - // ============================================= - - mobile : { - idleTime : false, - margin : 0, - - clickContent : function( current, event ) { - return current.type === 'image' ? 'toggleControls' : false; - }, - clickSlide : function( current, event ) { - return current.type === 'image' ? 'toggleControls' : 'close'; - }, - dblclickContent : function( current, event ) { - return current.type === 'image' ? 'zoom' : false; - }, - dblclickSlide : function( current, event ) { - return current.type === 'image' ? 'zoom' : false; - } - }, - - - // Internationalization - // ============ - - lang : 'en', - i18n : { - 'en' : { - CLOSE : 'Close', - NEXT : 'Next', - PREV : 'Previous', - ERROR : 'The requested content cannot be loaded.
    Please try again later.', - PLAY_START : 'Start slideshow', - PLAY_STOP : 'Pause slideshow', - FULL_SCREEN : 'Full screen', - THUMBS : 'Thumbnails', - DOWNLOAD : 'Download', - SHARE : 'Share', - ZOOM : 'Zoom' - }, - 'de' : { - CLOSE : 'Schliessen', - NEXT : 'Weiter', - PREV : 'Zurück', - ERROR : 'Die angeforderten Daten konnten nicht geladen werden.
    Bitte versuchen Sie es später nochmal.', - PLAY_START : 'Diaschau starten', - PLAY_STOP : 'Diaschau beenden', - FULL_SCREEN : 'Vollbild', - THUMBS : 'Vorschaubilder', - DOWNLOAD : 'Herunterladen', - SHARE : 'Teilen', - ZOOM : 'Maßstab' - } - } - - }; - - // Few useful variables and methods - // ================================ - - var $W = $(window); - var $D = $(document); - - var called = 0; - - - // Check if an object is a jQuery object and not a native JavaScript object - // ======================================================================== - - var isQuery = function ( obj ) { - return obj && obj.hasOwnProperty && obj instanceof $; + media: {}, + + slideShow: { + autoStart: false, + speed: 4000 + }, + + thumbs: { + autoStart: false, // Display thumbnails on opening + hideOnClose: true, // Hide thumbnail grid when closing animation starts + parentEl: ".fancybox-container", // Container is injected into this element + axis: "y" // Vertical (y) or horizontal (x) scrolling + }, + + // Use mousewheel to navigate gallery + // If 'auto' - enabled for images only + wheel: "auto", + + // Callbacks + //========== + + // See Documentation/API/Events for more information + // Example: + /* + afterShow: function( instance, current ) { + console.info( 'Clicked element:' ); + console.info( current.opts.$orig ); + } + */ + + onInit: $.noop, // When instance has been initialized + + beforeLoad: $.noop, // Before the content of a slide is being loaded + afterLoad: $.noop, // When the content of a slide is done loading + + beforeShow: $.noop, // Before open animation starts + afterShow: $.noop, // When content is done loading and animating + + beforeClose: $.noop, // Before the instance attempts to close. Return false to cancel the close. + afterClose: $.noop, // After instance has been closed + + onActivate: $.noop, // When instance is brought to front + onDeactivate: $.noop, // When other instance has been activated + + // Interaction + // =========== + + // Use options below to customize taken action when user clicks or double clicks on the fancyBox area, + // each option can be string or method that returns value. + // + // Possible values: + // "close" - close instance + // "next" - move to next gallery item + // "nextOrClose" - move to next gallery item or close if gallery has only one item + // "toggleControls" - show/hide controls + // "zoom" - zoom image (if loaded) + // false - do nothing + + // Clicked on the content + clickContent: function(current, event) { + return current.type === "image" ? "zoom" : false; + }, + + // Clicked on the slide + clickSlide: "close", + + // Clicked on the background (backdrop) element; + // if you have not changed the layout, then most likely you need to use `clickSlide` option + clickOutside: "close", + + // Same as previous two, but for double click + dblclickContent: false, + dblclickSlide: false, + dblclickOutside: false, + + // Custom options when mobile device is detected + // ============================================= + + mobile: { + idleTime: false, + clickContent: function(current, event) { + return current.type === "image" ? "toggleControls" : false; + }, + clickSlide: function(current, event) { + return current.type === "image" ? "toggleControls" : "close"; + }, + dblclickContent: function(current, event) { + return current.type === "image" ? "zoom" : false; + }, + dblclickSlide: function(current, event) { + return current.type === "image" ? "zoom" : false; + } + }, + + // Internationalization + // ==================== + + lang: "en", + i18n: { + en: { + CLOSE: "Close", + NEXT: "Next", + PREV: "Previous", + ERROR: "The requested content cannot be loaded.
    Please try again later.", + PLAY_START: "Start slideshow", + PLAY_STOP: "Pause slideshow", + FULL_SCREEN: "Full screen", + THUMBS: "Thumbnails", + DOWNLOAD: "Download", + SHARE: "Share", + ZOOM: "Zoom" + }, + de: { + CLOSE: "Schliessen", + NEXT: "Weiter", + PREV: "Zurück", + ERROR: "Die angeforderten Daten konnten nicht geladen werden.
    Bitte versuchen Sie es später nochmal.", + PLAY_START: "Diaschau starten", + PLAY_STOP: "Diaschau beenden", + FULL_SCREEN: "Vollbild", + THUMBS: "Vorschaubilder", + DOWNLOAD: "Herunterladen", + SHARE: "Teilen", + ZOOM: "Maßstab" + } + } + }; + + // Few useful variables and methods + // ================================ + + var $W = $(window); + var $D = $(document); + + var called = 0; + + // Check if an object is a jQuery object and not a native JavaScript object + // ======================================================================== + var isQuery = function(obj) { + return obj && obj.hasOwnProperty && obj instanceof $; + }; + + // Handle multiple browsers for "requestAnimationFrame" and "cancelAnimationFrame" + // =============================================================================== + var requestAFrame = (function() { + return ( + window.requestAnimationFrame || + window.webkitRequestAnimationFrame || + window.mozRequestAnimationFrame || + window.oRequestAnimationFrame || + // if all else fails, use setTimeout + function(callback) { + return window.setTimeout(callback, 1000 / 60); + } + ); + })(); + + // Detect the supported transition-end event property name + // ======================================================= + var transitionEnd = (function() { + var el = document.createElement("fakeelement"), + t; + + var transitions = { + transition: "transitionend", + OTransition: "oTransitionEnd", + MozTransition: "transitionend", + WebkitTransition: "webkitTransitionEnd" }; + for (t in transitions) { + if (el.style[t] !== undefined) { + return transitions[t]; + } + } - // Handle multiple browsers for "requestAnimationFrame" and "cancelAnimationFrame" - // =============================================================================== - - var requestAFrame = (function () { - return window.requestAnimationFrame || - window.webkitRequestAnimationFrame || - window.mozRequestAnimationFrame || - window.oRequestAnimationFrame || - // if all else fails, use setTimeout - function (callback) { - return window.setTimeout(callback, 1000 / 60); - }; - })(); + return "transitionend"; + })(); + + // Force redraw on an element. + // This helps in cases where the browser doesn't redraw an updated element properly + // ================================================================================ + var forceRedraw = function($el) { + return $el && $el.length && $el[0].offsetHeight; + }; + + // Exclude array (`buttons`) options from deep merging + // =================================================== + var mergeOpts = function(opts1, opts2) { + var rez = $.extend(true, {}, opts1, opts2); + + $.each(opts2, function(key, value) { + if ($.isArray(value)) { + rez[key] = value; + } + }); + return rez; + }; - // Detect the supported transition-end event property name - // ======================================================= + // Class definition + // ================ - var transitionEnd = (function () { - var t, el = document.createElement("fakeelement"); + var FancyBox = function(content, opts, index) { + var self = this; - var transitions = { - "transition" : "transitionend", - "OTransition" : "oTransitionEnd", - "MozTransition" : "transitionend", - "WebkitTransition": "webkitTransitionEnd" - }; + self.opts = mergeOpts({index: index}, $.fancybox.defaults); - for (t in transitions) { - if (el.style[t] !== undefined){ - return transitions[t]; - } - } + if ($.isPlainObject(opts)) { + self.opts = mergeOpts(self.opts, opts); + } - return 'transitionend'; - })(); + if ($.fancybox.isMobile) { + self.opts = mergeOpts(self.opts, self.opts.mobile); + } + self.id = self.opts.id || ++called; - // Force redraw on an element. - // This helps in cases where the browser doesn't redraw an updated element properly. - // ================================================================================= + self.currIndex = parseInt(self.opts.index, 10) || 0; + self.prevIndex = null; - var forceRedraw = function( $el ) { - return ( $el && $el.length && $el[0].offsetHeight ); - }; + self.prevPos = null; + self.currPos = 0; + self.firstRun = true; - // Class definition - // ================ + // All group items + self.group = []; - var FancyBox = function( content, opts, index ) { - var self = this; + // Existing slides (for current, next and previous gallery items) + self.slides = {}; - self.opts = $.extend( true, { index : index }, $.fancybox.defaults, opts || {} ); + // Create group elements + self.addContent(content); - if ( $.fancybox.isMobile ) { - self.opts = $.extend( true, {}, self.opts, self.opts.mobile ); - } + if (!self.group.length) { + return; + } - // Exclude buttons option from deep merging - if ( opts && $.isArray( opts.buttons ) ) { - self.opts.buttons = opts.buttons; + // Save last active element + self.$lastFocus = $(document.activeElement).trigger("blur"); + + self.init(); + }; + + $.extend(FancyBox.prototype, { + // Create DOM structure + // ==================== + + init: function() { + var self = this, + firstItem = self.group[self.currIndex], + firstItemOpts = firstItem.opts, + scrollbarWidth = $.fancybox.scrollbarWidth, + $scrollDiv, + $container, + buttonStr; + + // iOS hack; https://bugs.webkit.org/show_bug.cgi?id=176896 + if ( + firstItem.type !== "image" && + /iPad|iPhone|iPod/.test(navigator.userAgent) && + !window.MSStream && + !$("body").hasClass("fancybox-iosfix") + ) { + $("body") + .addClass("fancybox-iosfix") + .css("top", -$W.scrollTop()); + } + + // Hide scrollbars + // =============== + + if (!$.fancybox.getInstance()) { + $("body").addClass("fancybox-active"); + + if (!$.fancybox.isMobile && document.body.scrollHeight > window.innerHeight) { + if (scrollbarWidth === undefined) { + $scrollDiv = $('
    ').appendTo("body"); + + scrollbarWidth = $.fancybox.scrollbarWidth = $scrollDiv[0].offsetWidth - $scrollDiv[0].clientWidth; + + $scrollDiv.remove(); + } + + $("head").append( + '" + ); + + $("body").addClass("compensate-for-scrollbar"); } - - self.id = self.opts.id || ++called; - self.group = []; - - self.currIndex = parseInt( self.opts.index, 10 ) || 0; - self.prevIndex = null; - - self.prevPos = null; - self.currPos = 0; - - self.firstRun = null; - - // Create group elements from original item collection - self.createGroup( content ); - - if ( !self.group.length ) { - return; + } + + // Build html markup and set references + // ==================================== + + // Build html code for buttons and insert into main template + buttonStr = ""; + + $.each(firstItemOpts.buttons, function(index, value) { + buttonStr += firstItemOpts.btnTpl[value] || ""; + }); + + // Create markup from base template, it will be initially hidden to + // avoid unnecessary work like painting while initializing is not complete + $container = $( + self.translate( + self, + firstItemOpts.baseTpl + .replace("{{buttons}}", buttonStr) + .replace("{{arrows}}", firstItemOpts.btnTpl.arrowLeft + firstItemOpts.btnTpl.arrowRight) + ) + ) + .attr("id", "fancybox-container-" + self.id) + .addClass("fancybox-is-hidden") + .addClass(firstItemOpts.baseClass) + .data("FancyBox", self) + .appendTo(firstItemOpts.parentEl); + + // Create object holding references to jQuery wrapped nodes + self.$refs = { + container: $container + }; + + ["bg", "inner", "infobar", "toolbar", "stage", "caption", "navigation"].forEach(function(item) { + self.$refs[item] = $container.find(".fancybox-" + item); + }); + + self.trigger("onInit"); + + // Enable events, deactive previous instances + self.activate(); + + // Build slides, load and reveal content + self.jumpTo(self.currIndex); + }, + + // Simple i18n support - replaces object keys found in template + // with corresponding values + // ============================================================ + + translate: function(obj, str) { + var arr = obj.opts.i18n[obj.opts.lang]; + + return str.replace(/\{\{(\w+)\}\}/g, function(match, n) { + var value = arr[n]; + + if (value === undefined) { + return match; } - // Save last active element and current scroll position - self.$lastFocus = $(document.activeElement).blur(); - - // Collection of gallery objects - self.slides = {}; - - self.init(); - }; - - $.extend(FancyBox.prototype, { - - // Create DOM structure - // ==================== - - init : function() { - var self = this, - firstItem = self.group[ self.currIndex ], - firstItemOpts = firstItem.opts, - scrollbarWidth = $.fancybox.scrollbarWidth, - $scrollDiv, - $container, - buttonStr; - - self.scrollTop = $D.scrollTop(); - self.scrollLeft = $D.scrollLeft(); - - - // Hide scrollbars - // =============== - - if ( !$.fancybox.getInstance() ) { - - $( 'body' ).addClass( 'fancybox-active' ); - - // iOS hack - if ( /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream ) { - - // iOS has problems for input elements inside fixed containers, - // the workaround is to apply `position: fixed` to `` element, - // unfortunately, this makes it lose the scrollbars and forces address bar to appear. - - if ( firstItem.type !== 'image' ) { - $( 'body' ).css( 'top', $( 'body' ).scrollTop() * -1 ).addClass( 'fancybox-iosfix' ); - } - - } else if ( !$.fancybox.isMobile && document.body.scrollHeight > window.innerHeight ) { - - if ( scrollbarWidth === undefined ) { - $scrollDiv = $('
    ').appendTo( 'body' ); - - scrollbarWidth = $.fancybox.scrollbarWidth = $scrollDiv[0].offsetWidth - $scrollDiv[0].clientWidth; - - $scrollDiv.remove(); - } - - $( 'head' ).append( '' ); - $( 'body' ).addClass( 'compensate-for-scrollbar' ); - } - } - - - // Build html markup and set references - // ==================================== - - // Build html code for buttons and insert into main template - buttonStr = ''; - - $.each( firstItemOpts.buttons, function( index, value ) { - buttonStr += ( firstItemOpts.btnTpl[ value ] || '' ); - }); - - // Create markup from base template, it will be initially hidden to - // avoid unnecessary work like painting while initializing is not complete - $container = $( - self.translate( self, - firstItemOpts.baseTpl - .replace( '\{\{buttons\}\}', buttonStr ) - .replace( '\{\{arrows\}\}', firstItemOpts.btnTpl.arrowLeft + firstItemOpts.btnTpl.arrowRight ) - ) - ) - .attr( 'id', 'fancybox-container-' + self.id ) - .addClass( 'fancybox-is-hidden' ) - .addClass( firstItemOpts.baseClass ) - .data( 'FancyBox', self ) - .appendTo( firstItemOpts.parentEl ); - - // Create object holding references to jQuery wrapped nodes - self.$refs = { - container : $container - }; - - [ 'bg', 'inner', 'infobar', 'toolbar', 'stage', 'caption', 'navigation' ].forEach(function(item) { - self.$refs[ item ] = $container.find( '.fancybox-' + item ); - }); - - self.trigger( 'onInit' ); - - // Enable events, deactive previous instances - self.activate(); - - // Build slides, load and reveal content - self.jumpTo( self.currIndex ); - }, - - - // Simple i18n support - replaces object keys found in template - // with corresponding values - // ============================================================ - - translate : function( obj, str ) { - var arr = obj.opts.i18n[ obj.opts.lang ]; - - return str.replace(/\{\{(\w+)\}\}/g, function(match, n) { - var value = arr[n]; - - if ( value === undefined ) { - return match; - } - - return value; - }); - }, - - // Create array of gally item objects - // Check if each object has valid type and content - // =============================================== - - createGroup : function ( content ) { - var self = this; - var items = $.makeArray( content ); - - $.each(items, function( i, item ) { - var obj = {}, - opts = {}, - $item, - type, - found, - src, - srcParts; - - // Step 1 - Make sure we have an object - // ==================================== - - if ( $.isPlainObject( item ) ) { - - // We probably have manual usage here, something like - // $.fancybox.open( [ { src : "image.jpg", type : "image" } ] ) - - obj = item; - opts = item.opts || item; - - } else if ( $.type( item ) === 'object' && $( item ).length ) { - - // Here we probably have jQuery collection returned by some selector - $item = $( item ); - - opts = $item.data(); - opts = $.extend( {}, opts, opts.options || {} ); - - // Here we store clicked element - opts.$orig = $item; - - obj.src = opts.src || $item.attr( 'href' ); - - // Assume that simple syntax is used, for example: - // `$.fancybox.open( $("#test"), {} );` - if ( !obj.type && !obj.src ) { - obj.type = 'inline'; - obj.src = item; - } - - } else { - - // Assume we have a simple html code, for example: - // $.fancybox.open( '

    Hi!

    ' ); - - obj = { - type : 'html', - src : item + '' - }; - - } - - // Each gallery object has full collection of options - obj.opts = $.extend( true, {}, self.opts, opts ); - - // Do not merge buttons array - if ( $.isArray( opts.buttons ) ) { - obj.opts.buttons = opts.buttons; - } - - - // Step 2 - Make sure we have content type, if not - try to guess - // ============================================================== - - type = obj.type || obj.opts.type; - src = obj.src || ''; - - if ( !type && src ) { - if ( src.match(/(^data:image\/[a-z0-9+\/=]*,)|(\.(jp(e|g|eg)|gif|png|bmp|webp|svg|ico)((\?|#).*)?$)/i) ) { - type = 'image'; - - } else if ( src.match(/\.(pdf)((\?|#).*)?$/i) ) { - type = 'pdf'; - - } else if ( found = src.match(/\.(mp4|mov|ogv)((\?|#).*)?$/i) ) { - type = 'video'; - - if ( !obj.opts.videoFormat ) { - obj.opts.videoFormat = 'video/' + ( found[1] === 'ogv' ? 'ogg' : found[1] ); - } - - } else if ( src.charAt(0) === '#' ) { - type = 'inline'; - } - } - - if ( type ) { - obj.type = type; - - } else { - self.trigger( 'objectNeedsType', obj ); - } - - - // Step 3 - Some adjustments - // ========================= - - obj.index = self.group.length; - - // Check if $orig and $thumb objects exist - if ( obj.opts.$orig && !obj.opts.$orig.length ) { - delete obj.opts.$orig; - } - - if ( !obj.opts.$thumb && obj.opts.$orig ) { - obj.opts.$thumb = obj.opts.$orig.find( 'img:first' ); - } - - if ( obj.opts.$thumb && !obj.opts.$thumb.length ) { - delete obj.opts.$thumb; - } - - // "caption" is a "special" option, it can be used to customize caption per gallery item .. - if ( $.type( obj.opts.caption ) === 'function' ) { - obj.opts.caption = obj.opts.caption.apply( item, [ self, obj ] ); - } - - if ( $.type( self.opts.caption ) === 'function' ) { - obj.opts.caption = self.opts.caption.apply( item, [ self, obj ] ); - } - - // Make sure we have caption as a string or jQuery object - if ( !( obj.opts.caption instanceof $ ) ) { - obj.opts.caption = obj.opts.caption === undefined ? '' : obj.opts.caption + ''; - } - - // Check if url contains "filter" used to filter the content - // Example: "ajax.html #something" - if ( type === 'ajax' ) { - srcParts = src.split(/\s+/, 2); - - if ( srcParts.length > 1 ) { - obj.src = srcParts.shift(); - - obj.opts.filter = srcParts.shift(); - } - } - - if ( obj.opts.smallBtn == 'auto' ) { - - if ( $.inArray( type, ['html', 'inline', 'ajax'] ) > -1 ) { - obj.opts.toolbar = false; - obj.opts.smallBtn = true; - - } else { - obj.opts.smallBtn = false; - } - - } - - // If the type is "pdf", then simply load file into iframe - if ( type === 'pdf' ) { - obj.type = 'iframe'; - - obj.opts.iframe.preload = false; - } - - // Hide all buttons and disable interactivity for modal items - if ( obj.opts.modal ) { - - obj.opts = $.extend(true, obj.opts, { - // Remove buttons - infobar : 0, - toolbar : 0, - - smallBtn : 0, - - // Disable keyboard navigation - keyboard : 0, - - // Disable some modules - slideShow : 0, - fullScreen : 0, - thumbs : 0, - touch : 0, - - // Disable click event handlers - clickContent : false, - clickSlide : false, - clickOutside : false, - dblclickContent : false, - dblclickSlide : false, - dblclickOutside : false - }); - - } - - // Step 4 - Add processed object to group - // ====================================== - - self.group.push( obj ); - - }); - - }, - - - // Attach an event handler functions for: - // - navigation buttons - // - browser scrolling, resizing; - // - focusing - // - keyboard - // - detect idle - // ====================================== - - addEvents : function() { - var self = this; - - self.removeEvents(); - - // Make navigation elements clickable - self.$refs.container.on('click.fb-close', '[data-fancybox-close]', function(e) { - e.stopPropagation(); - e.preventDefault(); - - self.close( e ); - - }).on( 'click.fb-prev touchend.fb-prev', '[data-fancybox-prev]', function(e) { - e.stopPropagation(); - e.preventDefault(); - - self.previous(); - - }).on( 'click.fb-next touchend.fb-next', '[data-fancybox-next]', function(e) { - e.stopPropagation(); - e.preventDefault(); - - self.next(); - - }).on( 'click.fb', '[data-fancybox-zoom]', function(e) { - // Click handler for zoom button - self[ self.isScaledDown() ? 'scaleToActual' : 'scaleToFit' ](); - }); - - - // Handle page scrolling and browser resizing - $W.on('orientationchange.fb resize.fb', function(e) { - - if ( e && e.originalEvent && e.originalEvent.type === "resize" ) { - - requestAFrame(function() { - self.update(); - }); - - } else { - - self.$refs.stage.hide(); - - setTimeout(function() { - self.$refs.stage.show(); - - self.update(); - }, 600); - - } - - }); - - // Trap keyboard focus inside of the modal, so the user does not accidentally tab outside of the modal - // (a.k.a. "escaping the modal") - $D.on('focusin.fb', function(e) { - var instance = $.fancybox ? $.fancybox.getInstance() : null; - - if ( instance.isClosing || !instance.current || !instance.current.opts.trapFocus || $( e.target ).hasClass( 'fancybox-container' ) || $( e.target ).is( document ) ) { - return; - } - - if ( instance && $( e.target ).css( 'position' ) !== 'fixed' && !instance.$refs.container.has( e.target ).length ) { - e.stopPropagation(); - - instance.focus(); - - // Sometimes page gets scrolled, set it back - $W.scrollTop( self.scrollTop ).scrollLeft( self.scrollLeft ); - } - }); - - - // Enable keyboard navigation - $D.on('keydown.fb', function (e) { - var current = self.current, - keycode = e.keyCode || e.which; - - if ( !current || !current.opts.keyboard ) { - return; - } - - if ( $(e.target).is('input') || $(e.target).is('textarea') ) { - return; - } - - // Backspace and Esc keys - if ( keycode === 8 || keycode === 27 ) { - e.preventDefault(); - - self.close( e ); - - return; - } - - // Left arrow and Up arrow - if ( keycode === 37 || keycode === 38 ) { - e.preventDefault(); - - self.previous(); - - return; - } - - // Righ arrow and Down arrow - if ( keycode === 39 || keycode === 40 ) { - e.preventDefault(); - - self.next(); - - return; - } - - self.trigger('afterKeydown', e, keycode); - }); - - - // Hide controls after some inactivity period - if ( self.group[ self.currIndex ].opts.idleTime ) { - self.idleSecondsCounter = 0; - - $D.on('mousemove.fb-idle mouseleave.fb-idle mousedown.fb-idle touchstart.fb-idle touchmove.fb-idle scroll.fb-idle keydown.fb-idle', function(e) { - self.idleSecondsCounter = 0; - - if ( self.isIdle ) { - self.showControls(); - } - - self.isIdle = false; - }); - - self.idleInterval = window.setInterval(function() { - self.idleSecondsCounter++; - - if ( self.idleSecondsCounter >= self.group[ self.currIndex ].opts.idleTime && !self.isDragging ) { - self.isIdle = true; - self.idleSecondsCounter = 0; - - self.hideControls(); - } - - }, 1000); - } - - }, - - - // Remove events added by the core - // =============================== - - removeEvents : function() { - var self = this; - - $W.off( 'orientationchange.fb resize.fb' ); - $D.off( 'focusin.fb keydown.fb .fb-idle' ); - - this.$refs.container.off( '.fb-close .fb-prev .fb-next' ); - - if ( self.idleInterval ) { - window.clearInterval( self.idleInterval ); - - self.idleInterval = null; - } - }, - - - // Change to previous gallery item - // =============================== - - previous : function( duration ) { - return this.jumpTo( this.currPos - 1, duration ); - }, - - - // Change to next gallery item - // =========================== - - next : function( duration ) { - return this.jumpTo( this.currPos + 1, duration ); - }, - - - // Switch to selected gallery item - // =============================== - - jumpTo : function ( pos, duration, slide ) { - var self = this, - firstRun, - loop, - current, - previous, - canvasWidth, - currentPos, - transitionProps; - - var groupLen = self.group.length; - - if ( self.isDragging || self.isClosing || ( self.isAnimating && self.firstRun ) ) { - return; - } - - pos = parseInt( pos, 10 ); - loop = self.current ? self.current.opts.loop : self.opts.loop; - - if ( !loop && ( pos < 0 || pos >= groupLen ) ) { - return false; - } - - firstRun = self.firstRun = ( self.firstRun === null ); - - if ( groupLen < 2 && !firstRun && !!self.isDragging ) { - return; - } - - previous = self.current; - - self.prevIndex = self.currIndex; - self.prevPos = self.currPos; - - // Create slides - current = self.createSlide( pos ); - - if ( groupLen > 1 ) { - if ( loop || current.index > 0 ) { - self.createSlide( pos - 1 ); - } - - if ( loop || current.index < groupLen - 1 ) { - self.createSlide( pos + 1 ); - } - } - - self.current = current; - self.currIndex = current.index; - self.currPos = current.pos; - - self.trigger( 'beforeShow', firstRun ); - - self.updateControls(); - - currentPos = $.fancybox.getTranslate( current.$slide ); - - current.isMoved = ( currentPos.left !== 0 || currentPos.top !== 0 ) && !current.$slide.hasClass( 'fancybox-animated' ); - current.forcedDuration = undefined; - - if ( $.isNumeric( duration ) ) { - current.forcedDuration = duration; - } else { - duration = current.opts[ firstRun ? 'animationDuration' : 'transitionDuration' ]; - } - - duration = parseInt( duration, 10 ); - - // Fresh start - reveal container, current slide and start loading content - if ( firstRun ) { - - if ( current.opts.animationEffect && duration ) { - self.$refs.container.css( 'transition-duration', duration + 'ms' ); - } - - self.$refs.container.removeClass( 'fancybox-is-hidden' ); - - forceRedraw( self.$refs.container ); - - self.$refs.container.addClass( 'fancybox-is-open' ); - - // Make first slide visible (to display loading icon, if needed) - current.$slide.addClass( 'fancybox-slide--current' ); - - self.loadSlide( current ); - - self.preload( 'image' ); - - return; - } - - // Clean up - $.each(self.slides, function( index, slide ) { - $.fancybox.stop( slide.$slide ); - }); - - // Make current that slide is visible even if content is still loading - current.$slide.removeClass( 'fancybox-slide--next fancybox-slide--previous' ).addClass( 'fancybox-slide--current' ); - - // If slides have been dragged, animate them to correct position - if ( current.isMoved ) { - canvasWidth = Math.round( current.$slide.width() ); - - $.each(self.slides, function( index, slide ) { - var pos = slide.pos - current.pos; - - $.fancybox.animate( slide.$slide, { - top : 0, - left : ( pos * canvasWidth ) + ( pos * slide.opts.gutter ) - }, duration, function() { - - slide.$slide.removeAttr('style').removeClass( 'fancybox-slide--next fancybox-slide--previous' ); - - if ( slide.pos === self.currPos ) { - current.isMoved = false; - - self.complete(); - } - }); - }); - - } else { - self.$refs.stage.children().removeAttr( 'style' ); - } - - // Start transition that reveals current content - // or wait when it will be loaded - - if ( current.isLoaded ) { - self.revealContent( current ); - - } else { - self.loadSlide( current ); - } - - self.preload( 'image' ); - - if ( previous.pos === current.pos ) { - return; - } - - // Handle previous slide - // ===================== - - transitionProps = 'fancybox-slide--' + ( previous.pos > current.pos ? 'next' : 'previous' ); - - previous.$slide.removeClass( 'fancybox-slide--complete fancybox-slide--current fancybox-slide--next fancybox-slide--previous' ); - - previous.isComplete = false; - - if ( !duration || ( !current.isMoved && !current.opts.transitionEffect ) ) { - return; - } - - if ( current.isMoved ) { - previous.$slide.addClass( transitionProps ); - - } else { - - transitionProps = 'fancybox-animated ' + transitionProps + ' fancybox-fx-' + current.opts.transitionEffect; - - $.fancybox.animate( previous.$slide, transitionProps, duration, function() { - previous.$slide.removeClass( transitionProps ).removeAttr( 'style' ); - }); - - } - - }, - - - // Create new "slide" element - // These are gallery items that are actually added to DOM - // ======================================================= - - createSlide : function( pos ) { - - var self = this; - var $slide; - var index; - - index = pos % self.group.length; - index = index < 0 ? self.group.length + index : index; - - if ( !self.slides[ pos ] && self.group[ index ] ) { - $slide = $('
    ').appendTo( self.$refs.stage ); - - self.slides[ pos ] = $.extend( true, {}, self.group[ index ], { - pos : pos, - $slide : $slide, - isLoaded : false, - }); - - self.updateSlide( self.slides[ pos ] ); - } - - return self.slides[ pos ]; - }, - - - // Scale image to the actual size of the image - // =========================================== - - scaleToActual : function( x, y, duration ) { - - var self = this; - - var current = self.current; - var $what = current.$content; - - var imgPos, posX, posY, scaleX, scaleY; - - var canvasWidth = parseInt( current.$slide.width(), 10 ); - var canvasHeight = parseInt( current.$slide.height(), 10 ); - - var newImgWidth = current.width; - var newImgHeight = current.height; - - if ( !( current.type == 'image' && !current.hasError) || !$what || self.isAnimating ) { - return; - } - - $.fancybox.stop( $what ); - - self.isAnimating = true; - - x = x === undefined ? canvasWidth * 0.5 : x; - y = y === undefined ? canvasHeight * 0.5 : y; - - imgPos = $.fancybox.getTranslate( $what ); - - scaleX = newImgWidth / imgPos.width; - scaleY = newImgHeight / imgPos.height; - - // Get center position for original image - posX = ( canvasWidth * 0.5 - newImgWidth * 0.5 ); - posY = ( canvasHeight * 0.5 - newImgHeight * 0.5 ); - - // Make sure image does not move away from edges - if ( newImgWidth > canvasWidth ) { - posX = imgPos.left * scaleX - ( ( x * scaleX ) - x ); - - if ( posX > 0 ) { - posX = 0; - } - - if ( posX < canvasWidth - newImgWidth ) { - posX = canvasWidth - newImgWidth; - } - } - - if ( newImgHeight > canvasHeight) { - posY = imgPos.top * scaleY - ( ( y * scaleY ) - y ); - - if ( posY > 0 ) { - posY = 0; - } - - if ( posY < canvasHeight - newImgHeight ) { - posY = canvasHeight - newImgHeight; - } - } - - self.updateCursor( newImgWidth, newImgHeight ); - - $.fancybox.animate( $what, { - top : posY, - left : posX, - scaleX : scaleX, - scaleY : scaleY - }, duration || 330, function() { - self.isAnimating = false; - }); - - // Stop slideshow - if ( self.SlideShow && self.SlideShow.isActive ) { - self.SlideShow.stop(); - } - }, - - - // Scale image to fit inside parent element - // ======================================== - - scaleToFit : function( duration ) { - - var self = this; - - var current = self.current; - var $what = current.$content; - var end; - - if ( !( current.type == 'image' && !current.hasError) || !$what || self.isAnimating ) { - return; - } - - $.fancybox.stop( $what ); - - self.isAnimating = true; - - end = self.getFitPos( current ); - - self.updateCursor( end.width, end.height ); - - $.fancybox.animate( $what, { - top : end.top, - left : end.left, - scaleX : end.width / $what.width(), - scaleY : end.height / $what.height() - }, duration || 330, function() { - self.isAnimating = false; - }); - - }, - - // Calculate image size to fit inside viewport - // =========================================== - - getFitPos : function( slide ) { - var self = this; - var $what = slide.$content; - - var imgWidth = slide.width; - var imgHeight = slide.height; - - var margin = slide.opts.margin; - - var canvasWidth, canvasHeight, minRatio, width, height; - - if ( !$what || !$what.length || ( !imgWidth && !imgHeight) ) { - return false; - } - - // Convert "margin to CSS style: [ top, right, bottom, left ] - if ( $.type( margin ) === "number" ) { - margin = [ margin, margin ]; - } - - if ( margin.length == 2 ) { - margin = [ margin[0], margin[1], margin[0], margin[1] ]; - } - - // We can not use $slide width here, because it can have different diemensions while in transiton - canvasWidth = parseInt( self.$refs.stage.width(), 10 ) - ( margin[ 1 ] + margin[ 3 ] ); - canvasHeight = parseInt( self.$refs.stage.height(), 10 ) - ( margin[ 0 ] + margin[ 2 ] ); - - minRatio = Math.min(1, canvasWidth / imgWidth, canvasHeight / imgHeight ); - - width = Math.floor( minRatio * imgWidth ); - height = Math.floor( minRatio * imgHeight ); - - // Use floor rounding to make sure it really fits - return { - top : Math.floor( ( canvasHeight - height ) * 0.5 ) + margin[ 0 ], - left : Math.floor( ( canvasWidth - width ) * 0.5 ) + margin[ 3 ], - width : width, - height : height - }; - - }, - - - // Update content size and position for all slides - // ============================================== - - update : function() { - var self = this; - - $.each( self.slides, function( key, slide ) { - self.updateSlide( slide ); - }); - }, - - - // Update slide content position and size - // ====================================== - - updateSlide : function( slide, duration ) { - var self = this, - $what = slide && slide.$content; - - if ( $what && ( slide.width || slide.height ) ) { - self.isAnimating = false; - - $.fancybox.stop( $what ); - - $.fancybox.setTranslate( $what, self.getFitPos( slide ) ); - - if ( slide.pos === self.currPos ) { - self.updateCursor(); - } - } - - slide.$slide.trigger( 'refresh' ); - - self.trigger( 'onUpdate', slide ); - - }, - - - // Horizontally center slide - // ========================= - - centerSlide : function( slide, duration ) { - var self = this, canvasWidth, pos; - - if ( self.current ) { - canvasWidth = Math.round( slide.$slide.width() ); - pos = slide.pos - self.current.pos; - - $.fancybox.animate( slide.$slide, { - top : 0, - left : ( pos * canvasWidth ) + ( pos * slide.opts.gutter ), - opacity : 1 - }, duration === undefined ? 0 : duration, null, false); - } - }, - - - // Update cursor style depending if content can be zoomed - // ====================================================== - - updateCursor : function( nextWidth, nextHeight ) { - - var self = this; - var isScaledDown; - - var $container = self.$refs.container.removeClass( 'fancybox-is-zoomable fancybox-can-zoomIn fancybox-can-drag fancybox-can-zoomOut' ); - - if ( !self.current || self.isClosing ) { - return; - } - - if ( self.isZoomable() ) { - - $container.addClass( 'fancybox-is-zoomable' ); - - if ( nextWidth !== undefined && nextHeight !== undefined ) { - isScaledDown = nextWidth < self.current.width && nextHeight < self.current.height; - - } else { - isScaledDown = self.isScaledDown(); - } - - if ( isScaledDown ) { - - // If image is scaled down, then, obviously, it can be zoomed to full size - $container.addClass( 'fancybox-can-zoomIn' ); - - } else { - - if ( self.current.opts.touch ) { - - // If image size ir largen than available available and touch module is not disable, - // then user can do panning - $container.addClass( 'fancybox-can-drag' ); - - } else { - $container.addClass( 'fancybox-can-zoomOut' ); - } - - } - - } else if ( self.current.opts.touch ) { - $container.addClass( 'fancybox-can-drag' ); - } - - }, - - - // Check if current slide is zoomable - // ================================== - - isZoomable : function() { - - var self = this; - - var current = self.current; - var fitPos; - - if ( !current || self.isClosing ) { - return; - } - - // Assume that slide is zoomable if - // - image is loaded successfuly - // - click action is "zoom" - // - actual size of the image is smaller than available area - if ( current.type === 'image' && current.isLoaded && !current.hasError && - ( current.opts.clickContent === 'zoom' || ( $.isFunction( current.opts.clickContent ) && current.opts.clickContent( current ) === "zoom" ) ) - ) { - - fitPos = self.getFitPos( current ); - - if ( current.width > fitPos.width || current.height > fitPos.height ) { - return true; - } - - } - - return false; - - }, - - - // Check if current image dimensions are smaller than actual - // ========================================================= - - isScaledDown : function() { - - var self = this; - - var current = self.current; - var $what = current.$content; - - var rez = false; - - if ( $what ) { - rez = $.fancybox.getTranslate( $what ); - rez = rez.width < current.width || rez.height < current.height; - } - - return rez; - - }, - - - // Check if image dimensions exceed parent element - // =============================================== - - canPan : function() { - - var self = this; - - var current = self.current; - var $what = current.$content; - - var rez = false; - - if ( $what ) { - rez = self.getFitPos( current ); - rez = Math.abs( $what.width() - rez.width ) > 1 || Math.abs( $what.height() - rez.height ) > 1; - } - - return rez; - - }, - - - // Load content into the slide - // =========================== - - loadSlide : function( slide ) { - - var self = this, type, $slide; - var ajaxLoad; - - if ( slide.isLoading ) { - return; - } - - if ( slide.isLoaded ) { - return; - } - - slide.isLoading = true; - - self.trigger( 'beforeLoad', slide ); - - type = slide.type; - $slide = slide.$slide; - - $slide - .off( 'refresh' ) - .trigger( 'onReset' ) - .addClass( 'fancybox-slide--' + ( type || 'unknown' ) ) - .addClass( slide.opts.slideClass ); - - // Create content depending on the type - - switch ( type ) { - - case 'image': - - self.setImage( slide ); - - break; - - case 'iframe': - - self.setIframe( slide ); - - break; - - case 'html': - - self.setContent( slide, slide.src || slide.content ); - - break; - - case 'inline': - - if ( $( slide.src ).length ) { - self.setContent( slide, $( slide.src ) ); - - } else { - self.setError( slide ); - } - - break; - - case 'ajax': - - self.showLoading( slide ); - - ajaxLoad = $.ajax( $.extend( {}, slide.opts.ajax.settings, { - url : slide.src, - success : function ( data, textStatus ) { - - if ( textStatus === 'success' ) { - self.setContent( slide, data ); - } - - }, - error : function ( jqXHR, textStatus ) { - - if ( jqXHR && textStatus !== 'abort' ) { - self.setError( slide ); - } - - } - })); - - $slide.one( 'onReset', function () { - ajaxLoad.abort(); - }); - - break; - - case 'video' : - - self.setContent( slide, - '' - ); - - break; - - default: - - self.setError( slide ); - - break; - - } - - return true; - - }, - - - // Use thumbnail image, if possible - // ================================ - - setImage : function( slide ) { - - var self = this; - var srcset = slide.opts.srcset || slide.opts.image.srcset; - - var found, temp, pxRatio, windowWidth; - - // If we have "srcset", then we need to find matching "src" value. - // This is necessary, because when you set an src attribute, the browser will preload the image - // before any javascript or even CSS is applied. - if ( srcset ) { - pxRatio = window.devicePixelRatio || 1; - windowWidth = window.innerWidth * pxRatio; - - temp = srcset.split(',').map(function ( el ) { - var ret = {}; - - el.trim().split(/\s+/).forEach(function ( el, i ) { - var value = parseInt( el.substring(0, el.length - 1), 10 ); - - if ( i === 0 ) { - return ( ret.url = el ); - } - - if ( value ) { - ret.value = value; - ret.postfix = el[ el.length - 1 ]; - } - - }); - - return ret; - }); - - // Sort by value - temp.sort(function (a, b) { - return a.value - b.value; - }); - - // Ok, now we have an array of all srcset values - for ( var j = 0; j < temp.length; j++ ) { - var el = temp[ j ]; - - if ( ( el.postfix === 'w' && el.value >= windowWidth ) || ( el.postfix === 'x' && el.value >= pxRatio ) ) { - found = el; - break; - } - } - - // If not found, take the last one - if ( !found && temp.length ) { - found = temp[ temp.length - 1 ]; - } - - if ( found ) { - slide.src = found.url; - - // If we have default width/height values, we can calculate height for matching source - if ( slide.width && slide.height && found.postfix == 'w' ) { - slide.height = ( slide.width / slide.height ) * found.value; - slide.width = found.value; - } - } - } - - // This will be wrapper containing both ghost and actual image - slide.$content = $('
    ') - .addClass( 'fancybox-is-hidden' ) - .appendTo( slide.$slide ); - - - // If we have a thumbnail, we can display it while actual image is loading - // Users will not stare at black screen and actual image will appear gradually - if ( slide.opts.preload !== false && slide.opts.width && slide.opts.height && ( slide.opts.thumb || slide.opts.$thumb ) ) { - - slide.width = slide.opts.width; - slide.height = slide.opts.height; - - slide.$ghost = $('') - .one('error', function() { - - $(this).remove(); - - slide.$ghost = null; + return value; + }); + }, + + // Populate current group with fresh content + // Check if each object has valid type and content + // =============================================== + + addContent: function(content) { + var self = this, + items = $.makeArray(content), + thumbs; + + $.each(items, function(i, item) { + var obj = {}, + opts = {}, + $item, + type, + found, + src, + srcParts; + + // Step 1 - Make sure we have an object + // ==================================== + + if ($.isPlainObject(item)) { + // We probably have manual usage here, something like + // $.fancybox.open( [ { src : "image.jpg", type : "image" } ] ) + + obj = item; + opts = item.opts || item; + } else if ($.type(item) === "object" && $(item).length) { + // Here we probably have jQuery collection returned by some selector + $item = $(item); + + // Support attributes like `data-options='{"touch" : false}'` and `data-touch='false'` + opts = $item.data() || {}; + opts = $.extend(true, {}, opts, opts.options); + + // Here we store clicked element + opts.$orig = $item; + + obj.src = self.opts.src || opts.src || $item.attr("href"); + + // Assume that simple syntax is used, for example: + // `$.fancybox.open( $("#test"), {} );` + if (!obj.type && !obj.src) { + obj.type = "inline"; + obj.src = item; + } + } else { + // Assume we have a simple html code, for example: + // $.fancybox.open( '

    Hi!

    ' ); + obj = { + type: "html", + src: item + "" + }; + } - self.setBigImage( slide ); + // Each gallery object has full collection of options + obj.opts = $.extend(true, {}, self.opts, opts); - }) - .one('load', function() { + // Do not merge buttons array + if ($.isArray(opts.buttons)) { + obj.opts.buttons = opts.buttons; + } - self.afterLoad( slide ); + // Step 2 - Make sure we have content type, if not - try to guess + // ============================================================== - self.setBigImage( slide ); + type = obj.type || obj.opts.type; + src = obj.src || ""; - }) - .addClass( 'fancybox-image' ) - .appendTo( slide.$content ) - .attr( 'src', slide.opts.thumb || slide.opts.$thumb.attr( 'src' ) ); + if (!type && src) { + if ((found = src.match(/\.(mp4|mov|ogv)((\?|#).*)?$/i))) { + type = "video"; - } else { + if (!obj.opts.videoFormat) { + obj.opts.videoFormat = "video/" + (found[1] === "ogv" ? "ogg" : found[1]); + } + } else if (src.match(/(^data:image\/[a-z0-9+\/=]*,)|(\.(jp(e|g|eg)|gif|png|bmp|webp|svg|ico)((\?|#).*)?$)/i)) { + type = "image"; + } else if (src.match(/\.(pdf)((\?|#).*)?$/i)) { + type = "iframe"; + } else if (src.charAt(0) === "#") { + type = "inline"; + } + } - self.setBigImage( slide ); + if (type) { + obj.type = type; + } else { + self.trigger("objectNeedsType", obj); + } - } + if (!obj.contentType) { + obj.contentType = $.inArray(obj.type, ["html", "inline", "ajax"]) > -1 ? "html" : obj.type; + } - }, + // Step 3 - Some adjustments + // ========================= + obj.index = self.group.length; - // Create full-size image - // ====================== + if (obj.opts.smallBtn == "auto") { + obj.opts.smallBtn = $.inArray(obj.type, ["html", "inline", "ajax"]) > -1; + } - setBigImage : function ( slide ) { - var self = this; - var $img = $(''); + if (obj.opts.toolbar === "auto") { + obj.opts.toolbar = !obj.opts.smallBtn; + } - slide.$image = $img - .one('error', function() { + // Find thumbnail image + if (obj.opts.$trigger && obj.index === self.opts.index) { + obj.opts.$thumb = obj.opts.$trigger.find("img:first"); + } - self.setError( slide ); + if ((!obj.opts.$thumb || !obj.opts.$thumb.length) && obj.opts.$orig) { + obj.opts.$thumb = obj.opts.$orig.find("img:first"); + } - }) - .one('load', function() { + // "caption" is a "special" option, it can be used to customize caption per gallery item .. + if ($.type(obj.opts.caption) === "function") { + obj.opts.caption = obj.opts.caption.apply(item, [self, obj]); + } - // Clear timeout that checks if loading icon needs to be displayed - clearTimeout( slide.timouts ); + if ($.type(self.opts.caption) === "function") { + obj.opts.caption = self.opts.caption.apply(item, [self, obj]); + } - slide.timouts = null; + // Make sure we have caption as a string or jQuery object + if (!(obj.opts.caption instanceof $)) { + obj.opts.caption = obj.opts.caption === undefined ? "" : obj.opts.caption + ""; + } - if ( self.isClosing ) { - return; - } + // Check if url contains "filter" used to filter the content + // Example: "ajax.html #something" + if (obj.type === "ajax") { + srcParts = src.split(/\s+/, 2); - slide.width = slide.opts.width || this.naturalWidth; - slide.height = slide.opts.height || this.naturalHeight; + if (srcParts.length > 1) { + obj.src = srcParts.shift(); - if ( slide.opts.image.srcset ) { - $img.attr( 'sizes', '100vw' ).attr( 'srcset', slide.opts.image.srcset ); - } + obj.opts.filter = srcParts.shift(); + } + } - self.hideLoading( slide ); + // Hide all buttons and disable interactivity for modal items + if (obj.opts.modal) { + obj.opts = $.extend(true, obj.opts, { + // Remove buttons + infobar: 0, + toolbar: 0, + + smallBtn: 0, + + // Disable keyboard navigation + keyboard: 0, + + // Disable some modules + slideShow: 0, + fullScreen: 0, + thumbs: 0, + touch: 0, + + // Disable click event handlers + clickContent: false, + clickSlide: false, + clickOutside: false, + dblclickContent: false, + dblclickSlide: false, + dblclickOutside: false + }); + } - if ( slide.$ghost ) { + // Step 4 - Add processed object to group + // ====================================== - slide.timouts = setTimeout(function() { - slide.timouts = null; + self.group.push(obj); + }); - slide.$ghost.hide(); + // Update controls if gallery is already opened + if (Object.keys(self.slides).length) { + self.updateControls(); - }, Math.min( 300, Math.max( 1000, slide.height / 1600 ) ) ); + // Update thumbnails, if needed + thumbs = self.Thumbs; - } else { - self.afterLoad( slide ); - } + if (thumbs && thumbs.isActive) { + thumbs.create(); - }) - .addClass( 'fancybox-image' ) - .attr('src', slide.src) - .appendTo( slide.$content ); + thumbs.focus(); + } + } + }, + + // Attach an event handler functions for: + // - navigation buttons + // - browser scrolling, resizing; + // - focusing + // - keyboard + // - detect idle + // ====================================== + + addEvents: function() { + var self = this; + + self.removeEvents(); + + // Make navigation elements clickable + self.$refs.container + .on("click.fb-close", "[data-fancybox-close]", function(e) { + e.stopPropagation(); + e.preventDefault(); + + self.close(e); + }) + .on("touchstart.fb-prev click.fb-prev", "[data-fancybox-prev]", function(e) { + e.stopPropagation(); + e.preventDefault(); + + self.previous(); + }) + .on("touchstart.fb-next click.fb-next", "[data-fancybox-next]", function(e) { + e.stopPropagation(); + e.preventDefault(); + + self.next(); + }) + .on("click.fb", "[data-fancybox-zoom]", function(e) { + // Click handler for zoom button + self[self.isScaledDown() ? "scaleToActual" : "scaleToFit"](); + }); + + // Handle page scrolling and browser resizing + $W.on("orientationchange.fb resize.fb", function(e) { + if (e && e.originalEvent && e.originalEvent.type === "resize") { + requestAFrame(function() { + self.update(); + }); + } else { + self.$refs.stage.hide(); - if ( ( $img[0].complete || $img[0].readyState == "complete" ) && $img[0].naturalWidth && $img[0].naturalHeight ) { - $img.trigger( 'load' ); + setTimeout(function() { + self.$refs.stage.show(); - } else if( $img[0].error ) { - $img.trigger( 'error' ); + self.update(); + }, $.fancybox.isMobile ? 600 : 250); + } + }); + + // Trap keyboard focus inside of the modal, so the user does not accidentally tab outside of the modal + // (a.k.a. "escaping the modal") + $D.on("focusin.fb", function(e) { + var instance = $.fancybox ? $.fancybox.getInstance() : null; + + if ( + instance.isClosing || + !instance.current || + !instance.current.opts.trapFocus || + $(e.target).hasClass("fancybox-container") || + $(e.target).is(document) + ) { + return; + } - } else { + if (instance && $(e.target).css("position") !== "fixed" && !instance.$refs.container.has(e.target).length) { + e.stopPropagation(); - slide.timouts = setTimeout(function() { - if ( !$img[0].complete && !slide.hasError ) { - self.showLoading( slide ); - } + instance.focus(); + } + }); - }, 100); + // Enable keyboard navigation + $D.on("keydown.fb", function(e) { + var current = self.current, + keycode = e.keyCode || e.which; - } + if (!current || !current.opts.keyboard) { + return; + } - }, + if (e.ctrlKey || e.altKey || e.shiftKey || $(e.target).is("input") || $(e.target).is("textarea")) { + return; + } + // Backspace and Esc keys + if (keycode === 8 || keycode === 27) { + e.preventDefault(); - // Create iframe wrapper, iframe and bindings - // ========================================== + self.close(e); - setIframe : function( slide ) { - var self = this, - opts = slide.opts.iframe, - $slide = slide.$slide, - $iframe; + return; + } - slide.$content = $('
    ') - .css( opts.css ) - .appendTo( $slide ); + // Left arrow and Up arrow + if (keycode === 37 || keycode === 38) { + e.preventDefault(); - $iframe = $( opts.tpl.replace(/\{rnd\}/g, new Date().getTime()) ) - .attr( opts.attr ) - .appendTo( slide.$content ); + self.previous(); - if ( opts.preload ) { + return; + } - self.showLoading( slide ); + // Righ arrow and Down arrow + if (keycode === 39 || keycode === 40) { + e.preventDefault(); - // Unfortunately, it is not always possible to determine if iframe is successfully loaded - // (due to browser security policy) + self.next(); - $iframe.on('load.fb error.fb', function(e) { - this.isReady = 1; + return; + } - slide.$slide.trigger( 'refresh' ); + self.trigger("afterKeydown", e, keycode); + }); - self.afterLoad( slide ); - }); + // Hide controls after some inactivity period + if (self.group[self.currIndex].opts.idleTime) { + self.idleSecondsCounter = 0; - // Recalculate iframe content size - // =============================== + $D.on( + "mousemove.fb-idle mouseleave.fb-idle mousedown.fb-idle touchstart.fb-idle touchmove.fb-idle scroll.fb-idle keydown.fb-idle", + function(e) { + self.idleSecondsCounter = 0; - $slide.on('refresh.fb', function() { - var $wrap = slide.$content, - frameWidth = opts.css.width, - frameHeight = opts.css.height, - scrollWidth, - $contents, - $body; + if (self.isIdle) { + self.showControls(); + } - if ( $iframe[0].isReady !== 1 ) { - return; - } + self.isIdle = false; + } + ); - // Check if content is accessible, - // it will fail if frame is not with the same origin + self.idleInterval = window.setInterval(function() { + self.idleSecondsCounter++; - try { - $contents = $iframe.contents(); - $body = $contents.find('body'); + if (self.idleSecondsCounter >= self.group[self.currIndex].opts.idleTime && !self.isDragging) { + self.isIdle = true; + self.idleSecondsCounter = 0; - } catch (ignore) {} + self.hideControls(); + } + }, 1000); + } + }, - // Calculate dimensions for the wrapper - if ( $body && $body.length ) { + // Remove events added by the core + // =============================== - if ( frameWidth === undefined ) { - scrollWidth = $iframe[0].contentWindow.document.documentElement.scrollWidth; + removeEvents: function() { + var self = this; - frameWidth = Math.ceil( $body.outerWidth(true) + ( $wrap.width() - scrollWidth ) ); - frameWidth += $wrap.outerWidth() - $wrap.innerWidth(); - } + $W.off("orientationchange.fb resize.fb"); + $D.off("focusin.fb keydown.fb .fb-idle"); - if ( frameHeight === undefined ) { - frameHeight = Math.ceil( $body.outerHeight(true) ); - frameHeight += $wrap.outerHeight() - $wrap.innerHeight(); - } + this.$refs.container.off(".fb-close .fb-prev .fb-next"); - // Resize wrapper to fit iframe content - if ( frameWidth ) { - $wrap.width( frameWidth ); - } + if (self.idleInterval) { + window.clearInterval(self.idleInterval); - if ( frameHeight ) { - $wrap.height( frameHeight ); - } - } + self.idleInterval = null; + } + }, - $wrap.removeClass( 'fancybox-is-hidden' ); + // Change to previous gallery item + // =============================== - }); + previous: function(duration) { + return this.jumpTo(this.currPos - 1, duration); + }, - } else { + // Change to next gallery item + // =========================== - this.afterLoad( slide ); + next: function(duration) { + return this.jumpTo(this.currPos + 1, duration); + }, - } + // Switch to selected gallery item + // =============================== - $iframe.attr( 'src', slide.src ); + jumpTo: function(pos, duration) { + var self = this, + groupLen = self.group.length, + firstRun, + loop, + current, + previous, + canvasWidth, + currentPos, + transitionProps; - if ( slide.opts.smallBtn === true ) { - slide.$content.prepend( self.translate( slide, slide.opts.btnTpl.smallBtn ) ); - } + if (self.isDragging || self.isClosing || (self.isAnimating && self.firstRun)) { + return; + } - // Remove iframe if closing or changing gallery item - $slide.one( 'onReset', function () { + pos = parseInt(pos, 10); - // This helps IE not to throw errors when closing - try { + // Should loop? + loop = self.current ? self.current.opts.loop : self.opts.loop; - $( this ).find( 'iframe' ).hide().attr( 'src', '//about:blank' ); + if (!loop && (pos < 0 || pos >= groupLen)) { + return false; + } - } catch ( ignore ) {} + firstRun = self.firstRun = !Object.keys(self.slides).length; - $( this ).empty(); + if (groupLen < 2 && !firstRun && !!self.isDragging) { + return; + } - slide.isLoaded = false; + previous = self.current; - }); + self.prevIndex = self.currIndex; + self.prevPos = self.currPos; - }, + // Create slides + current = self.createSlide(pos); + if (groupLen > 1) { + if (loop || current.index > 0) { + self.createSlide(pos - 1); + } - // Wrap and append content to the slide - // ====================================== + if (loop || current.index < groupLen - 1) { + self.createSlide(pos + 1); + } + } - setContent : function ( slide, content ) { + self.current = current; + self.currIndex = current.index; + self.currPos = current.pos; - var self = this; + self.trigger("beforeShow", firstRun); - if ( self.isClosing ) { - return; - } + self.updateControls(); - self.hideLoading( slide ); + currentPos = $.fancybox.getTranslate(current.$slide); - slide.$slide.empty(); + current.isMoved = (currentPos.left !== 0 || currentPos.top !== 0) && !current.$slide.hasClass("fancybox-animated"); - if ( isQuery( content ) && content.parent().length ) { + // Validate duration length + current.forcedDuration = undefined; - // If content is a jQuery object, then it will be moved to the slide. - // The placeholder is created so we will know where to put it back. - // If user is navigating gallery fast, then the content might be already inside fancyBox - // ===================================================================================== + if ($.isNumeric(duration)) { + current.forcedDuration = duration; + } else { + duration = current.opts[firstRun ? "animationDuration" : "transitionDuration"]; + } - // Make sure content is not already moved to fancyBox - content.parent( '.fancybox-slide--inline' ).trigger( 'onReset' ); + duration = parseInt(duration, 10); - // Create temporary element marking original place of the content - slide.$placeholder = $( '
    ' ).hide().insertAfter( content ); + // Fresh start - reveal container, current slide and start loading content + if (firstRun) { + if (current.opts.animationEffect && duration) { + self.$refs.container.css("transition-duration", duration + "ms"); + } - // Make sure content is visible - content.css('display', 'inline-block'); + self.$refs.container.removeClass("fancybox-is-hidden"); - } else if ( !slide.hasError ) { + forceRedraw(self.$refs.container); - // If content is just a plain text, try to convert it to html - if ( $.type( content ) === 'string' ) { - content = $('
    ').append( $.trim( content ) ).contents(); + self.$refs.container.addClass("fancybox-is-open"); - // If we have text node, then add wrapping element to make vertical alignment work - if ( content[0].nodeType === 3 ) { - content = $('
    ').html( content ); - } - } + forceRedraw(self.$refs.container); - // If "filter" option is provided, then filter content - if ( slide.opts.filter ) { - content = $('
    ').html( content ).find( slide.opts.filter ); - } + // Make current slide visible + current.$slide.addClass("fancybox-slide--previous"); - } + // Attempt to load content into slide; + // at this point image would start loading, but inline/html content would load immediately + self.loadSlide(current); - slide.$slide.one('onReset', function () { + current.$slide.removeClass("fancybox-slide--previous").addClass("fancybox-slide--current"); - // Pause all html5 video/audio - $( this ).find( 'video,audio' ).trigger( 'pause' ); + self.preload("image"); - // Put content back - if ( slide.$placeholder ) { - slide.$placeholder.after( content.hide() ).remove(); + return; + } - slide.$placeholder = null; - } + // Clean up + $.each(self.slides, function(index, slide) { + $.fancybox.stop(slide.$slide); + }); - // Remove custom close button - if ( slide.$smallBtn ) { - slide.$smallBtn.remove(); + // Make current that slide is visible even if content is still loading + current.$slide.removeClass("fancybox-slide--next fancybox-slide--previous").addClass("fancybox-slide--current"); - slide.$smallBtn = null; - } + // If slides have been dragged, animate them to correct position + if (current.isMoved) { + canvasWidth = Math.round(current.$slide.width()); - // Remove content and mark slide as not loaded - if ( !slide.hasError ) { - $(this).empty(); + $.each(self.slides, function(index, slide) { + var pos = slide.pos - current.pos; - slide.isLoaded = false; - } + $.fancybox.animate( + slide.$slide, + { + top: 0, + left: pos * canvasWidth + pos * slide.opts.gutter + }, + duration, + function() { + slide.$slide.removeAttr("style").removeClass("fancybox-slide--next fancybox-slide--previous"); - }); + if (slide.pos === self.currPos) { + current.isMoved = false; - slide.$content = $( content ).appendTo( slide.$slide ); + self.complete(); + } + } + ); + }); + } else { + self.$refs.stage.children().removeAttr("style"); + } - this.afterLoad( slide ); - }, + // Start transition that reveals current content + // or wait when it will be loaded - // Display error message - // ===================== + if (current.isLoaded) { + self.revealContent(current); + } else { + self.loadSlide(current); + } - setError : function ( slide ) { + self.preload("image"); - slide.hasError = true; + if (previous.pos === current.pos) { + return; + } - slide.$slide.removeClass( 'fancybox-slide--' + slide.type ); + // Handle previous slide + // ===================== - this.setContent( slide, this.translate( slide, slide.opts.errorTpl ) ); + transitionProps = "fancybox-slide--" + (previous.pos > current.pos ? "next" : "previous"); - }, + previous.$slide.removeClass("fancybox-slide--complete fancybox-slide--current fancybox-slide--next fancybox-slide--previous"); + previous.isComplete = false; - // Show loading icon inside the slide - // ================================== + if (!duration || (!current.isMoved && !current.opts.transitionEffect)) { + return; + } - showLoading : function( slide ) { + if (current.isMoved) { + previous.$slide.addClass(transitionProps); + } else { + transitionProps = "fancybox-animated " + transitionProps + " fancybox-fx-" + current.opts.transitionEffect; - var self = this; + $.fancybox.animate(previous.$slide, transitionProps, duration, function() { + previous.$slide.removeClass(transitionProps).removeAttr("style"); + }); + } + }, - slide = slide || self.current; + // Create new "slide" element + // These are gallery items that are actually added to DOM + // ======================================================= - if ( slide && !slide.$spinner ) { - slide.$spinner = $( self.opts.spinnerTpl ).appendTo( slide.$slide ); - } + createSlide: function(pos) { + var self = this, + $slide, + index; + + index = pos % self.group.length; + index = index < 0 ? self.group.length + index : index; + + if (!self.slides[pos] && self.group[index]) { + $slide = $('
    ').appendTo(self.$refs.stage); + + self.slides[pos] = $.extend(true, {}, self.group[index], { + pos: pos, + $slide: $slide, + isLoaded: false + }); + + self.updateSlide(self.slides[pos]); + } + + return self.slides[pos]; + }, + + // Scale image to the actual size of the image; + // x and y values should be relative to the slide + // ============================================== + + scaleToActual: function(x, y, duration) { + var self = this, + current = self.current, + $content = current.$content, + canvasWidth = $.fancybox.getTranslate(current.$slide).width, + canvasHeight = $.fancybox.getTranslate(current.$slide).height, + newImgWidth = current.width, + newImgHeight = current.height, + imgPos, + posX, + posY, + scaleX, + scaleY; + + if (self.isAnimating || !$content || !(current.type == "image" && current.isLoaded && !current.hasError)) { + return; + } - }, + $.fancybox.stop($content); - // Remove loading icon from the slide - // ================================== + self.isAnimating = true; - hideLoading : function( slide ) { + x = x === undefined ? canvasWidth * 0.5 : x; + y = y === undefined ? canvasHeight * 0.5 : y; - var self = this; + imgPos = $.fancybox.getTranslate($content); - slide = slide || self.current; + imgPos.top -= $.fancybox.getTranslate(current.$slide).top; + imgPos.left -= $.fancybox.getTranslate(current.$slide).left; - if ( slide && slide.$spinner ) { - slide.$spinner.remove(); + scaleX = newImgWidth / imgPos.width; + scaleY = newImgHeight / imgPos.height; - delete slide.$spinner; - } + // Get center position for original image + posX = canvasWidth * 0.5 - newImgWidth * 0.5; + posY = canvasHeight * 0.5 - newImgHeight * 0.5; - }, + // Make sure image does not move away from edges + if (newImgWidth > canvasWidth) { + posX = imgPos.left * scaleX - (x * scaleX - x); + if (posX > 0) { + posX = 0; + } - // Adjustments after slide content has been loaded - // =============================================== + if (posX < canvasWidth - newImgWidth) { + posX = canvasWidth - newImgWidth; + } + } - afterLoad : function( slide ) { + if (newImgHeight > canvasHeight) { + posY = imgPos.top * scaleY - (y * scaleY - y); - var self = this; + if (posY > 0) { + posY = 0; + } - if ( self.isClosing ) { - return; - } + if (posY < canvasHeight - newImgHeight) { + posY = canvasHeight - newImgHeight; + } + } - slide.isLoading = false; - slide.isLoaded = true; + self.updateCursor(newImgWidth, newImgHeight); - self.trigger( 'afterLoad', slide ); + $.fancybox.animate( + $content, + { + top: posY, + left: posX, + scaleX: scaleX, + scaleY: scaleY + }, + duration || 330, + function() { + self.isAnimating = false; + } + ); - self.hideLoading( slide ); + // Stop slideshow + if (self.SlideShow && self.SlideShow.isActive) { + self.SlideShow.stop(); + } + }, - if ( slide.opts.smallBtn && !slide.$smallBtn ) { - slide.$smallBtn = $( self.translate( slide, slide.opts.btnTpl.smallBtn ) ).appendTo( slide.$content.filter('div,form').first() ); - } + // Scale image to fit inside parent element + // ======================================== - if ( slide.opts.protect && slide.$content && !slide.hasError ) { + scaleToFit: function(duration) { + var self = this, + current = self.current, + $content = current.$content, + end; - // Disable right click - slide.$content.on( 'contextmenu.fb', function( e ) { - if ( e.button == 2 ) { - e.preventDefault(); - } + if (self.isAnimating || !$content || !(current.type == "image" && current.isLoaded && !current.hasError)) { + return; + } - return true; - }); + $.fancybox.stop($content); - // Add fake element on top of the image - // This makes a bit harder for user to select image - if ( slide.type === 'image' ) { - $( '
    ' ).appendTo( slide.$content ); - } + self.isAnimating = true; - } + end = self.getFitPos(current); - self.revealContent( slide ); + self.updateCursor(end.width, end.height); + $.fancybox.animate( + $content, + { + top: end.top, + left: end.left, + scaleX: end.width / $content.width(), + scaleY: end.height / $content.height() }, + duration || 330, + function() { + self.isAnimating = false; + } + ); + }, + + // Calculate image size to fit inside viewport + // =========================================== + + getFitPos: function(slide) { + var self = this, + $content = slide.$content, + width = slide.width || slide.opts.width, + height = slide.height || slide.opts.height, + maxWidth, + maxHeight, + minRatio, + margin, + aspectRatio, + rez = {}; + + if (!slide.isLoaded || !$content || !$content.length) { + return false; + } + + margin = { + top: parseInt(slide.$slide.css("paddingTop"), 10), + right: parseInt(slide.$slide.css("paddingRight"), 10), + bottom: parseInt(slide.$slide.css("paddingBottom"), 10), + left: parseInt(slide.$slide.css("paddingLeft"), 10) + }; + + // We can not use $slide width here, because it can have different diemensions while in transiton + maxWidth = parseInt(self.$refs.stage.width(), 10) - (margin.left + margin.right); + maxHeight = parseInt(self.$refs.stage.height(), 10) - (margin.top + margin.bottom); + + if (!width || !height) { + width = maxWidth; + height = maxHeight; + } + + minRatio = Math.min(1, maxWidth / width, maxHeight / height); + + // Use floor rounding to make sure it really fits + width = Math.floor(minRatio * width); + height = Math.floor(minRatio * height); + + if (slide.type === "image") { + rez.top = Math.floor((maxHeight - height) * 0.5) + margin.top; + rez.left = Math.floor((maxWidth - width) * 0.5) + margin.left; + } else if (slide.contentType === "video") { + // Force aspect ratio for the video + // "I say the whole world must learn of our peaceful ways… by force!" + aspectRatio = slide.opts.width && slide.opts.height ? width / height : slide.opts.ratio || 16 / 9; + + if (height > width / aspectRatio) { + height = width / aspectRatio; + } else if (width > height * aspectRatio) { + width = height * aspectRatio; + } + } + rez.width = width; + rez.height = height; - // Make content visible - // This method is called right after content has been loaded or - // user navigates gallery and transition should start - // ============================================================ + return rez; + }, - revealContent : function( slide ) { + // Update content size and position for all slides + // ============================================== - var self = this; - var $slide = slide.$slide; + update: function() { + var self = this; - var effect, effectClassName, duration, opacity, end, start = false; + $.each(self.slides, function(key, slide) { + self.updateSlide(slide); + }); + }, - effect = slide.opts[ self.firstRun ? 'animationEffect' : 'transitionEffect' ]; - duration = slide.opts[ self.firstRun ? 'animationDuration' : 'transitionDuration' ]; + // Update slide content position and size + // ====================================== - duration = parseInt( slide.forcedDuration === undefined ? duration : slide.forcedDuration, 10 ); + updateSlide: function(slide, duration) { + var self = this, + $content = slide && slide.$content, + width = slide.width || slide.opts.width, + height = slide.height || slide.opts.height; - if ( slide.isMoved || slide.pos !== self.currPos || !duration ) { - effect = false; - } + if ($content && (width || height || slide.contentType === "video") && !slide.hasError) { + $.fancybox.stop($content); - // Check if can zoom - if ( effect === 'zoom' && !( slide.pos === self.currPos && duration && slide.type === 'image' && !slide.hasError && ( start = self.getThumbPos( slide ) ) ) ) { - effect = 'fade'; - } + $.fancybox.setTranslate($content, self.getFitPos(slide)); - // Zoom animation - // ============== + if (slide.pos === self.currPos) { + self.isAnimating = false; - if ( effect === 'zoom' ) { - end = self.getFitPos( slide ); + self.updateCursor(); + } + } + + slide.$slide.trigger("refresh"); + + self.$refs.toolbar.toggleClass("compensate-for-scrollbar", slide.$slide.get(0).scrollHeight > slide.$slide.get(0).clientHeight); + + self.trigger("onUpdate", slide); + }, + + // Horizontally center slide + // ========================= + + centerSlide: function(slide, duration) { + var self = this, + canvasWidth, + pos; + + if (self.current) { + canvasWidth = Math.round(slide.$slide.width()); + pos = slide.pos - self.current.pos; + + $.fancybox.animate( + slide.$slide, + { + top: 0, + left: pos * canvasWidth + pos * slide.opts.gutter, + opacity: 1 + }, + duration === undefined ? 0 : duration, + null, + false + ); + } + }, + + // Update cursor style depending if content can be zoomed + // ====================================================== + + updateCursor: function(nextWidth, nextHeight) { + var self = this, + current = self.current, + $container = self.$refs.container.removeClass("fancybox-is-zoomable fancybox-can-zoomIn fancybox-can-drag fancybox-can-zoomOut"), + isZoomable; + + if (!current || self.isClosing) { + return; + } - end.scaleX = end.width / start.width; - end.scaleY = end.height / start.height; + isZoomable = self.isZoomable(); - delete end.width; - delete end.height; + $container.toggleClass("fancybox-is-zoomable", isZoomable); - // Check if we need to animate opacity - opacity = slide.opts.zoomOpacity; + $("[data-fancybox-zoom]").prop("disabled", !isZoomable); - if ( opacity == 'auto' ) { - opacity = Math.abs( slide.width / slide.height - start.width / start.height ) > 0.1; - } + // Set cursor to zoom in/out if click event is 'zoom' + if ( + isZoomable && + (current.opts.clickContent === "zoom" || ($.isFunction(current.opts.clickContent) && current.opts.clickContent(current) === "zoom")) + ) { + if (self.isScaledDown(nextWidth, nextHeight)) { + // If image is scaled down, then, obviously, it can be zoomed to full size + $container.addClass("fancybox-can-zoomIn"); + } else { + if (current.opts.touch) { + // If image size ir largen than available available and touch module is not disable, + // then user can do panning + $container.addClass("fancybox-can-drag"); + } else { + $container.addClass("fancybox-can-zoomOut"); + } + } + } else if (current.opts.touch && current.contentType !== "video") { + $container.addClass("fancybox-can-drag"); + } + }, + + // Check if current slide is zoomable + // ================================== + + isZoomable: function() { + var self = this, + current = self.current, + fitPos; + + // Assume that slide is zoomable if: + // - image is still loading + // - actual size of the image is smaller than available area + if (current && !self.isClosing && current.type === "image" && !current.hasError) { + if (!current.isLoaded) { + return true; + } - if ( opacity ) { - start.opacity = 0.1; - end.opacity = 1; - } + fitPos = self.getFitPos(current); - // Draw image at start position - $.fancybox.setTranslate( slide.$content.removeClass( 'fancybox-is-hidden' ), start ); + if (current.width > fitPos.width || current.height > fitPos.height) { + return true; + } + } - forceRedraw( slide.$content ); + return false; + }, - // Start animation - $.fancybox.animate( slide.$content, end, duration, function() { - self.complete(); - }); + // Check if current image dimensions are smaller than actual + // ========================================================= - return; - } + isScaledDown: function(nextWidth, nextHeight) { + var self = this, + rez = false, + current = self.current, + $content = current.$content; - self.updateSlide( slide ); + if (nextWidth !== undefined && nextHeight !== undefined) { + rez = nextWidth < current.width && nextHeight < current.height; + } else if ($content) { + rez = $.fancybox.getTranslate($content); + rez = rez.width < current.width && rez.height < current.height; + } + return rez; + }, - // Simply show content - // =================== + // Check if image dimensions exceed parent element + // =============================================== - if ( !effect ) { - forceRedraw( $slide ); + canPan: function() { + var self = this, + rez = false, + current = self.current, + $content; - slide.$content.removeClass( 'fancybox-is-hidden' ); + if (current.type === "image" && ($content = current.$content) && !current.hasError) { + rez = self.getFitPos(current); + rez = Math.abs($content.width() - rez.width) > 1 || Math.abs($content.height() - rez.height) > 1; + } - if ( slide.pos === self.currPos ) { - self.complete(); - } + return rez; + }, - return; - } + // Load content into the slide + // =========================== - $.fancybox.stop( $slide ); + loadSlide: function(slide) { + var self = this, + type, + $slide, + ajaxLoad; - effectClassName = 'fancybox-animated fancybox-slide--' + ( slide.pos >= self.prevPos ? 'next' : 'previous' ) + ' fancybox-fx-' + effect; + if (slide.isLoading || slide.isLoaded) { + return; + } - $slide.removeAttr( 'style' ).removeClass( 'fancybox-slide--current fancybox-slide--next fancybox-slide--previous' ).addClass( effectClassName ); + slide.isLoading = true; - slide.$content.removeClass( 'fancybox-is-hidden' ); + self.trigger("beforeLoad", slide); - //Force reflow for CSS3 transitions - forceRedraw( $slide ); + type = slide.type; + $slide = slide.$slide; - $.fancybox.animate( $slide, 'fancybox-slide--current', duration, function(e) { - $slide.removeClass( effectClassName ).removeAttr( 'style' ); + $slide + .off("refresh") + .trigger("onReset") + .addClass(slide.opts.slideClass); - if ( slide.pos === self.currPos ) { - self.complete(); - } + // Create content depending on the type + switch (type) { + case "image": + self.setImage(slide); - }, true); + break; - }, + case "iframe": + self.setIframe(slide); + break; - // Check if we can and have to zoom from thumbnail - //================================================ + case "html": + self.setContent(slide, slide.src || slide.content); - getThumbPos : function( slide ) { + break; - var self = this; - var rez = false; + case "video": + self.setContent( + slide, + '
    ") + .hide() + .insertAfter(content); + + // Make sure content is visible + content.css("display", "inline-block"); + } else if (!slide.hasError) { + // If content is just a plain text, try to convert it to html + if ($.type(content) === "string") { + content = $("
    ") + .append($.trim(content)) + .contents(); + + // If we have text node, then add wrapping element to make vertical alignment work + if (content[0].nodeType === 3) { + content = $("
    ").html(content); + } + } - $what = current.$content; - effect = current.opts.animationEffect; - duration = $.isNumeric( d ) ? d : ( effect ? current.opts.animationDuration : 0 ); + // If "filter" option is provided, then filter content + if (slide.opts.filter) { + content = $("
    ") + .html(content) + .find(slide.opts.filter); + } + } - // Remove other slides - current.$slide.off( transitionEnd ).removeClass( 'fancybox-slide--complete fancybox-slide--next fancybox-slide--previous fancybox-animated' ); + slide.$slide.one("onReset", function() { + // Pause all html5 video/audio + $(this) + .find("video,audio") + .trigger("pause"); - current.$slide.siblings().trigger( 'onReset' ).remove(); + // Put content back + if (slide.$placeholder) { + slide.$placeholder.after(content.hide()).remove(); - // Trigger animations - if ( duration ) { - self.$refs.container.removeClass( 'fancybox-is-open' ).addClass( 'fancybox-is-closing' ); - } + slide.$placeholder = null; + } - // Clean up - self.hideLoading( current ); + // Remove custom close button + if (slide.$smallBtn) { + slide.$smallBtn.remove(); - self.hideControls(); + slide.$smallBtn = null; + } - self.updateCursor(); + // Remove content and mark slide as not loaded + if (!slide.hasError) { + $(this).empty(); - // Check if possible to zoom-out - if ( effect === 'zoom' && !( e !== true && $what && duration && current.type === 'image' && !current.hasError && ( end = self.getThumbPos( current ) ) ) ) { - effect = 'fade'; - } + slide.isLoaded = false; + } + }); - if ( effect === 'zoom' ) { - $.fancybox.stop( $what ); + $(content).appendTo(slide.$slide); - start = $.fancybox.getTranslate( $what ); + if ($(content).is("video,audio")) { + $(content).addClass("fancybox-video"); - start.width = start.width * start.scaleX; - start.height = start.height * start.scaleY; + $(content).wrap("
    "); - // Check if we need to animate opacity - opacity = current.opts.zoomOpacity; + slide.contentType = "video"; - if ( opacity == 'auto' ) { - opacity = Math.abs( current.width / current.height - end.width / end.height ) > 0.1; - } + slide.opts.width = slide.opts.width || $(content).attr("width"); + slide.opts.height = slide.opts.height || $(content).attr("height"); + } - if ( opacity ) { - end.opacity = 0; - } + slide.$content = slide.$slide + .children() + .filter("div,form,main,video,audio") + .first() + .addClass("fancybox-content"); - start.scaleX = start.width / end.width; - start.scaleY = start.height / end.height; + slide.$slide.addClass("fancybox-slide--" + slide.contentType); - start.width = end.width; - start.height = end.height; + this.afterLoad(slide); + }, - $.fancybox.setTranslate( current.$content, start ); + // Display error message + // ===================== - forceRedraw( current.$content ); + setError: function(slide) { + slide.hasError = true; - $.fancybox.animate( current.$content, end, duration, done ); + slide.$slide + .trigger("onReset") + .removeClass("fancybox-slide--" + slide.contentType) + .addClass("fancybox-slide--error"); - return true; - } + slide.contentType = "html"; - if ( effect && duration ) { + this.setContent(slide, this.translate(slide, slide.opts.errorTpl)); - // If skip animation - if ( e === true ) { - setTimeout( done, duration ); + if (slide.pos === this.currPos) { + this.isAnimating = false; + } + }, - } else { - $.fancybox.animate( current.$slide.removeClass( 'fancybox-slide--current' ), 'fancybox-animated fancybox-slide--previous fancybox-fx-' + effect, duration, done ); - } + // Show loading icon inside the slide + // ================================== - } else { - done(); - } + showLoading: function(slide) { + var self = this; - return true; - }, + slide = slide || self.current; + if (slide && !slide.$spinner) { + slide.$spinner = $(self.translate(self, self.opts.spinnerTpl)).appendTo(slide.$slide); + } + }, - // Final adjustments after removing the instance - // ============================================= + // Remove loading icon from the slide + // ================================== - cleanUp : function( e ) { - var self = this, - $body = $( 'body' ), - instance, - offset; + hideLoading: function(slide) { + var self = this; - self.current.$slide.trigger( 'onReset' ); + slide = slide || self.current; - self.$refs.container.empty().remove(); + if (slide && slide.$spinner) { + slide.$spinner.remove(); - self.trigger( 'afterClose', e ); + delete slide.$spinner; + } + }, - // Place back focus - if ( self.$lastFocus && !!self.current.opts.backFocus ) { - self.$lastFocus.focus(); - } + // Adjustments after slide content has been loaded + // =============================================== - self.current = null; + afterLoad: function(slide) { + var self = this; - // Check if there are other instances - instance = $.fancybox.getInstance(); + if (self.isClosing) { + return; + } - if ( instance ) { - instance.activate(); + slide.isLoading = false; + slide.isLoaded = true; - } else { + self.trigger("afterLoad", slide); - $W.scrollTop( self.scrollTop ).scrollLeft( self.scrollLeft ); + self.hideLoading(slide); - $body.removeClass( 'fancybox-active compensate-for-scrollbar' ); + if (slide.pos === self.currPos) { + self.updateCursor(); + } - if ( $body.hasClass( 'fancybox-iosfix' ) ) { - offset = parseInt(document.body.style.top, 10); + if (slide.opts.smallBtn && (!slide.$smallBtn || !slide.$smallBtn.length)) { + slide.$smallBtn = $(self.translate(slide, slide.opts.btnTpl.smallBtn)).prependTo(slide.$content); + } - $body.removeClass( 'fancybox-iosfix' ).css( 'top', '' ).scrollTop( offset * -1 ); - } + if (slide.opts.protect && slide.$content && !slide.hasError) { + // Disable right click + slide.$content.on("contextmenu.fb", function(e) { + if (e.button == 2) { + e.preventDefault(); + } - $( '#fancybox-style-noscroll' ).remove(); + return true; + }); - } + // Add fake element on top of the image + // This makes a bit harder for user to select image + if (slide.type === "image") { + $('
    ').appendTo(slide.$content); + } + } + + self.revealContent(slide); + }, + + // Make content visible + // This method is called right after content has been loaded or + // user navigates gallery and transition should start + // ============================================================ + + revealContent: function(slide) { + var self = this, + $slide = slide.$slide, + end = false, + start = false, + effect, + effectClassName, + duration, + opacity; + + effect = slide.opts[self.firstRun ? "animationEffect" : "transitionEffect"]; + duration = slide.opts[self.firstRun ? "animationDuration" : "transitionDuration"]; + + duration = parseInt(slide.forcedDuration === undefined ? duration : slide.forcedDuration, 10); + + if (slide.pos === self.currPos) { + if (slide.isComplete) { + effect = false; + } else { + self.isAnimating = true; + } + } - }, + if (slide.isMoved || slide.pos !== self.currPos || !duration) { + effect = false; + } + // Check if can zoom + if (effect === "zoom") { + if (slide.pos === self.currPos && duration && slide.type === "image" && !slide.hasError && (start = self.getThumbPos(slide))) { + end = self.getFitPos(slide); + } else { + effect = "fade"; + } + } - // Call callback and trigger an event - // ================================== + // Zoom animation + // ============== - trigger : function( name, slide ) { - var args = Array.prototype.slice.call(arguments, 1), - self = this, - obj = slide && slide.opts ? slide : self.current, - rez; + if (effect === "zoom") { + end.scaleX = end.width / start.width; + end.scaleY = end.height / start.height; - if ( obj ) { - args.unshift( obj ); + // Check if we need to animate opacity + opacity = slide.opts.zoomOpacity; - } else { - obj = self; - } + if (opacity == "auto") { + opacity = Math.abs(slide.width / slide.height - start.width / start.height) > 0.1; + } - args.unshift( self ); + if (opacity) { + start.opacity = 0.1; + end.opacity = 1; + } - if ( $.isFunction( obj.opts[ name ] ) ) { - rez = obj.opts[ name ].apply( obj, args ); - } + // Draw image at start position + $.fancybox.setTranslate(slide.$content.removeClass("fancybox-is-hidden"), start); - if ( rez === false ) { - return rez; - } + forceRedraw(slide.$content); - if ( name === 'afterClose' || !self.$refs ) { - $D.trigger( name + '.fb', args ); + // Start animation + $.fancybox.animate(slide.$content, end, duration, function() { + self.isAnimating = false; - } else { - self.$refs.container.trigger( name + '.fb', args ); - } + self.complete(); + }); - }, + return; + } + self.updateSlide(slide); - // Update infobar values, navigation button states and reveal caption - // ================================================================== + // Simply show content + // =================== - updateControls : function ( force ) { + if (!effect) { + forceRedraw($slide); - var self = this; + slide.$content.removeClass("fancybox-is-hidden"); - var current = self.current, - index = current.index, - caption = current.opts.caption, - $container = self.$refs.container, - $caption = self.$refs.caption; + if (slide.pos === self.currPos) { + self.complete(); + } - // Recalculate content dimensions - current.$slide.trigger( 'refresh' ); + return; + } - self.$caption = caption && caption.length ? $caption.html( caption ) : null; + $.fancybox.stop($slide); - if ( !self.isHiddenControls && !self.isIdle ) { - self.showControls(); - } + effectClassName = "fancybox-animated fancybox-slide--" + (slide.pos >= self.prevPos ? "next" : "previous") + " fancybox-fx-" + effect; - // Update info and navigation elements - $container.find('[data-fancybox-count]').html( self.group.length ); - $container.find('[data-fancybox-index]').html( index + 1 ); + $slide + .removeAttr("style") + .removeClass("fancybox-slide--current fancybox-slide--next fancybox-slide--previous") + .addClass(effectClassName); - $container.find('[data-fancybox-prev]').prop( 'disabled', ( !current.opts.loop && index <= 0 ) ); - $container.find('[data-fancybox-next]').prop( 'disabled', ( !current.opts.loop && index >= self.group.length - 1 ) ); + slide.$content.removeClass("fancybox-is-hidden"); - if ( current.type === 'image' ) { + // Force reflow for CSS3 transitions + forceRedraw($slide); - // Update download button source - $container.find('[data-fancybox-download]').attr( 'href', current.opts.image.src || current.src ).show(); + $.fancybox.animate( + $slide, + "fancybox-slide--current", + duration, + function(e) { + $slide.removeClass(effectClassName).removeAttr("style"); - } else { - $container.find('[data-fancybox-download],[data-fancybox-zoom]').hide(); - } + if (slide.pos === self.currPos) { + self.complete(); + } }, + true + ); + }, + + // Check if we can and have to zoom from thumbnail + //================================================ + + getThumbPos: function(slide) { + var self = this, + rez = false, + $thumb = slide.opts.$thumb, + thumbPos = $thumb ? $thumb.offset() : 0, + slidePos; + + // Check if element is inside the viewport by at least 1 pixel + var isElementVisible = function($el) { + var element = $el[0], + elementRect = element.getBoundingClientRect(), + parentRects = [], + visibleInAllParents; + + while (element.parentElement !== null) { + if ($(element.parentElement).css("overflow") === "hidden" || $(element.parentElement).css("overflow") === "auto") { + parentRects.push(element.parentElement.getBoundingClientRect()); + } + + element = element.parentElement; + } - // Hide toolbar and caption - // ======================== + visibleInAllParents = parentRects.every(function(parentRect) { + var visiblePixelX = Math.min(elementRect.right, parentRect.right) - Math.max(elementRect.left, parentRect.left); + var visiblePixelY = Math.min(elementRect.bottom, parentRect.bottom) - Math.max(elementRect.top, parentRect.top); + + return visiblePixelX > 0 && visiblePixelY > 0; + }); + + return ( + visibleInAllParents && + elementRect.bottom > 0 && + elementRect.right > 0 && + elementRect.left < $(window).width() && + elementRect.top < $(window).height() + ); + }; + + if (thumbPos && $thumb[0].ownerDocument === document && isElementVisible($thumb)) { + slidePos = self.$refs.stage.offset(); + + rez = { + top: thumbPos.top - slidePos.top + parseFloat($thumb.css("border-top-width") || 0), + left: thumbPos.left - slidePos.left + parseFloat($thumb.css("border-left-width") || 0), + width: $thumb.width(), + height: $thumb.height(), + scaleX: 1, + scaleY: 1 + }; + } - hideControls : function () { + return rez; + }, - this.isHiddenControls = true; + // Final adjustments after current gallery item is moved to position + // and it`s content is loaded + // ================================================================== - this.$refs.container.removeClass( 'fancybox-show-infobar fancybox-show-toolbar fancybox-show-caption fancybox-show-nav' ); + complete: function() { + var self = this, + current = self.current, + slides = {}; - }, + if (current.isMoved || !current.isLoaded) { + return; + } - showControls : function() { - var self = this; - var opts = self.current ? self.current.opts : self.opts; - var $container = self.$refs.container; + if (!current.isComplete) { + current.isComplete = true; - self.isHiddenControls = false; - self.idleSecondsCounter = 0; + current.$slide.siblings().trigger("onReset"); - $container - .toggleClass( 'fancybox-show-toolbar', !!( opts.toolbar && opts.buttons ) ) - .toggleClass( 'fancybox-show-infobar', !!( opts.infobar && self.group.length > 1 ) ) - .toggleClass( 'fancybox-show-nav', !!( opts.arrows && self.group.length > 1 ) ) - .toggleClass( 'fancybox-is-modal', !!opts.modal ); + self.preload("inline"); - if ( self.$caption ) { - $container.addClass( 'fancybox-show-caption '); + // Trigger any CSS3 transiton inside the slide + forceRedraw(current.$slide); - } else { - $container.removeClass( 'fancybox-show-caption' ); - } + current.$slide.addClass("fancybox-slide--complete"); - }, + // Remove unnecessary slides + $.each(self.slides, function(key, slide) { + if (slide.pos >= self.currPos - 1 && slide.pos <= self.currPos + 1) { + slides[slide.pos] = slide; + } else if (slide) { + $.fancybox.stop(slide.$slide); + slide.$slide.off().remove(); + } + }); - // Toggle toolbar and caption - // ========================== + self.slides = slides; + } - toggleControls : function() { - if ( this.isHiddenControls ) { - this.showControls(); + self.isAnimating = false; - } else { - this.hideControls(); - } + self.updateCursor(); - }, + self.trigger("afterShow"); + // Play first html5 video/audio + current.$slide + .find("video,audio") + .filter(":visible:first") + .trigger("play"); - }); + // Try to focus on the first focusable element + if ( + $(document.activeElement).is("[disabled]") || + (current.opts.autoFocus && !(current.type == "image" || current.type === "iframe")) + ) { + self.focus(); + } + }, + // Preload next and previous slides + // ================================ - $.fancybox = { + preload: function(type) { + var self = this, + next = self.slides[self.currPos + 1], + prev = self.slides[self.currPos - 1]; - version : "{fancybox-version}", - defaults : defaults, + if (next && next.type === type) { + self.loadSlide(next); + } + if (prev && prev.type === type) { + self.loadSlide(prev); + } + }, - // Get current instance and execute a command. - // - // Examples of usage: - // - // $instance = $.fancybox.getInstance(); - // $.fancybox.getInstance().jumpTo( 1 ); - // $.fancybox.getInstance( 'jumpTo', 1 ); - // $.fancybox.getInstance( function() { - // console.info( this.currIndex ); - // }); - // ====================================================== + // Try to find and focus on the first focusable element + // ==================================================== - getInstance : function ( command ) { - var instance = $('.fancybox-container:not(".fancybox-is-closing"):last').data( 'FancyBox' ); - var args = Array.prototype.slice.call(arguments, 1); + focus: function() { + var current = this.current, + $el; - if ( instance instanceof FancyBox ) { + if (this.isClosing) { + return; + } - if ( $.type( command ) === 'string' ) { - instance[ command ].apply( instance, args ); + if (current && current.isComplete && current.$content) { + // Look for first input with autofocus attribute + $el = current.$content.find("input[autofocus]:enabled:visible:first"); - } else if ( $.type( command ) === 'function' ) { - command.apply( instance, args ); - } + if (!$el.length) { + $el = current.$content.find("button,:input,[tabindex],a").filter(":enabled:visible:first"); + } - return instance; - } + $el = $el && $el.length ? $el : current.$content; - return false; + $el.trigger("focus"); + } + }, - }, + // Activates current instance - brings container to the front and enables keyboard, + // notifies other instances about deactivating + // ================================================================================= + activate: function() { + var self = this; - // Create new instance - // =================== + // Deactivate all instances + $(".fancybox-container").each(function() { + var instance = $(this).data("FancyBox"); - open : function ( items, opts, index ) { - return new FancyBox( items, opts, index ); - }, + // Skip self and closing instances + if (instance && instance.id !== self.id && !instance.isClosing) { + instance.trigger("onDeactivate"); + instance.removeEvents(); - // Close current or all instances - // ============================== + instance.isVisible = false; + } + }); - close : function ( all ) { - var instance = this.getInstance(); + self.isVisible = true; - if ( instance ) { - instance.close(); + if (self.current || self.isIdle) { + self.update(); - // Try to find and close next instance + self.updateControls(); + } - if ( all === true ) { - this.close(); - } - } + self.trigger("onActivate"); - }, + self.addEvents(); + }, - // Close instances and unbind all events - // ============================== + // Start closing procedure + // This will start "zoom-out" animation if needed and clean everything up afterwards + // ================================================================================= - destroy : function() { + close: function(e, d) { + var self = this, + current = self.current, + effect, + duration, + $content, + domRect, + opacity, + start, + end; + + var done = function() { + self.cleanUp(e); + }; + + if (self.isClosing) { + return false; + } + + self.isClosing = true; + + // If beforeClose callback prevents closing, make sure content is centered + if (self.trigger("beforeClose", e) === false) { + self.isClosing = false; + + requestAFrame(function() { + self.update(); + }); + + return false; + } + + // Remove all events + // If there are multiple instances, they will be set again by "activate" method + self.removeEvents(); + + if (current.timouts) { + clearTimeout(current.timouts); + } + + $content = current.$content; + effect = current.opts.animationEffect; + duration = $.isNumeric(d) ? d : effect ? current.opts.animationDuration : 0; + + // Remove other slides + current.$slide + .off(transitionEnd) + .removeClass("fancybox-slide--complete fancybox-slide--next fancybox-slide--previous fancybox-animated"); + + current.$slide + .siblings() + .trigger("onReset") + .remove(); + + // Trigger animations + if (duration) { + self.$refs.container.removeClass("fancybox-is-open").addClass("fancybox-is-closing"); + } + + // Clean up + self.hideLoading(current); + + self.hideControls(); + + self.updateCursor(); + + // Check if possible to zoom-out + if ( + effect === "zoom" && + !(e !== true && $content && duration && current.type === "image" && !current.hasError && (end = self.getThumbPos(current))) + ) { + effect = "fade"; + } + + if (effect === "zoom") { + $.fancybox.stop($content); + + domRect = $.fancybox.getTranslate($content); + + start = { + top: domRect.top, + left: domRect.left, + scaleX: domRect.width / end.width, + scaleY: domRect.height / end.height, + width: end.width, + height: end.height + }; - this.close( true ); + // Check if we need to animate opacity + opacity = current.opts.zoomOpacity; - $D.off( 'click.fb-start' ); + if (opacity == "auto") { + opacity = Math.abs(current.width / current.height - end.width / end.height) > 0.1; + } - }, + if (opacity) { + end.opacity = 0; + } + $.fancybox.setTranslate($content, start); - // Try to detect mobile devices - // ============================ + forceRedraw($content); - isMobile : document.createTouch !== undefined && /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent), + $.fancybox.animate($content, end, duration, done); + return true; + } - // Detect if 'translate3d' support is available - // ============================================ + if (effect && duration) { + // If skip animation + if (e === true) { + setTimeout(done, duration); + } else { + $.fancybox.animate( + current.$slide.removeClass("fancybox-slide--current"), + "fancybox-animated fancybox-slide--previous fancybox-fx-" + effect, + duration, + done + ); + } + } else { + done(); + } - use3d : (function() { - var div = document.createElement('div'); + return true; + }, - return window.getComputedStyle && window.getComputedStyle( div ).getPropertyValue('transform') && !(document.documentMode && document.documentMode < 11); - }()), + // Final adjustments after removing the instance + // ============================================= - // Helper function to get current visual state of an element - // returns array[ top, left, horizontal-scale, vertical-scale, opacity ] - // ===================================================================== + cleanUp: function(e) { + var self = this, + $body = $("body"), + instance, + scrollTop; - getTranslate : function( $el ) { - var matrix; + self.current.$slide.trigger("onReset"); - if ( !$el || !$el.length ) { - return false; - } + self.$refs.container.empty().remove(); - matrix = $el.eq( 0 ).css('transform'); + self.trigger("afterClose", e); - if ( matrix && matrix.indexOf( 'matrix' ) !== -1 ) { - matrix = matrix.split('(')[1]; - matrix = matrix.split(')')[0]; - matrix = matrix.split(','); - } else { - matrix = []; - } + // Place back focus + if (self.$lastFocus && !!self.current.opts.backFocus) { + self.$lastFocus.trigger("focus"); + } - if ( matrix.length ) { + self.current = null; - // If IE - if ( matrix.length > 10 ) { - matrix = [ matrix[13], matrix[12], matrix[0], matrix[5] ]; + // Check if there are other instances + instance = $.fancybox.getInstance(); - } else { - matrix = [ matrix[5], matrix[4], matrix[0], matrix[3]]; - } + if (instance) { + instance.activate(); + } else { + $body.removeClass("fancybox-active compensate-for-scrollbar"); - matrix = matrix.map(parseFloat); + $("#fancybox-style-noscroll").remove(); - } else { - matrix = [ 0, 0, 1, 1 ]; + if ($body.hasClass("fancybox-iosfix")) { + scrollTop = parseInt($body[0].style.top, 10); - var transRegex = /\.*translate\((.*)px,(.*)px\)/i; - var transRez = transRegex.exec( $el.eq( 0 ).attr('style') ); + $body.css("top", "").removeClass("fancybox-iosfix"); - if ( transRez ) { - matrix[ 0 ] = parseFloat( transRez[2] ); - matrix[ 1 ] = parseFloat( transRez[1] ); - } - } + $W.scrollTop(-scrollTop); + } + } + }, + + // Call callback and trigger an event + // ================================== + + trigger: function(name, slide) { + var args = Array.prototype.slice.call(arguments, 1), + self = this, + obj = slide && slide.opts ? slide : self.current, + rez; + + if (obj) { + args.unshift(obj); + } else { + obj = self; + } + + args.unshift(self); + + if ($.isFunction(obj.opts[name])) { + rez = obj.opts[name].apply(obj, args); + } + + if (rez === false) { + return rez; + } + + if (name === "afterClose" || !self.$refs) { + $D.trigger(name + ".fb", args); + } else { + self.$refs.container.trigger(name + ".fb", args); + } + }, + + // Update infobar values, navigation button states and reveal caption + // ================================================================== + + updateControls: function(force) { + var self = this, + current = self.current, + index = current.index, + caption = current.opts.caption, + $container = self.$refs.container, + $caption = self.$refs.caption; + + // Recalculate content dimensions + current.$slide.trigger("refresh"); + + self.$caption = caption && caption.length ? $caption.html(caption) : null; + + if (!self.isHiddenControls && !self.isIdle) { + self.showControls(); + } + + // Update info and navigation elements + $container.find("[data-fancybox-count]").html(self.group.length); + $container.find("[data-fancybox-index]").html(index + 1); + + $container.find("[data-fancybox-prev]").toggleClass("disabled", !current.opts.loop && index <= 0); + $container.find("[data-fancybox-next]").toggleClass("disabled", !current.opts.loop && index >= self.group.length - 1); + + if (current.type === "image") { + // Re-enable buttons; update download button source + $container + .find("[data-fancybox-zoom]") + .show() + .end() + .find("[data-fancybox-download]") + .attr("href", current.opts.image.src || current.src) + .show(); + } else if (current.opts.toolbar) { + $container.find("[data-fancybox-download],[data-fancybox-zoom]").hide(); + } + }, + + // Hide toolbar and caption + // ======================== - return { - top : matrix[ 0 ], - left : matrix[ 1 ], - scaleX : matrix[ 2 ], - scaleY : matrix[ 3 ], - opacity : parseFloat( $el.css('opacity') ), - width : $el.width(), - height : $el.height() - }; + hideControls: function() { + this.isHiddenControls = true; + + this.$refs.container.removeClass("fancybox-show-infobar fancybox-show-toolbar fancybox-show-caption fancybox-show-nav"); + }, + + showControls: function() { + var self = this, + opts = self.current ? self.current.opts : self.opts, + $container = self.$refs.container; + + self.isHiddenControls = false; + self.idleSecondsCounter = 0; + + $container + .toggleClass("fancybox-show-toolbar", !!(opts.toolbar && opts.buttons)) + .toggleClass("fancybox-show-infobar", !!(opts.infobar && self.group.length > 1)) + .toggleClass("fancybox-show-nav", !!(opts.arrows && self.group.length > 1)) + .toggleClass("fancybox-is-modal", !!opts.modal); + + if (self.$caption) { + $container.addClass("fancybox-show-caption "); + } else { + $container.removeClass("fancybox-show-caption"); + } + }, + + // Toggle toolbar and caption + // ========================== + + toggleControls: function() { + if (this.isHiddenControls) { + this.showControls(); + } else { + this.hideControls(); + } + } + }); + + $.fancybox = { + version: "{fancybox-version}", + defaults: defaults, + + // Get current instance and execute a command. + // + // Examples of usage: + // + // $instance = $.fancybox.getInstance(); + // $.fancybox.getInstance().jumpTo( 1 ); + // $.fancybox.getInstance( 'jumpTo', 1 ); + // $.fancybox.getInstance( function() { + // console.info( this.currIndex ); + // }); + // ====================================================== + + getInstance: function(command) { + var instance = $('.fancybox-container:not(".fancybox-is-closing"):last').data("FancyBox"), + args = Array.prototype.slice.call(arguments, 1); + + if (instance instanceof FancyBox) { + if ($.type(command) === "string") { + instance[command].apply(instance, args); + } else if ($.type(command) === "function") { + command.apply(instance, args); + } - }, + return instance; + } + return false; + }, - // Shortcut for setting "translate3d" properties for element - // Can set be used to set opacity, too - // ======================================================== + // Create new instance + // =================== - setTranslate : function( $el, props ) { - var str = ''; - var css = {}; + open: function(items, opts, index) { + return new FancyBox(items, opts, index); + }, - if ( !$el || !props ) { - return; - } + // Close current or all instances + // ============================== - if ( props.left !== undefined || props.top !== undefined ) { - str = ( props.left === undefined ? $el.position().left : props.left ) + 'px, ' + ( props.top === undefined ? $el.position().top : props.top ) + 'px'; + close: function(all) { + var instance = this.getInstance(); - if ( this.use3d ) { - str = 'translate3d(' + str + ', 0px)'; + if (instance) { + instance.close(); - } else { - str = 'translate(' + str + ')'; - } - } + // Try to find and close next instance - if ( props.scaleX !== undefined && props.scaleY !== undefined ) { - str = (str.length ? str + ' ' : '') + 'scale(' + props.scaleX + ', ' + props.scaleY + ')'; - } + if (all === true) { + this.close(); + } + } + }, - if ( str.length ) { - css.transform = str; - } + // Close all instances and unbind all events + // ========================================= - if ( props.opacity !== undefined ) { - css.opacity = props.opacity; - } + destroy: function() { + this.close(true); - if ( props.width !== undefined ) { - css.width = props.width; - } + $D.add("body").off("click.fb-start", "**"); + }, - if ( props.height !== undefined ) { - css.height = props.height; - } + // Try to detect mobile devices + // ============================ - return $el.css( css ); - }, + isMobile: + document.createTouch !== undefined && /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent), + // Detect if 'translate3d' support is available + // ============================================ - // Simple CSS transition handler - // ============================= + use3d: (function() { + var div = document.createElement("div"); - animate : function ( $el, to, duration, callback, leaveAnimationName ) { - if ( $.isFunction( duration ) ) { - callback = duration; - duration = null; - } + return ( + window.getComputedStyle && + window.getComputedStyle(div) && + window.getComputedStyle(div).getPropertyValue("transform") && + !(document.documentMode && document.documentMode < 11) + ); + })(), - if ( !$.isPlainObject( to ) ) { - $el.removeAttr( 'style' ); - } + // Helper function to get current visual state of an element + // returns array[ top, left, horizontal-scale, vertical-scale, opacity ] + // ===================================================================== - $el.on( transitionEnd, function(e) { + getTranslate: function($el) { + var domRect; - // Skip events from child elements and z-index change - if ( e && e.originalEvent && ( !$el.is( e.originalEvent.target ) || e.originalEvent.propertyName == 'z-index' ) ) { - return; - } + if (!$el || !$el.length) { + return false; + } - $.fancybox.stop( $el ); + domRect = $el[0].getBoundingClientRect(); - if ( $.isPlainObject( to ) ) { + return { + top: domRect.top || 0, + left: domRect.left || 0, + width: domRect.width, + height: domRect.height, + opacity: parseFloat($el.css("opacity")) + }; + }, - if ( to.scaleX !== undefined && to.scaleY !== undefined ) { - $el.css( 'transition-duration', '' ); + // Shortcut for setting "translate3d" properties for element + // Can set be used to set opacity, too + // ======================================================== - to.width = Math.round( $el.width() * to.scaleX ); - to.height = Math.round( $el.height() * to.scaleY ); + setTranslate: function($el, props) { + var str = "", + css = {}; - to.scaleX = 1; - to.scaleY = 1; + if (!$el || !props) { + return; + } - $.fancybox.setTranslate( $el, to ); - } + if (props.left !== undefined || props.top !== undefined) { + str = + (props.left === undefined ? $el.position().left : props.left) + + "px, " + + (props.top === undefined ? $el.position().top : props.top) + + "px"; - if ( leaveAnimationName === false ) { - $el.removeAttr( 'style' ); - } + if (this.use3d) { + str = "translate3d(" + str + ", 0px)"; + } else { + str = "translate(" + str + ")"; + } + } - } else if ( leaveAnimationName !== true ) { - $el.removeClass( to ); - } + if (props.scaleX !== undefined && props.scaleY !== undefined) { + str = (str.length ? str + " " : "") + "scale(" + props.scaleX + ", " + props.scaleY + ")"; + } - if ( $.isFunction( callback ) ) { - callback( e ); - } + if (str.length) { + css.transform = str; + } - }); + if (props.opacity !== undefined) { + css.opacity = props.opacity; + } - if ( $.isNumeric( duration ) ) { - $el.css( 'transition-duration', duration + 'ms' ); - } + if (props.width !== undefined) { + css.width = props.width; + } - if ( $.isPlainObject( to ) ) { - $.fancybox.setTranslate( $el, to ); + if (props.height !== undefined) { + css.height = props.height; + } - } else { - $el.addClass( to ); - } + return $el.css(css); + }, - if ( to.scaleX && $el.hasClass( 'fancybox-image-wrap' ) ) { - $el.parent().addClass( 'fancybox-is-scaling' ); - } + // Simple CSS transition handler + // ============================= - // Make sure that `transitionend` callback gets fired - $el.data("timer", setTimeout(function() { - $el.trigger( 'transitionend' ); - }, duration + 16)); + animate: function($el, to, duration, callback, leaveAnimationName) { + var final = false; - }, + if ($.isFunction(duration)) { + callback = duration; + duration = null; + } - stop : function( $el ) { - clearTimeout( $el.data("timer") ); + if (!$.isPlainObject(to)) { + $el.removeAttr("style"); + } - $el.off( 'transitionend' ).css( 'transition-duration', '' ); + $.fancybox.stop($el); - if ( $el.hasClass( 'fancybox-image-wrap' ) ) { - $el.parent().removeClass( 'fancybox-is-scaling' ); - } + $el.on(transitionEnd, function(e) { + // Skip events from child elements and z-index change + if (e && e.originalEvent && (!$el.is(e.originalEvent.target) || e.originalEvent.propertyName == "z-index")) { + return; } - }; - + $.fancybox.stop($el); - // Default click handler for "fancyboxed" links - // ============================================ - - function _run( e ) { - var $target = $( e.currentTarget ), - opts = e.data ? e.data.options : {}, - value = $target.attr( 'data-fancybox' ) || '', - index = 0, - items = []; + if (final) { + $.fancybox.setTranslate($el, final); + } - // Avoid opening multiple times - if ( e.isDefaultPrevented() ) { - return; + if ($.isPlainObject(to)) { + if (leaveAnimationName === false) { + $el.removeAttr("style"); + } + } else if (leaveAnimationName !== true) { + $el.removeClass(to); } - e.preventDefault(); + if ($.isFunction(callback)) { + callback(e); + } + }); + + if ($.isNumeric(duration)) { + $el.css("transition-duration", duration + "ms"); + } + + // Start animation by changing CSS properties or class name + if ($.isPlainObject(to)) { + if (to.scaleX !== undefined && to.scaleY !== undefined) { + final = $.extend({}, to, { + width: $el.width() * to.scaleX, + height: $el.height() * to.scaleY, + scaleX: 1, + scaleY: 1 + }); + + delete to.width; + delete to.height; + + if ($el.parent().hasClass("fancybox-slide--image")) { + $el.parent().addClass("fancybox-is-scaling"); + } + } - // Get all related items and find index for clicked one - if ( value ) { - items = opts.selector ? $( opts.selector ) : ( e.data ? e.data.items : [] ); - items = items.length ? items.filter( '[data-fancybox="' + value + '"]' ) : $( '[data-fancybox="' + value + '"]' ); + $.fancybox.setTranslate($el, to); + } else { + $el.addClass(to); + } - index = items.index( $target ); + // Make sure that `transitionend` callback gets fired + $el.data( + "timer", + setTimeout(function() { + $el.trigger("transitionend"); + }, duration + 16) + ); + }, - // Sometimes current item can not be found - // (for example, when slider clones items) - if ( index < 0 ) { - index = 0; - } + stop: function($el) { + if ($el && $el.length) { + clearTimeout($el.data("timer")); - } else { - items = [ $target ]; - } + $el.off("transitionend").css("transition-duration", ""); - $.fancybox.open( items, opts, index ); + $el.parent().removeClass("fancybox-is-scaling"); + } } + }; + // Default click handler for "fancyboxed" links + // ============================================ - // Create a jQuery plugin - // ====================== + function _run(e, opts) { + var items = [], + index = 0, + $target, + value; - $.fn.fancybox = function (options) { - var selector; + // Avoid opening multiple times + if (e && e.isDefaultPrevented()) { + return; + } - options = options || {}; - selector = options.selector || false; + e.preventDefault(); - if ( selector ) { + opts = e && e.data ? e.data.options : opts || {}; - $( 'body' ).off( 'click.fb-start', selector ).on( 'click.fb-start', selector, { - options : options - }, _run ); + $target = opts.$target || $(e.currentTarget); + value = $target.attr("data-fancybox") || ""; - } else { + // Get all related items and find index for clicked one + if (value) { + items = opts.selector ? $(opts.selector) : e.data ? e.data.items : []; + items = items.length ? items.filter('[data-fancybox="' + value + '"]') : $('[data-fancybox="' + value + '"]'); - this.off( 'click.fb-start' ).on( 'click.fb-start', { - items : this, - options : options - }, _run); + index = items.index($target); - } + // Sometimes current item can not be found (for example, if some script clones items) + if (index < 0) { + index = 0; + } + } else { + items = [$target]; + } - return this; - }; + $.fancybox.open(items, opts, index); + } + + // Create a jQuery plugin + // ====================== + + $.fn.fancybox = function(options) { + var selector; + + options = options || {}; + selector = options.selector || false; + + if (selector) { + // Use body element instead of document so it executes first + $("body") + .off("click.fb-start", selector) + .on("click.fb-start", selector, {options: options}, _run); + } else { + this.off("click.fb-start").on( + "click.fb-start", + { + items: this, + options: options + }, + _run + ); + } + return this; + }; - // Self initializing plugin - // ======================== + // Self initializing plugin for all elements having `data-fancybox` attribute + // ========================================================================== - $D.on( 'click.fb-start', '[data-fancybox]', _run ); + $D.on("click.fb-start", "[data-fancybox]", _run); -}( window, document, window.jQuery || jQuery )); + // Enable "trigger elements" + // ========================= + + $D.on("click.fb-start", "[data-trigger]", function(e) { + _run(e, { + $target: $('[data-fancybox="' + $(e.currentTarget).attr("data-trigger") + '"]').eq($(e.currentTarget).attr("data-index") || 0), + $trigger: $(this) + }); + }); +})(window, document, window.jQuery || jQuery); diff --git a/src/js/fullscreen.js b/src/js/fullscreen.js index 27143ef6..1f05cb0f 100644 --- a/src/js/fullscreen.js +++ b/src/js/fullscreen.js @@ -4,207 +4,166 @@ // Adds fullscreen functionality // // ========================================================================== -;(function (document, $) { - 'use strict'; - - // Collection of methods supported by user browser - var fn = (function () { - - var fnMap = [ - [ - 'requestFullscreen', - 'exitFullscreen', - 'fullscreenElement', - 'fullscreenEnabled', - 'fullscreenchange', - 'fullscreenerror' - ], - // new WebKit - [ - 'webkitRequestFullscreen', - 'webkitExitFullscreen', - 'webkitFullscreenElement', - 'webkitFullscreenEnabled', - 'webkitfullscreenchange', - 'webkitfullscreenerror' - - ], - // old WebKit (Safari 5.1) - [ - 'webkitRequestFullScreen', - 'webkitCancelFullScreen', - 'webkitCurrentFullScreenElement', - 'webkitCancelFullScreen', - 'webkitfullscreenchange', - 'webkitfullscreenerror' - - ], - [ - 'mozRequestFullScreen', - 'mozCancelFullScreen', - 'mozFullScreenElement', - 'mozFullScreenEnabled', - 'mozfullscreenchange', - 'mozfullscreenerror' - ], - [ - 'msRequestFullscreen', - 'msExitFullscreen', - 'msFullscreenElement', - 'msFullscreenEnabled', - 'MSFullscreenChange', - 'MSFullscreenError' - ] - ]; - - var val; - var ret = {}; - var i, j; - - for ( i = 0; i < fnMap.length; i++ ) { - val = fnMap[ i ]; - - if ( val && val[ 1 ] in document ) { - for ( j = 0; j < val.length; j++ ) { - ret[ fnMap[ 0 ][ j ] ] = val[ j ]; - } - - return ret; - } - } - - return false; - })(); - - // If browser does not have Full Screen API, then simply unset default button template and stop - if ( !fn ) { - - if ( $ && $.fancybox ) { - $.fancybox.defaults.btnTpl.fullScreen = false; - } - - return; - } - - var FullScreen = { - - request : function ( elem ) { - - elem = elem || document.documentElement; - - elem[ fn.requestFullscreen ]( elem.ALLOW_KEYBOARD_INPUT ); - - }, - exit : function () { - - document[ fn.exitFullscreen ](); - - }, - toggle : function ( elem ) { - - elem = elem || document.documentElement; - - if ( this.isFullscreen() ) { - this.exit(); - - } else { - this.request( elem ); - } - - }, - isFullscreen : function() { - - return Boolean( document[ fn.fullscreenElement ] ); - - }, - enabled : function() { - - return Boolean( document[ fn.fullscreenEnabled ] ); - - } - }; - - $.extend(true, $.fancybox.defaults, { - btnTpl : { - fullScreen : - '' - }, - fullScreen : { - autoStart : false - } - }); - - $(document).on({ - 'onInit.fb' : function(e, instance) { - var $container; - - if ( instance && instance.group[ instance.currIndex ].opts.fullScreen ) { - $container = instance.$refs.container; - - $container.on('click.fb-fullscreen', '[data-fancybox-fullscreen]', function(e) { - - e.stopPropagation(); - e.preventDefault(); - - FullScreen.toggle( $container[ 0 ] ); - - }); - - if ( instance.opts.fullScreen && instance.opts.fullScreen.autoStart === true ) { - FullScreen.request( $container[ 0 ] ); - } - - // Expose API - instance.FullScreen = FullScreen; - - } else if ( instance ) { - instance.$refs.toolbar.find('[data-fancybox-fullscreen]').hide(); - } - - }, - - 'afterKeydown.fb' : function(e, instance, current, keypress, keycode) { - - // "P" or Spacebar - if ( instance && instance.FullScreen && keycode === 70 ) { - keypress.preventDefault(); - - instance.FullScreen.toggle( instance.$refs.container[ 0 ] ); - } - - }, - - 'beforeClose.fb' : function( instance ) { - if ( instance && instance.FullScreen ) { - FullScreen.exit(); - } - } - }); - - $(document).on(fn.fullscreenchange, function() { - var isFullscreen = FullScreen.isFullscreen(), - instance = $.fancybox.getInstance(); - - if ( instance ) { - - // If image is zooming, then force to stop and reposition properly - if ( instance.current && instance.current.type === 'image' && instance.isAnimating ) { - instance.current.$content.css( 'transition', 'none' ); - - instance.isAnimating = false; - - instance.update( true, true, 0 ); - } - - instance.trigger( 'onFullscreenChange', isFullscreen ); - - instance.$refs.container.toggleClass( 'fancybox-is-fullscreen', isFullscreen ); - } - - }); - -}( document, window.jQuery || jQuery )); +(function(document, $) { + "use strict"; + + // Collection of methods supported by user browser + var fn = (function() { + var fnMap = [ + ["requestFullscreen", "exitFullscreen", "fullscreenElement", "fullscreenEnabled", "fullscreenchange", "fullscreenerror"], + // new WebKit + [ + "webkitRequestFullscreen", + "webkitExitFullscreen", + "webkitFullscreenElement", + "webkitFullscreenEnabled", + "webkitfullscreenchange", + "webkitfullscreenerror" + ], + // old WebKit (Safari 5.1) + [ + "webkitRequestFullScreen", + "webkitCancelFullScreen", + "webkitCurrentFullScreenElement", + "webkitCancelFullScreen", + "webkitfullscreenchange", + "webkitfullscreenerror" + ], + [ + "mozRequestFullScreen", + "mozCancelFullScreen", + "mozFullScreenElement", + "mozFullScreenEnabled", + "mozfullscreenchange", + "mozfullscreenerror" + ], + ["msRequestFullscreen", "msExitFullscreen", "msFullscreenElement", "msFullscreenEnabled", "MSFullscreenChange", "MSFullscreenError"] + ]; + + var ret = {}; + + for (var i = 0; i < fnMap.length; i++) { + var val = fnMap[i]; + + if (val && val[1] in document) { + for (var j = 0; j < val.length; j++) { + ret[fnMap[0][j]] = val[j]; + } + + return ret; + } + } + + return false; + })(); + + // If browser does not have Full Screen API, then simply unset default button template and stop + if (!fn) { + if ($ && $.fancybox) { + $.fancybox.defaults.btnTpl.fullScreen = false; + } + + return; + } + + var FullScreen = { + request: function(elem) { + elem = elem || document.documentElement; + + elem[fn.requestFullscreen](elem.ALLOW_KEYBOARD_INPUT); + }, + exit: function() { + document[fn.exitFullscreen](); + }, + toggle: function(elem) { + elem = elem || document.documentElement; + + if (this.isFullscreen()) { + this.exit(); + } else { + this.request(elem); + } + }, + isFullscreen: function() { + return Boolean(document[fn.fullscreenElement]); + }, + enabled: function() { + return Boolean(document[fn.fullscreenEnabled]); + } + }; + + $.extend(true, $.fancybox.defaults, { + btnTpl: { + fullScreen: + '" + }, + fullScreen: { + autoStart: false + } + }); + + $(document).on({ + "onInit.fb": function(e, instance) { + var $container; + + if (instance && instance.group[instance.currIndex].opts.fullScreen) { + $container = instance.$refs.container; + + $container.on("click.fb-fullscreen", "[data-fancybox-fullscreen]", function(e) { + e.stopPropagation(); + e.preventDefault(); + + FullScreen.toggle(); + }); + + if (instance.opts.fullScreen && instance.opts.fullScreen.autoStart === true) { + FullScreen.request(); + } + + // Expose API + instance.FullScreen = FullScreen; + } else if (instance) { + instance.$refs.toolbar.find("[data-fancybox-fullscreen]").hide(); + } + }, + + "afterKeydown.fb": function(e, instance, current, keypress, keycode) { + // "F" + if (instance && instance.FullScreen && keycode === 70) { + keypress.preventDefault(); + + instance.FullScreen.toggle(); + } + }, + + "beforeClose.fb": function(e, instance) { + if (instance && instance.FullScreen && instance.$refs.container.hasClass("fancybox-is-fullscreen")) { + FullScreen.exit(); + } + } + }); + + $(document).on(fn.fullscreenchange, function() { + var isFullscreen = FullScreen.isFullscreen(), + instance = $.fancybox.getInstance(); + + if (instance) { + // If image is zooming, then force to stop and reposition properly + if (instance.current && instance.current.type === "image" && instance.isAnimating) { + instance.current.$content.css("transition", "none"); + + instance.isAnimating = false; + + instance.update(true, true, 0); + } + + instance.trigger("onFullscreenChange", isFullscreen); + + instance.$refs.container.toggleClass("fancybox-is-fullscreen", isFullscreen); + } + }); +})(document, window.jQuery || jQuery); diff --git a/src/js/guestures.js b/src/js/guestures.js index cc113fe0..84d37b3a 100644 --- a/src/js/guestures.js +++ b/src/js/guestures.js @@ -4,916 +4,882 @@ // Adds touch guestures, handles click and tap events // // ========================================================================== -;(function (window, document, $) { - 'use strict'; +(function(window, document, $) { + "use strict"; + + var requestAFrame = (function() { + return ( + window.requestAnimationFrame || + window.webkitRequestAnimationFrame || + window.mozRequestAnimationFrame || + window.oRequestAnimationFrame || + // if all else fails, use setTimeout + function(callback) { + return window.setTimeout(callback, 1000 / 60); + } + ); + })(); + + var cancelAFrame = (function() { + return ( + window.cancelAnimationFrame || + window.webkitCancelAnimationFrame || + window.mozCancelAnimationFrame || + window.oCancelAnimationFrame || + function(id) { + window.clearTimeout(id); + } + ); + })(); + + var getPointerXY = function(e) { + var result = []; + + e = e.originalEvent || e || window.e; + e = e.touches && e.touches.length ? e.touches : e.changedTouches && e.changedTouches.length ? e.changedTouches : [e]; + + for (var key in e) { + if (e[key].pageX) { + result.push({ + x: e[key].pageX, + y: e[key].pageY + }); + } else if (e[key].clientX) { + result.push({ + x: e[key].clientX, + y: e[key].clientY + }); + } + } + + return result; + }; + + var distance = function(point2, point1, what) { + if (!point1 || !point2) { + return 0; + } + + if (what === "x") { + return point2.x - point1.x; + } else if (what === "y") { + return point2.y - point1.y; + } + + return Math.sqrt(Math.pow(point2.x - point1.x, 2) + Math.pow(point2.y - point1.y, 2)); + }; + + var isClickable = function($el) { + if ( + $el.is('a,area,button,[role="button"],input,label,select,summary,textarea,video,audio') || + $.isFunction($el.get(0).onclick) || + $el.data("selectable") + ) { + return true; + } + + // Check for attributes like data-fancybox-next or data-fancybox-close + for (var i = 0, atts = $el[0].attributes, n = atts.length; i < n; i++) { + if (atts[i].nodeName.substr(0, 14) === "data-fancybox-") { + return true; + } + } + + return false; + }; + + var hasScrollbars = function(el) { + var overflowY = window.getComputedStyle(el)["overflow-y"], + overflowX = window.getComputedStyle(el)["overflow-x"], + vertical = (overflowY === "scroll" || overflowY === "auto") && el.scrollHeight > el.clientHeight, + horizontal = (overflowX === "scroll" || overflowX === "auto") && el.scrollWidth > el.clientWidth; + + return vertical || horizontal; + }; + + var isScrollable = function($el) { + var rez = false; + + while (true) { + rez = hasScrollbars($el.get(0)); + + if (rez) { + break; + } + + $el = $el.parent(); + + if (!$el.length || $el.hasClass("fancybox-stage") || $el.is("body")) { + break; + } + } + + return rez; + }; + + var Guestures = function(instance) { + var self = this; + + self.instance = instance; + + self.$bg = instance.$refs.bg; + self.$stage = instance.$refs.stage; + self.$container = instance.$refs.container; + + self.destroy(); + + self.$container.on("touchstart.fb.touch mousedown.fb.touch", $.proxy(self, "ontouchstart")); + }; + + Guestures.prototype.destroy = function() { + this.$container.off(".fb.touch"); + }; + + Guestures.prototype.ontouchstart = function(e) { + var self = this, + $target = $(e.target), + instance = self.instance, + current = instance.current, + $content = current.$content, + isTouchDevice = e.type == "touchstart"; + + // Do not respond to both (touch and mouse) events + if (isTouchDevice) { + self.$container.off("mousedown.fb.touch"); + } - var requestAFrame = (function () { - return window.requestAnimationFrame || - window.webkitRequestAnimationFrame || - window.mozRequestAnimationFrame || - window.oRequestAnimationFrame || - // if all else fails, use setTimeout - function (callback) { - return window.setTimeout(callback, 1000 / 60); - }; - })(); + // Ignore right click + if (e.originalEvent && e.originalEvent.button == 2) { + return; + } - var cancelAFrame = (function () { - return window.cancelAnimationFrame || - window.webkitCancelAnimationFrame || - window.mozCancelAnimationFrame || - window.oCancelAnimationFrame || - function (id) { - window.clearTimeout(id); - }; - })(); + // Ignore taping on links, buttons, input elements + if (!$target.length || isClickable($target) || isClickable($target.parent())) { + return; + } - var pointers = function( e ) { - var result = []; + // Ignore clicks on the scrollbar + if (!$target.is("img") && e.originalEvent.clientX > $target[0].clientWidth + $target.offset().left) { + return; + } - e = e.originalEvent || e || window.e; - e = e.touches && e.touches.length ? e.touches : ( e.changedTouches && e.changedTouches.length ? e.changedTouches : [ e ] ); + // Ignore clicks while zooming or closing + if (!current || instance.isAnimating || instance.isClosing) { + e.stopPropagation(); + e.preventDefault(); - for ( var key in e ) { + return; + } - if ( e[ key ].pageX ) { - result.push( { x : e[ key ].pageX, y : e[ key ].pageY } ); + self.realPoints = self.startPoints = getPointerXY(e); - } else if ( e[ key ].clientX ) { - result.push( { x : e[ key ].clientX, y : e[ key ].clientY } ); - } - } + if (!self.startPoints.length) { + return; + } - return result; - }; + e.stopPropagation(); - var distance = function( point2, point1, what ) { - if ( !point1 || !point2 ) { - return 0; - } + self.startEvent = e; - if ( what === 'x' ) { - return point2.x - point1.x; + self.canTap = true; + self.$target = $target; + self.$content = $content; + self.opts = current.opts.touch; - } else if ( what === 'y' ) { - return point2.y - point1.y; - } + self.isPanning = false; + self.isSwiping = false; + self.isZooming = false; + self.isScrolling = false; - return Math.sqrt( Math.pow( point2.x - point1.x, 2 ) + Math.pow( point2.y - point1.y, 2 ) ); - }; + self.startTime = new Date().getTime(); + self.distanceX = self.distanceY = self.distance = 0; - var isClickable = function( $el ) { - if ( $el.is('a,area,button,[role="button"],input,label,select,summary,textarea') || $.isFunction( $el.get(0).onclick ) || $el.data('selectable') ) { - return true; - } + self.canvasWidth = Math.round(current.$slide[0].clientWidth); + self.canvasHeight = Math.round(current.$slide[0].clientHeight); - // Check for attributes like data-fancybox-next or data-fancybox-close - for ( var i = 0, atts = $el[0].attributes, n = atts.length; i < n; i++ ) { - if ( atts[i].nodeName.substr(0, 14) === 'data-fancybox-' ) { - return true; - } - } + self.contentLastPos = null; + self.contentStartPos = $.fancybox.getTranslate(self.$content) || {top: 0, left: 0}; + self.sliderStartPos = self.sliderLastPos || $.fancybox.getTranslate(current.$slide); - return false; - }; + // Since position will be absolute, but we need to make it relative to the stage + self.stagePos = $.fancybox.getTranslate(instance.$refs.stage); - var hasScrollbars = function( el ) { - var overflowY = window.getComputedStyle( el )['overflow-y']; - var overflowX = window.getComputedStyle( el )['overflow-x']; + self.sliderStartPos.top -= self.stagePos.top; + self.sliderStartPos.left -= self.stagePos.left; - var vertical = (overflowY === 'scroll' || overflowY === 'auto') && el.scrollHeight > el.clientHeight; - var horizontal = (overflowX === 'scroll' || overflowX === 'auto') && el.scrollWidth > el.clientWidth; + self.contentStartPos.top -= self.stagePos.top; + self.contentStartPos.left -= self.stagePos.left; - return vertical || horizontal; - }; + $(document) + .off(".fb.touch") + .on(isTouchDevice ? "touchend.fb.touch touchcancel.fb.touch" : "mouseup.fb.touch mouseleave.fb.touch", $.proxy(self, "ontouchend")) + .on(isTouchDevice ? "touchmove.fb.touch" : "mousemove.fb.touch", $.proxy(self, "ontouchmove")); - var isScrollable = function ( $el ) { - var rez = false; + if ($.fancybox.isMobile) { + document.addEventListener("scroll", self.onscroll, true); + } - while ( true ) { - rez = hasScrollbars( $el.get(0) ); + if (!(self.opts || instance.canPan()) || !($target.is(self.$stage) || self.$stage.find($target).length)) { + if ($target.is(".fancybox-image")) { + e.preventDefault(); + } - if ( rez ) { - break; - } + return; + } - $el = $el.parent(); + if (!($.fancybox.isMobile && (isScrollable($target) || isScrollable($target.parent())))) { + e.preventDefault(); + } - if ( !$el.length || $el.hasClass( 'fancybox-stage' ) || $el.is( 'body' ) ) { - break; - } - } + if (self.startPoints.length === 1 || current.hasError) { + if (self.instance.canPan()) { + $.fancybox.stop(self.$content); - return rez; - }; + self.$content.css("transition-duration", ""); + self.isPanning = true; + } else { + self.isSwiping = true; + } - var Guestures = function ( instance ) { - var self = this; + self.$container.addClass("fancybox-controls--isGrabbing"); + } - self.instance = instance; + if (self.startPoints.length === 2 && current.type === "image" && (current.isLoaded || current.$ghost)) { + self.canTap = false; + self.isSwiping = false; + self.isPanning = false; - self.$bg = instance.$refs.bg; - self.$stage = instance.$refs.stage; - self.$container = instance.$refs.container; + self.isZooming = true; - self.destroy(); + $.fancybox.stop(self.$content); - self.$container.on( 'touchstart.fb.touch mousedown.fb.touch', $.proxy(self, 'ontouchstart') ); - }; + self.$content.css("transition-duration", ""); - Guestures.prototype.destroy = function() { - this.$container.off( '.fb.touch' ); - }; + self.centerPointStartX = (self.startPoints[0].x + self.startPoints[1].x) * 0.5 - $(window).scrollLeft(); + self.centerPointStartY = (self.startPoints[0].y + self.startPoints[1].y) * 0.5 - $(window).scrollTop(); - Guestures.prototype.ontouchstart = function( e ) { - var self = this; + self.percentageOfImageAtPinchPointX = (self.centerPointStartX - self.contentStartPos.left) / self.contentStartPos.width; + self.percentageOfImageAtPinchPointY = (self.centerPointStartY - self.contentStartPos.top) / self.contentStartPos.height; - var $target = $( e.target ); - var instance = self.instance; - var current = instance.current; - var $content = current.$content; + self.startDistanceBetweenFingers = distance(self.startPoints[0], self.startPoints[1]); + } + }; - var isTouchDevice = ( e.type == 'touchstart' ); + Guestures.prototype.onscroll = function(e) { + var self = this; - // Do not respond to both (touch and mouse) events - if ( isTouchDevice ) { - self.$container.off( 'mousedown.fb.touch' ); - } + self.isScrolling = true; - // Ignore right click - if ( e.originalEvent && e.originalEvent.button == 2 ) { - return; - } + document.removeEventListener("scroll", self.onscroll, true); + }; - // Ignore taping on links, buttons, input elements - if ( !$target.length || isClickable( $target ) || isClickable( $target.parent() ) ) { - return; - } + Guestures.prototype.ontouchmove = function(e) { + var self = this, + $target = $(e.target); - // Ignore clicks on the scrollbar - if ( !$target.is('img') && e.originalEvent.clientX > $target[0].clientWidth + $target.offset().left ) { - return; - } + // Make sure user has not released over iframe or disabled element + if (e.originalEvent.buttons !== undefined && e.originalEvent.buttons === 0) { + self.ontouchend(e); + return; + } - // Ignore clicks while zooming or closing - if ( !current || self.instance.isAnimating || self.instance.isClosing ) { - e.stopPropagation(); - e.preventDefault(); + if (self.isScrolling || !($target.is(self.$stage) || self.$stage.find($target).length)) { + self.canTap = false; - return; - } + return; + } - self.realPoints = self.startPoints = pointers( e ); + self.newPoints = getPointerXY(e); - if ( !self.startPoints ) { - return; - } + if (!(self.opts || self.instance.canPan()) || !self.newPoints.length || !self.newPoints.length) { + return; + } - e.stopPropagation(); + if (!(self.isSwiping && self.isSwiping === true)) { + e.preventDefault(); + } - self.startEvent = e; + self.distanceX = distance(self.newPoints[0], self.startPoints[0], "x"); + self.distanceY = distance(self.newPoints[0], self.startPoints[0], "y"); - self.canTap = true; - self.$target = $target; - self.$content = $content; - self.opts = current.opts.touch; + self.distance = distance(self.newPoints[0], self.startPoints[0]); - self.isPanning = false; - self.isSwiping = false; - self.isZooming = false; - self.isScrolling = false; + // Skip false ontouchmove events (Chrome) + if (self.distance > 0) { + if (self.isSwiping) { + self.onSwipe(e); + } else if (self.isPanning) { + self.onPan(); + } else if (self.isZooming) { + self.onZoom(); + } + } + }; + + Guestures.prototype.onSwipe = function(e) { + var self = this, + swiping = self.isSwiping, + left = self.sliderStartPos.left || 0, + angle; - self.sliderStartPos = self.sliderLastPos || { top: 0, left: 0 }; - self.contentStartPos = $.fancybox.getTranslate( self.$content ); - self.contentLastPos = null; + // If direction is not yet determined + if (swiping === true) { + // We need at least 10px distance to correctly calculate an angle + if (Math.abs(self.distance) > 10) { + self.canTap = false; - self.startTime = new Date().getTime(); - self.distanceX = self.distanceY = self.distance = 0; + if (self.instance.group.length < 2 && self.opts.vertical) { + self.isSwiping = "y"; + } else if (self.instance.isDragging || self.opts.vertical === false || (self.opts.vertical === "auto" && $(window).width() > 800)) { + self.isSwiping = "x"; + } else { + angle = Math.abs(Math.atan2(self.distanceY, self.distanceX) * 180 / Math.PI); - self.canvasWidth = Math.round( current.$slide[0].clientWidth ); - self.canvasHeight = Math.round( current.$slide[0].clientHeight ); + self.isSwiping = angle > 45 && angle < 135 ? "y" : "x"; + } - $(document) - .off( '.fb.touch' ) - .on( isTouchDevice ? 'touchend.fb.touch touchcancel.fb.touch' : 'mouseup.fb.touch mouseleave.fb.touch', $.proxy(self, "ontouchend")) - .on( isTouchDevice ? 'touchmove.fb.touch' : 'mousemove.fb.touch', $.proxy(self, "ontouchmove")); + self.canTap = false; - if ( $.fancybox.isMobile ) { - document.addEventListener('scroll', self.onscroll, true); - } + if (self.isSwiping === "y" && $.fancybox.isMobile && (isScrollable(self.$target) || isScrollable(self.$target.parent()))) { + self.isScrolling = true; - if ( !(self.opts || instance.canPan() ) || !( $target.is( self.$stage ) || self.$stage.find( $target ).length ) ) { + return; + } - // Prevent image ghosting while dragging - if ( $target.is('img') ) { - e.preventDefault(); - } + self.instance.isDragging = self.isSwiping; - return; - } + // Reset points to avoid jumping, because we dropped first swipes to calculate the angle + self.startPoints = self.newPoints; - if ( !( $.fancybox.isMobile && ( isScrollable( $target ) || isScrollable( $target.parent() ) ) ) ) { - e.preventDefault(); - } + $.each(self.instance.slides, function(index, slide) { + $.fancybox.stop(slide.$slide); - if ( self.startPoints.length === 1 ) { - if ( current.type === 'image' && ( self.contentStartPos.width > self.canvasWidth + 1 || self.contentStartPos.height > self.canvasHeight + 1 ) ) { - $.fancybox.stop( self.$content ); + slide.$slide.css("transition-duration", ""); - self.$content.css( 'transition-duration', '' ); + slide.inTransition = false; - self.isPanning = true; + if (slide.pos === self.instance.current.pos) { + self.sliderStartPos.left = $.fancybox.getTranslate(slide.$slide).left - $.fancybox.getTranslate(self.instance.$refs.stage).left; + } + }); - } else { - self.isSwiping = true; - } + // Stop slideshow + if (self.instance.SlideShow && self.instance.SlideShow.isActive) { + self.instance.SlideShow.stop(); + } + } - self.$container.addClass( 'fancybox-controls--isGrabbing' ); - } + return; + } + + // Sticky edges + if (swiping == "x") { + if ( + self.distanceX > 0 && + (self.instance.group.length < 2 || (self.instance.current.index === 0 && !self.instance.current.opts.loop)) + ) { + left = left + Math.pow(self.distanceX, 0.8); + } else if ( + self.distanceX < 0 && + (self.instance.group.length < 2 || + (self.instance.current.index === self.instance.group.length - 1 && !self.instance.current.opts.loop)) + ) { + left = left - Math.pow(-self.distanceX, 0.8); + } else { + left = left + self.distanceX; + } + } + + self.sliderLastPos = { + top: swiping == "x" ? 0 : self.sliderStartPos.top + self.distanceY, + left: left + }; + + if (self.requestId) { + cancelAFrame(self.requestId); + + self.requestId = null; + } + + self.requestId = requestAFrame(function() { + if (self.sliderLastPos) { + $.each(self.instance.slides, function(index, slide) { + var pos = slide.pos - self.instance.currPos; + + $.fancybox.setTranslate(slide.$slide, { + top: self.sliderLastPos.top, + left: self.sliderLastPos.left + pos * self.canvasWidth + pos * slide.opts.gutter + }); + }); + + self.$container.addClass("fancybox-is-sliding"); + } + }); + }; + + Guestures.prototype.onPan = function() { + var self = this; + + // Prevent accidental movement (sometimes, when tapping casually, finger can move a bit) + if (distance(self.newPoints[0], self.realPoints[0]) < ($.fancybox.isMobile ? 10 : 5)) { + self.startPoints = self.newPoints; + return; + } + + self.canTap = false; + + self.contentLastPos = self.limitMovement(); + + if (self.requestId) { + cancelAFrame(self.requestId); + + self.requestId = null; + } + + self.requestId = requestAFrame(function() { + $.fancybox.setTranslate(self.$content, self.contentLastPos); + }); + }; + + // Make panning sticky to the edges + Guestures.prototype.limitMovement = function() { + var self = this; + + var canvasWidth = self.canvasWidth; + var canvasHeight = self.canvasHeight; + + var distanceX = self.distanceX; + var distanceY = self.distanceY; + + var contentStartPos = self.contentStartPos; + + var currentOffsetX = contentStartPos.left; + var currentOffsetY = contentStartPos.top; + + var currentWidth = contentStartPos.width; + var currentHeight = contentStartPos.height; + + var minTranslateX, minTranslateY, maxTranslateX, maxTranslateY, newOffsetX, newOffsetY; + + if (currentWidth > canvasWidth) { + newOffsetX = currentOffsetX + distanceX; + } else { + newOffsetX = currentOffsetX; + } + + newOffsetY = currentOffsetY + distanceY; + + // Slow down proportionally to traveled distance + minTranslateX = Math.max(0, canvasWidth * 0.5 - currentWidth * 0.5); + minTranslateY = Math.max(0, canvasHeight * 0.5 - currentHeight * 0.5); + + maxTranslateX = Math.min(canvasWidth - currentWidth, canvasWidth * 0.5 - currentWidth * 0.5); + maxTranslateY = Math.min(canvasHeight - currentHeight, canvasHeight * 0.5 - currentHeight * 0.5); + + // -> + if (distanceX > 0 && newOffsetX > minTranslateX) { + newOffsetX = minTranslateX - 1 + Math.pow(-minTranslateX + currentOffsetX + distanceX, 0.8) || 0; + } - if ( self.startPoints.length === 2 && !instance.isAnimating && !current.hasError && current.type === 'image' && ( current.isLoaded || current.$ghost ) ) { - self.canTap = false; - self.isSwiping = false; - self.isPanning = false; + // <- + if (distanceX < 0 && newOffsetX < maxTranslateX) { + newOffsetX = maxTranslateX + 1 - Math.pow(maxTranslateX - currentOffsetX - distanceX, 0.8) || 0; + } - self.isZooming = true; + // \/ + if (distanceY > 0 && newOffsetY > minTranslateY) { + newOffsetY = minTranslateY - 1 + Math.pow(-minTranslateY + currentOffsetY + distanceY, 0.8) || 0; + } - $.fancybox.stop( self.$content ); + // /\ + if (distanceY < 0 && newOffsetY < maxTranslateY) { + newOffsetY = maxTranslateY + 1 - Math.pow(maxTranslateY - currentOffsetY - distanceY, 0.8) || 0; + } - self.$content.css( 'transition-duration', '' ); + return { + top: newOffsetY, + left: newOffsetX + }; + }; - self.centerPointStartX = ( ( self.startPoints[0].x + self.startPoints[1].x ) * 0.5 ) - $(window).scrollLeft(); - self.centerPointStartY = ( ( self.startPoints[0].y + self.startPoints[1].y ) * 0.5 ) - $(window).scrollTop(); + Guestures.prototype.limitPosition = function(newOffsetX, newOffsetY, newWidth, newHeight) { + var self = this; - self.percentageOfImageAtPinchPointX = ( self.centerPointStartX - self.contentStartPos.left ) / self.contentStartPos.width; - self.percentageOfImageAtPinchPointY = ( self.centerPointStartY - self.contentStartPos.top ) / self.contentStartPos.height; + var canvasWidth = self.canvasWidth; + var canvasHeight = self.canvasHeight; - self.startDistanceBetweenFingers = distance( self.startPoints[0], self.startPoints[1] ); - } + if (newWidth > canvasWidth) { + newOffsetX = newOffsetX > 0 ? 0 : newOffsetX; + newOffsetX = newOffsetX < canvasWidth - newWidth ? canvasWidth - newWidth : newOffsetX; + } else { + // Center horizontally + newOffsetX = Math.max(0, canvasWidth / 2 - newWidth / 2); + } - }; + if (newHeight > canvasHeight) { + newOffsetY = newOffsetY > 0 ? 0 : newOffsetY; + newOffsetY = newOffsetY < canvasHeight - newHeight ? canvasHeight - newHeight : newOffsetY; + } else { + // Center vertically + newOffsetY = Math.max(0, canvasHeight / 2 - newHeight / 2); + } - Guestures.prototype.onscroll = function(e) { - self.isScrolling = true; - }; + return { + top: newOffsetY, + left: newOffsetX + }; + }; - Guestures.prototype.ontouchmove = function( e ) { - var self = this, - $target = $(e.target); + Guestures.prototype.onZoom = function() { + var self = this; - if ( self.isScrolling || !( $target.is( self.$stage ) || self.$stage.find( $target ).length ) ) { - self.canTap = false; + // Calculate current distance between points to get pinch ratio and new width and height + var contentStartPos = self.contentStartPos; - return; - } + var currentWidth = contentStartPos.width; + var currentHeight = contentStartPos.height; - self.newPoints = pointers( e ); + var currentOffsetX = contentStartPos.left; + var currentOffsetY = contentStartPos.top; - if ( !( self.opts || self.instance.canPan() ) || !self.newPoints || !self.newPoints.length ) { - return; - } + var endDistanceBetweenFingers = distance(self.newPoints[0], self.newPoints[1]); - if ( !(self.isSwiping && self.isSwiping === true) ) { - e.preventDefault(); - } + var pinchRatio = endDistanceBetweenFingers / self.startDistanceBetweenFingers; - self.distanceX = distance( self.newPoints[0], self.startPoints[0], 'x' ); - self.distanceY = distance( self.newPoints[0], self.startPoints[0], 'y' ); + var newWidth = Math.floor(currentWidth * pinchRatio); + var newHeight = Math.floor(currentHeight * pinchRatio); - self.distance = distance( self.newPoints[0], self.startPoints[0] ) + // This is the translation due to pinch-zooming + var translateFromZoomingX = (currentWidth - newWidth) * self.percentageOfImageAtPinchPointX; + var translateFromZoomingY = (currentHeight - newHeight) * self.percentageOfImageAtPinchPointY; - // Skip false ontouchmove events (Chrome) - if ( self.distance > 0 ) { - if ( self.isSwiping ) { - self.onSwipe(e); + // Point between the two touches + var centerPointEndX = (self.newPoints[0].x + self.newPoints[1].x) / 2 - $(window).scrollLeft(); + var centerPointEndY = (self.newPoints[0].y + self.newPoints[1].y) / 2 - $(window).scrollTop(); - } else if ( self.isPanning ) { - self.onPan(); + // And this is the translation due to translation of the centerpoint + // between the two fingers + var translateFromTranslatingX = centerPointEndX - self.centerPointStartX; + var translateFromTranslatingY = centerPointEndY - self.centerPointStartY; - } else if ( self.isZooming ) { - self.onZoom(); - } - } + // The new offset is the old/current one plus the total translation + var newOffsetX = currentOffsetX + (translateFromZoomingX + translateFromTranslatingX); + var newOffsetY = currentOffsetY + (translateFromZoomingY + translateFromTranslatingY); - }; + var newPos = { + top: newOffsetY, + left: newOffsetX, + scaleX: pinchRatio, + scaleY: pinchRatio + }; - Guestures.prototype.onSwipe = function(e) { - var self = this, - swiping = self.isSwiping, - left = self.sliderStartPos.left || 0, - angle; + self.canTap = false; + + self.newWidth = newWidth; + self.newHeight = newHeight; + + self.contentLastPos = newPos; + + if (self.requestId) { + cancelAFrame(self.requestId); + + self.requestId = null; + } + + self.requestId = requestAFrame(function() { + $.fancybox.setTranslate(self.$content, self.contentLastPos); + }); + }; - // If direction is not yet determined - if ( swiping === true ) { + Guestures.prototype.ontouchend = function(e) { + var self = this; + var dMs = Math.max(new Date().getTime() - self.startTime, 1); + + var swiping = self.isSwiping; + var panning = self.isPanning; + var zooming = self.isZooming; + var scrolling = self.isScrolling; + + self.endPoints = getPointerXY(e); - // We need at least 10px distance to correctly calculate an angle - if ( Math.abs( self.distance ) > 10 ) { - self.canTap = false; + self.$container.removeClass("fancybox-controls--isGrabbing"); + + $(document).off(".fb.touch"); + + document.removeEventListener("scroll", self.onscroll, true); - if ( self.instance.group.length < 2 && self.opts.vertical ) { - self.isSwiping = 'y'; + if (self.requestId) { + cancelAFrame(self.requestId); - } else if ( self.instance.isDragging || self.opts.vertical === false || ( self.opts.vertical === 'auto' && $( window ).width() > 800 ) ) { - self.isSwiping = 'x'; + self.requestId = null; + } - } else { - angle = Math.abs( Math.atan2( self.distanceY, self.distanceX ) * 180 / Math.PI ); + self.isSwiping = false; + self.isPanning = false; + self.isZooming = false; + self.isScrolling = false; - self.isSwiping = ( angle > 45 && angle < 135 ) ? 'y' : 'x'; - } + self.instance.isDragging = false; - self.canTap = false; + if (self.canTap) { + return self.onTap(e); + } - if ( self.isSwiping === 'y' && $.fancybox.isMobile && ( isScrollable( self.$target ) || isScrollable( self.$target.parent() ) ) ) { - self.isScrolling = true; + self.speed = 366; - return; - } + // Speed in px/ms + self.velocityX = self.distanceX / dMs * 0.5; + self.velocityY = self.distanceY / dMs * 0.5; - self.instance.isDragging = self.isSwiping; + self.speedX = Math.max(self.speed * 0.5, Math.min(self.speed * 1.5, 1 / Math.abs(self.velocityX) * self.speed)); - // Reset points to avoid jumping, because we dropped first swipes to calculate the angle - self.startPoints = self.newPoints; + if (panning) { + self.endPanning(); + } else if (zooming) { + self.endZooming(); + } else { + self.endSwiping(swiping, scrolling); + } - $.each(self.instance.slides, function( index, slide ) { - $.fancybox.stop( slide.$slide ); + return; + }; - slide.$slide.css( 'transition-duration', '' ); + Guestures.prototype.endSwiping = function(swiping, scrolling) { + var self = this, + ret = false, + len = self.instance.group.length; - slide.inTransition = false; + self.sliderLastPos = null; - if ( slide.pos === self.instance.current.pos ) { - self.sliderStartPos.left = $.fancybox.getTranslate( slide.$slide ).left; - } - }); + // Close if swiped vertically / navigate if horizontally + if (swiping == "y" && !scrolling && Math.abs(self.distanceY) > 50) { + // Continue vertical movement + $.fancybox.animate( + self.instance.current.$slide, + { + top: self.sliderStartPos.top + self.distanceY + self.velocityY * 150, + opacity: 0 + }, + 200 + ); - // Stop slideshow - if ( self.instance.SlideShow && self.instance.SlideShow.isActive ) { - self.instance.SlideShow.stop(); - } - } + ret = self.instance.close(true, 200); + } else if (swiping == "x" && self.distanceX > 50 && len > 1) { + ret = self.instance.previous(self.speedX); + } else if (swiping == "x" && self.distanceX < -50 && len > 1) { + ret = self.instance.next(self.speedX); + } - return; - } + if (ret === false && (swiping == "x" || swiping == "y")) { + if (scrolling || len < 2) { + self.instance.centerSlide(self.instance.current, 150); + } else { + self.instance.jumpTo(self.instance.current.index); + } + } - // Sticky edges - if ( swiping == 'x' ) { - if ( self.distanceX > 0 && ( self.instance.group.length < 2 || ( self.instance.current.index === 0 && !self.instance.current.opts.loop ) ) ) { - left = left + Math.pow( self.distanceX, 0.8 ); + self.$container.removeClass("fancybox-is-sliding"); + }; - } else if ( self.distanceX < 0 && ( self.instance.group.length < 2 || ( self.instance.current.index === self.instance.group.length - 1 && !self.instance.current.opts.loop ) ) ) { - left = left - Math.pow( -self.distanceX, 0.8 ); + // Limit panning from edges + // ======================== + Guestures.prototype.endPanning = function() { + var self = this; + var newOffsetX, newOffsetY, newPos; - } else { - left = left + self.distanceX; - } - } + if (!self.contentLastPos) { + return; + } - self.sliderLastPos = { - top : swiping == 'x' ? 0 : self.sliderStartPos.top + self.distanceY, - left : left - }; + if (self.opts.momentum === false) { + newOffsetX = self.contentLastPos.left; + newOffsetY = self.contentLastPos.top; + } else { + // Continue movement + newOffsetX = self.contentLastPos.left + self.velocityX * self.speed; + newOffsetY = self.contentLastPos.top + self.velocityY * self.speed; + } - if ( self.requestId ) { - cancelAFrame( self.requestId ); + newPos = self.limitPosition(newOffsetX, newOffsetY, self.contentStartPos.width, self.contentStartPos.height); - self.requestId = null; - } + newPos.width = self.contentStartPos.width; + newPos.height = self.contentStartPos.height; - self.requestId = requestAFrame(function() { + $.fancybox.animate(self.$content, newPos, 330); + }; - if ( self.sliderLastPos ) { - $.each(self.instance.slides, function( index, slide ) { - var pos = slide.pos - self.instance.currPos; - - $.fancybox.setTranslate( slide.$slide, { - top : self.sliderLastPos.top, - left : self.sliderLastPos.left + ( pos * self.canvasWidth ) + ( pos * slide.opts.gutter ) - }); - }); - - self.$container.addClass( 'fancybox-is-sliding' ); - } - - }); - - }; - - Guestures.prototype.onPan = function() { - var self = this; - - // Sometimes, when tapping causally, image can move a bit and that breaks double tapping - if ( distance( self.newPoints[0], self.realPoints[0] ) < ($.fancybox.isMobile ? 10 : 5) ) { - self.startPoints = self.newPoints; - return; - } - - self.canTap = false; - - self.contentLastPos = self.limitMovement(); - - if ( self.requestId ) { - cancelAFrame( self.requestId ); - - self.requestId = null; - } - - self.requestId = requestAFrame(function() { - $.fancybox.setTranslate( self.$content, self.contentLastPos ); - }); - }; - - // Make panning sticky to the edges - Guestures.prototype.limitMovement = function() { - var self = this; - - var canvasWidth = self.canvasWidth; - var canvasHeight = self.canvasHeight; - - var distanceX = self.distanceX; - var distanceY = self.distanceY; - - var contentStartPos = self.contentStartPos; - - var currentOffsetX = contentStartPos.left; - var currentOffsetY = contentStartPos.top; - - var currentWidth = contentStartPos.width; - var currentHeight = contentStartPos.height; - - var minTranslateX, minTranslateY, - maxTranslateX, maxTranslateY, - newOffsetX, newOffsetY; - - if ( currentWidth > canvasWidth ) { - newOffsetX = currentOffsetX + distanceX; - - } else { - newOffsetX = currentOffsetX; - } - - newOffsetY = currentOffsetY + distanceY; - - // Slow down proportionally to traveled distance - minTranslateX = Math.max( 0, canvasWidth * 0.5 - currentWidth * 0.5 ); - minTranslateY = Math.max( 0, canvasHeight * 0.5 - currentHeight * 0.5 ); - - maxTranslateX = Math.min( canvasWidth - currentWidth, canvasWidth * 0.5 - currentWidth * 0.5 ); - maxTranslateY = Math.min( canvasHeight - currentHeight, canvasHeight * 0.5 - currentHeight * 0.5 ); - - if ( currentWidth > canvasWidth ) { - - // -> - if ( distanceX > 0 && newOffsetX > minTranslateX ) { - newOffsetX = minTranslateX - 1 + Math.pow( -minTranslateX + currentOffsetX + distanceX, 0.8 ) || 0; - } - - // <- - if ( distanceX < 0 && newOffsetX < maxTranslateX ) { - newOffsetX = maxTranslateX + 1 - Math.pow( maxTranslateX - currentOffsetX - distanceX, 0.8 ) || 0; - } - - } - - if ( currentHeight > canvasHeight ) { - - // \/ - if ( distanceY > 0 && newOffsetY > minTranslateY ) { - newOffsetY = minTranslateY - 1 + Math.pow(-minTranslateY + currentOffsetY + distanceY, 0.8 ) || 0; - } - - // /\ - if ( distanceY < 0 && newOffsetY < maxTranslateY ) { - newOffsetY = maxTranslateY + 1 - Math.pow ( maxTranslateY - currentOffsetY - distanceY, 0.8 ) || 0; - } - - } - - return { - top : newOffsetY, - left : newOffsetX, - scaleX : contentStartPos.scaleX, - scaleY : contentStartPos.scaleY - }; - - }; - - Guestures.prototype.limitPosition = function( newOffsetX, newOffsetY, newWidth, newHeight ) { - var self = this; - - var canvasWidth = self.canvasWidth; - var canvasHeight = self.canvasHeight; - - if ( newWidth > canvasWidth ) { - newOffsetX = newOffsetX > 0 ? 0 : newOffsetX; - newOffsetX = newOffsetX < canvasWidth - newWidth ? canvasWidth - newWidth : newOffsetX; - - } else { - - // Center horizontally - newOffsetX = Math.max( 0, canvasWidth / 2 - newWidth / 2 ); - - } - - if ( newHeight > canvasHeight ) { - newOffsetY = newOffsetY > 0 ? 0 : newOffsetY; - newOffsetY = newOffsetY < canvasHeight - newHeight ? canvasHeight - newHeight : newOffsetY; - - } else { - - // Center vertically - newOffsetY = Math.max( 0, canvasHeight / 2 - newHeight / 2 ); - - } - - return { - top : newOffsetY, - left : newOffsetX - }; - - }; - - Guestures.prototype.onZoom = function() { - var self = this; - - // Calculate current distance between points to get pinch ratio and new width and height - - var currentWidth = self.contentStartPos.width; - var currentHeight = self.contentStartPos.height; - - var currentOffsetX = self.contentStartPos.left; - var currentOffsetY = self.contentStartPos.top; - - var endDistanceBetweenFingers = distance( self.newPoints[0], self.newPoints[1] ); - - var pinchRatio = endDistanceBetweenFingers / self.startDistanceBetweenFingers; - - var newWidth = Math.floor( currentWidth * pinchRatio ); - var newHeight = Math.floor( currentHeight * pinchRatio ); - - // This is the translation due to pinch-zooming - var translateFromZoomingX = (currentWidth - newWidth) * self.percentageOfImageAtPinchPointX; - var translateFromZoomingY = (currentHeight - newHeight) * self.percentageOfImageAtPinchPointY; - - //Point between the two touches - - var centerPointEndX = ((self.newPoints[0].x + self.newPoints[1].x) / 2) - $(window).scrollLeft(); - var centerPointEndY = ((self.newPoints[0].y + self.newPoints[1].y) / 2) - $(window).scrollTop(); - - // And this is the translation due to translation of the centerpoint - // between the two fingers - - var translateFromTranslatingX = centerPointEndX - self.centerPointStartX; - var translateFromTranslatingY = centerPointEndY - self.centerPointStartY; - - // The new offset is the old/current one plus the total translation - - var newOffsetX = currentOffsetX + ( translateFromZoomingX + translateFromTranslatingX ); - var newOffsetY = currentOffsetY + ( translateFromZoomingY + translateFromTranslatingY ); - - var newPos = { - top : newOffsetY, - left : newOffsetX, - scaleX : self.contentStartPos.scaleX * pinchRatio, - scaleY : self.contentStartPos.scaleY * pinchRatio - }; - - self.canTap = false; - - self.newWidth = newWidth; - self.newHeight = newHeight; - - self.contentLastPos = newPos; - - if ( self.requestId ) { - cancelAFrame( self.requestId ); - - self.requestId = null; - } - - self.requestId = requestAFrame(function() { - $.fancybox.setTranslate( self.$content, self.contentLastPos ); - }); - - }; - - Guestures.prototype.ontouchend = function( e ) { - var self = this; - var dMs = Math.max( (new Date().getTime() ) - self.startTime, 1); - - var swiping = self.isSwiping; - var panning = self.isPanning; - var zooming = self.isZooming; - var scrolling = self.isScrolling; - - self.endPoints = pointers( e ); - - self.$container.removeClass( 'fancybox-controls--isGrabbing' ); - - $(document).off( '.fb.touch' ); - - document.removeEventListener('scroll', self.onscroll, true); - - if ( self.requestId ) { - cancelAFrame( self.requestId ); - - self.requestId = null; - } - - self.isSwiping = false; - self.isPanning = false; - self.isZooming = false; - self.isScrolling = false; - - self.instance.isDragging = false; - - if ( self.canTap ) { - return self.onTap( e ); - } - - self.speed = 366; - - // Speed in px/ms - self.velocityX = self.distanceX / dMs * 0.5; - self.velocityY = self.distanceY / dMs * 0.5; - - self.speedX = Math.max( self.speed * 0.5, Math.min( self.speed * 1.5, ( 1 / Math.abs( self.velocityX ) ) * self.speed ) ); - - if ( panning ) { - self.endPanning(); - - } else if ( zooming ) { - self.endZooming(); - - } else { - self.endSwiping( swiping, scrolling ); - } - - return; - }; - - Guestures.prototype.endSwiping = function( swiping, scrolling ) { - var self = this, - ret = false, - len = self.instance.group.length; - - self.sliderLastPos = null; - - // Close if swiped vertically / navigate if horizontally - if ( swiping == 'y' && !scrolling && Math.abs( self.distanceY ) > 50 ) { - - // Continue vertical movement - $.fancybox.animate( self.instance.current.$slide, { - top : self.sliderStartPos.top + self.distanceY + ( self.velocityY * 150 ), - opacity : 0 - }, 150 ); - - ret = self.instance.close( true, 300 ); - - } else if ( swiping == 'x' && self.distanceX > 50 && len > 1 ) { - ret = self.instance.previous( self.speedX ); - - } else if ( swiping == 'x' && self.distanceX < -50 && len > 1 ) { - ret = self.instance.next( self.speedX ); - } - - if ( ret === false && ( swiping == 'x' || swiping == 'y' ) ) { - if ( scrolling || len < 2 ) { - self.instance.centerSlide( self.instance.current, 150 ); - } else { - self.instance.jumpTo( self.instance.current.index ); - } - } - - self.$container.removeClass( 'fancybox-is-sliding' ); - - }; - - // Limit panning from edges - // ======================== - - Guestures.prototype.endPanning = function() { - - var self = this; - var newOffsetX, newOffsetY, newPos; - - if ( !self.contentLastPos ) { - return; - } - - if ( self.opts.momentum === false ) { - newOffsetX = self.contentLastPos.left; - newOffsetY = self.contentLastPos.top; - - } else { - - // Continue movement - newOffsetX = self.contentLastPos.left + ( self.velocityX * self.speed ); - newOffsetY = self.contentLastPos.top + ( self.velocityY * self.speed ); - } - - newPos = self.limitPosition( newOffsetX, newOffsetY, self.contentStartPos.width, self.contentStartPos.height ); - - newPos.width = self.contentStartPos.width; - newPos.height = self.contentStartPos.height; - - $.fancybox.animate( self.$content, newPos, 330 ); - }; - - - Guestures.prototype.endZooming = function() { - var self = this; - - var current = self.instance.current; - - var newOffsetX, newOffsetY, newPos, reset; - - var newWidth = self.newWidth; - var newHeight = self.newHeight; - - if ( !self.contentLastPos ) { - return; - } - - newOffsetX = self.contentLastPos.left; - newOffsetY = self.contentLastPos.top; - - reset = { - top : newOffsetY, - left : newOffsetX, - width : newWidth, - height : newHeight, - scaleX : 1, - scaleY : 1 - }; - - // Reset scalex/scaleY values; this helps for perfomance and does not break animation - $.fancybox.setTranslate( self.$content, reset ); - - if ( newWidth < self.canvasWidth && newHeight < self.canvasHeight ) { - self.instance.scaleToFit( 150 ); - - } else if ( newWidth > current.width || newHeight > current.height ) { - self.instance.scaleToActual( self.centerPointStartX, self.centerPointStartY, 150 ); - - } else { - - newPos = self.limitPosition( newOffsetX, newOffsetY, newWidth, newHeight ); - - // Switch from scale() to width/height or animation will not work correctly - $.fancybox.setTranslate( self.content, $.fancybox.getTranslate( self.$content ) ); - - $.fancybox.animate( self.$content, newPos, 150 ); - } - - }; - - Guestures.prototype.onTap = function(e) { - var self = this; - var $target = $( e.target ); - - var instance = self.instance; - var current = instance.current; - - var endPoints = ( e && pointers( e ) ) || self.startPoints; - - var tapX = endPoints[0] ? endPoints[0].x - self.$stage.offset().left : 0; - var tapY = endPoints[0] ? endPoints[0].y - self.$stage.offset().top : 0; - - var where; - - var process = function ( prefix ) { - - var action = current.opts[ prefix ]; - - if ( $.isFunction( action ) ) { - action = action.apply( instance, [ current, e ] ); - } - - if ( !action) { - return; - } - - switch ( action ) { - - case "close" : - - instance.close( self.startEvent ); - - break; - - case "toggleControls" : - - instance.toggleControls( true ); - - break; - - case "next" : - - instance.next(); - - break; - - case "nextOrClose" : - - if ( instance.group.length > 1 ) { - instance.next(); - - } else { - instance.close( self.startEvent ); - } - - break; - - case "zoom" : - - if ( current.type == 'image' && ( current.isLoaded || current.$ghost ) ) { - - if ( instance.canPan() ) { - instance.scaleToFit(); - - } else if ( instance.isScaledDown() ) { - instance.scaleToActual( tapX, tapY ); - - } else if ( instance.group.length < 2 ) { - instance.close( self.startEvent ); - } - } - - break; - } - - }; - - // Ignore right click - if ( e.originalEvent && e.originalEvent.button == 2 ) { - return; - } - - // Skip if clicked on the scrollbar - if ( !$target.is('img') && tapX > $target[0].clientWidth + $target.offset().left ) { - return; - } - - // Check where is clicked - if ( $target.is( '.fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-container' ) ) { - where = 'Outside'; - - } else if ( $target.is( '.fancybox-slide' ) ) { - where = 'Slide'; - - } else if ( instance.current.$content && instance.current.$content.find( $target ).addBack().filter( $target ).length ) { - where = 'Content'; - - } else { - return; - } - - // Check if this is a double tap - if ( self.tapped ) { - - // Stop previously created single tap - clearTimeout( self.tapped ); - self.tapped = null; - - // Skip if distance between taps is too big - if ( Math.abs( tapX - self.tapX ) > 50 || Math.abs( tapY - self.tapY ) > 50 ) { - return this; - } - - // OK, now we assume that this is a double-tap - process( 'dblclick' + where ); - - } else { - - // Single tap will be processed if user has not clicked second time within 300ms - // or there is no need to wait for double-tap - self.tapX = tapX; - self.tapY = tapY; - - if ( current.opts[ 'dblclick' + where ] && current.opts[ 'dblclick' + where ] !== current.opts[ 'click' + where ] ) { - - self.tapped = setTimeout(function() { - self.tapped = null; - - process( 'click' + where ); - - }, 500); - - } else { - process( 'click' + where ); - } - - } - - return this; - }; - - $(document).on('onActivate.fb', function (e, instance) { - if ( instance && !instance.Guestures ) { - instance.Guestures = new Guestures( instance ); - } - }); - -}( window, document, window.jQuery || jQuery )); + Guestures.prototype.endZooming = function() { + var self = this; + + var current = self.instance.current; + + var newOffsetX, newOffsetY, newPos, reset; + + var newWidth = self.newWidth; + var newHeight = self.newHeight; + + if (!self.contentLastPos) { + return; + } + + newOffsetX = self.contentLastPos.left; + newOffsetY = self.contentLastPos.top; + + reset = { + top: newOffsetY, + left: newOffsetX, + width: newWidth, + height: newHeight, + scaleX: 1, + scaleY: 1 + }; + + // Reset scalex/scaleY values; this helps for perfomance and does not break animation + $.fancybox.setTranslate(self.$content, reset); + + if (newWidth < self.canvasWidth && newHeight < self.canvasHeight) { + self.instance.scaleToFit(150); + } else if (newWidth > current.width || newHeight > current.height) { + self.instance.scaleToActual(self.centerPointStartX, self.centerPointStartY, 150); + } else { + newPos = self.limitPosition(newOffsetX, newOffsetY, newWidth, newHeight); + + // Switch from scale() to width/height or animation will not work correctly + $.fancybox.setTranslate(self.$content, $.fancybox.getTranslate(self.$content)); + + $.fancybox.animate(self.$content, newPos, 150); + } + }; + + Guestures.prototype.onTap = function(e) { + var self = this; + var $target = $(e.target); + + var instance = self.instance; + var current = instance.current; + + var endPoints = (e && getPointerXY(e)) || self.startPoints; + + var tapX = endPoints[0] ? endPoints[0].x - $(window).scrollLeft() - self.stagePos.left : 0; + var tapY = endPoints[0] ? endPoints[0].y - $(window).scrollTop() - self.stagePos.top : 0; + + var where; + + var process = function(prefix) { + var action = current.opts[prefix]; + + if ($.isFunction(action)) { + action = action.apply(instance, [current, e]); + } + + if (!action) { + return; + } + + switch (action) { + case "close": + instance.close(self.startEvent); + + break; + + case "toggleControls": + instance.toggleControls(true); + + break; + + case "next": + instance.next(); + + break; + + case "nextOrClose": + if (instance.group.length > 1) { + instance.next(); + } else { + instance.close(self.startEvent); + } + + break; + + case "zoom": + if (current.type == "image" && (current.isLoaded || current.$ghost)) { + if (instance.canPan()) { + instance.scaleToFit(); + } else if (instance.isScaledDown()) { + instance.scaleToActual(tapX, tapY); + } else if (instance.group.length < 2) { + instance.close(self.startEvent); + } + } + + break; + } + }; + + // Ignore right click + if (e.originalEvent && e.originalEvent.button == 2) { + return; + } + + // Skip if clicked on the scrollbar + if (!$target.is("img") && tapX > $target[0].clientWidth + $target.offset().left) { + return; + } + + // Check where is clicked + if ($target.is(".fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-container")) { + where = "Outside"; + } else if ($target.is(".fancybox-slide")) { + where = "Slide"; + } else if ( + instance.current.$content && + instance.current.$content + .find($target) + .addBack() + .filter($target).length + ) { + where = "Content"; + } else { + return; + } + + // Check if this is a double tap + if (self.tapped) { + // Stop previously created single tap + clearTimeout(self.tapped); + self.tapped = null; + + // Skip if distance between taps is too big + if (Math.abs(tapX - self.tapX) > 50 || Math.abs(tapY - self.tapY) > 50) { + return this; + } + + // OK, now we assume that this is a double-tap + process("dblclick" + where); + } else { + // Single tap will be processed if user has not clicked second time within 300ms + // or there is no need to wait for double-tap + self.tapX = tapX; + self.tapY = tapY; + + if (current.opts["dblclick" + where] && current.opts["dblclick" + where] !== current.opts["click" + where]) { + self.tapped = setTimeout(function() { + self.tapped = null; + + process("click" + where); + }, 500); + } else { + process("click" + where); + } + } + + return this; + }; + + $(document).on("onActivate.fb", function(e, instance) { + if (instance && !instance.Guestures) { + instance.Guestures = new Guestures(instance); + } + }); +})(window, document, window.jQuery || jQuery); diff --git a/src/js/hash.js b/src/js/hash.js index 42287006..e33ec538 100644 --- a/src/js/hash.js +++ b/src/js/hash.js @@ -4,215 +4,213 @@ // Enables linking to each modal // // ========================================================================== -;(function (document, window, $) { - 'use strict'; - - // Simple $.escapeSelector polyfill (for jQuery prior v3) - if ( !$.escapeSelector ) { - $.escapeSelector = function( sel ) { - var rcssescape = /([\0-\x1f\x7f]|^-?\d)|^-$|[^\x80-\uFFFF\w-]/g; - var fcssescape = function( ch, asCodePoint ) { - if ( asCodePoint ) { - // U+0000 NULL becomes U+FFFD REPLACEMENT CHARACTER - if ( ch === "\0" ) { - return "\uFFFD"; - } - - // Control characters and (dependent upon position) numbers get escaped as code points - return ch.slice( 0, -1 ) + "\\" + ch.charCodeAt( ch.length - 1 ).toString( 16 ) + " "; - } - - // Other potentially-special ASCII characters get backslash-escaped - return "\\" + ch; - }; - - return ( sel + "" ).replace( rcssescape, fcssescape ); - }; - } - - // Create new history entry only once - var shouldCreateHistory = true; - - // Variable containing last hash value set by fancyBox - // It will be used to determine if fancyBox needs to close after hash change is detected - var currentHash = null; - - // Throttling the history change - var timerID = null; - - // Get info about gallery name and current index from url - function parseUrl() { - var hash = window.location.hash.substr( 1 ); - var rez = hash.split( '-' ); - var index = rez.length > 1 && /^\+?\d+$/.test( rez[ rez.length - 1 ] ) ? parseInt( rez.pop( -1 ), 10 ) || 1 : 1; - var gallery = rez.join( '-' ); - - // Index is starting from 1 - if ( index < 1 ) { - index = 1; - } - - return { - hash : hash, - index : index, - gallery : gallery - }; - } - - // Trigger click evnt on links to open new fancyBox instance - function triggerFromUrl( url ) { - var $el; - - if ( url.gallery !== '' ) { - - // If we can find element matching 'data-fancybox' atribute, then trigger click event for that .. - $el = $( "[data-fancybox='" + $.escapeSelector( url.gallery ) + "']" ).eq( url.index - 1 ); - - if ( !$el.length ) { - // .. if not, try finding element by ID - $el = $( "#" + $.escapeSelector( url.gallery ) + "" ); - } - - if ( $el.length ) { - shouldCreateHistory = false; - - $el.trigger( 'click' ); - } - +(function(document, window, $) { + "use strict"; + + // Simple $.escapeSelector polyfill (for jQuery prior v3) + if (!$.escapeSelector) { + $.escapeSelector = function(sel) { + var rcssescape = /([\0-\x1f\x7f]|^-?\d)|^-$|[^\x80-\uFFFF\w-]/g; + var fcssescape = function(ch, asCodePoint) { + if (asCodePoint) { + // U+0000 NULL becomes U+FFFD REPLACEMENT CHARACTER + if (ch === "\0") { + return "\uFFFD"; + } + + // Control characters and (dependent upon position) numbers get escaped as code points + return ch.slice(0, -1) + "\\" + ch.charCodeAt(ch.length - 1).toString(16) + " "; } - } - - // Get gallery name from current instance - function getGalleryID( instance ) { - var opts; - - if ( !instance ) { - return false; - } - - opts = instance.current ? instance.current.opts : instance.opts; - - return opts.hash || ( opts.$orig ? opts.$orig.data( 'fancybox' ) : '' ); - } - - // Start when DOM becomes ready - $(function() { - - // Check if user has disabled this module - if ( $.fancybox.defaults.hash === false ) { - return; - } - - // Update hash when opening/closing fancyBox - $(document).on({ - 'onInit.fb' : function( e, instance ) { - var url, gallery; - - if ( instance.group[ instance.currIndex ].opts.hash === false ) { - return; - } - - url = parseUrl(); - gallery = getGalleryID( instance ); - - // Make sure gallery start index matches index from hash - if ( gallery && url.gallery && gallery == url.gallery ) { - instance.currIndex = url.index - 1; - } - }, - 'beforeShow.fb' : function( e, instance, current ) { - var gallery; - - if ( !current || current.opts.hash === false ) { - return; - } - - gallery = getGalleryID( instance ); - - // Update window hash - if ( gallery && gallery !== '' ) { + // Other potentially-special ASCII characters get backslash-escaped + return "\\" + ch; + }; + + return (sel + "").replace(rcssescape, fcssescape); + }; + } + + // Get info about gallery name and current index from url + function parseUrl() { + var hash = window.location.hash.substr(1), + rez = hash.split("-"), + index = rez.length > 1 && /^\+?\d+$/.test(rez[rez.length - 1]) ? parseInt(rez.pop(-1), 10) || 1 : 1, + gallery = rez.join("-"); + + return { + hash: hash, + /* Index is starting from 1 */ + index: index < 1 ? 1 : index, + gallery: gallery + }; + } + + // Trigger click evnt on links to open new fancyBox instance + function triggerFromUrl(url) { + var $el; + + if (url.gallery !== "") { + // If we can find element matching 'data-fancybox' atribute, then trigger click event for that. + // It should start fancyBox + $el = $("[data-fancybox='" + $.escapeSelector(url.gallery) + "']") + .eq(url.index - 1) + .trigger("click.fb-start"); + } + } - if ( window.location.hash.indexOf( gallery ) < 0 ) { - instance.opts.origHash = window.location.hash; - } + // Get gallery name from current instance + function getGalleryID(instance) { + var opts, ret; - currentHash = gallery + ( instance.group.length > 1 ? '-' + ( current.index + 1 ) : '' ); + if (!instance) { + return false; + } - if ( 'replaceState' in window.history ) { - if ( timerID ) { - clearTimeout( timerID ); - } + opts = instance.current ? instance.current.opts : instance.opts; + ret = opts.hash || (opts.$orig ? opts.$orig.data("fancybox") : ""); - timerID = setTimeout(function() { - window.history[ shouldCreateHistory ? 'pushState' : 'replaceState' ]( {} , document.title, window.location.pathname + window.location.search + '#' + currentHash ); + return ret === "" ? false : ret; + } - timerID = null; + // Start when DOM becomes ready + $(function() { + // Check if user has disabled this module + if ($.fancybox.defaults.hash === false) { + return; + } - shouldCreateHistory = false; + // Update hash when opening/closing fancyBox + $(document).on({ + "onInit.fb": function(e, instance) { + var url, gallery; - }, 300); + if (instance.group[instance.currIndex].opts.hash === false) { + return; + } - } else { - window.location.hash = currentHash; - } + url = parseUrl(); + gallery = getGalleryID(instance); - } + // Make sure gallery start index matches index from hash + if (gallery && url.gallery && gallery == url.gallery) { + instance.currIndex = url.index - 1; + } + }, - }, + "beforeShow.fb": function(e, instance, current, firstRun) { + var gallery; - 'beforeClose.fb' : function( e, instance, current ) { - var gallery, origHash; + if (!current || current.opts.hash === false) { + return; + } - if ( timerID ) { - clearTimeout( timerID ); - } + // Check if need to update window hash + gallery = getGalleryID(instance); - if ( current.opts.hash === false ) { - return; - } + if (!gallery) { + return; + } - gallery = getGalleryID( instance ); - origHash = instance && instance.opts.origHash ? instance.opts.origHash : ''; + // Variable containing last hash value set by fancyBox + // It will be used to determine if fancyBox needs to close after hash change is detected + instance.currentHash = gallery + (instance.group.length > 1 ? "-" + (current.index + 1) : ""); - // Remove hash from location bar - if ( gallery && gallery !== '' ) { + // If current hash is the same (this instance most likely is opened by hashchange), then do nothing + if (window.location.hash === "#" + instance.currentHash) { + return; + } - if ( 'replaceState' in history ) { - window.history.replaceState( {} , document.title, window.location.pathname + window.location.search + origHash ); + if (!instance.origHash) { + instance.origHash = window.location.hash; + } - } else { - window.location.hash = origHash; + if (instance.hashTimer) { + clearTimeout(instance.hashTimer); + } - // Keep original scroll position - $( window ).scrollTop( instance.scrollTop ).scrollLeft( instance.scrollLeft ); - } - } + // Update hash + instance.hashTimer = setTimeout(function() { + if ("replaceState" in window.history) { + window.history[firstRun ? "pushState" : "replaceState"]( + {}, + document.title, + window.location.pathname + window.location.search + "#" + instance.currentHash + ); + + if (firstRun) { + instance.hasCreatedHistory = true; + } + } else { + window.location.hash = instance.currentHash; + } + + instance.hashTimer = null; + }, 300); + }, + + "beforeClose.fb": function(e, instance, current) { + var gallery; + + if (current.opts.hash === false) { + return; + } - currentHash = null; - } - }); + gallery = getGalleryID(instance); + + // Goto previous history entry + if (instance.currentHash && instance.hasCreatedHistory) { + window.history.back(); + } else if (instance.currentHash) { + if ("replaceState" in window.history) { + window.history.replaceState({}, document.title, window.location.pathname + window.location.search + (instance.origHash || "")); + } else { + window.location.hash = instance.origHash; + } + } - // Check if need to close after url has changed - $(window).on('hashchange.fb', function() { - var url = parseUrl(); + instance.currentHash = null; - if ( $.fancybox.getInstance() ) { - if ( currentHash && currentHash !== url.gallery + '-' + url.index && !( url.index === 1 && currentHash == url.gallery ) ) { - currentHash = null; + clearTimeout(instance.hashTimer); + } + }); - $.fancybox.close(); - } + // Check if need to start/close after url has changed + $(window).on("hashchange.fb", function() { + var url = parseUrl(), + fb; + + // Find last fancyBox instance that has "hash" + $.each( + $(".fancybox-container") + .get() + .reverse(), + function(index, value) { + var tmp = $(value).data("FancyBox"); + //isClosing + if (tmp.currentHash) { + fb = tmp; + return false; + } + } + ); - } else if ( url.gallery !== '' ) { - triggerFromUrl( url ); - } - }); + if (fb) { + // Now, compare hash values + if (fb.currentHash && fb.currentHash !== url.gallery + "-" + url.index && !(url.index === 1 && fb.currentHash == url.gallery)) { + fb.currentHash = null; - // Check current hash and trigger click event on matching element to start fancyBox, if needed - setTimeout(function() { - triggerFromUrl( parseUrl() ); - }, 50); + fb.close(); + } + } else if (url.gallery !== "") { + triggerFromUrl(url); + } }); -}( document, window, window.jQuery || jQuery )); + // Check current hash and trigger click event on matching element to start fancyBox, if needed + setTimeout(function() { + if (!$.fancybox.getInstance()) { + triggerFromUrl(parseUrl()); + } + }, 50); + }); +})(document, window, window.jQuery || jQuery); diff --git a/src/js/media.js b/src/js/media.js index 5c3820bc..9326a02a 100644 --- a/src/js/media.js +++ b/src/js/media.js @@ -4,208 +4,193 @@ // Adds additional media type support // // ========================================================================== -;(function ($) { - - 'use strict'; - - // Formats matching url to final form - - var format = function (url, rez, params) { - if ( !url ) { - return; - } - - params = params || ''; - - if ( $.type(params) === "object" ) { - params = $.param(params, true); - } - - $.each(rez, function (key, value) { - url = url.replace('$' + key, value || ''); - }); - - if (params.length) { - url += (url.indexOf('?') > 0 ? '&' : '?') + params; - } - - return url; - }; - - // Object containing properties for each media type - - var defaults = { - youtube : { - matcher : /(youtube\.com|youtu\.be|youtube\-nocookie\.com)\/(watch\?(.*&)?v=|v\/|u\/|embed\/?)?(videoseries\?list=(.*)|[\w-]{11}|\?listType=(.*)&list=(.*))(.*)/i, - params : { - autoplay : 1, - autohide : 1, - fs : 1, - rel : 0, - hd : 1, - wmode : 'transparent', - enablejsapi : 1, - html5 : 1 - }, - paramPlace : 8, - type : 'iframe', - url : '//www.youtube.com/embed/$4', - thumb : '//img.youtube.com/vi/$4/hqdefault.jpg' - }, - - vimeo : { - matcher : /^.+vimeo.com\/(.*\/)?([\d]+)(.*)?/, - params : { - autoplay : 1, - hd : 1, - show_title : 1, - show_byline : 1, - show_portrait : 0, - fullscreen : 1, - api : 1 - }, - paramPlace : 3, - type : 'iframe', - url : '//player.vimeo.com/video/$2' - }, - - metacafe : { - matcher : /metacafe.com\/watch\/(\d+)\/(.*)?/, - type : 'iframe', - url : '//www.metacafe.com/embed/$1/?ap=1' - }, - - dailymotion : { - matcher : /dailymotion.com\/video\/(.*)\/?(.*)/, - params : { - additionalInfos : 0, - autoStart : 1 - }, - type : 'iframe', - url : '//www.dailymotion.com/embed/video/$1' - }, - - vine : { - matcher : /vine.co\/v\/([a-zA-Z0-9\?\=\-]+)/, - type : 'iframe', - url : '//vine.co/v/$1/embed/simple' - }, - - instagram : { - matcher : /(instagr\.am|instagram\.com)\/p\/([a-zA-Z0-9_\-]+)\/?/i, - type : 'image', - url : '//$1/p/$2/media/?size=l' - }, - - // Examples: - // http://maps.google.com/?ll=48.857995,2.294297&spn=0.007666,0.021136&t=m&z=16 - // https://www.google.com/maps/@37.7852006,-122.4146355,14.65z - // https://www.google.com/maps/place/Googleplex/@37.4220041,-122.0833494,17z/data=!4m5!3m4!1s0x0:0x6c296c66619367e0!8m2!3d37.4219998!4d-122.0840572 - gmap_place : { - matcher : /(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(((maps\/(place\/(.*)\/)?\@(.*),(\d+.?\d+?)z))|(\?ll=))(.*)?/i, - type : 'iframe', - url : function (rez) { - return '//maps.google.' + rez[2] + '/?ll=' + ( rez[9] ? rez[9] + '&z=' + Math.floor( rez[10] ) + ( rez[12] ? rez[12].replace(/^\//, "&") : '' ) : rez[12] ) + '&output=' + ( rez[12] && rez[12].indexOf('layer=c') > 0 ? 'svembed' : 'embed' ); - } - }, - - // Examples: - // https://www.google.com/maps/search/Empire+State+Building/ - // https://www.google.com/maps/search/?api=1&query=centurylink+field - // https://www.google.com/maps/search/?api=1&query=47.5951518,-122.3316393 - gmap_search : { - matcher : /(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(maps\/search\/)(.*)/i, - type : 'iframe', - url : function (rez) { - return '//maps.google.' + rez[2] + '/maps?q=' + rez[5].replace('query=', 'q=').replace('api=1', '') + '&output=embed'; - } - } - }; - - $(document).on('objectNeedsType.fb', function (e, instance, item) { - - var url = item.src || '', - type = false, - media, - thumb, - rez, - params, - urlParams, - paramObj, - provider; - - media = $.extend( true, {}, defaults, item.opts.media ); - - // Look for any matching media type - $.each(media, function ( providerName, providerOpts ) { - rez = url.match( providerOpts.matcher ); - - if ( !rez ) { - return; - } - - type = providerOpts.type; - paramObj = {}; - - if ( providerOpts.paramPlace && rez[ providerOpts.paramPlace ] ) { - urlParams = rez[ providerOpts.paramPlace ]; - - if ( urlParams[ 0 ] == '?' ) { - urlParams = urlParams.substring(1); - } - - urlParams = urlParams.split('&'); - - for ( var m = 0; m < urlParams.length; ++m ) { - var p = urlParams[ m ].split('=', 2); - - if ( p.length == 2 ) { - paramObj[ p[0] ] = decodeURIComponent( p[1].replace(/\+/g, " ") ); - } - } - } - - params = $.extend( true, {}, providerOpts.params, item.opts[ providerName ], paramObj ); - - url = $.type( providerOpts.url ) === "function" ? providerOpts.url.call( this, rez, params, item ) : format( providerOpts.url, rez, params ); - thumb = $.type( providerOpts.thumb ) === "function" ? providerOpts.thumb.call( this, rez, params, item ) : format( providerOpts.thumb, rez ); - - if ( providerName === 'vimeo' ) { - url = url.replace('&%23', '#'); - } - - return false; - }); - - // If it is found, then change content type and update the url - - if ( type ) { - item.src = url; - item.type = type; - - if ( !item.opts.thumb && !( item.opts.$thumb && item.opts.$thumb.length ) ) { - item.opts.thumb = thumb; - } - - if ( type === 'iframe' ) { - $.extend(true, item.opts, { - iframe : { - preload : false, - attr : { - scrolling : "no" - } - } - }); - - item.contentProvider = provider; - - item.opts.slideClass += ' fancybox-slide--' + ( provider == 'gmap_place' || provider == 'gmap_search' ? 'map' : 'video' ); - } - - } else if ( url ) { - item.type = item.opts.defaultType; - } - - }); - -}( window.jQuery || jQuery )); +(function($) { + "use strict"; + + // Formats matching url to final form + + var format = function(url, rez, params) { + if (!url) { + return; + } + + params = params || ""; + + if ($.type(params) === "object") { + params = $.param(params, true); + } + + $.each(rez, function(key, value) { + url = url.replace("$" + key, value || ""); + }); + + if (params.length) { + url += (url.indexOf("?") > 0 ? "&" : "?") + params; + } + + return url; + }; + + // Object containing properties for each media type + + var defaults = { + youtube: { + matcher: /(youtube\.com|youtu\.be|youtube\-nocookie\.com)\/(watch\?(.*&)?v=|v\/|u\/|embed\/?)?(videoseries\?list=(.*)|[\w-]{11}|\?listType=(.*)&list=(.*))(.*)/i, + params: { + autoplay: 1, + autohide: 1, + fs: 1, + rel: 0, + hd: 1, + wmode: "transparent", + enablejsapi: 1, + html5: 1 + }, + paramPlace: 8, + type: "iframe", + url: "//www.youtube.com/embed/$4", + thumb: "//img.youtube.com/vi/$4/hqdefault.jpg" + }, + + vimeo: { + matcher: /^.+vimeo.com\/(.*\/)?([\d]+)(.*)?/, + params: { + autoplay: 1, + hd: 1, + show_title: 1, + show_byline: 1, + show_portrait: 0, + fullscreen: 1, + api: 1 + }, + paramPlace: 3, + type: "iframe", + url: "//player.vimeo.com/video/$2" + }, + + instagram: { + matcher: /(instagr\.am|instagram\.com)\/p\/([a-zA-Z0-9_\-]+)\/?/i, + type: "image", + url: "//$1/p/$2/media/?size=l" + }, + + // Examples: + // http://maps.google.com/?ll=48.857995,2.294297&spn=0.007666,0.021136&t=m&z=16 + // https://www.google.com/maps/@37.7852006,-122.4146355,14.65z + // https://www.google.com/maps/@52.2111123,2.9237542,6.61z?hl=en + // https://www.google.com/maps/place/Googleplex/@37.4220041,-122.0833494,17z/data=!4m5!3m4!1s0x0:0x6c296c66619367e0!8m2!3d37.4219998!4d-122.0840572 + gmap_place: { + matcher: /(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(((maps\/(place\/(.*)\/)?\@(.*),(\d+.?\d+?)z))|(\?ll=))(.*)?/i, + type: "iframe", + url: function(rez) { + return ( + "//maps.google." + + rez[2] + + "/?ll=" + + (rez[9] ? rez[9] + "&z=" + Math.floor(rez[10]) + (rez[12] ? rez[12].replace(/^\//, "&") : "") : rez[12] + "").replace(/\?/, "&") + + "&output=" + + (rez[12] && rez[12].indexOf("layer=c") > 0 ? "svembed" : "embed") + ); + } + }, + + // Examples: + // https://www.google.com/maps/search/Empire+State+Building/ + // https://www.google.com/maps/search/?api=1&query=centurylink+field + // https://www.google.com/maps/search/?api=1&query=47.5951518,-122.3316393 + gmap_search: { + matcher: /(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(maps\/search\/)(.*)/i, + type: "iframe", + url: function(rez) { + return "//maps.google." + rez[2] + "/maps?q=" + rez[5].replace("query=", "q=").replace("api=1", "") + "&output=embed"; + } + } + }; + + $(document).on("objectNeedsType.fb", function(e, instance, item) { + var url = item.src || "", + type = false, + media, + thumb, + rez, + params, + urlParams, + paramObj, + provider; + + media = $.extend(true, {}, defaults, item.opts.media); + + // Look for any matching media type + $.each(media, function(providerName, providerOpts) { + rez = url.match(providerOpts.matcher); + + if (!rez) { + return; + } + + type = providerOpts.type; + provider = providerName; + paramObj = {}; + + if (providerOpts.paramPlace && rez[providerOpts.paramPlace]) { + urlParams = rez[providerOpts.paramPlace]; + + if (urlParams[0] == "?") { + urlParams = urlParams.substring(1); + } + + urlParams = urlParams.split("&"); + + for (var m = 0; m < urlParams.length; ++m) { + var p = urlParams[m].split("=", 2); + + if (p.length == 2) { + paramObj[p[0]] = decodeURIComponent(p[1].replace(/\+/g, " ")); + } + } + } + + params = $.extend(true, {}, providerOpts.params, item.opts[providerName], paramObj); + + url = + $.type(providerOpts.url) === "function" ? providerOpts.url.call(this, rez, params, item) : format(providerOpts.url, rez, params); + + thumb = + $.type(providerOpts.thumb) === "function" ? providerOpts.thumb.call(this, rez, params, item) : format(providerOpts.thumb, rez); + + if (providerName === "vimeo") { + url = url.replace("&%23", "#"); + } + + return false; + }); + + // If it is found, then change content type and update the url + + if (type) { + if (!item.opts.thumb && !(item.opts.$thumb && item.opts.$thumb.length)) { + item.opts.thumb = thumb; + } + + if (type === "iframe") { + item.opts = $.extend(true, item.opts, { + iframe: { + preload: false, + attr: { + scrolling: "no" + } + } + }); + } + + $.extend(item, { + src: url, + type: type, + contentSource: provider, + contentType: type === "image" ? "image" : provider == "gmap_place" || provider == "gmap_search" ? "map" : "video" + }); + } else if (url) { + item.type = item.opts.defaultType; + } + }); +})(window.jQuery || jQuery); diff --git a/src/js/share.js b/src/js/share.js index 78928473..d5e51188 100644 --- a/src/js/share.js +++ b/src/js/share.js @@ -4,88 +4,90 @@ // Displays simple form for sharing current url // // ========================================================================== -;(function (document, $) { - 'use strict'; +(function(document, $) { + "use strict"; - $.extend(true, $.fancybox.defaults, { - btnTpl : { - share : - '' - }, - share : { - tpl : - '
    ' + - '

    {{SHARE}}

    ' + - '' + - '

    ' + - '
    ' - } - }); + $.extend(true, $.fancybox.defaults, { + btnTpl: { + share: + '" + }, + share: { + tpl: + '
    ' + + "

    {{SHARE}}

    " + + "

    " + + '' + + '' + + "Facebook" + + "" + + '' + + '' + + "Twitter" + + "" + + '' + + '' + + "Pinterest" + + "" + + "

    " + + '

    ' + + "
    " + } + }); - function escapeHtml(string) { - var entityMap = { - '&': '&', - '<': '<', - '>': '>', - '"': '"', - "'": ''', - '/': '/', - '`': '`', - '=': '=' - }; + function escapeHtml(string) { + var entityMap = { + "&": "&", + "<": "<", + ">": ">", + '"': """, + "'": "'", + "/": "/", + "`": "`", + "=": "=" + }; - return String(string).replace(/[&<>"'`=\/]/g, function (s) { - return entityMap[s]; - }); - } + return String(string).replace(/[&<>"'`=\/]/g, function(s) { + return entityMap[s]; + }); + } - $(document).on('click', '[data-fancybox-share]', function() { - var f = $.fancybox.getInstance(), - url, - tpl; + $(document).on("click", "[data-fancybox-share]", function() { + var f = $.fancybox.getInstance(), + url, + tpl; - if ( f ) { - url = f.current.opts.hash === false ? f.current.src : window.location; - tpl = f.current.opts.share.tpl - .replace( /\{\{media\}\}/g, f.current.type === 'image' ? encodeURIComponent( f.current.src ) : '' ) - .replace( /\{\{url\}\}/g, encodeURIComponent( url ) ) - .replace( /\{\{url_raw\}\}/g, escapeHtml( url ) ) - .replace( /\{\{descr\}\}/g, f.$caption ? encodeURIComponent( f.$caption.text() ) : '' ); + if (f) { + url = f.current.opts.hash === false ? f.current.src : window.location; + tpl = f.current.opts.share.tpl + .replace(/\{\{media\}\}/g, f.current.type === "image" ? encodeURIComponent(f.current.src) : "") + .replace(/\{\{url\}\}/g, encodeURIComponent(url)) + .replace(/\{\{url_raw\}\}/g, escapeHtml(url)) + .replace(/\{\{descr\}\}/g, f.$caption ? encodeURIComponent(f.$caption.text()) : ""); - $.fancybox.open({ - src : f.translate( f, tpl ), - type : 'html', - opts : { - animationEffect : "fade", - animationDuration : 250, - afterLoad : function(instance, current) { - // Opening links in a popup window - current.$content.find('.fancybox-share__links a').click(function() { - window.open(this.href, "Share", "width=550, height=450"); - return false; - }); - } - } - }); - } + $.fancybox.open({ + src: f.translate(f, tpl), + type: "html", + opts: { + animationEffect: false, + afterLoad: function(instance, current) { + // Close self if parent instance is closing + f.$refs.container.one("beforeClose.fb", function() { + instance.close(null, 0); + }); - }); - -}( document, window.jQuery || jQuery )); + // Opening links in a popup window + current.$content.find(".fancybox-share__links a").click(function() { + window.open(this.href, "Share", "width=550, height=450"); + return false; + }); + } + } + }); + } + }); +})(document, window.jQuery || jQuery); diff --git a/src/js/slideshow.js b/src/js/slideshow.js index f0449125..2a8c2554 100644 --- a/src/js/slideshow.js +++ b/src/js/slideshow.js @@ -7,179 +7,175 @@ // $.fancybox.getInstance().SlideShow.start() // // ========================================================================== -;(function (document, $) { - 'use strict'; - - $.extend(true, $.fancybox.defaults, { - btnTpl : { - slideShow : - '' - }, - slideShow : { - autoStart : false, - speed : 3000 - } - }); - - var SlideShow = function( instance ) { - this.instance = instance; - this.init(); - }; - - $.extend( SlideShow.prototype, { - timer : null, - isActive : false, - $button : null, - - init : function() { - var self = this; - - self.$button = self.instance.$refs.toolbar.find('[data-fancybox-play]').on('click', function() { - self.toggle(); - }); - - if ( self.instance.group.length < 2 || !self.instance.group[ self.instance.currIndex ].opts.slideShow ) { - self.$button.hide(); - } - }, - - set : function( force ) { - var self = this; - - // Check if reached last element - if ( self.instance && self.instance.current && (force === true || self.instance.current.opts.loop || self.instance.currIndex < self.instance.group.length - 1 )) { - self.timer = setTimeout(function() { - if ( self.isActive ) { - self.instance.jumpTo( (self.instance.currIndex + 1) % self.instance.group.length ); - } - - }, self.instance.current.opts.slideShow.speed); - - } else { - self.stop(); - self.instance.idleSecondsCounter = 0; - self.instance.showControls(); - } - }, - - clear : function() { - var self = this; - - clearTimeout( self.timer ); - - self.timer = null; - }, - - start : function() { - var self = this; - var current = self.instance.current; - - if ( current ) { - self.isActive = true; - - self.$button - .attr( 'title', current.opts.i18n[ current.opts.lang ].PLAY_STOP ) - .removeClass( 'fancybox-button--play' ) - .addClass( 'fancybox-button--pause' ); - - self.set( true ); - } - }, - - stop : function() { - var self = this; - var current = self.instance.current; - - self.clear(); - - self.$button - .attr( 'title', current.opts.i18n[ current.opts.lang ].PLAY_START ) - .removeClass( 'fancybox-button--pause' ) - .addClass( 'fancybox-button--play' ); - - self.isActive = false; - }, - - toggle : function() { - var self = this; - - if ( self.isActive ) { - self.stop(); - - } else { - self.start(); - } - } - - }); - - $(document).on({ - 'onInit.fb' : function(e, instance) { - if ( instance && !instance.SlideShow ) { - instance.SlideShow = new SlideShow( instance ); - } - }, - - 'beforeShow.fb' : function(e, instance, current, firstRun) { - var SlideShow = instance && instance.SlideShow; - - if ( firstRun ) { - - if ( SlideShow && current.opts.slideShow.autoStart ) { - SlideShow.start(); - } - - } else if ( SlideShow && SlideShow.isActive ) { - SlideShow.clear(); - } - }, - - 'afterShow.fb' : function(e, instance, current) { - var SlideShow = instance && instance.SlideShow; - - if ( SlideShow && SlideShow.isActive ) { - SlideShow.set(); - } - }, - - 'afterKeydown.fb' : function(e, instance, current, keypress, keycode) { - var SlideShow = instance && instance.SlideShow; - - // "P" or Spacebar - if ( SlideShow && current.opts.slideShow && ( keycode === 80 || keycode === 32 ) && !$(document.activeElement).is( 'button,a,input' ) ) { - keypress.preventDefault(); - - SlideShow.toggle(); - } - }, - - 'beforeClose.fb onDeactivate.fb' : function(e, instance) { - var SlideShow = instance && instance.SlideShow; - - if ( SlideShow ) { - SlideShow.stop(); - } - } - }); - - // Page Visibility API to pause slideshow when window is not active - $(document).on("visibilitychange", function() { - var instance = $.fancybox.getInstance(); - var SlideShow = instance && instance.SlideShow; - - if ( SlideShow && SlideShow.isActive ) { - if ( document.hidden ) { - SlideShow.clear(); - - } else { - SlideShow.set(); - } - } - }); - -}( document, window.jQuery || jQuery )); +(function(document, $) { + "use strict"; + + $.extend(true, $.fancybox.defaults, { + btnTpl: { + slideShow: + '" + }, + slideShow: { + autoStart: false, + speed: 3000 + } + }); + + var SlideShow = function(instance) { + this.instance = instance; + this.init(); + }; + + $.extend(SlideShow.prototype, { + timer: null, + isActive: false, + $button: null, + + init: function() { + var self = this; + + self.$button = self.instance.$refs.toolbar.find("[data-fancybox-play]").on("click", function() { + self.toggle(); + }); + + if (self.instance.group.length < 2 || !self.instance.group[self.instance.currIndex].opts.slideShow) { + self.$button.hide(); + } + }, + + set: function(force) { + var self = this; + + // Check if reached last element + if ( + self.instance && + self.instance.current && + (force === true || self.instance.current.opts.loop || self.instance.currIndex < self.instance.group.length - 1) + ) { + self.timer = setTimeout(function() { + if (self.isActive) { + self.instance.jumpTo((self.instance.currIndex + 1) % self.instance.group.length); + } + }, self.instance.current.opts.slideShow.speed); + } else { + self.stop(); + self.instance.idleSecondsCounter = 0; + self.instance.showControls(); + } + }, + + clear: function() { + var self = this; + + clearTimeout(self.timer); + + self.timer = null; + }, + + start: function() { + var self = this; + var current = self.instance.current; + + if (current) { + self.isActive = true; + + self.$button + .attr("title", current.opts.i18n[current.opts.lang].PLAY_STOP) + .removeClass("fancybox-button--play") + .addClass("fancybox-button--pause"); + + self.set(true); + } + }, + + stop: function() { + var self = this; + var current = self.instance.current; + + self.clear(); + + self.$button + .attr("title", current.opts.i18n[current.opts.lang].PLAY_START) + .removeClass("fancybox-button--pause") + .addClass("fancybox-button--play"); + + self.isActive = false; + }, + + toggle: function() { + var self = this; + + if (self.isActive) { + self.stop(); + } else { + self.start(); + } + } + }); + + $(document).on({ + "onInit.fb": function(e, instance) { + if (instance && !instance.SlideShow) { + instance.SlideShow = new SlideShow(instance); + } + }, + + "beforeShow.fb": function(e, instance, current, firstRun) { + var SlideShow = instance && instance.SlideShow; + + if (firstRun) { + if (SlideShow && current.opts.slideShow.autoStart) { + SlideShow.start(); + } + } else if (SlideShow && SlideShow.isActive) { + SlideShow.clear(); + } + }, + + "afterShow.fb": function(e, instance, current) { + var SlideShow = instance && instance.SlideShow; + + if (SlideShow && SlideShow.isActive) { + SlideShow.set(); + } + }, + + "afterKeydown.fb": function(e, instance, current, keypress, keycode) { + var SlideShow = instance && instance.SlideShow; + + // "P" or Spacebar + if (SlideShow && current.opts.slideShow && (keycode === 80 || keycode === 32) && !$(document.activeElement).is("button,a,input")) { + keypress.preventDefault(); + + SlideShow.toggle(); + } + }, + + "beforeClose.fb onDeactivate.fb": function(e, instance) { + var SlideShow = instance && instance.SlideShow; + + if (SlideShow) { + SlideShow.stop(); + } + } + }); + + // Page Visibility API to pause slideshow when window is not active + $(document).on("visibilitychange", function() { + var instance = $.fancybox.getInstance(); + var SlideShow = instance && instance.SlideShow; + + if (SlideShow && SlideShow.isActive) { + if (document.hidden) { + SlideShow.clear(); + } else { + SlideShow.set(); + } + } + }); +})(document, window.jQuery || jQuery); diff --git a/src/js/thumbs.js b/src/js/thumbs.js index 4d38c1e4..8a2822b4 100644 --- a/src/js/thumbs.js +++ b/src/js/thumbs.js @@ -4,249 +4,256 @@ // Displays thumbnails in a grid // // ========================================================================== -;(function (document, $) { - 'use strict'; - - // Make sure there are default values - $.fancybox.defaults = $.extend(true, { - btnTpl : { - thumbs : - '' - }, - thumbs : { - autoStart : false, // Display thumbnails on opening - hideOnClose : true, // Hide thumbnail grid when closing animation starts - parentEl : '.fancybox-container', // Container is injected into this element - axis : 'y' // Vertical (y) or horizontal (x) scrolling - } - }, $.fancybox.defaults); - - var FancyThumbs = function( instance ) { - this.init( instance ); - }; - - $.extend( FancyThumbs.prototype, { - - $button : null, - $grid : null, - $list : null, - isVisible : false, - isActive : false, - - init : function( instance ) { - var self = this; - - self.instance = instance; - - instance.Thumbs = self; - - // Enable thumbs if at least two group items have thumbnails - var first = instance.group[0], - second = instance.group[1]; - - self.opts = instance.group[ instance.currIndex ].opts.thumbs; - - self.$button = instance.$refs.toolbar.find( '[data-fancybox-thumbs]' ); - - if ( self.opts && first && second && ( - ( first.type == 'image' || first.opts.thumb || first.opts.$thumb ) && - ( second.type == 'image' || second.opts.thumb || second.opts.$thumb ) - )) { - - self.$button.show().on('click', function() { - self.toggle(); - }); - - self.isActive = true; - - } else { - self.$button.hide(); - } - }, - - create : function() { - var self = this, - instance = self.instance, - parentEl = self.opts.parentEl, - list, - src; - - self.$grid = $('
    ').appendTo( instance.$refs.container.find( parentEl ).addBack().filter( parentEl ) ); - - // Build list HTML - list = '
      '; - - $.each(instance.group, function( i, item ) { - src = item.opts.thumb || ( item.opts.$thumb ? item.opts.$thumb.attr( 'src' ) : null ); - - if ( !src && item.type === 'image' ) { - src = item.src; - } - - if ( src && src.length ) { - list += '
    • '; - } - }); - - list += '
    '; - - self.$list = $( list ).appendTo( self.$grid ).on('click', 'li', function() { - instance.jumpTo( $(this).data('index') ); - }); - - self.$list.find( 'img' ).hide().one('load', function() { - var $parent = $(this).parent().removeClass( 'fancybox-thumbs-loading' ), - thumbWidth = $parent.outerWidth(), - thumbHeight = $parent.outerHeight(), - width, - height, - widthRatio, - heightRatio; - - width = this.naturalWidth || this.width; - height = this.naturalHeight || this.height; - - // Calculate thumbnail dimensions; center vertically and horizontally - widthRatio = width / thumbWidth; - heightRatio = height / thumbHeight; - - if (widthRatio >= 1 && heightRatio >= 1) { - if (widthRatio > heightRatio) { - width = width / heightRatio; - height = thumbHeight; - - } else { - width = thumbWidth; - height = height / widthRatio; - } - } - - $(this).css({ - width : Math.floor(width), - height : Math.floor(height), - 'margin-top' : height > thumbHeight ? ( Math.floor(thumbHeight * 0.3 - height * 0.3 ) ) : Math.floor(thumbHeight * 0.5 - height * 0.5 ), - 'margin-left' : Math.floor(thumbWidth * 0.5 - width * 0.5 ) - }).show(); - - }) - .each(function() { - this.src = $( this ).data( 'src' ); - }); - - if ( self.opts.axis === 'x' ) { - self.$list.width( parseInt( self.$grid.css("padding-right") ) + ( instance.group.length * self.$list.children().eq(0).outerWidth(true) ) + 'px' ); - } - }, - - focus : function( duration ) { - var self = this, - $list = self.$list, - thumb, - thumbPos; - - if ( self.instance.current ) { - thumb = $list.children() - .removeClass( 'fancybox-thumbs-active' ) - .filter('[data-index="' + self.instance.current.index + '"]') - .addClass('fancybox-thumbs-active'); - - thumbPos = thumb.position(); - - // Check if need to scroll to make current thumb visible - if ( self.opts.axis === 'y' && ( thumbPos.top < 0 || thumbPos.top > ( $list.height() - thumb.outerHeight() ) ) ) { - $list.stop().animate({ 'scrollTop' : $list.scrollTop() + thumbPos.top }, duration); - - } else if ( self.opts.axis === 'x' && ( - thumbPos.left < $list.parent().scrollLeft() || - thumbPos.left > ( $list.parent().scrollLeft() + ( $list.parent().width() - thumb.outerWidth() ) ) - ) - ) { - $list.parent().stop().animate({ 'scrollLeft' : thumbPos.left }, duration); - } - } - }, - - update : function() { - this.instance.$refs.container.toggleClass( 'fancybox-show-thumbs', this.isVisible ); - - if ( this.isVisible ) { - if ( !this.$grid ) { - this.create(); - } - - this.instance.trigger( 'onThumbsShow' ); - - this.focus( 0 ); - - } else if ( this.$grid ) { - this.instance.trigger( 'onThumbsHide' ); - } - - // Update content position - this.instance.update(); - }, - - hide : function() { - this.isVisible = false; - this.update(); - }, - - show : function() { - this.isVisible = true; - this.update(); - }, - - toggle : function() { - this.isVisible = !this.isVisible; - this.update(); - } - }); - - $(document).on({ - - 'onInit.fb' : function(e, instance) { - var Thumbs; - - if ( instance && !instance.Thumbs ) { - Thumbs = new FancyThumbs( instance ); - - if ( Thumbs.isActive && Thumbs.opts.autoStart === true ) { - Thumbs.show(); - } - } - }, - - 'beforeShow.fb' : function(e, instance, item, firstRun) { - var Thumbs = instance && instance.Thumbs; - - if ( Thumbs && Thumbs.isVisible ) { - Thumbs.focus( firstRun ? 0 : 250 ); - } - }, - - 'afterKeydown.fb' : function(e, instance, current, keypress, keycode) { - var Thumbs = instance && instance.Thumbs; - - // "G" - if ( Thumbs && Thumbs.isActive && keycode === 71 ) { - keypress.preventDefault(); - - Thumbs.toggle(); - } - }, - - 'beforeClose.fb' : function( e, instance ) { - var Thumbs = instance && instance.Thumbs; - - if ( Thumbs && Thumbs.isVisible && Thumbs.opts.hideOnClose !== false ) { - Thumbs.$grid.hide(); - } - } - - }); - -}(document, window.jQuery)); +(function(document, $) { + "use strict"; + + var CLASS = "fancybox-thumbs", + CLASS_ACTIVE = CLASS + "-active", + CLASS_LOAD = CLASS + "-loading"; + + // Make sure there are default values + $.fancybox.defaults = $.extend( + true, + { + btnTpl: { + thumbs: + '" + }, + thumbs: { + autoStart: false, // Display thumbnails on opening + hideOnClose: true, // Hide thumbnail grid when closing animation starts + parentEl: ".fancybox-container", // Container is injected into this element + axis: "y" // Vertical (y) or horizontal (x) scrolling + } + }, + $.fancybox.defaults + ); + + var FancyThumbs = function(instance) { + this.init(instance); + }; + + $.extend(FancyThumbs.prototype, { + $button: null, + $grid: null, + $list: null, + isVisible: false, + isActive: false, + + init: function(instance) { + var self = this, + first, + second; + + self.instance = instance; + + instance.Thumbs = self; + + self.opts = instance.group[instance.currIndex].opts.thumbs; + + // Enable thumbs if at least two group items have thumbnails + first = instance.group[0]; + first = first.opts.thumb || (first.opts.$thumb && first.opts.$thumb.length ? first.opts.$thumb.attr("src") : false); + + if (instance.group.length > 1) { + second = instance.group[1]; + second = second.opts.thumb || (second.opts.$thumb && second.opts.$thumb.length ? second.opts.$thumb.attr("src") : false); + } + + self.$button = instance.$refs.toolbar.find("[data-fancybox-thumbs]"); + + if (self.opts && first && second && first && second) { + self.$button.show().on("click", function() { + self.toggle(); + }); + + self.isActive = true; + } else { + self.$button.hide(); + } + }, + + create: function() { + var self = this, + instance = self.instance, + parentEl = self.opts.parentEl, + list = [], + src; + + if (!self.$grid) { + // Create main element + self.$grid = $('
    ').appendTo( + instance.$refs.container + .find(parentEl) + .addBack() + .filter(parentEl) + ); + + // Add "click" event that performs gallery navigation + self.$grid.on("click", "li", function() { + instance.jumpTo($(this).attr("data-index")); + }); + } + + // Build the list + if (!self.$list) { + self.$list = $("
      ").appendTo(self.$grid); + } + + $.each(instance.group, function(i, item) { + src = item.opts.thumb || (item.opts.$thumb ? item.opts.$thumb.attr("src") : null); + + if (!src && item.type === "image") { + src = item.src; + } + + list.push( + '
    • ' : "") + + ">
    • " + ); + }); + + self.$list[0].innerHTML = list.join(""); + + if (self.opts.axis === "x") { + // Set fixed width for list element to enable horizontal scrolling + self.$list.width( + parseInt(self.$grid.css("padding-right"), 10) + + instance.group.length * + self.$list + .children() + .eq(0) + .outerWidth(true) + ); + } + }, + + focus: function(duration) { + var self = this, + $list = self.$list, + $grid = self.$grid, + thumb, + thumbPos; + + if (!self.instance.current) { + return; + } + + thumb = $list + .children() + .removeClass(CLASS_ACTIVE) + .filter('[data-index="' + self.instance.current.index + '"]') + .addClass(CLASS_ACTIVE); + + thumbPos = thumb.position(); + + // Check if need to scroll to make current thumb visible + if (self.opts.axis === "y" && (thumbPos.top < 0 || thumbPos.top > $list.height() - thumb.outerHeight())) { + $list.stop().animate( + { + scrollTop: $list.scrollTop() + thumbPos.top + }, + duration + ); + } else if ( + self.opts.axis === "x" && + (thumbPos.left < $grid.scrollLeft() || thumbPos.left > $grid.scrollLeft() + ($grid.width() - thumb.outerWidth())) + ) { + $list + .parent() + .stop() + .animate( + { + scrollLeft: thumbPos.left + }, + duration + ); + } + }, + + update: function() { + var that = this; + that.instance.$refs.container.toggleClass("fancybox-show-thumbs", this.isVisible); + + if (that.isVisible) { + if (!that.$grid) { + that.create(); + } + + that.instance.trigger("onThumbsShow"); + + that.focus(0); + } else if (that.$grid) { + that.instance.trigger("onThumbsHide"); + } + + // Update content position + that.instance.update(); + }, + + hide: function() { + this.isVisible = false; + this.update(); + }, + + show: function() { + this.isVisible = true; + this.update(); + }, + + toggle: function() { + this.isVisible = !this.isVisible; + this.update(); + } + }); + + $(document).on({ + "onInit.fb": function(e, instance) { + var Thumbs; + + if (instance && !instance.Thumbs) { + Thumbs = new FancyThumbs(instance); + + if (Thumbs.isActive && Thumbs.opts.autoStart === true) { + Thumbs.show(); + } + } + }, + + "beforeShow.fb": function(e, instance, item, firstRun) { + var Thumbs = instance && instance.Thumbs; + + if (Thumbs && Thumbs.isVisible) { + Thumbs.focus(firstRun ? 0 : 250); + } + }, + + "afterKeydown.fb": function(e, instance, current, keypress, keycode) { + var Thumbs = instance && instance.Thumbs; + + // "G" + if (Thumbs && Thumbs.isActive && keycode === 71) { + keypress.preventDefault(); + + Thumbs.toggle(); + } + }, + + "beforeClose.fb": function(e, instance) { + var Thumbs = instance && instance.Thumbs; + + if (Thumbs && Thumbs.isVisible && Thumbs.opts.hideOnClose !== false) { + Thumbs.$grid.hide(); + } + } + }); +})(document, window.jQuery || jQuery); diff --git a/src/js/wheel.js b/src/js/wheel.js index 199ada58..dab6d107 100644 --- a/src/js/wheel.js +++ b/src/js/wheel.js @@ -1,37 +1,41 @@ -;(function (document, $) { - 'use strict'; - - var prevTime = new Date().getTime(); - - $(document).on({ - 'onInit.fb' : function( e, instance, current ) { - instance.$refs.stage.on('mousewheel DOMMouseScroll wheel MozMousePixelScroll', function(e) { - var current = instance.current, - currTime = new Date().getTime(); - - if ( instance.group.length < 1 || current.opts.wheel === false || ( current.opts.wheel === 'auto' && current.type !== 'image' ) ) { - return; - } - - e.preventDefault(); - e.stopPropagation(); - - if ( current.$slide.hasClass( 'fancybox-animated' ) ) { - return; - } - - e = e.originalEvent || e; - - if ( currTime - prevTime < 250 ) { - return; - } - - prevTime = currTime; - - instance[ ( -e.deltaY || -e.deltaX || e.wheelDelta || -e.detail ) < 0 ? 'next' : 'previous' ](); - - }); - } - }); - -}( document, window.jQuery || jQuery )); +// ========================================================================== +// +// Wheel +// Basic mouse weheel support for gallery navigation +// +// ========================================================================== +(function(document, $) { + "use strict"; + + var prevTime = new Date().getTime(); + + $(document).on({ + "onInit.fb": function(e, instance, current) { + instance.$refs.stage.on("mousewheel DOMMouseScroll wheel MozMousePixelScroll", function(e) { + var current = instance.current, + currTime = new Date().getTime(); + + if (instance.group.length < 2 || current.opts.wheel === false || (current.opts.wheel === "auto" && current.type !== "image")) { + return; + } + + e.preventDefault(); + e.stopPropagation(); + + if (current.$slide.hasClass("fancybox-animated")) { + return; + } + + e = e.originalEvent || e; + + if (currTime - prevTime < 250) { + return; + } + + prevTime = currTime; + + instance[(-e.deltaY || -e.deltaX || e.wheelDelta || -e.detail) < 0 ? "next" : "previous"](); + }); + } + }); +})(document, window.jQuery || jQuery); From 5eee4ec76ffdaa31b7dd59c267f5c5f0a69c0be5 Mon Sep 17 00:00:00 2001 From: Janis Skarnelis Date: Thu, 5 Apr 2018 11:54:45 +0300 Subject: [PATCH 26/56] New option to customize share URL New option "share{ url: function(){} }" to customize URL for share modal. Demo - https://codepen.io/fancyapps/pen/BrOqmQ?editors=1010 --- dist/jquery.fancybox.js | 72 ++++++---- dist/jquery.fancybox.min.js | 6 +- docs/index.html | 272 +++++++++++++++++++++--------------- package.json | 12 +- src/js/media.js | 3 +- src/js/share.js | 63 +++++---- 6 files changed, 246 insertions(+), 182 deletions(-) diff --git a/dist/jquery.fancybox.js b/dist/jquery.fancybox.js index 076c3612..9954d3a6 100644 --- a/dist/jquery.fancybox.js +++ b/dist/jquery.fancybox.js @@ -1,5 +1,5 @@ // ================================================== -// fancyBox v3.3.0 +// fancyBox v3.3.1 // // Licensed GPLv3 for open source use // or fancyBox Commercial License for commercial use @@ -2764,7 +2764,7 @@ }); $.fancybox = { - version: "3.3.0", + version: "3.3.1", defaults: defaults, // Get current instance and execute a command. @@ -3278,8 +3278,9 @@ } $.extend(item, { - src: url, type: type, + src: url, + origSrc: item.src, contentSource: provider, contentType: type === "image" ? "image" : provider == "gmap_place" || provider == "gmap_search" ? "map" : "video" }); @@ -4806,6 +4807,11 @@ "" }, share: { + url: function(instance, item) { + return ( + (!instance.currentHash && !(item.type === "inline" || item.type === "html") ? item.origSrc || item.src : false) || window.location + ); + }, tpl: '
      ' + "

      {{SHARE}}

      " + @@ -4846,38 +4852,44 @@ } $(document).on("click", "[data-fancybox-share]", function() { - var f = $.fancybox.getInstance(), + var instance = $.fancybox.getInstance(), + current = instance.current || null, url, tpl; - if (f) { - url = f.current.opts.hash === false ? f.current.src : window.location; - tpl = f.current.opts.share.tpl - .replace(/\{\{media\}\}/g, f.current.type === "image" ? encodeURIComponent(f.current.src) : "") - .replace(/\{\{url\}\}/g, encodeURIComponent(url)) - .replace(/\{\{url_raw\}\}/g, escapeHtml(url)) - .replace(/\{\{descr\}\}/g, f.$caption ? encodeURIComponent(f.$caption.text()) : ""); - - $.fancybox.open({ - src: f.translate(f, tpl), - type: "html", - opts: { - animationEffect: false, - afterLoad: function(instance, current) { - // Close self if parent instance is closing - f.$refs.container.one("beforeClose.fb", function() { - instance.close(null, 0); - }); + if (!current) { + return; + } - // Opening links in a popup window - current.$content.find(".fancybox-share__links a").click(function() { - window.open(this.href, "Share", "width=550, height=450"); - return false; - }); - } - } - }); + if ($.type(current.opts.share.url) === "function") { + url = current.opts.share.url.apply(current, [instance, current]); } + + tpl = current.opts.share.tpl + .replace(/\{\{media\}\}/g, current.type === "image" ? encodeURIComponent(current.src) : "") + .replace(/\{\{url\}\}/g, encodeURIComponent(url)) + .replace(/\{\{url_raw\}\}/g, escapeHtml(url)) + .replace(/\{\{descr\}\}/g, instance.$caption ? encodeURIComponent(instance.$caption.text()) : ""); + + $.fancybox.open({ + src: instance.translate(instance, tpl), + type: "html", + opts: { + animationEffect: false, + afterLoad: function(shareInstance, shareCurrent) { + // Close self if parent instance is closing + instance.$refs.container.one("beforeClose.fb", function() { + shareInstance.close(null, 0); + }); + + // Opening links in a popup window + shareCurrent.$content.find(".fancybox-share__links a").click(function() { + window.open(this.href, "Share", "width=550, height=450"); + return false; + }); + } + } + }); }); })(document, window.jQuery || jQuery); diff --git a/dist/jquery.fancybox.min.js b/dist/jquery.fancybox.min.js index 8155d58a..5efcced7 100644 --- a/dist/jquery.fancybox.min.js +++ b/dist/jquery.fancybox.min.js @@ -1,5 +1,5 @@ // ================================================== -// fancyBox v3.3.0 +// fancyBox v3.3.1 // // Licensed GPLv3 for open source use // or fancyBox Commercial License for commercial use @@ -8,5 +8,5 @@ // Copyright 2018 fancyApps // // ================================================== -!function(t,e,n,o){"use strict";function i(t,e){var o,i,a=[],s=0;t&&t.isDefaultPrevented()||(t.preventDefault(),e=t&&t.data?t.data.options:e||{},o=e.$target||n(t.currentTarget),i=o.attr("data-fancybox")||"",i?(a=e.selector?n(e.selector):t.data?t.data.items:[],a=a.length?a.filter('[data-fancybox="'+i+'"]'):n('[data-fancybox="'+i+'"]'),s=a.index(o),s<0&&(s=0)):a=[o],n.fancybox.open(a,e,s))}if(t.console=t.console||{info:function(t){}},n){if(n.fn.fancybox)return void console.info("fancyBox already initialized");var a={loop:!1,gutter:50,keyboard:!0,arrows:!0,infobar:!0,smallBtn:"auto",toolbar:"auto",buttons:["zoom","thumbs","close"],idleTime:3,protect:!1,modal:!1,image:{preload:!1},ajax:{settings:{data:{fancybox:!0}}},iframe:{tpl:'',preload:!0,css:{},attr:{scrolling:"auto"}},defaultType:"image",animationEffect:"zoom",animationDuration:366,zoomOpacity:"auto",transitionEffect:"fade",transitionDuration:366,slideClass:"",baseClass:"",baseTpl:'',spinnerTpl:'
      ',errorTpl:'

      {{ERROR}}

      ',btnTpl:{download:'',zoom:'',close:'',smallBtn:'',arrowLeft:'',arrowRight:''},parentEl:"body",autoFocus:!1,backFocus:!0,trapFocus:!0,fullScreen:{autoStart:!1},touch:{vertical:!0,momentum:!0},hash:null,media:{},slideShow:{autoStart:!1,speed:4e3},thumbs:{autoStart:!1,hideOnClose:!0,parentEl:".fancybox-container",axis:"y"},wheel:"auto",onInit:n.noop,beforeLoad:n.noop,afterLoad:n.noop,beforeShow:n.noop,afterShow:n.noop,beforeClose:n.noop,afterClose:n.noop,onActivate:n.noop,onDeactivate:n.noop,clickContent:function(t,e){return"image"===t.type&&"zoom"},clickSlide:"close",clickOutside:"close",dblclickContent:!1,dblclickSlide:!1,dblclickOutside:!1,mobile:{idleTime:!1,clickContent:function(t,e){return"image"===t.type&&"toggleControls"},clickSlide:function(t,e){return"image"===t.type?"toggleControls":"close"},dblclickContent:function(t,e){return"image"===t.type&&"zoom"},dblclickSlide:function(t,e){return"image"===t.type&&"zoom"}},lang:"en",i18n:{en:{CLOSE:"Close",NEXT:"Next",PREV:"Previous",ERROR:"The requested content cannot be loaded.
      Please try again later.",PLAY_START:"Start slideshow",PLAY_STOP:"Pause slideshow",FULL_SCREEN:"Full screen",THUMBS:"Thumbnails",DOWNLOAD:"Download",SHARE:"Share",ZOOM:"Zoom"},de:{CLOSE:"Schliessen",NEXT:"Weiter",PREV:"Zurück",ERROR:"Die angeforderten Daten konnten nicht geladen werden.
      Bitte versuchen Sie es später nochmal.",PLAY_START:"Diaschau starten",PLAY_STOP:"Diaschau beenden",FULL_SCREEN:"Vollbild",THUMBS:"Vorschaubilder",DOWNLOAD:"Herunterladen",SHARE:"Teilen",ZOOM:"Maßstab"}}},s=n(t),r=n(e),c=0,l=function(t){return t&&t.hasOwnProperty&&t instanceof n},d=function(){return t.requestAnimationFrame||t.webkitRequestAnimationFrame||t.mozRequestAnimationFrame||t.oRequestAnimationFrame||function(e){return t.setTimeout(e,1e3/60)}}(),u=function(){var t,n=e.createElement("fakeelement"),i={transition:"transitionend",OTransition:"oTransitionEnd",MozTransition:"transitionend",WebkitTransition:"webkitTransitionEnd"};for(t in i)if(n.style[t]!==o)return i[t];return"transitionend"}(),f=function(t){return t&&t.length&&t[0].offsetHeight},p=function(t,e){var o=n.extend(!0,{},t,e);return n.each(e,function(t,e){n.isArray(e)&&(o[t]=e)}),o},h=function(t,o,i){var a=this;a.opts=p({index:i},n.fancybox.defaults),n.isPlainObject(o)&&(a.opts=p(a.opts,o)),n.fancybox.isMobile&&(a.opts=p(a.opts,a.opts.mobile)),a.id=a.opts.id||++c,a.currIndex=parseInt(a.opts.index,10)||0,a.prevIndex=null,a.prevPos=null,a.currPos=0,a.firstRun=!0,a.group=[],a.slides={},a.addContent(t),a.group.length&&(a.$lastFocus=n(e.activeElement).trigger("blur"),a.init())};n.extend(h.prototype,{init:function(){var i,a,r,c=this,l=c.group[c.currIndex],d=l.opts,u=n.fancybox.scrollbarWidth;"image"===l.type||!/iPad|iPhone|iPod/.test(navigator.userAgent)||t.MSStream||n("body").hasClass("fancybox-iosfix")||n("body").addClass("fancybox-iosfix").css("top",-s.scrollTop()),n.fancybox.getInstance()||(n("body").addClass("fancybox-active"),!n.fancybox.isMobile&&e.body.scrollHeight>t.innerHeight&&(u===o&&(i=n('
      ').appendTo("body"),u=n.fancybox.scrollbarWidth=i[0].offsetWidth-i[0].clientWidth,i.remove()),n("head").append('"),n("body").addClass("compensate-for-scrollbar"))),r="",n.each(d.buttons,function(t,e){r+=d.btnTpl[e]||""}),a=n(c.translate(c,d.baseTpl.replace("{{buttons}}",r).replace("{{arrows}}",d.btnTpl.arrowLeft+d.btnTpl.arrowRight))).attr("id","fancybox-container-"+c.id).addClass("fancybox-is-hidden").addClass(d.baseClass).data("FancyBox",c).appendTo(d.parentEl),c.$refs={container:a},["bg","inner","infobar","toolbar","stage","caption","navigation"].forEach(function(t){c.$refs[t]=a.find(".fancybox-"+t)}),c.trigger("onInit"),c.activate(),c.jumpTo(c.currIndex)},translate:function(t,e){var n=t.opts.i18n[t.opts.lang];return e.replace(/\{\{(\w+)\}\}/g,function(t,e){var i=n[e];return i===o?t:i})},addContent:function(t){var e,i=this,a=n.makeArray(t);n.each(a,function(t,e){var a,s,r,c,l,d={},u={};n.isPlainObject(e)?(d=e,u=e.opts||e):"object"===n.type(e)&&n(e).length?(a=n(e),u=a.data()||{},u=n.extend(!0,{},u,u.options),u.$orig=a,d.src=i.opts.src||u.src||a.attr("href"),d.type||d.src||(d.type="inline",d.src=e)):d={type:"html",src:e+""},d.opts=n.extend(!0,{},i.opts,u),n.isArray(u.buttons)&&(d.opts.buttons=u.buttons),s=d.type||d.opts.type,c=d.src||"",!s&&c&&((r=c.match(/\.(mp4|mov|ogv)((\?|#).*)?$/i))?(s="video",d.opts.videoFormat||(d.opts.videoFormat="video/"+("ogv"===r[1]?"ogg":r[1]))):c.match(/(^data:image\/[a-z0-9+\/=]*,)|(\.(jp(e|g|eg)|gif|png|bmp|webp|svg|ico)((\?|#).*)?$)/i)?s="image":c.match(/\.(pdf)((\?|#).*)?$/i)?s="iframe":"#"===c.charAt(0)&&(s="inline")),s?d.type=s:i.trigger("objectNeedsType",d),d.contentType||(d.contentType=n.inArray(d.type,["html","inline","ajax"])>-1?"html":d.type),d.index=i.group.length,"auto"==d.opts.smallBtn&&(d.opts.smallBtn=n.inArray(d.type,["html","inline","ajax"])>-1),"auto"===d.opts.toolbar&&(d.opts.toolbar=!d.opts.smallBtn),d.opts.$trigger&&d.index===i.opts.index&&(d.opts.$thumb=d.opts.$trigger.find("img:first")),d.opts.$thumb&&d.opts.$thumb.length||!d.opts.$orig||(d.opts.$thumb=d.opts.$orig.find("img:first")),"function"===n.type(d.opts.caption)&&(d.opts.caption=d.opts.caption.apply(e,[i,d])),"function"===n.type(i.opts.caption)&&(d.opts.caption=i.opts.caption.apply(e,[i,d])),d.opts.caption instanceof n||(d.opts.caption=d.opts.caption===o?"":d.opts.caption+""),"ajax"===d.type&&(l=c.split(/\s+/,2),l.length>1&&(d.src=l.shift(),d.opts.filter=l.shift())),d.opts.modal&&(d.opts=n.extend(!0,d.opts,{infobar:0,toolbar:0,smallBtn:0,keyboard:0,slideShow:0,fullScreen:0,thumbs:0,touch:0,clickContent:!1,clickSlide:!1,clickOutside:!1,dblclickContent:!1,dblclickSlide:!1,dblclickOutside:!1})),i.group.push(d)}),Object.keys(i.slides).length&&(i.updateControls(),e=i.Thumbs,e&&e.isActive&&(e.create(),e.focus()))},addEvents:function(){var o=this;o.removeEvents(),o.$refs.container.on("click.fb-close","[data-fancybox-close]",function(t){t.stopPropagation(),t.preventDefault(),o.close(t)}).on("touchstart.fb-prev click.fb-prev","[data-fancybox-prev]",function(t){t.stopPropagation(),t.preventDefault(),o.previous()}).on("touchstart.fb-next click.fb-next","[data-fancybox-next]",function(t){t.stopPropagation(),t.preventDefault(),o.next()}).on("click.fb","[data-fancybox-zoom]",function(t){o[o.isScaledDown()?"scaleToActual":"scaleToFit"]()}),s.on("orientationchange.fb resize.fb",function(t){t&&t.originalEvent&&"resize"===t.originalEvent.type?d(function(){o.update()}):(o.$refs.stage.hide(),setTimeout(function(){o.$refs.stage.show(),o.update()},n.fancybox.isMobile?600:250))}),r.on("focusin.fb",function(t){var o=n.fancybox?n.fancybox.getInstance():null;o.isClosing||!o.current||!o.current.opts.trapFocus||n(t.target).hasClass("fancybox-container")||n(t.target).is(e)||o&&"fixed"!==n(t.target).css("position")&&!o.$refs.container.has(t.target).length&&(t.stopPropagation(),o.focus())}),r.on("keydown.fb",function(t){var e=o.current,i=t.keyCode||t.which;if(e&&e.opts.keyboard&&!(t.ctrlKey||t.altKey||t.shiftKey||n(t.target).is("input")||n(t.target).is("textarea")))return 8===i||27===i?(t.preventDefault(),void o.close(t)):37===i||38===i?(t.preventDefault(),void o.previous()):39===i||40===i?(t.preventDefault(),void o.next()):void o.trigger("afterKeydown",t,i)}),o.group[o.currIndex].opts.idleTime&&(o.idleSecondsCounter=0,r.on("mousemove.fb-idle mouseleave.fb-idle mousedown.fb-idle touchstart.fb-idle touchmove.fb-idle scroll.fb-idle keydown.fb-idle",function(t){o.idleSecondsCounter=0,o.isIdle&&o.showControls(),o.isIdle=!1}),o.idleInterval=t.setInterval(function(){o.idleSecondsCounter++,o.idleSecondsCounter>=o.group[o.currIndex].opts.idleTime&&!o.isDragging&&(o.isIdle=!0,o.idleSecondsCounter=0,o.hideControls())},1e3))},removeEvents:function(){var e=this;s.off("orientationchange.fb resize.fb"),r.off("focusin.fb keydown.fb .fb-idle"),this.$refs.container.off(".fb-close .fb-prev .fb-next"),e.idleInterval&&(t.clearInterval(e.idleInterval),e.idleInterval=null)},previous:function(t){return this.jumpTo(this.currPos-1,t)},next:function(t){return this.jumpTo(this.currPos+1,t)},jumpTo:function(t,e){var i,a,s,r,c,l,d,u=this,p=u.group.length;if(!(u.isDragging||u.isClosing||u.isAnimating&&u.firstRun)){if(t=parseInt(t,10),a=u.current?u.current.opts.loop:u.opts.loop,!a&&(t<0||t>=p))return!1;if(i=u.firstRun=!Object.keys(u.slides).length,!(p<2&&!i&&u.isDragging)){if(r=u.current,u.prevIndex=u.currIndex,u.prevPos=u.currPos,s=u.createSlide(t),p>1&&((a||s.index>0)&&u.createSlide(t-1),(a||s.indexs.pos?"next":"previous"),r.$slide.removeClass("fancybox-slide--complete fancybox-slide--current fancybox-slide--next fancybox-slide--previous"),r.isComplete=!1,e&&(s.isMoved||s.opts.transitionEffect)&&(s.isMoved?r.$slide.addClass(d):(d="fancybox-animated "+d+" fancybox-fx-"+s.opts.transitionEffect,n.fancybox.animate(r.$slide,d,e,function(){r.$slide.removeClass(d).removeAttr("style")}))))}}},createSlide:function(t){var e,o,i=this;return o=t%i.group.length,o=o<0?i.group.length+o:o,!i.slides[t]&&i.group[o]&&(e=n('
      ').appendTo(i.$refs.stage),i.slides[t]=n.extend(!0,{},i.group[o],{pos:t,$slide:e,isLoaded:!1}),i.updateSlide(i.slides[t])),i.slides[t]},scaleToActual:function(t,e,i){var a,s,r,c,l,d=this,u=d.current,f=u.$content,p=n.fancybox.getTranslate(u.$slide).width,h=n.fancybox.getTranslate(u.$slide).height,g=u.width,b=u.height;!d.isAnimating&&f&&"image"==u.type&&u.isLoaded&&!u.hasError&&(n.fancybox.stop(f),d.isAnimating=!0,t=t===o?.5*p:t,e=e===o?.5*h:e,a=n.fancybox.getTranslate(f),a.top-=n.fancybox.getTranslate(u.$slide).top,a.left-=n.fancybox.getTranslate(u.$slide).left,c=g/a.width,l=b/a.height,s=.5*p-.5*g,r=.5*h-.5*b,g>p&&(s=a.left*c-(t*c-t),s>0&&(s=0),sh&&(r=a.top*l-(e*l-e),r>0&&(r=0),rc/a?l=c/a:c>l*a&&(c=l*a)),d.width=c,d.height=l,d)},update:function(){var t=this;n.each(t.slides,function(e,n){t.updateSlide(n)})},updateSlide:function(t,e){var o=this,i=t&&t.$content,a=t.width||t.opts.width,s=t.height||t.opts.height;i&&(a||s||"video"===t.contentType)&&!t.hasError&&(n.fancybox.stop(i),n.fancybox.setTranslate(i,o.getFitPos(t)),t.pos===o.currPos&&(o.isAnimating=!1,o.updateCursor())),t.$slide.trigger("refresh"),o.$refs.toolbar.toggleClass("compensate-for-scrollbar",t.$slide.get(0).scrollHeight>t.$slide.get(0).clientHeight),o.trigger("onUpdate",t)},centerSlide:function(t,e){var i,a,s=this;s.current&&(i=Math.round(t.$slide.width()),a=t.pos-s.current.pos,n.fancybox.animate(t.$slide,{top:0,left:a*i+a*t.opts.gutter,opacity:1},e===o?0:e,null,!1))},updateCursor:function(t,e){var o,i=this,a=i.current,s=i.$refs.container.removeClass("fancybox-is-zoomable fancybox-can-zoomIn fancybox-can-drag fancybox-can-zoomOut");a&&!i.isClosing&&(o=i.isZoomable(),s.toggleClass("fancybox-is-zoomable",o),n("[data-fancybox-zoom]").prop("disabled",!o),o&&("zoom"===a.opts.clickContent||n.isFunction(a.opts.clickContent)&&"zoom"===a.opts.clickContent(a))?i.isScaledDown(t,e)?s.addClass("fancybox-can-zoomIn"):a.opts.touch?s.addClass("fancybox-can-drag"):s.addClass("fancybox-can-zoomOut"):a.opts.touch&&"video"!==a.contentType&&s.addClass("fancybox-can-drag"))},isZoomable:function(){var t,e=this,n=e.current;if(n&&!e.isClosing&&"image"===n.type&&!n.hasError){if(!n.isLoaded)return!0;if(t=e.getFitPos(n),n.width>t.width||n.height>t.height)return!0}return!1},isScaledDown:function(t,e){var i=this,a=!1,s=i.current,r=s.$content;return t!==o&&e!==o?a=t1||Math.abs(t.height()-n.height)>1),n},loadSlide:function(t){var e,o,i,a=this;if(!t.isLoading&&!t.isLoaded){switch(t.isLoading=!0,a.trigger("beforeLoad",t),e=t.type,o=t.$slide,o.off("refresh").trigger("onReset").addClass(t.opts.slideClass),e){case"image":a.setImage(t);break;case"iframe":a.setIframe(t);break;case"html":a.setContent(t,t.src||t.content);break;case"video":a.setContent(t,'
      ").hide().insertAfter(e),e.css("display","inline-block")):t.hasError||("string"===n.type(e)&&(e=n("
      ").append(n.trim(e)).contents(),3===e[0].nodeType&&(e=n("
      ").html(e))),t.opts.filter&&(e=n("
      ").html(e).find(t.opts.filter))),t.$slide.one("onReset",function(){n(this).find("video,audio").trigger("pause"),t.$placeholder&&(t.$placeholder.after(e.hide()).remove(),t.$placeholder=null),t.$smallBtn&&(t.$smallBtn.remove(),t.$smallBtn=null),t.hasError||(n(this).empty(),t.isLoaded=!1)}),n(e).appendTo(t.$slide),n(e).is("video,audio")&&(n(e).addClass("fancybox-video"),n(e).wrap("
      "),t.contentType="video",t.opts.width=t.opts.width||n(e).attr("width"),t.opts.height=t.opts.height||n(e).attr("height")),t.$content=t.$slide.children().filter("div,form,main,video,audio").first().addClass("fancybox-content"),t.$slide.addClass("fancybox-slide--"+t.contentType),this.afterLoad(t))},setError:function(t){t.hasError=!0,t.$slide.trigger("onReset").removeClass("fancybox-slide--"+t.contentType).addClass("fancybox-slide--error"),t.contentType="html",this.setContent(t,this.translate(t,t.opts.errorTpl)),t.pos===this.currPos&&(this.isAnimating=!1)},showLoading:function(t){var e=this;t=t||e.current,t&&!t.$spinner&&(t.$spinner=n(e.translate(e,e.opts.spinnerTpl)).appendTo(t.$slide))},hideLoading:function(t){var e=this;t=t||e.current,t&&t.$spinner&&(t.$spinner.remove(),delete t.$spinner)},afterLoad:function(t){var e=this;e.isClosing||(t.isLoading=!1,t.isLoaded=!0,e.trigger("afterLoad",t),e.hideLoading(t),t.pos===e.currPos&&e.updateCursor(),!t.opts.smallBtn||t.$smallBtn&&t.$smallBtn.length||(t.$smallBtn=n(e.translate(t,t.opts.btnTpl.smallBtn)).prependTo(t.$content)),t.opts.protect&&t.$content&&!t.hasError&&(t.$content.on("contextmenu.fb",function(t){return 2==t.button&&t.preventDefault(),!0}),"image"===t.type&&n('
      ').appendTo(t.$content)),e.revealContent(t))},revealContent:function(t){var e,i,a,s,r=this,c=t.$slide,l=!1,d=!1;return e=t.opts[r.firstRun?"animationEffect":"transitionEffect"],a=t.opts[r.firstRun?"animationDuration":"transitionDuration"],a=parseInt(t.forcedDuration===o?a:t.forcedDuration,10),t.pos===r.currPos&&(t.isComplete?e=!1:r.isAnimating=!0),!t.isMoved&&t.pos===r.currPos&&a||(e=!1),"zoom"===e&&(t.pos===r.currPos&&a&&"image"===t.type&&!t.hasError&&(d=r.getThumbPos(t))?l=r.getFitPos(t):e="fade"),"zoom"===e?(l.scaleX=l.width/d.width,l.scaleY=l.height/d.height,s=t.opts.zoomOpacity,"auto"==s&&(s=Math.abs(t.width/t.height-d.width/d.height)>.1),s&&(d.opacity=.1,l.opacity=1),n.fancybox.setTranslate(t.$content.removeClass("fancybox-is-hidden"),d),f(t.$content),void n.fancybox.animate(t.$content,l,a,function(){r.isAnimating=!1,r.complete()})):(r.updateSlide(t),e?(n.fancybox.stop(c),i="fancybox-animated fancybox-slide--"+(t.pos>=r.prevPos?"next":"previous")+" fancybox-fx-"+e,c.removeAttr("style").removeClass("fancybox-slide--current fancybox-slide--next fancybox-slide--previous").addClass(i),t.$content.removeClass("fancybox-is-hidden"),f(c),void n.fancybox.animate(c,"fancybox-slide--current",a,function(e){c.removeClass(i).removeAttr("style"),t.pos===r.currPos&&r.complete()},!0)):(f(c),t.$content.removeClass("fancybox-is-hidden"),void(t.pos===r.currPos&&r.complete())))},getThumbPos:function(o){var i,a=this,s=!1,r=o.opts.$thumb,c=r?r.offset():0,l=function(e){for(var o,i=e[0],a=i.getBoundingClientRect(),s=[];null!==i.parentElement;)"hidden"!==n(i.parentElement).css("overflow")&&"auto"!==n(i.parentElement).css("overflow")||s.push(i.parentElement.getBoundingClientRect()),i=i.parentElement;return o=s.every(function(t){var e=Math.min(a.right,t.right)-Math.max(a.left,t.left),n=Math.min(a.bottom,t.bottom)-Math.max(a.top,t.top);return e>0&&n>0}),o&&a.bottom>0&&a.right>0&&a.left=t.currPos-1&&o.pos<=t.currPos+1?i[o.pos]=o:o&&(n.fancybox.stop(o.$slide),o.$slide.off().remove())}),t.slides=i),t.isAnimating=!1,t.updateCursor(),t.trigger("afterShow"),o.$slide.find("video,audio").filter(":visible:first").trigger("play"),(n(e.activeElement).is("[disabled]")||o.opts.autoFocus&&"image"!=o.type&&"iframe"!==o.type)&&t.focus())},preload:function(t){var e=this,n=e.slides[e.currPos+1],o=e.slides[e.currPos-1];n&&n.type===t&&e.loadSlide(n),o&&o.type===t&&e.loadSlide(o)},focus:function(){var t,e=this.current;this.isClosing||e&&e.isComplete&&e.$content&&(t=e.$content.find("input[autofocus]:enabled:visible:first"),t.length||(t=e.$content.find("button,:input,[tabindex],a").filter(":enabled:visible:first")),t=t&&t.length?t:e.$content,t.trigger("focus"))},activate:function(){var t=this;n(".fancybox-container").each(function(){var e=n(this).data("FancyBox");e&&e.id!==t.id&&!e.isClosing&&(e.trigger("onDeactivate"),e.removeEvents(),e.isVisible=!1)}),t.isVisible=!0,(t.current||t.isIdle)&&(t.update(),t.updateControls()),t.trigger("onActivate"),t.addEvents()},close:function(t,e){var o,i,a,s,r,c,l,p=this,h=p.current,g=function(){p.cleanUp(t)};return!p.isClosing&&(p.isClosing=!0,p.trigger("beforeClose",t)===!1?(p.isClosing=!1,d(function(){p.update()}),!1):(p.removeEvents(),h.timouts&&clearTimeout(h.timouts),a=h.$content,o=h.opts.animationEffect,i=n.isNumeric(e)?e:o?h.opts.animationDuration:0,h.$slide.off(u).removeClass("fancybox-slide--complete fancybox-slide--next fancybox-slide--previous fancybox-animated"),h.$slide.siblings().trigger("onReset").remove(),i&&p.$refs.container.removeClass("fancybox-is-open").addClass("fancybox-is-closing"),p.hideLoading(h),p.hideControls(),p.updateCursor(),"zoom"!==o||t!==!0&&a&&i&&"image"===h.type&&!h.hasError&&(l=p.getThumbPos(h))||(o="fade"),"zoom"===o?(n.fancybox.stop(a),s=n.fancybox.getTranslate(a),c={top:s.top,left:s.left,scaleX:s.width/l.width,scaleY:s.height/l.height,width:l.width,height:l.height},r=h.opts.zoomOpacity,"auto"==r&&(r=Math.abs(h.width/h.height-l.width/l.height)>.1),r&&(l.opacity=0),n.fancybox.setTranslate(a,c),f(a),n.fancybox.animate(a,l,i,g),!0):(o&&i?t===!0?setTimeout(g,i):n.fancybox.animate(h.$slide.removeClass("fancybox-slide--current"),"fancybox-animated fancybox-slide--previous fancybox-fx-"+o,i,g):g(),!0)))},cleanUp:function(t){var e,o,i=this,a=n("body");i.current.$slide.trigger("onReset"),i.$refs.container.empty().remove(),i.trigger("afterClose",t),i.$lastFocus&&i.current.opts.backFocus&&i.$lastFocus.trigger("focus"),i.current=null,e=n.fancybox.getInstance(),e?e.activate():(a.removeClass("fancybox-active compensate-for-scrollbar"),n("#fancybox-style-noscroll").remove(),a.hasClass("fancybox-iosfix")&&(o=parseInt(a[0].style.top,10),a.css("top","").removeClass("fancybox-iosfix"),s.scrollTop(-o)))},trigger:function(t,e){var o,i=Array.prototype.slice.call(arguments,1),a=this,s=e&&e.opts?e:a.current;return s?i.unshift(s):s=a,i.unshift(a),n.isFunction(s.opts[t])&&(o=s.opts[t].apply(s,i)),o===!1?o:void("afterClose"!==t&&a.$refs?a.$refs.container.trigger(t+".fb",i):r.trigger(t+".fb",i))},updateControls:function(t){var e=this,n=e.current,o=n.index,i=n.opts.caption,a=e.$refs.container,s=e.$refs.caption;n.$slide.trigger("refresh"),e.$caption=i&&i.length?s.html(i):null,e.isHiddenControls||e.isIdle||e.showControls(),a.find("[data-fancybox-count]").html(e.group.length),a.find("[data-fancybox-index]").html(o+1),a.find("[data-fancybox-prev]").toggleClass("disabled",!n.opts.loop&&o<=0),a.find("[data-fancybox-next]").toggleClass("disabled",!n.opts.loop&&o>=e.group.length-1),"image"===n.type?a.find("[data-fancybox-zoom]").show().end().find("[data-fancybox-download]").attr("href",n.opts.image.src||n.src).show():n.opts.toolbar&&a.find("[data-fancybox-download],[data-fancybox-zoom]").hide()},hideControls:function(){this.isHiddenControls=!0,this.$refs.container.removeClass("fancybox-show-infobar fancybox-show-toolbar fancybox-show-caption fancybox-show-nav")},showControls:function(){var t=this,e=t.current?t.current.opts:t.opts,n=t.$refs.container;t.isHiddenControls=!1,t.idleSecondsCounter=0,n.toggleClass("fancybox-show-toolbar",!(!e.toolbar||!e.buttons)).toggleClass("fancybox-show-infobar",!!(e.infobar&&t.group.length>1)).toggleClass("fancybox-show-nav",!!(e.arrows&&t.group.length>1)).toggleClass("fancybox-is-modal",!!e.modal),t.$caption?n.addClass("fancybox-show-caption "):n.removeClass("fancybox-show-caption")},toggleControls:function(){this.isHiddenControls?this.showControls():this.hideControls()}}),n.fancybox={version:"3.3.0",defaults:a,getInstance:function(t){var e=n('.fancybox-container:not(".fancybox-is-closing"):last').data("FancyBox"),o=Array.prototype.slice.call(arguments,1);return e instanceof h&&("string"===n.type(t)?e[t].apply(e,o):"function"===n.type(t)&&t.apply(e,o),e)},open:function(t,e,n){return new h(t,e,n)},close:function(t){var e=this.getInstance();e&&(e.close(),t===!0&&this.close())},destroy:function(){this.close(!0),r.add("body").off("click.fb-start","**")},isMobile:e.createTouch!==o&&/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent),use3d:function(){var n=e.createElement("div");return t.getComputedStyle&&t.getComputedStyle(n)&&t.getComputedStyle(n).getPropertyValue("transform")&&!(e.documentMode&&e.documentMode<11)}(),getTranslate:function(t){var e;return!(!t||!t.length)&&(e=t[0].getBoundingClientRect(),{top:e.top||0,left:e.left||0,width:e.width,height:e.height,opacity:parseFloat(t.css("opacity"))})},setTranslate:function(t,e){var n="",i={};if(t&&e)return e.left===o&&e.top===o||(n=(e.left===o?t.position().left:e.left)+"px, "+(e.top===o?t.position().top:e.top)+"px",n=this.use3d?"translate3d("+n+", 0px)":"translate("+n+")"),e.scaleX!==o&&e.scaleY!==o&&(n=(n.length?n+" ":"")+"scale("+e.scaleX+", "+e.scaleY+")"),n.length&&(i.transform=n),e.opacity!==o&&(i.opacity=e.opacity),e.width!==o&&(i.width=e.width),e.height!==o&&(i.height=e.height),t.css(i)},animate:function(t,e,i,a,s){ -var r=!1;n.isFunction(i)&&(a=i,i=null),n.isPlainObject(e)||t.removeAttr("style"),n.fancybox.stop(t),t.on(u,function(o){(!o||!o.originalEvent||t.is(o.originalEvent.target)&&"z-index"!=o.originalEvent.propertyName)&&(n.fancybox.stop(t),r&&n.fancybox.setTranslate(t,r),n.isPlainObject(e)?s===!1&&t.removeAttr("style"):s!==!0&&t.removeClass(e),n.isFunction(a)&&a(o))}),n.isNumeric(i)&&t.css("transition-duration",i+"ms"),n.isPlainObject(e)?(e.scaleX!==o&&e.scaleY!==o&&(r=n.extend({},e,{width:t.width()*e.scaleX,height:t.height()*e.scaleY,scaleX:1,scaleY:1}),delete e.width,delete e.height,t.parent().hasClass("fancybox-slide--image")&&t.parent().addClass("fancybox-is-scaling")),n.fancybox.setTranslate(t,e)):t.addClass(e),t.data("timer",setTimeout(function(){t.trigger("transitionend")},i+16))},stop:function(t){t&&t.length&&(clearTimeout(t.data("timer")),t.off("transitionend").css("transition-duration",""),t.parent().removeClass("fancybox-is-scaling"))}},n.fn.fancybox=function(t){var e;return t=t||{},e=t.selector||!1,e?n("body").off("click.fb-start",e).on("click.fb-start",e,{options:t},i):this.off("click.fb-start").on("click.fb-start",{items:this,options:t},i),this},r.on("click.fb-start","[data-fancybox]",i),r.on("click.fb-start","[data-trigger]",function(t){i(t,{$target:n('[data-fancybox="'+n(t.currentTarget).attr("data-trigger")+'"]').eq(n(t.currentTarget).attr("data-index")||0),$trigger:n(this)})})}}(window,document,window.jQuery||jQuery),function(t){"use strict";var e=function(e,n,o){if(e)return o=o||"","object"===t.type(o)&&(o=t.param(o,!0)),t.each(n,function(t,n){e=e.replace("$"+t,n||"")}),o.length&&(e+=(e.indexOf("?")>0?"&":"?")+o),e},n={youtube:{matcher:/(youtube\.com|youtu\.be|youtube\-nocookie\.com)\/(watch\?(.*&)?v=|v\/|u\/|embed\/?)?(videoseries\?list=(.*)|[\w-]{11}|\?listType=(.*)&list=(.*))(.*)/i,params:{autoplay:1,autohide:1,fs:1,rel:0,hd:1,wmode:"transparent",enablejsapi:1,html5:1},paramPlace:8,type:"iframe",url:"//www.youtube.com/embed/$4",thumb:"//img.youtube.com/vi/$4/hqdefault.jpg"},vimeo:{matcher:/^.+vimeo.com\/(.*\/)?([\d]+)(.*)?/,params:{autoplay:1,hd:1,show_title:1,show_byline:1,show_portrait:0,fullscreen:1,api:1},paramPlace:3,type:"iframe",url:"//player.vimeo.com/video/$2"},instagram:{matcher:/(instagr\.am|instagram\.com)\/p\/([a-zA-Z0-9_\-]+)\/?/i,type:"image",url:"//$1/p/$2/media/?size=l"},gmap_place:{matcher:/(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(((maps\/(place\/(.*)\/)?\@(.*),(\d+.?\d+?)z))|(\?ll=))(.*)?/i,type:"iframe",url:function(t){return"//maps.google."+t[2]+"/?ll="+(t[9]?t[9]+"&z="+Math.floor(t[10])+(t[12]?t[12].replace(/^\//,"&"):""):t[12]+"").replace(/\?/,"&")+"&output="+(t[12]&&t[12].indexOf("layer=c")>0?"svembed":"embed")}},gmap_search:{matcher:/(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(maps\/search\/)(.*)/i,type:"iframe",url:function(t){return"//maps.google."+t[2]+"/maps?q="+t[5].replace("query=","q=").replace("api=1","")+"&output=embed"}}};t(document).on("objectNeedsType.fb",function(o,i,a){var s,r,c,l,d,u,f,p=a.src||"",h=!1;s=t.extend(!0,{},n,a.opts.media),t.each(s,function(n,o){if(c=p.match(o.matcher)){if(h=o.type,f=n,u={},o.paramPlace&&c[o.paramPlace]){d=c[o.paramPlace],"?"==d[0]&&(d=d.substring(1)),d=d.split("&");for(var i=0;ie.clientHeight,a=("scroll"===o||"auto"===o)&&e.scrollWidth>e.clientWidth;return i||a},l=function(t){for(var e=!1;;){if(e=c(t.get(0)))break;if(t=t.parent(),!t.length||t.hasClass("fancybox-stage")||t.is("body"))break}return e},d=function(t){var e=this;e.instance=t,e.$bg=t.$refs.bg,e.$stage=t.$refs.stage,e.$container=t.$refs.container,e.destroy(),e.$container.on("touchstart.fb.touch mousedown.fb.touch",n.proxy(e,"ontouchstart"))};d.prototype.destroy=function(){this.$container.off(".fb.touch")},d.prototype.ontouchstart=function(o){var i=this,c=n(o.target),d=i.instance,u=d.current,f=u.$content,p="touchstart"==o.type;if(p&&i.$container.off("mousedown.fb.touch"),(!o.originalEvent||2!=o.originalEvent.button)&&c.length&&!r(c)&&!r(c.parent())&&(c.is("img")||!(o.originalEvent.clientX>c[0].clientWidth+c.offset().left))){if(!u||d.isAnimating||d.isClosing)return o.stopPropagation(),void o.preventDefault();if(i.realPoints=i.startPoints=a(o),i.startPoints.length){if(o.stopPropagation(),i.startEvent=o,i.canTap=!0,i.$target=c,i.$content=f,i.opts=u.opts.touch,i.isPanning=!1,i.isSwiping=!1,i.isZooming=!1,i.isScrolling=!1,i.startTime=(new Date).getTime(),i.distanceX=i.distanceY=i.distance=0,i.canvasWidth=Math.round(u.$slide[0].clientWidth),i.canvasHeight=Math.round(u.$slide[0].clientHeight),i.contentLastPos=null,i.contentStartPos=n.fancybox.getTranslate(i.$content)||{top:0,left:0},i.sliderStartPos=i.sliderLastPos||n.fancybox.getTranslate(u.$slide),i.stagePos=n.fancybox.getTranslate(d.$refs.stage),i.sliderStartPos.top-=i.stagePos.top,i.sliderStartPos.left-=i.stagePos.left,i.contentStartPos.top-=i.stagePos.top,i.contentStartPos.left-=i.stagePos.left,n(e).off(".fb.touch").on(p?"touchend.fb.touch touchcancel.fb.touch":"mouseup.fb.touch mouseleave.fb.touch",n.proxy(i,"ontouchend")).on(p?"touchmove.fb.touch":"mousemove.fb.touch",n.proxy(i,"ontouchmove")),n.fancybox.isMobile&&e.addEventListener("scroll",i.onscroll,!0),!i.opts&&!d.canPan()||!c.is(i.$stage)&&!i.$stage.find(c).length)return void(c.is(".fancybox-image")&&o.preventDefault());n.fancybox.isMobile&&(l(c)||l(c.parent()))||o.preventDefault(),(1===i.startPoints.length||u.hasError)&&(i.instance.canPan()?(n.fancybox.stop(i.$content),i.$content.css("transition-duration",""),i.isPanning=!0):i.isSwiping=!0,i.$container.addClass("fancybox-controls--isGrabbing")),2===i.startPoints.length&&"image"===u.type&&(u.isLoaded||u.$ghost)&&(i.canTap=!1,i.isSwiping=!1,i.isPanning=!1,i.isZooming=!0,n.fancybox.stop(i.$content),i.$content.css("transition-duration",""),i.centerPointStartX=.5*(i.startPoints[0].x+i.startPoints[1].x)-n(t).scrollLeft(),i.centerPointStartY=.5*(i.startPoints[0].y+i.startPoints[1].y)-n(t).scrollTop(),i.percentageOfImageAtPinchPointX=(i.centerPointStartX-i.contentStartPos.left)/i.contentStartPos.width,i.percentageOfImageAtPinchPointY=(i.centerPointStartY-i.contentStartPos.top)/i.contentStartPos.height,i.startDistanceBetweenFingers=s(i.startPoints[0],i.startPoints[1]))}}},d.prototype.onscroll=function(t){var n=this;n.isScrolling=!0,e.removeEventListener("scroll",n.onscroll,!0)},d.prototype.ontouchmove=function(t){var e=this,o=n(t.target);return void 0!==t.originalEvent.buttons&&0===t.originalEvent.buttons?void e.ontouchend(t):e.isScrolling||!o.is(e.$stage)&&!e.$stage.find(o).length?void(e.canTap=!1):(e.newPoints=a(t),void((e.opts||e.instance.canPan())&&e.newPoints.length&&e.newPoints.length&&(e.isSwiping&&e.isSwiping===!0||t.preventDefault(),e.distanceX=s(e.newPoints[0],e.startPoints[0],"x"),e.distanceY=s(e.newPoints[0],e.startPoints[0],"y"),e.distance=s(e.newPoints[0],e.startPoints[0]),e.distance>0&&(e.isSwiping?e.onSwipe(t):e.isPanning?e.onPan():e.isZooming&&e.onZoom()))))},d.prototype.onSwipe=function(e){var a,s=this,r=s.isSwiping,c=s.sliderStartPos.left||0;if(r!==!0)"x"==r&&(s.distanceX>0&&(s.instance.group.length<2||0===s.instance.current.index&&!s.instance.current.opts.loop)?c+=Math.pow(s.distanceX,.8):s.distanceX<0&&(s.instance.group.length<2||s.instance.current.index===s.instance.group.length-1&&!s.instance.current.opts.loop)?c-=Math.pow(-s.distanceX,.8):c+=s.distanceX),s.sliderLastPos={top:"x"==r?0:s.sliderStartPos.top+s.distanceY,left:c},s.requestId&&(i(s.requestId),s.requestId=null),s.requestId=o(function(){s.sliderLastPos&&(n.each(s.instance.slides,function(t,e){var o=e.pos-s.instance.currPos;n.fancybox.setTranslate(e.$slide,{top:s.sliderLastPos.top,left:s.sliderLastPos.left+o*s.canvasWidth+o*e.opts.gutter})}),s.$container.addClass("fancybox-is-sliding"))});else if(Math.abs(s.distance)>10){if(s.canTap=!1,s.instance.group.length<2&&s.opts.vertical?s.isSwiping="y":s.instance.isDragging||s.opts.vertical===!1||"auto"===s.opts.vertical&&n(t).width()>800?s.isSwiping="x":(a=Math.abs(180*Math.atan2(s.distanceY,s.distanceX)/Math.PI),s.isSwiping=a>45&&a<135?"y":"x"),s.canTap=!1,"y"===s.isSwiping&&n.fancybox.isMobile&&(l(s.$target)||l(s.$target.parent())))return void(s.isScrolling=!0);s.instance.isDragging=s.isSwiping,s.startPoints=s.newPoints,n.each(s.instance.slides,function(t,e){n.fancybox.stop(e.$slide),e.$slide.css("transition-duration",""),e.inTransition=!1,e.pos===s.instance.current.pos&&(s.sliderStartPos.left=n.fancybox.getTranslate(e.$slide).left-n.fancybox.getTranslate(s.instance.$refs.stage).left)}),s.instance.SlideShow&&s.instance.SlideShow.isActive&&s.instance.SlideShow.stop()}},d.prototype.onPan=function(){var t=this;return s(t.newPoints[0],t.realPoints[0])<(n.fancybox.isMobile?10:5)?void(t.startPoints=t.newPoints):(t.canTap=!1,t.contentLastPos=t.limitMovement(),t.requestId&&(i(t.requestId),t.requestId=null),void(t.requestId=o(function(){n.fancybox.setTranslate(t.$content,t.contentLastPos)})))},d.prototype.limitMovement=function(){var t,e,n,o,i,a,s=this,r=s.canvasWidth,c=s.canvasHeight,l=s.distanceX,d=s.distanceY,u=s.contentStartPos,f=u.left,p=u.top,h=u.width,g=u.height;return i=h>r?f+l:f,a=p+d,t=Math.max(0,.5*r-.5*h),e=Math.max(0,.5*c-.5*g),n=Math.min(r-h,.5*r-.5*h),o=Math.min(c-g,.5*c-.5*g),l>0&&i>t&&(i=t-1+Math.pow(-t+f+l,.8)||0),l<0&&i0&&a>e&&(a=e-1+Math.pow(-e+p+d,.8)||0),d<0&&aa?(t=t>0?0:t,t=ts?(e=e>0?0:e,e=e50?(n.fancybox.animate(o.instance.current.$slide,{top:o.sliderStartPos.top+o.distanceY+150*o.velocityY,opacity:0},200),i=o.instance.close(!0,200)):"x"==t&&o.distanceX>50&&a>1?i=o.instance.previous(o.speedX):"x"==t&&o.distanceX<-50&&a>1&&(i=o.instance.next(o.speedX)),i!==!1||"x"!=t&&"y"!=t||(e||a<2?o.instance.centerSlide(o.instance.current,150):o.instance.jumpTo(o.instance.current.index)),o.$container.removeClass("fancybox-is-sliding")},d.prototype.endPanning=function(){var t,e,o,i=this;i.contentLastPos&&(i.opts.momentum===!1?(t=i.contentLastPos.left,e=i.contentLastPos.top):(t=i.contentLastPos.left+i.velocityX*i.speed,e=i.contentLastPos.top+i.velocityY*i.speed),o=i.limitPosition(t,e,i.contentStartPos.width,i.contentStartPos.height),o.width=i.contentStartPos.width,o.height=i.contentStartPos.height,n.fancybox.animate(i.$content,o,330))},d.prototype.endZooming=function(){var t,e,o,i,a=this,s=a.instance.current,r=a.newWidth,c=a.newHeight;a.contentLastPos&&(t=a.contentLastPos.left,e=a.contentLastPos.top,i={top:e,left:t,width:r,height:c,scaleX:1,scaleY:1},n.fancybox.setTranslate(a.$content,i),rs.width||c>s.height?a.instance.scaleToActual(a.centerPointStartX,a.centerPointStartY,150):(o=a.limitPosition(t,e,r,c),n.fancybox.setTranslate(a.$content,n.fancybox.getTranslate(a.$content)),n.fancybox.animate(a.$content,o,150)))},d.prototype.onTap=function(e){var o,i=this,s=n(e.target),r=i.instance,c=r.current,l=e&&a(e)||i.startPoints,d=l[0]?l[0].x-n(t).scrollLeft()-i.stagePos.left:0,u=l[0]?l[0].y-n(t).scrollTop()-i.stagePos.top:0,f=function(t){var o=c.opts[t];if(n.isFunction(o)&&(o=o.apply(r,[c,e])),o)switch(o){case"close":r.close(i.startEvent);break;case"toggleControls":r.toggleControls(!0);break;case"next":r.next();break;case"nextOrClose":r.group.length>1?r.next():r.close(i.startEvent);break;case"zoom":"image"==c.type&&(c.isLoaded||c.$ghost)&&(r.canPan()?r.scaleToFit():r.isScaledDown()?r.scaleToActual(d,u):r.group.length<2&&r.close(i.startEvent))}};if((!e.originalEvent||2!=e.originalEvent.button)&&(s.is("img")||!(d>s[0].clientWidth+s.offset().left))){if(s.is(".fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-container"))o="Outside";else if(s.is(".fancybox-slide"))o="Slide";else{if(!r.current.$content||!r.current.$content.find(s).addBack().filter(s).length)return;o="Content"}if(i.tapped){if(clearTimeout(i.tapped),i.tapped=null,Math.abs(d-i.tapX)>50||Math.abs(u-i.tapY)>50)return this;f("dblclick"+o)}else i.tapX=d,i.tapY=u,c.opts["dblclick"+o]&&c.opts["dblclick"+o]!==c.opts["click"+o]?i.tapped=setTimeout(function(){i.tapped=null,f("click"+o)},500):f("click"+o);return this}},n(e).on("onActivate.fb",function(t,e){e&&!e.Guestures&&(e.Guestures=new d(e))})}(window,document,window.jQuery||jQuery),function(t,e){"use strict";e.extend(!0,e.fancybox.defaults,{btnTpl:{slideShow:''},slideShow:{autoStart:!1,speed:3e3}});var n=function(t){this.instance=t,this.init()};e.extend(n.prototype,{timer:null,isActive:!1,$button:null,init:function(){var t=this;t.$button=t.instance.$refs.toolbar.find("[data-fancybox-play]").on("click",function(){t.toggle()}),(t.instance.group.length<2||!t.instance.group[t.instance.currIndex].opts.slideShow)&&t.$button.hide()},set:function(t){var e=this;e.instance&&e.instance.current&&(t===!0||e.instance.current.opts.loop||e.instance.currIndex'},fullScreen:{autoStart:!1}}),e(t).on({"onInit.fb":function(t,e){var n;e&&e.group[e.currIndex].opts.fullScreen?(n=e.$refs.container,n.on("click.fb-fullscreen","[data-fancybox-fullscreen]",function(t){t.stopPropagation(),t.preventDefault(),o.toggle()}),e.opts.fullScreen&&e.opts.fullScreen.autoStart===!0&&o.request(),e.FullScreen=o):e&&e.$refs.toolbar.find("[data-fancybox-fullscreen]").hide()},"afterKeydown.fb":function(t,e,n,o,i){e&&e.FullScreen&&70===i&&(o.preventDefault(),e.FullScreen.toggle())},"beforeClose.fb":function(t,e){e&&e.FullScreen&&e.$refs.container.hasClass("fancybox-is-fullscreen")&&o.exit()}}),e(t).on(n.fullscreenchange,function(){var t=o.isFullscreen(),n=e.fancybox.getInstance();n&&(n.current&&"image"===n.current.type&&n.isAnimating&&(n.current.$content.css("transition","none"),n.isAnimating=!1,n.update(!0,!0,0)),n.trigger("onFullscreenChange",t),n.$refs.container.toggleClass("fancybox-is-fullscreen",t))})}(document,window.jQuery||jQuery),function(t,e){"use strict";var n="fancybox-thumbs",o=n+"-active",i=n+"-loading";e.fancybox.defaults=e.extend(!0,{btnTpl:{thumbs:''},thumbs:{autoStart:!1,hideOnClose:!0,parentEl:".fancybox-container",axis:"y"}},e.fancybox.defaults);var a=function(t){this.init(t)};e.extend(a.prototype,{$button:null,$grid:null,$list:null,isVisible:!1,isActive:!1,init:function(t){var e,n,o=this;o.instance=t,t.Thumbs=o,o.opts=t.group[t.currIndex].opts.thumbs,e=t.group[0],e=e.opts.thumb||!(!e.opts.$thumb||!e.opts.$thumb.length)&&e.opts.$thumb.attr("src"),t.group.length>1&&(n=t.group[1],n=n.opts.thumb||!(!n.opts.$thumb||!n.opts.$thumb.length)&&n.opts.$thumb.attr("src")),o.$button=t.$refs.toolbar.find("[data-fancybox-thumbs]"),o.opts&&e&&n&&e&&n?(o.$button.show().on("click",function(){o.toggle()}),o.isActive=!0):o.$button.hide()},create:function(){var t,o=this,a=o.instance,s=o.opts.parentEl,r=[];o.$grid||(o.$grid=e('
      ').appendTo(a.$refs.container.find(s).addBack().filter(s)),o.$grid.on("click","li",function(){a.jumpTo(e(this).attr("data-index"))})),o.$list||(o.$list=e("
        ").appendTo(o.$grid)),e.each(a.group,function(e,n){t=n.opts.thumb||(n.opts.$thumb?n.opts.$thumb.attr("src"):null),t||"image"!==n.type||(t=n.src),r.push('
      • ':"")+">
      • ")}),o.$list[0].innerHTML=r.join(""),"x"===o.opts.axis&&o.$list.width(parseInt(o.$grid.css("padding-right"),10)+a.group.length*o.$list.children().eq(0).outerWidth(!0))},focus:function(t){var e,n,i=this,a=i.$list,s=i.$grid;i.instance.current&&(e=a.children().removeClass(o).filter('[data-index="'+i.instance.current.index+'"]').addClass(o),n=e.position(),"y"===i.opts.axis&&(n.top<0||n.top>a.height()-e.outerHeight())?a.stop().animate({scrollTop:a.scrollTop()+n.top},t):"x"===i.opts.axis&&(n.lefts.scrollLeft()+(s.width()-e.outerWidth()))&&a.parent().stop().animate({scrollLeft:n.left},t))},update:function(){var t=this;t.instance.$refs.container.toggleClass("fancybox-show-thumbs",this.isVisible),t.isVisible?(t.$grid||t.create(),t.instance.trigger("onThumbsShow"),t.focus(0)):t.$grid&&t.instance.trigger("onThumbsHide"),t.instance.update()},hide:function(){this.isVisible=!1,this.update()},show:function(){this.isVisible=!0,this.update()},toggle:function(){this.isVisible=!this.isVisible,this.update()}}),e(t).on({"onInit.fb":function(t,e){var n;e&&!e.Thumbs&&(n=new a(e),n.isActive&&n.opts.autoStart===!0&&n.show())},"beforeShow.fb":function(t,e,n,o){var i=e&&e.Thumbs;i&&i.isVisible&&i.focus(o?0:250)},"afterKeydown.fb":function(t,e,n,o,i){var a=e&&e.Thumbs;a&&a.isActive&&71===i&&(o.preventDefault(),a.toggle())},"beforeClose.fb":function(t,e){var n=e&&e.Thumbs;n&&n.isVisible&&n.opts.hideOnClose!==!1&&n.$grid.hide()}})}(document,window.jQuery||jQuery),function(t,e){"use strict";function n(t){var e={"&":"&","<":"<",">":">",'"':""","'":"'","/":"/","`":"`","=":"="};return String(t).replace(/[&<>"'`=\/]/g,function(t){return e[t]})}e.extend(!0,e.fancybox.defaults,{btnTpl:{share:''},share:{tpl:''}}),e(t).on("click","[data-fancybox-share]",function(){var t,o,i=e.fancybox.getInstance();i&&(t=i.current.opts.hash===!1?i.current.src:window.location,o=i.current.opts.share.tpl.replace(/\{\{media\}\}/g,"image"===i.current.type?encodeURIComponent(i.current.src):"").replace(/\{\{url\}\}/g,encodeURIComponent(t)).replace(/\{\{url_raw\}\}/g,n(t)).replace(/\{\{descr\}\}/g,i.$caption?encodeURIComponent(i.$caption.text()):""),e.fancybox.open({src:i.translate(i,o),type:"html",opts:{animationEffect:!1,afterLoad:function(t,e){i.$refs.container.one("beforeClose.fb",function(){t.close(null,0)}),e.$content.find(".fancybox-share__links a").click(function(){return window.open(this.href,"Share","width=550, height=450"),!1})}}}))})}(document,window.jQuery||jQuery),function(t,e,n){"use strict";function o(){var t=e.location.hash.substr(1),n=t.split("-"),o=n.length>1&&/^\+?\d+$/.test(n[n.length-1])?parseInt(n.pop(-1),10)||1:1,i=n.join("-");return{hash:t,index:o<1?1:o,gallery:i}}function i(t){var e;""!==t.gallery&&(e=n("[data-fancybox='"+n.escapeSelector(t.gallery)+"']").eq(t.index-1).trigger("click.fb-start"))}function a(t){var e,n;return!!t&&(e=t.current?t.current.opts:t.opts,n=e.hash||(e.$orig?e.$orig.data("fancybox"):""),""!==n&&n)}n.escapeSelector||(n.escapeSelector=function(t){var e=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\x80-\uFFFF\w-]/g,n=function(t,e){return e?"\0"===t?"�":t.slice(0,-1)+"\\"+t.charCodeAt(t.length-1).toString(16)+" ":"\\"+t};return(t+"").replace(e,n)}),n(function(){n.fancybox.defaults.hash!==!1&&(n(t).on({"onInit.fb":function(t,e){var n,i;e.group[e.currIndex].opts.hash!==!1&&(n=o(),i=a(e),i&&n.gallery&&i==n.gallery&&(e.currIndex=n.index-1))},"beforeShow.fb":function(n,o,i,s){var r;i&&i.opts.hash!==!1&&(r=a(o),r&&(o.currentHash=r+(o.group.length>1?"-"+(i.index+1):""),e.location.hash!=="#"+o.currentHash&&(o.origHash||(o.origHash=e.location.hash),o.hashTimer&&clearTimeout(o.hashTimer),o.hashTimer=setTimeout(function(){"replaceState"in e.history?(e.history[s?"pushState":"replaceState"]({},t.title,e.location.pathname+e.location.search+"#"+o.currentHash),s&&(o.hasCreatedHistory=!0)):e.location.hash=o.currentHash,o.hashTimer=null},300))))},"beforeClose.fb":function(n,o,i){var s;i.opts.hash!==!1&&(s=a(o),o.currentHash&&o.hasCreatedHistory?e.history.back():o.currentHash&&("replaceState"in e.history?e.history.replaceState({},t.title,e.location.pathname+e.location.search+(o.origHash||"")):e.location.hash=o.origHash),o.currentHash=null,clearTimeout(o.hashTimer))}}),n(e).on("hashchange.fb",function(){var t,e=o();n.each(n(".fancybox-container").get().reverse(),function(e,o){var i=n(o).data("FancyBox");if(i.currentHash)return t=i,!1}),t?!t.currentHash||t.currentHash===e.gallery+"-"+e.index||1===e.index&&t.currentHash==e.gallery||(t.currentHash=null,t.close()):""!==e.gallery&&i(e)}),setTimeout(function(){n.fancybox.getInstance()||i(o())},50))})}(document,window,window.jQuery||jQuery),function(t,e){"use strict";var n=(new Date).getTime();e(t).on({"onInit.fb":function(t,e,o){e.$refs.stage.on("mousewheel DOMMouseScroll wheel MozMousePixelScroll",function(t){var o=e.current,i=(new Date).getTime();e.group.length<2||o.opts.wheel===!1||"auto"===o.opts.wheel&&"image"!==o.type||(t.preventDefault(),t.stopPropagation(),o.$slide.hasClass("fancybox-animated")||(t=t.originalEvent||t,i-n<250||(n=i,e[(-t.deltaY||-t.deltaX||t.wheelDelta||-t.detail)<0?"next":"previous"]())))})}})}(document,window.jQuery||jQuery); \ No newline at end of file +!function(t,e,n,o){"use strict";function i(t,e){var o,i,a=[],s=0;t&&t.isDefaultPrevented()||(t.preventDefault(),e=t&&t.data?t.data.options:e||{},o=e.$target||n(t.currentTarget),i=o.attr("data-fancybox")||"",i?(a=e.selector?n(e.selector):t.data?t.data.items:[],a=a.length?a.filter('[data-fancybox="'+i+'"]'):n('[data-fancybox="'+i+'"]'),s=a.index(o),s<0&&(s=0)):a=[o],n.fancybox.open(a,e,s))}if(t.console=t.console||{info:function(t){}},n){if(n.fn.fancybox)return void console.info("fancyBox already initialized");var a={loop:!1,gutter:50,keyboard:!0,arrows:!0,infobar:!0,smallBtn:"auto",toolbar:"auto",buttons:["zoom","thumbs","close"],idleTime:3,protect:!1,modal:!1,image:{preload:!1},ajax:{settings:{data:{fancybox:!0}}},iframe:{tpl:'',preload:!0,css:{},attr:{scrolling:"auto"}},defaultType:"image",animationEffect:"zoom",animationDuration:366,zoomOpacity:"auto",transitionEffect:"fade",transitionDuration:366,slideClass:"",baseClass:"",baseTpl:'',spinnerTpl:'
        ',errorTpl:'

        {{ERROR}}

        ',btnTpl:{download:'',zoom:'',close:'',smallBtn:'',arrowLeft:'',arrowRight:''},parentEl:"body",autoFocus:!1,backFocus:!0,trapFocus:!0,fullScreen:{autoStart:!1},touch:{vertical:!0,momentum:!0},hash:null,media:{},slideShow:{autoStart:!1,speed:4e3},thumbs:{autoStart:!1,hideOnClose:!0,parentEl:".fancybox-container",axis:"y"},wheel:"auto",onInit:n.noop,beforeLoad:n.noop,afterLoad:n.noop,beforeShow:n.noop,afterShow:n.noop,beforeClose:n.noop,afterClose:n.noop,onActivate:n.noop,onDeactivate:n.noop,clickContent:function(t,e){return"image"===t.type&&"zoom"},clickSlide:"close",clickOutside:"close",dblclickContent:!1,dblclickSlide:!1,dblclickOutside:!1,mobile:{idleTime:!1,clickContent:function(t,e){return"image"===t.type&&"toggleControls"},clickSlide:function(t,e){return"image"===t.type?"toggleControls":"close"},dblclickContent:function(t,e){return"image"===t.type&&"zoom"},dblclickSlide:function(t,e){return"image"===t.type&&"zoom"}},lang:"en",i18n:{en:{CLOSE:"Close",NEXT:"Next",PREV:"Previous",ERROR:"The requested content cannot be loaded.
        Please try again later.",PLAY_START:"Start slideshow",PLAY_STOP:"Pause slideshow",FULL_SCREEN:"Full screen",THUMBS:"Thumbnails",DOWNLOAD:"Download",SHARE:"Share",ZOOM:"Zoom"},de:{CLOSE:"Schliessen",NEXT:"Weiter",PREV:"Zurück",ERROR:"Die angeforderten Daten konnten nicht geladen werden.
        Bitte versuchen Sie es später nochmal.",PLAY_START:"Diaschau starten",PLAY_STOP:"Diaschau beenden",FULL_SCREEN:"Vollbild",THUMBS:"Vorschaubilder",DOWNLOAD:"Herunterladen",SHARE:"Teilen",ZOOM:"Maßstab"}}},s=n(t),r=n(e),c=0,l=function(t){return t&&t.hasOwnProperty&&t instanceof n},d=function(){return t.requestAnimationFrame||t.webkitRequestAnimationFrame||t.mozRequestAnimationFrame||t.oRequestAnimationFrame||function(e){return t.setTimeout(e,1e3/60)}}(),u=function(){var t,n=e.createElement("fakeelement"),i={transition:"transitionend",OTransition:"oTransitionEnd",MozTransition:"transitionend",WebkitTransition:"webkitTransitionEnd"};for(t in i)if(n.style[t]!==o)return i[t];return"transitionend"}(),f=function(t){return t&&t.length&&t[0].offsetHeight},p=function(t,e){var o=n.extend(!0,{},t,e);return n.each(e,function(t,e){n.isArray(e)&&(o[t]=e)}),o},h=function(t,o,i){var a=this;a.opts=p({index:i},n.fancybox.defaults),n.isPlainObject(o)&&(a.opts=p(a.opts,o)),n.fancybox.isMobile&&(a.opts=p(a.opts,a.opts.mobile)),a.id=a.opts.id||++c,a.currIndex=parseInt(a.opts.index,10)||0,a.prevIndex=null,a.prevPos=null,a.currPos=0,a.firstRun=!0,a.group=[],a.slides={},a.addContent(t),a.group.length&&(a.$lastFocus=n(e.activeElement).trigger("blur"),a.init())};n.extend(h.prototype,{init:function(){var i,a,r,c=this,l=c.group[c.currIndex],d=l.opts,u=n.fancybox.scrollbarWidth;"image"===l.type||!/iPad|iPhone|iPod/.test(navigator.userAgent)||t.MSStream||n("body").hasClass("fancybox-iosfix")||n("body").addClass("fancybox-iosfix").css("top",-s.scrollTop()),n.fancybox.getInstance()||(n("body").addClass("fancybox-active"),!n.fancybox.isMobile&&e.body.scrollHeight>t.innerHeight&&(u===o&&(i=n('
        ').appendTo("body"),u=n.fancybox.scrollbarWidth=i[0].offsetWidth-i[0].clientWidth,i.remove()),n("head").append('"),n("body").addClass("compensate-for-scrollbar"))),r="",n.each(d.buttons,function(t,e){r+=d.btnTpl[e]||""}),a=n(c.translate(c,d.baseTpl.replace("{{buttons}}",r).replace("{{arrows}}",d.btnTpl.arrowLeft+d.btnTpl.arrowRight))).attr("id","fancybox-container-"+c.id).addClass("fancybox-is-hidden").addClass(d.baseClass).data("FancyBox",c).appendTo(d.parentEl),c.$refs={container:a},["bg","inner","infobar","toolbar","stage","caption","navigation"].forEach(function(t){c.$refs[t]=a.find(".fancybox-"+t)}),c.trigger("onInit"),c.activate(),c.jumpTo(c.currIndex)},translate:function(t,e){var n=t.opts.i18n[t.opts.lang];return e.replace(/\{\{(\w+)\}\}/g,function(t,e){var i=n[e];return i===o?t:i})},addContent:function(t){var e,i=this,a=n.makeArray(t);n.each(a,function(t,e){var a,s,r,c,l,d={},u={};n.isPlainObject(e)?(d=e,u=e.opts||e):"object"===n.type(e)&&n(e).length?(a=n(e),u=a.data()||{},u=n.extend(!0,{},u,u.options),u.$orig=a,d.src=i.opts.src||u.src||a.attr("href"),d.type||d.src||(d.type="inline",d.src=e)):d={type:"html",src:e+""},d.opts=n.extend(!0,{},i.opts,u),n.isArray(u.buttons)&&(d.opts.buttons=u.buttons),s=d.type||d.opts.type,c=d.src||"",!s&&c&&((r=c.match(/\.(mp4|mov|ogv)((\?|#).*)?$/i))?(s="video",d.opts.videoFormat||(d.opts.videoFormat="video/"+("ogv"===r[1]?"ogg":r[1]))):c.match(/(^data:image\/[a-z0-9+\/=]*,)|(\.(jp(e|g|eg)|gif|png|bmp|webp|svg|ico)((\?|#).*)?$)/i)?s="image":c.match(/\.(pdf)((\?|#).*)?$/i)?s="iframe":"#"===c.charAt(0)&&(s="inline")),s?d.type=s:i.trigger("objectNeedsType",d),d.contentType||(d.contentType=n.inArray(d.type,["html","inline","ajax"])>-1?"html":d.type),d.index=i.group.length,"auto"==d.opts.smallBtn&&(d.opts.smallBtn=n.inArray(d.type,["html","inline","ajax"])>-1),"auto"===d.opts.toolbar&&(d.opts.toolbar=!d.opts.smallBtn),d.opts.$trigger&&d.index===i.opts.index&&(d.opts.$thumb=d.opts.$trigger.find("img:first")),d.opts.$thumb&&d.opts.$thumb.length||!d.opts.$orig||(d.opts.$thumb=d.opts.$orig.find("img:first")),"function"===n.type(d.opts.caption)&&(d.opts.caption=d.opts.caption.apply(e,[i,d])),"function"===n.type(i.opts.caption)&&(d.opts.caption=i.opts.caption.apply(e,[i,d])),d.opts.caption instanceof n||(d.opts.caption=d.opts.caption===o?"":d.opts.caption+""),"ajax"===d.type&&(l=c.split(/\s+/,2),l.length>1&&(d.src=l.shift(),d.opts.filter=l.shift())),d.opts.modal&&(d.opts=n.extend(!0,d.opts,{infobar:0,toolbar:0,smallBtn:0,keyboard:0,slideShow:0,fullScreen:0,thumbs:0,touch:0,clickContent:!1,clickSlide:!1,clickOutside:!1,dblclickContent:!1,dblclickSlide:!1,dblclickOutside:!1})),i.group.push(d)}),Object.keys(i.slides).length&&(i.updateControls(),e=i.Thumbs,e&&e.isActive&&(e.create(),e.focus()))},addEvents:function(){var o=this;o.removeEvents(),o.$refs.container.on("click.fb-close","[data-fancybox-close]",function(t){t.stopPropagation(),t.preventDefault(),o.close(t)}).on("touchstart.fb-prev click.fb-prev","[data-fancybox-prev]",function(t){t.stopPropagation(),t.preventDefault(),o.previous()}).on("touchstart.fb-next click.fb-next","[data-fancybox-next]",function(t){t.stopPropagation(),t.preventDefault(),o.next()}).on("click.fb","[data-fancybox-zoom]",function(t){o[o.isScaledDown()?"scaleToActual":"scaleToFit"]()}),s.on("orientationchange.fb resize.fb",function(t){t&&t.originalEvent&&"resize"===t.originalEvent.type?d(function(){o.update()}):(o.$refs.stage.hide(),setTimeout(function(){o.$refs.stage.show(),o.update()},n.fancybox.isMobile?600:250))}),r.on("focusin.fb",function(t){var o=n.fancybox?n.fancybox.getInstance():null;o.isClosing||!o.current||!o.current.opts.trapFocus||n(t.target).hasClass("fancybox-container")||n(t.target).is(e)||o&&"fixed"!==n(t.target).css("position")&&!o.$refs.container.has(t.target).length&&(t.stopPropagation(),o.focus())}),r.on("keydown.fb",function(t){var e=o.current,i=t.keyCode||t.which;if(e&&e.opts.keyboard&&!(t.ctrlKey||t.altKey||t.shiftKey||n(t.target).is("input")||n(t.target).is("textarea")))return 8===i||27===i?(t.preventDefault(),void o.close(t)):37===i||38===i?(t.preventDefault(),void o.previous()):39===i||40===i?(t.preventDefault(),void o.next()):void o.trigger("afterKeydown",t,i)}),o.group[o.currIndex].opts.idleTime&&(o.idleSecondsCounter=0,r.on("mousemove.fb-idle mouseleave.fb-idle mousedown.fb-idle touchstart.fb-idle touchmove.fb-idle scroll.fb-idle keydown.fb-idle",function(t){o.idleSecondsCounter=0,o.isIdle&&o.showControls(),o.isIdle=!1}),o.idleInterval=t.setInterval(function(){o.idleSecondsCounter++,o.idleSecondsCounter>=o.group[o.currIndex].opts.idleTime&&!o.isDragging&&(o.isIdle=!0,o.idleSecondsCounter=0,o.hideControls())},1e3))},removeEvents:function(){var e=this;s.off("orientationchange.fb resize.fb"),r.off("focusin.fb keydown.fb .fb-idle"),this.$refs.container.off(".fb-close .fb-prev .fb-next"),e.idleInterval&&(t.clearInterval(e.idleInterval),e.idleInterval=null)},previous:function(t){return this.jumpTo(this.currPos-1,t)},next:function(t){return this.jumpTo(this.currPos+1,t)},jumpTo:function(t,e){var i,a,s,r,c,l,d,u=this,p=u.group.length;if(!(u.isDragging||u.isClosing||u.isAnimating&&u.firstRun)){if(t=parseInt(t,10),a=u.current?u.current.opts.loop:u.opts.loop,!a&&(t<0||t>=p))return!1;if(i=u.firstRun=!Object.keys(u.slides).length,!(p<2&&!i&&u.isDragging)){if(r=u.current,u.prevIndex=u.currIndex,u.prevPos=u.currPos,s=u.createSlide(t),p>1&&((a||s.index>0)&&u.createSlide(t-1),(a||s.indexs.pos?"next":"previous"),r.$slide.removeClass("fancybox-slide--complete fancybox-slide--current fancybox-slide--next fancybox-slide--previous"),r.isComplete=!1,e&&(s.isMoved||s.opts.transitionEffect)&&(s.isMoved?r.$slide.addClass(d):(d="fancybox-animated "+d+" fancybox-fx-"+s.opts.transitionEffect,n.fancybox.animate(r.$slide,d,e,function(){r.$slide.removeClass(d).removeAttr("style")}))))}}},createSlide:function(t){var e,o,i=this;return o=t%i.group.length,o=o<0?i.group.length+o:o,!i.slides[t]&&i.group[o]&&(e=n('
        ').appendTo(i.$refs.stage),i.slides[t]=n.extend(!0,{},i.group[o],{pos:t,$slide:e,isLoaded:!1}),i.updateSlide(i.slides[t])),i.slides[t]},scaleToActual:function(t,e,i){var a,s,r,c,l,d=this,u=d.current,f=u.$content,p=n.fancybox.getTranslate(u.$slide).width,h=n.fancybox.getTranslate(u.$slide).height,g=u.width,b=u.height;!d.isAnimating&&f&&"image"==u.type&&u.isLoaded&&!u.hasError&&(n.fancybox.stop(f),d.isAnimating=!0,t=t===o?.5*p:t,e=e===o?.5*h:e,a=n.fancybox.getTranslate(f),a.top-=n.fancybox.getTranslate(u.$slide).top,a.left-=n.fancybox.getTranslate(u.$slide).left,c=g/a.width,l=b/a.height,s=.5*p-.5*g,r=.5*h-.5*b,g>p&&(s=a.left*c-(t*c-t),s>0&&(s=0),sh&&(r=a.top*l-(e*l-e),r>0&&(r=0),rc/a?l=c/a:c>l*a&&(c=l*a)),d.width=c,d.height=l,d)},update:function(){var t=this;n.each(t.slides,function(e,n){t.updateSlide(n)})},updateSlide:function(t,e){var o=this,i=t&&t.$content,a=t.width||t.opts.width,s=t.height||t.opts.height;i&&(a||s||"video"===t.contentType)&&!t.hasError&&(n.fancybox.stop(i),n.fancybox.setTranslate(i,o.getFitPos(t)),t.pos===o.currPos&&(o.isAnimating=!1,o.updateCursor())),t.$slide.trigger("refresh"),o.$refs.toolbar.toggleClass("compensate-for-scrollbar",t.$slide.get(0).scrollHeight>t.$slide.get(0).clientHeight),o.trigger("onUpdate",t)},centerSlide:function(t,e){var i,a,s=this;s.current&&(i=Math.round(t.$slide.width()),a=t.pos-s.current.pos,n.fancybox.animate(t.$slide,{top:0,left:a*i+a*t.opts.gutter,opacity:1},e===o?0:e,null,!1))},updateCursor:function(t,e){var o,i=this,a=i.current,s=i.$refs.container.removeClass("fancybox-is-zoomable fancybox-can-zoomIn fancybox-can-drag fancybox-can-zoomOut");a&&!i.isClosing&&(o=i.isZoomable(),s.toggleClass("fancybox-is-zoomable",o),n("[data-fancybox-zoom]").prop("disabled",!o),o&&("zoom"===a.opts.clickContent||n.isFunction(a.opts.clickContent)&&"zoom"===a.opts.clickContent(a))?i.isScaledDown(t,e)?s.addClass("fancybox-can-zoomIn"):a.opts.touch?s.addClass("fancybox-can-drag"):s.addClass("fancybox-can-zoomOut"):a.opts.touch&&"video"!==a.contentType&&s.addClass("fancybox-can-drag"))},isZoomable:function(){var t,e=this,n=e.current;if(n&&!e.isClosing&&"image"===n.type&&!n.hasError){if(!n.isLoaded)return!0;if(t=e.getFitPos(n),n.width>t.width||n.height>t.height)return!0}return!1},isScaledDown:function(t,e){var i=this,a=!1,s=i.current,r=s.$content;return t!==o&&e!==o?a=t1||Math.abs(t.height()-n.height)>1),n},loadSlide:function(t){var e,o,i,a=this;if(!t.isLoading&&!t.isLoaded){switch(t.isLoading=!0,a.trigger("beforeLoad",t),e=t.type,o=t.$slide,o.off("refresh").trigger("onReset").addClass(t.opts.slideClass),e){case"image":a.setImage(t);break;case"iframe":a.setIframe(t);break;case"html":a.setContent(t,t.src||t.content);break;case"video":a.setContent(t,'