imagelightbox - npm Package Compare versions

Comparing version 1.1.0 to 1.2.0

CHANGELOG.md

@@ -10,2 +10,18 @@ # Changelog
 
+## [1.2.0] - 2022-08-09
+
+### Added
+
+- Added TypeScript type declarations for imagelightbox (@marekdedic)
+- Added unminified output to `dist` in addition to the minified files (@marekdedic)
+
+### Changed
+
+- Clicking in the center of the image navigates to the next one (@marekdedic)
+- The lightbox buttons are plain `<div>`s now (@marekdedic)
+
+### Fixed
+
+- Fixed an issue where rapidly navigating would get the lightbox in a broken state (@marekdedic)
+
 ## [1.1.0] - 2020-06-13
@@ -12,0 +28,0 @@

dist/imagelightbox.min.js

@@ -1,1 +0,1 @@
-!function(M,D,R){"use strict";var z=M("<div/>").attr("class","imagelightbox-loading").append(M("<div/>")),t=M("<button/>",{type:"button",class:"imagelightbox-arrow imagelightbox-arrow-left"}),e=M("<button/>",{type:"button",class:"imagelightbox-arrow imagelightbox-arrow-right"}),X=t.add(e),j=M("<div/>",{class:"imagelightbox-caption",html:"&nbsp;"}),N=M("<button/>",{type:"button",class:"imagelightbox-close"}),V=M("<div/>",{class:"imagelightbox-overlay"}),U=M("<a/>",{href:"#",class:"imagelightbox-navitem"}),K=M("<div/>",{class:"imagelightbox-nav"}),Y=M("<div/>",{class:"imagelightbox-wrapper"}),_=M("body"),o=function(){var t=R.body||R.documentElement;return""===(t=t.style).transition?"":""===t.WebkitTransition?"-webkit-":""===t.MozTransition?"-moz-":""===t.OTransition&&"-o-"},H=!1!==o(),W=function(t,e,i){var n={},a=o();n[a+"transform"]="translateX("+e+") translateY(-50%)",n[a+"transition"]=a+"transform "+i+"s ease-in",t.css(n)},$="ontouchstart"in D,B=D.navigator.pointerEnabled||D.navigator.msPointerEnabled,Q=function(t){if($)return!0;if(!B||void 0===t||void 0===t.pointerType)return!1;if(void 0!==t.MSPOINTER_TYPE_MOUSE){if(t.MSPOINTER_TYPE_MOUSE!==t.pointerType)return!0}else if("mouse"!==t.pointerType)return!0;return!1},A=!!(R.fullscreenEnabled||R.webkitFullscreenEnabled||R.mozFullScreenEnabled||R.msFullscreenEnabled),G=!(!D.history||!history.pushState);M.fn.imageLightbox=function(t){var i="",s=M([]),u=M(),d=M([]),r=-1,g=M(),f=0,h=!1,n=0,p=M.extend({selector:"a[data-imagelightbox]",id:"imagelightbox",allowedTypes:"png|jpg|jpeg|gif",animationSpeed:250,activity:!1,arrows:!1,button:!1,caption:!1,enableKeyboard:!0,history:!1,fullscreen:!1,gutter:10,offsetY:0,navigation:!1,overlay:!1,preloadNext:!0,quitOnEnd:!1,quitOnImgClick:!1,quitOnDocClick:!0,quitOnEscKey:!0},t),b=function(){p.activity&&y(),p.arrows&&X.css("display","block")},a=function(t,e,i){var n=e+"="+i,a="?"+n;if(t){var o=new RegExp("([?&])"+e+"=[^&]*");a=null!==t.match(o)?t.replace(o,"$1"+n):t+"&"+n}return a},o=function(){if(G&&p.history){var t=s[r].dataset.ilb2Id;t||(t=r);var e={imageLightboxIndex:t},i=s[r].dataset.imagelightbox;i&&(e.imageLightboxSet=i);var n=a(R.location.search,"imageLightboxIndex",t);i&&(n=a(n,"imageLightboxSet",i)),D.history.pushState(e,"",R.location.pathname+n)}},e=function(t,e){var i=t;if(i){var n=new RegExp("\\?"+e+"=[^&]*"),a=new RegExp("&"+e+"=[^&]*");i=(i=i.replace(n,"?")).replace(a,"")}return i},l=function(t){var e=new RegExp("[?&]"+t+"(=([^&#]*)|&|#|$)").exec(R.location.search);if(e&&e[2])return decodeURIComponent(e[2].replace(/\+/g," "))},c=function(){if(G&&p.history){var t=l("imageLightboxIndex");if(t){var e=s.filter('[data-ilb2-id="'+t+'"]');0<e.length?r=s.index(e):e=M(s[r=t]);var i=l("imageLightboxSet");!e[0]||i&&i!==e[0].dataset.imagelightbox||T(e,!0)}}},m=function(){if(--r<0){if(!0===p.quitOnEnd)return void L();r=s.length-1}u=s.eq(r),o(),Y.trigger("previous.ilb2",u),O(1)},v=function(){if(++r>=s.length){if(!0===p.quitOnEnd)return void L();r=0}o(),u=s.eq(r),Y.trigger("next.ilb2",u),O(-1)},x=function(){Y.append(z)},y=function(){M(".imagelightbox-loading").remove()},w=function(){Y.append(V)},E=function(){N.appendTo(Y).on("click.ilb7",function(){return L(),!1})},S=function(){j.css("opacity","0"),j.html("&nbsp;"),M(u).data("ilb2-caption")?(j.css("opacity","1"),j.html(M(u).data("ilb2-caption"))):M(u).find("img").attr("alt")&&(j.css("opacity","1"),j.html(M(u).find("img").attr("alt")))},k=function(){if(s.length){for(var t=0;t<s.length;t++)K.append(U.clone());var e=K.children("a");e.eq(s.index(u)).addClass("active"),Y.on("previous.ilb2 next.ilb2",function(){e.removeClass("active").eq(s.index(u)).addClass("active")}),Y.append(K),K.on("click.ilb7 touchend.ilb7",function(){return!1}).on("click.ilb7 touchend.ilb7","a",function(){var t=M(this);if(s.eq(t.index()).attr("href")!==M(".imagelightbox").attr("src")){var e=s.eq(t.index());e.length&&(n=s.index(u),u=e,O(t.index()<n?-1:1))}t.addClass("active").siblings().removeClass("active")})}},I=function(){Y.append(X),X.on("click.ilb7 touchend.ilb7",function(t){return t.stopImmediatePropagation(),t.preventDefault(),M(this).hasClass("imagelightbox-arrow-left")?m():v(),!1})},q=function(){if(!g.length)return!0;var t=p.caption?j.outerHeight():0,r=M(D).width(),l=M(D).height()-t,c=Math.abs(1-p.gutter/100);function e(t,e){if(r<t||l<e){var i=r/l<t/e?t/r:e/l;t/=i,e/=i}var n=e*c,a=t*c,o=(M(D).width()-a)/2;g.css({width:a+"px",height:n+"px",left:o+"px"})}var i=g.data("ilb2VideoId"),n=!1;if(d.each(function(){i===this.i&&(e(this.w,this.h),n=!0)}),!n)if(void 0===g.get(0).videoWidth){var a=new Image;a.src=g.attr("src"),a.onload=function(){e(a.width,a.height)}}else e(g.get(0).videoWidth,g.get(0).videoHeight)},O=function(c){if(h)return!1;if(g.length){var t={opacity:0};H?W(g,100*c-f+"px",p.animationSpeed/1e3):t.left=parseInt(g.css("left"))+100*c+"px",g.animate(t,p.animationSpeed,function(){C()}),f=0}h=!0,p.activity&&x(),p.caption&&S(),setTimeout(function(){var t,e,i=u.attr("href"),n=0,a=0,o=0,r=u.data("ilb2Video");function l(){var t={opacity:1};if(g.appendTo(Y),q(),g.css("opacity",0),H)W(g,-100*c+"px",0),setTimeout(function(){W(g,"0px",p.animationSpeed/1e3)},50);else{var e=parseInt(g.css("left"));t.left=e+"px",g.css("left",e-100*c+"px")}if(g.animate(t,p.animationSpeed,function(){h=!1,b()}),p.preloadNext){var i=s.eq(s.index(u)+1);i.length||(i=s.eq(0)),M("<img />").attr("src",i.attr("href"))}Y.trigger("loaded.ilb2")}r?d.each(function(){this.i===u.data("ilb2VideoId")&&(t=this.l,e=this.e,this.a&&(!1===t&&e.attr("autoplay",this.a),!0===t&&e.get(0).play()))}):e=M("<img id='"+p.id+"' />").attr("src",i),g=e.on("load.ilb7",l).on("error.ilb7",function(){b()}).on("touchstart.ilb7 pointerdown.ilb7 MSPointerDown.ilb7",function(t){if(!Q(t.originalEvent)||p.quitOnImgClick)return!0;H&&(o=parseInt(g.css("left"))),n=t.originalEvent.pageX||t.originalEvent.touches[0].pageX}).on("touchmove.ilb7 pointermove.ilb7 MSPointerMove.ilb7",function(t){if(!B&&"pointermove"===t.type||!Q(t.originalEvent)||p.quitOnImgClick)return!0;t.preventDefault(),a=t.originalEvent.pageX||t.originalEvent.touches[0].pageX,f=n-a,H?W(g,-f+"px",0):g.css("left",o-f+"px")}).on("touchend.ilb7 touchcancel.ilb7 pointerup.ilb7 pointercancel.ilb7 MSPointerUp.ilb7 MSPointerCancel.ilb7",function(t){if(!Q(t.originalEvent)||p.quitOnImgClick)return!0;50<Math.abs(f)?f<0?m():v():H?W(g,"0px",p.animationSpeed/1e3):g.animate({left:o+"px"},p.animationSpeed/2)}),!0===t&&l(),!1===t&&(g=g.on("loadedmetadata.ilb7",l)),r||(g=g.on(B?"pointerup.ilb7 MSPointerUp.ilb7":"click.ilb7",function(t){if(t.preventDefault(),p.quitOnImgClick)return L(),!1;if(Q(t.originalEvent))return!0;var e=(t.pageX||t.originalEvent.pageX)-t.target.offsetLeft;t.target.width/2>e?m():v()}))},p.animationSpeed+100)},C=function(){if(!g.length)return!1;g.remove(),g=M()},T=function(t,e){if(h)return!1;h=!1,u=t,r=s.index(u),e||o(),function(){p.arrows&&I(this),p.navigation&&k(),p.overlay&&w(),p.button&&E(),p.caption&&Y.append(j)}(),_.append(Y).addClass("imagelightbox-open"),Y.trigger("start.ilb2",t),O(0)},L=function(t){if(r=-1,t||function(){if(G&&p.history){var t=e(R.location.search,"imageLightboxIndex");t=e(t,"imageLightboxSet"),D.history.pushState({},"",R.location.pathname+t)}}(),Y.trigger("quit.ilb2"),_.removeClass("imagelightbox-open"),!g.length)return!1;g.animate({opacity:0},p.animationSpeed,function(){C(),h=!1,Y.remove().find("*").remove()})},P=function(e){e.each(function(){s=e.add(M(this))}),e.on("click.ilb7",{set:i},function(t){t.preventDefault(),i=M(t.currentTarget).data("imagelightbox"),e.filter(function(){return M(this).data("imagelightbox")===i}).filter(function(){return function(t){return"a"===M(t).prop("tagName").toLowerCase()&&(new RegExp(".("+p.allowedTypes+")$","i").test(M(t).attr("href"))||M(t).data("ilb2Video"))}(M(this))}).each(function(){s=s.add(M(this))}),s.length<1?L():T(M(this))})},F=function(t){t.each(function(){var t=M(this).data("ilb2Video");if(t){var e=M(this).data("ilb2Id");e||(e="a"+(65536*(1+Math.random())|0).toString(16)),M(this).data("ilb2VideoId",e);var n={e:M("<video id='"+p.id+"' preload='metadata' data-ilb2-video-id='"+e+"'>"),i:e,l:!1,a:void 0,h:void 0,w:void 0};M.each(t,function(t,e){switch(t){case"autoplay":n.a=e;break;case"height":n.h=e;break;case"sources":break;case"width":n.w=e;break;default:n.e=n.e.attr(t,e)}}),t.sources&&M.each(t.sources,function(t,e){var i=M("<source>");M.each(e,function(t,e){i=i.attr(t,e)}),n.e.append(i)}),n.e.on("loadedmetadata.ilb7",function(){n.l=!0}),d=d.add(n)}})};return M(D).on("resize.ilb7",q),G&&p.history&&M(D).on("popstate",function(t){var e=t.originalEvent.state;if(e){var i=e.imageLightboxIndex;if(void 0!==i){var n=s.filter('[data-ilb2-id="'+i+'"]');if(0<n.length)var a=s.index(n);else n=M(s[a=i]);if(n[0]&&(!e.imageLightboxSet||e.imageLightboxSet===n[0].dataset.imagelightbox))if(r<0)T(n,!0);else{var o=1;r<a&&(o=-1),u=n,r=a,O(o)}}else L(!0)}else L(!0)}),M(R).ready(function(){p.quitOnDocClick&&M(R).on($?"touchend.ilb7":"click.ilb7",function(t){g.length&&!M(t.target).is(g)&&(t.preventDefault(),L())}),p.fullscreen&&A&&M(R).on("keydown.ilb7",function(t){if(!g.length)return!0;-1<[9,32,38,40].indexOf(t.which)&&(t.stopPropagation(),t.preventDefault()),-1<[13].indexOf(t.which)&&(t.stopPropagation(),t.preventDefault(),function(){var t=D.document,e=R.getElementById(p.id).parentElement,i=e.requestFullscreen||e.mozRequestFullScreen||e.webkitRequestFullScreen||e.msRequestFullscreen,n=t.exitFullscreen||t.mozCancelFullScreen||t.webkitExitFullscreen||t.msExitFullscreen;t.fullscreenElement||t.mozFullScreenElement||t.webkitFullscreenElement||t.msFullscreenElement?n.call(t):i.call(e)}())}),p.enableKeyboard&&M(R).on("keydown.ilb7",function(t){if(!g.length)return!0;-1<[27].indexOf(t.which)&&p.quitOnEscKey&&(t.stopPropagation(),t.preventDefault(),L()),-1<[37].indexOf(t.which)&&(t.stopPropagation(),t.preventDefault(),m()),-1<[39].indexOf(t.which)&&(t.stopPropagation(),t.preventDefault(),v())})}),M(R).off(".ilb7 .ilb2",p.selector),P(M(this)),c(),F(s),this.addToImageLightbox=function(t){P(t),F(t)},this.openHistory=function(){c()},this.loadPreviousImage=function(){m()},this.loadNextImage=function(){v()},this.quitImageLightbox=function(){return L(),this},this.startImageLightbox=function(t){t?t.trigger("click.ilb7"):M(this).trigger("click.ilb7")},this}}("object"==typeof module&&"object"==typeof module.exports?require("jquery"):jQuery,window,document);
+"use strict";!function(N,V,U){"use strict";var K=N("<div/>").attr("class","imagelightbox-loading").append(N("<div/>")),e=N("<div/>",{class:"imagelightbox-arrow imagelightbox-arrow-left"}),i=N("<div/>",{class:"imagelightbox-arrow imagelightbox-arrow-right"}),Y=e.add(i),_=N("<div/>",{class:"imagelightbox-caption",html:"&nbsp;"}),H=N("<div/>",{class:"imagelightbox-close"}),$=N("<div/>",{class:"imagelightbox-overlay"}),W=N("<a/>",{href:"#",class:"imagelightbox-navitem"}),B=N("<div/>",{class:"imagelightbox-nav"}),Q=N("<div/>",{class:"imagelightbox-wrapper"}),A=N("body"),r=function(){var e=(U.body||U.documentElement).style;if(e.transition==="")return"";if(e.webkitTransition==="")return"-webkit-";if(e.MozTransition==="")return"-moz-";if(e.OTransition==="")return"-o-";return false},G=r()!==false,J=function(e,i,t){var n={},a=r()||"";n[a+"transform"]="translateX("+i+") translateY(-50%)";n[a+"transition"]=a+"transform "+t.toString()+"s ease-in";e.css(n)},Z="ontouchstart"in V,t=V.navigator,ee=t.pointerEnabled||t.msPointerEnabled,ie=function(e){if(Z)return true;if(!ee||typeof e==="undefined"||typeof e.pointerType==="undefined")return false;if(typeof e.MSPOINTER_TYPE_MOUSE!=="undefined"){if(e.MSPOINTER_TYPE_MOUSE!==e.pointerType)return true}else if(e.pointerType!=="mouse")return true;return false},te=!!(U.fullscreenEnabled||U.webkitFullscreenEnabled||U.mozFullScreenEnabled||U.msFullscreenEnabled),ne=!!(V.history&&history.pushState);N.fn.imageLightbox=function(e){var t=0;var u=N();var c=false;var d=0;var g=N();var o=-1;var h=N([]);var n="";var p=[],v=N.extend({selector:"a[data-imagelightbox]",id:"imagelightbox",allowedTypes:"png|jpg|jpeg|gif",animationSpeed:250,activity:false,arrows:false,button:false,caption:false,enableKeyboard:true,history:false,fullscreen:false,gutter:10,offsetY:0,navigation:false,overlay:false,preloadNext:true,quitOnEnd:false,quitOnImgClick:false,quitOnDocClick:true,quitOnEscKey:true},e),a=function(){if(v.arrows)z();if(v.navigation)L();if(v.overlay)k();if(v.button)q();if(v.caption)Q.append(_)},i=function(){if(v.activity)E();if(v.caption)C()},b=function(){if(v.activity)I();if(v.arrows)Y.css("display","block")},r=function(e,i,t){var n=i+"="+t;var a="?"+n;if(e){var r=new RegExp("([?&])"+i+"=[^&]*");if(r.exec(e)!==null)a=e.replace(r,"$1"+n);else a=e+"&"+n}return a},l=function(){if(!ne||!v.history)return;var e=h[o].dataset.ilb2Id;if(!e)e=o.toString();var i={imageLightboxIndex:e,imageLightboxSet:""};var t=h[o].dataset.imagelightbox;if(t)i.imageLightboxSet=t;var n=r(U.location.search,"imageLightboxIndex",e);if(t)n=r(n,"imageLightboxSet",t);V.history.pushState(i,"",U.location.pathname+n)},f=function(e,i){var t=e;if(t){var n=new RegExp("\\?"+i+"=[^&]*");var a=new RegExp("&"+i+"=[^&]*");t=t.replace(n,"?");t=t.replace(a,"")}return t},s=function(){if(!ne||!v.history)return;var e=f(U.location.search,"imageLightboxIndex");e=f(e,"imageLightboxSet");V.history.pushState({},"",U.location.pathname+e)},m=function(e){var i=new RegExp("[?&]"+e+"(=([^&#]*)|&|#|$)").exec(U.location.search);if(!i||!i[2])return undefined;return decodeURIComponent(i[2].replace(/\+/g," "))},x=function(){if(!ne||!v.history)return;var e=m("imageLightboxIndex");if(!e)return;var i=h.filter('[data-ilb2-id="'+e+'"]');if(i.length>0)o=h.index(i);else{o=parseInt(e);i=N(h[o])}var t=m("imageLightboxSet");if(!i[0]||!!t&&t!==i[0].dataset.imagelightbox)return;F(i,true)},y=function(e){var i=e.originalEvent.state;if(!i){M(true);return}var t=i.imageLightboxIndex;if(t===undefined){M(true);return}var n=h.filter('[data-ilb2-id="'+t+'"]');if(n.length===0)return;var a=h.index(n);if(!n[0]||i.imageLightboxSet&&i.imageLightboxSet!==n[0].dataset.imagelightbox)return;if(o<0){F(n,true);return}var r=+1;if(a>o)r=-1;g=n;o=a;O(r)},S=function(){if(c)return;o--;if(o<0)if(v.quitOnEnd===true){M();return}else o=h.length-1;g=h.eq(o);l();Q.trigger("previous.ilb2",g);O(+1)},w=function(){if(c)return;o++;if(o>=h.length)if(v.quitOnEnd===true){M();return}else o=0;l();g=h.eq(o);Q.trigger("next.ilb2",g);O(-1)},E=function(){Q.append(K)},I=function(){N(".imagelightbox-loading").remove()},k=function(){Q.append($)},q=function(){H.appendTo(Q).on("click.ilb7",function(){M();return false})},C=function(){_.css("opacity","0");_.html("&nbsp;");if(N(g).data("ilb2-caption")){_.css("opacity","1");_.html(N(g).data("ilb2-caption"))}else if(N(g).find("img").attr("alt")){_.css("opacity","1");_.html(N(g).find("img").attr("alt"))}},L=function(){if(!h.length)return;for(var e=0;e<h.length;e++)B.append(W.clone());var i=B.children("a");i.eq(h.index(g)).addClass("active");Q.on("previous.ilb2 next.ilb2",function(){i.removeClass("active").eq(h.index(g)).addClass("active")});Q.append(B);B.on("click.ilb7 touchend.ilb7",function(){return false}).on("click.ilb7 touchend.ilb7","a",function(){var e=N(this);if(h.eq(e.index()).attr("href")!==N(".imagelightbox").attr("src")){var i=h.eq(e.index());if(i.length){t=h.index(g);g=i;O(e.index()<t?-1:1)}}e.addClass("active").siblings().removeClass("active")})},z=function(){Q.append(Y);Y.on("click.ilb7 touchend.ilb7",function(e){e.stopImmediatePropagation();e.preventDefault();if(N(this).hasClass("imagelightbox-arrow-left"))S();else w()})},X=function(e){return N(e).prop("tagName").toLowerCase()==="a"&&(new RegExp(".("+v.allowedTypes+")$","i").test(N(e).attr("href"))||N(e).data("ilb2Video"))},T=function(){if(!u.length)return;var e=v.caption?_.outerHeight():0,o=N(V).width(),l=N(V).height()-e,f=Math.abs(1-v.gutter/100);function t(e,i){if(e>o||i>l){var t=e/i>o/l?e/o:i/l;e/=t;i/=t}var n=i*f,a=e*f,r=(N(V).width()-a)/2;u.css({width:a.toString()+"px",height:n.toString()+"px",left:r.toString()+"px"})}var n=u.data("ilb2VideoId");var a=false;N.each(p,function(e,i){if(n===this.i){t(i.w,i.h);a=true}});if(a)return;var i=u.get(0);if(i.videoWidth!==undefined){t(i.videoWidth,i.videoHeight);return}var r=new Image;r.src=u.attr("src");r.onload=function(){t(r.width,r.height)}},O=function(s){if(c)return;if(u.length){var e={opacity:0};if(G)J(u,(100*s-d).toString()+"px",v.animationSpeed/1e3);else e.left=(parseInt(u.css("left"))+100*s).toString()+"px";u.animate(e,v.animationSpeed,function(){P()});d=0}c=true;i();setTimeout(function(){var i=0;var t=0;var n=0;var e=g.attr("href");var a=g.data("ilb2Video");var r=N();var o;if(a)N.each(p,function(e,i){if(i.i===g.data("ilb2VideoId")){o=i.l;r=i.e;if(i.a){if(o===false)r.attr("autoplay",i.a);if(o===true)void r.get(0).play()}}});else r=N("<img id='"+v.id+"' />").attr("src",e);function l(){var e={opacity:1};u.appendTo(Q);T();u.css("opacity",0);if(G){J(u,(-100*s).toString()+"px",0);setTimeout(function(){J(u,"0px",v.animationSpeed/1e3)},50)}else{n=parseInt(u.css("left"));e.left=n.toString()+"px";u.css("left",(n-100*s).toString()+"px")}u.animate(e,v.animationSpeed,function(){c=false;b()});if(v.preloadNext){var i=h.eq(h.index(g)+1);if(!i.length)i=h.eq(0);N("<img />").attr("src",i.attr("href"))}Q.trigger("loaded.ilb2")}function f(e){e.preventDefault();if(v.quitOnImgClick){M();return}if(ie(e.originalEvent))return;var i=(e.pageX||e.originalEvent.pageX)-e.target.offsetLeft;if(e.target.width/3>i)S();else w()}u=r.on("load.ilb7",l).on("error.ilb7",function(){b()}).on("touchstart.ilb7 pointerdown.ilb7 MSPointerDown.ilb7",function(e){if(!ie(e.originalEvent)||v.quitOnImgClick)return;if(G)n=parseInt(u.css("left"));i=e.originalEvent.pageX||e.originalEvent.touches[0].pageX}).on("touchmove.ilb7 pointermove.ilb7 MSPointerMove.ilb7",function(e){if(!ee&&e.type==="pointermove"||!ie(e.originalEvent)||v.quitOnImgClick)return;e.preventDefault();t=e.originalEvent.pageX||e.originalEvent.touches[0].pageX;d=i-t;if(G)J(u,(-d).toString()+"px",0);else u.css("left",(n-d).toString()+"px")}).on("touchend.ilb7 touchcancel.ilb7 pointerup.ilb7 pointercancel.ilb7 MSPointerUp.ilb7 MSPointerCancel.ilb7",function(e){if(!ie(e.originalEvent)||v.quitOnImgClick)return;if(Math.abs(d)>50)if(d<0)S();else w();else if(G)J(u,"0px",v.animationSpeed/1e3);else u.animate({left:n.toString()+"px"},v.animationSpeed/2)});if(o===true)l();if(o===false)u=u.on("loadedmetadata.ilb7",l);if(!a)u=u.on(ee?"pointerup.ilb7 MSPointerUp.ilb7":"click.ilb7",f)},v.animationSpeed+100)},P=function(){if(!u.length)return;u.remove();u=N()},F=function(e,i){if(c)return;c=false;g=e;o=h.index(g);if(!i)l();a();A.append(Q).addClass("imagelightbox-open");Q.trigger("start.ilb2",e);O(0)},M=function(e){if(e===void 0)e=false;o=-1;if(!e)s();Q.trigger("quit.ilb2");A.removeClass("imagelightbox-open");if(!u.length)return;u.animate({opacity:0},v.animationSpeed,function(){P();c=false;Q.remove().find("*").remove()})},D=function(e){e.each(function(){h=e.add(N(this))});e.on("click.ilb7",{set:n},function(e){e.preventDefault();n=N(e.currentTarget).data("imagelightbox");i();if(h.length<1)M();else F(N(this),false)});function i(){e.filter(function(){return N(this).data("imagelightbox")===n}).filter(function(){return X(N(this))}).each(function(){h=h.add(N(this))})}},R=function(e){e.each(function(){var e=N(this).data("ilb2Video");if(e){var i=N(this).data("ilb2Id");if(!i)i="a"+((1+Math.random())*65536|0).toString(16);N(this).data("ilb2VideoId",i);var n={e:N("<video id='"+v.id+"' preload='metadata' data-ilb2-video-id='"+i+"'>"),i:i,l:false,a:undefined,h:undefined,w:undefined};N.each(e,function(e,i){switch(e){case"autoplay":n.a=i;break;case"height":n.h=i;break;case"sources":break;case"width":n.w=i;break;default:n.e=n.e.attr(e,i)}});if(e.sources)N.each(e.sources,function(e,i){var t=N("<source>");N.each(i,function(e,i){t=t.attr(e,i)});n.e.append(t)});n.e.on("loadedmetadata.ilb7",function(){n.l=true});p.push(n)}})};N(V).on("resize.ilb7",T);if(ne&&v.history)N(V).on("popstate",y);N(U).ready(function(){if(v.quitOnDocClick)N(U).on(Z?"touchend.ilb7":"click.ilb7",function(e){if(u.length&&!N(e.target).is(u)){e.preventDefault();M()}});if(v.fullscreen&&te)N(U).on("keydown.ilb7",function(e){if(!u.length)return;if([9,32,38,40].includes(e.which)){e.stopPropagation();e.preventDefault()}if([13].includes(e.which)){e.stopPropagation();e.preventDefault();j()}});if(v.enableKeyboard)N(U).on("keydown.ilb7",function(e){if(!u.length)return;if([27].includes(e.which)&&v.quitOnEscKey){e.stopPropagation();e.preventDefault();M()}if([37].includes(e.which)){e.stopPropagation();e.preventDefault();S()}if([39].includes(e.which)){e.stopPropagation();e.preventDefault();w()}})});function j(){var e=V.document;var i=U.getElementById(v.id).parentElement;var t=i.requestFullscreen||i.mozRequestFullScreen||i.webkitRequestFullScreen||i.msRequestFullscreen;var n=e.exitFullscreen||e.mozCancelFullScreen||e.webkitExitFullscreen||e.msExitFullscreen;if(!e.fullscreenElement&&!e.mozFullScreenElement&&!e.webkitFullscreenElement&&!e.msFullscreenElement)void t.call(i);else void n.call(e)}N(U).off(".ilb7 .ilb2",v.selector);D(N(this));x();R(h);this.addToImageLightbox=function(e){D(e);R(e)};this.openHistory=function(){x()};this.loadPreviousImage=function(){S()};this.loadNextImage=function(){w()};this.quitImageLightbox=function(){M();return this};this.startImageLightbox=function(e){if(e)e.trigger("click.ilb7");else N(this).trigger("click.ilb7")};return this}}("object"==typeof module&&"object"==typeof module.exports?require("jquery"):jQuery,window,document);

docs/javascripts/imagelightbox.js

@@ -0,1 +1,2 @@
+"use strict";
 (function (factory) {
@@ -8,712 +9,709 @@ // http://blog.npmjs.org/post/112712169830/making-your-jquery-plugin-work-better-with-npm
     // jQuery object.
-    factory((typeof module === 'object' && typeof module.exports === 'object') ? require('jquery') : jQuery, window, document );
-}(function ($, window, document) {
-    'use strict';
+    factory(typeof module === "object" && typeof module.exports === "object"
+        ? require("jquery")
+        : jQuery, window, document);
+})(function ($, window, document) {
+    "use strict";
     // COMPONENTS //
-    var $activityObject = $('<div/>')
-            .attr('class','imagelightbox-loading')
-            .append($('<div/>')),
-        $arrowLeftObject = $('<button/>',{
-            type: 'button',
-            class: 'imagelightbox-arrow imagelightbox-arrow-left'}),
-        $arrowRightObject = $('<button/>',{
-            type: 'button',
-            class: 'imagelightbox-arrow imagelightbox-arrow-right'}),
-        $arrows = $arrowLeftObject.add($arrowRightObject),
-        $captionObject = $('<div/>', {
-            class: 'imagelightbox-caption',
-            html: '&nbsp;'
-        }),
-        $buttonObject =  $('<button/>', {
-            type: 'button',
-            class: 'imagelightbox-close'
-        }),
-        $overlayObject = $('<div/>', {
-            class:'imagelightbox-overlay'
-        }),
-        $navItem = $('<a/>', {
-            href:'#',
-            class:'imagelightbox-navitem'
-        }),
-        $navObject = $('<div/>', {
-            class: 'imagelightbox-nav'
-        }),
-        $wrapper = $('<div/>', {
-            class: 'imagelightbox-wrapper'
-        }),
-        $body = $('body');
-
+    var $activityObject = $("<div/>")
+        .attr("class", "imagelightbox-loading")
+        .append($("<div/>")), $arrowLeftObject = $("<div/>", {
+        "class": "imagelightbox-arrow imagelightbox-arrow-left"
+    }), $arrowRightObject = $("<div/>", {
+        "class": "imagelightbox-arrow imagelightbox-arrow-right"
+    }), $arrows = $arrowLeftObject.add($arrowRightObject), $captionObject = $("<div/>", {
+        "class": "imagelightbox-caption",
+        html: "&nbsp;"
+    }), $buttonObject = $("<div/>", {
+        "class": "imagelightbox-close"
+    }), $overlayObject = $("<div/>", {
+        "class": "imagelightbox-overlay"
+    }), $navItem = $("<a/>", {
+        href: "#",
+        "class": "imagelightbox-navitem"
+    }), $navObject = $("<div/>", {
+        "class": "imagelightbox-nav"
+    }), $wrapper = $("<div/>", {
+        "class": "imagelightbox-wrapper"
+    }), $body = $("body");
     var cssTransitionSupport = function () {
-            var s = document.body || document.documentElement;
-            s = s.style;
-            if (s.transition === '') {
-                return '';
+        var s = (document.body || document.documentElement)
+            .style;
+        if (s.transition === "") {
+            return "";
+        }
+        if (s.webkitTransition === "") {
+            return "-webkit-";
+        }
+        if (s.MozTransition === "") {
+            return "-moz-";
+        }
+        if (s.OTransition === "") {
+            return "-o-";
+        }
+        return false;
+    }, hasCssTransitionSupport = cssTransitionSupport() !== false, cssTransitionTranslateX = function (element, positionX, speed) {
+        var options = {}, prefix = cssTransitionSupport() || "";
+        options[prefix + "transform"] =
+            "translateX(" + positionX + ") translateY(-50%)";
+        options[prefix + "transition"] =
+            prefix + "transform " + speed.toString() + "s ease-in";
+        element.css(options);
+    }, hasTouch = "ontouchstart" in window, navigator = window.navigator, hasPointers = navigator.pointerEnabled || navigator.msPointerEnabled, wasTouched = function (event) {
+        if (hasTouch) {
+            return true;
+        }
+        if (!hasPointers ||
+            typeof event === "undefined" ||
+            typeof event.pointerType === "undefined") {
+            return false;
+        }
+        if (typeof event.MSPOINTER_TYPE_MOUSE !==
+            "undefined") {
+            if (event.MSPOINTER_TYPE_MOUSE !==
+                event.pointerType) {
+                return true;
             }
-            if (s.WebkitTransition === '') {
-                return '-webkit-';
+        }
+        else if (event.pointerType !== "mouse") {
+            return true;
+        }
+        return false;
+    }, hasFullscreenSupport = !!(document.fullscreenEnabled ||
+        document.webkitFullscreenEnabled ||
+        document.mozFullScreenEnabled ||
+        document.msFullscreenEnabled), hasHistorySupport = !!(window.history && history.pushState);
+    $.fn.imageLightbox = function (opts) {
+        var currentIndex = 0;
+        var image = $();
+        var inProgress = false;
+        var swipeDiff = 0;
+        var target = $();
+        var targetIndex = -1;
+        var targets = $([]);
+        var targetSet = "";
+        var videos = [], options = $.extend({
+            selector: "a[data-imagelightbox]",
+            id: "imagelightbox",
+            allowedTypes: "png|jpg|jpeg|gif",
+            animationSpeed: 250,
+            activity: false,
+            arrows: false,
+            button: false,
+            caption: false,
+            enableKeyboard: true,
+            history: false,
+            fullscreen: false,
+            gutter: 10,
+            offsetY: 0,
+            navigation: false,
+            overlay: false,
+            preloadNext: true,
+            quitOnEnd: false,
+            quitOnImgClick: false,
+            quitOnDocClick: true,
+            quitOnEscKey: true
+        }, opts), _onStart = function () {
+            if (options.arrows) {
+                arrowsOn();
             }
-            if (s.MozTransition === '') {
-                return '-moz-';
+            if (options.navigation) {
+                navigationOn();
             }
-            if (s.OTransition === '') {
-                return '-o-';
+            if (options.overlay) {
+                overlayOn();
             }
-            return false;
-        },
-
-        hasCssTransitionSupport = cssTransitionSupport() !== false,
-
-        cssTransitionTranslateX = function (element, positionX, speed) {
-            var options = {}, prefix = cssTransitionSupport();
-            options[prefix + 'transform'] = 'translateX(' + positionX + ') translateY(-50%)';
-            options[prefix + 'transition'] = prefix + 'transform ' + speed + 's ease-in';
-            element.css(options);
-        },
-
-        hasTouch = ('ontouchstart' in window),
-        hasPointers = window.navigator.pointerEnabled || window.navigator.msPointerEnabled,
-        wasTouched = function (event) {
-            if (hasTouch) {
-                return true;
+            if (options.button) {
+                closeButtonOn();
             }
-
-            if (!hasPointers || typeof event === 'undefined' || typeof event.pointerType === 'undefined') {
-                return false;
+            if (options.caption) {
+                $wrapper.append($captionObject);
             }
-
-            if (typeof event.MSPOINTER_TYPE_MOUSE !== 'undefined') {
-                if (event.MSPOINTER_TYPE_MOUSE !== event.pointerType) {
-                    return true;
-                }
+        }, _onLoadStart = function () {
+            if (options.activity) {
+                activityIndicatorOn();
             }
-            else if (event.pointerType !== 'mouse') {
-                return true;
+            if (options.caption) {
+                captionReset();
             }
-
-            return false;
-        },
-
-        hasFullscreenSupport = !!(document.fullscreenEnabled ||
-                document.webkitFullscreenEnabled ||
-                document.mozFullScreenEnabled ||
-                document.msFullscreenEnabled),
-        hasHistorySupport = !!(window.history && history.pushState);
-
-    $.fn.imageLightbox = function (opts) {
-        var targetSet = '',
-            targets = $([]),
-            target = $(),
-            videos = $([]),
-            targetIndex = -1,
-            image = $(),
-            swipeDiff = 0,
-            inProgress = false,
-            currentIndex = 0,
-            options = $.extend({
-                selector:       'a[data-imagelightbox]',
-                id:             'imagelightbox',
-                allowedTypes:   'png|jpg|jpeg|gif',
-                animationSpeed: 250,
-                activity:       false,
-                arrows:         false,
-                button:         false,
-                caption:        false,
-                enableKeyboard: true,
-                history:        false,
-                fullscreen:     false,
-                gutter:         10,     // percentage of client height
-                offsetY:        0,      // percentage of gutter
-                navigation:     false,
-                overlay:        false,
-                preloadNext:    true,
-                quitOnEnd:      false,
-                quitOnImgClick: false,
-                quitOnDocClick: true,
-                quitOnEscKey:   true
-            }, opts),
-
-            _onStart = function () {
-                if (options.arrows) {
-                    arrowsOn(this);
+        }, _onLoadEnd = function () {
+            if (options.activity) {
+                activityIndicatorOff();
+            }
+            if (options.arrows) {
+                $arrows.css("display", "block");
+            }
+        }, _addQueryField = function (query, key, value) {
+            var newField = key + "=" + value;
+            var newQuery = "?" + newField;
+            if (query) {
+                var keyRegex = new RegExp("([?&])" + key + "=[^&]*");
+                if (keyRegex.exec(query) !== null) {
+                    newQuery = query.replace(keyRegex, "$1" + newField);
                 }
-                if (options.navigation) {
-                    navigationOn();
+                else {
+                    newQuery = query + "&" + newField;
                 }
-                if (options.overlay) {
-                    overlayOn();
-                }
-                if (options.button) {
-                    closeButtonOn();
-                }
-                if (options.caption) {
-                    $wrapper.append($captionObject);
-                }
-            },
-            _onLoadStart = function () {
-                if (options.activity) {
-                    activityIndicatorOn();
-                }
-                if (options.caption) {
-                    captionReset();
-                }
-            },
-            _onLoadEnd = function () {
-                if (options.activity) {
-                    activityIndicatorOff();
-                }
-                if (options.arrows) {
-                    $arrows.css('display', 'block');
-                }
-            },
-            _addQueryField = function (query, key, value) {
-                var newField = key + '=' + value;
-                var newQuery = '?' + newField;
-
-                if (query) {
-                    var keyRegex = new RegExp('([?&])' + key + '=[^&]*');
-                    if (query.match(keyRegex) !== null) {
-                        newQuery = query.replace(keyRegex, '$1' + newField);
-                    } else {
-                        newQuery = query + '&' + newField;
-                    }
-                }
-                return newQuery;
-            },
-            _pushToHistory = function () {
-                if(!hasHistorySupport || !options.history) {
+            }
+            return newQuery;
+        }, _pushToHistory = function () {
+            if (!hasHistorySupport || !options.history) {
+                return;
+            }
+            var newIndex = targets[targetIndex].dataset.ilb2Id;
+            if (!newIndex) {
+                newIndex = targetIndex.toString();
+            }
+            var newState = {
+                imageLightboxIndex: newIndex,
+                imageLightboxSet: ""
+            };
+            var set = targets[targetIndex].dataset.imagelightbox;
+            if (set) {
+                newState.imageLightboxSet = set;
+            }
+            var newQuery = _addQueryField(document.location.search, "imageLightboxIndex", newIndex);
+            if (set) {
+                newQuery = _addQueryField(newQuery, "imageLightboxSet", set);
+            }
+            window.history.pushState(newState, "", document.location.pathname + newQuery);
+        }, _removeQueryField = function (query, key) {
+            var newQuery = query;
+            if (newQuery) {
+                var keyRegex1 = new RegExp("\\?" + key + "=[^&]*");
+                var keyRegex2 = new RegExp("&" + key + "=[^&]*");
+                newQuery = newQuery.replace(keyRegex1, "?");
+                newQuery = newQuery.replace(keyRegex2, "");
+            }
+            return newQuery;
+        }, _pushQuitToHistory = function () {
+            if (!hasHistorySupport || !options.history) {
+                return;
+            }
+            var newQuery = _removeQueryField(document.location.search, "imageLightboxIndex");
+            newQuery = _removeQueryField(newQuery, "imageLightboxSet");
+            window.history.pushState({}, "", document.location.pathname + newQuery);
+        }, _getQueryField = function (key) {
+            var keyValuePair = new RegExp("[?&]" + key + "(=([^&#]*)|&|#|$)").exec(document.location.search);
+            if (!keyValuePair || !keyValuePair[2]) {
+                return undefined;
+            }
+            return decodeURIComponent(keyValuePair[2].replace(/\+/g, " "));
+        }, _openHistory = function () {
+            if (!hasHistorySupport || !options.history) {
+                return;
+            }
+            var id = _getQueryField("imageLightboxIndex");
+            if (!id) {
+                return;
+            }
+            var element = targets.filter('[data-ilb2-id="' + id + '"]');
+            if (element.length > 0) {
+                targetIndex = targets.index(element);
+            }
+            else {
+                targetIndex = parseInt(id);
+                element = $(targets[targetIndex]);
+            }
+            var set = _getQueryField("imageLightboxSet");
+            if (!element[0] ||
+                (!!set && set !== element[0].dataset.imagelightbox)) {
+                return;
+            }
+            _openImageLightbox(element, true);
+        }, _popHistory = function (event) {
+            var newState = event.originalEvent
+                .state;
+            if (!newState) {
+                _quitImageLightbox(true);
+                return;
+            }
+            var newId = newState.imageLightboxIndex;
+            if (newId === undefined) {
+                _quitImageLightbox(true);
+                return;
+            }
+            var element = targets.filter('[data-ilb2-id="' + newId + '"]');
+            if (element.length === 0) {
+                return;
+            }
+            var newIndex = targets.index(element);
+            if (!element[0] ||
+                (newState.imageLightboxSet &&
+                    newState.imageLightboxSet !==
+                        element[0].dataset.imagelightbox)) {
+                return;
+            }
+            if (targetIndex < 0) {
+                _openImageLightbox(element, true);
+                return;
+            }
+            var direction = +1;
+            if (newIndex > targetIndex) {
+                direction = -1;
+            }
+            target = element;
+            targetIndex = newIndex;
+            _loadImage(direction);
+        }, _previousTarget = function () {
+            if (inProgress) {
+                return;
+            }
+            targetIndex--;
+            if (targetIndex < 0) {
+                if (options.quitOnEnd === true) {
+                    _quitImageLightbox();
                     return;
                 }
-                var newIndex = targets[targetIndex].dataset.ilb2Id;
-                if(!newIndex) {
-                    newIndex = targetIndex;
+                else {
+                    targetIndex = targets.length - 1;
                 }
-                var newState = {imageLightboxIndex: newIndex};
-                var set = targets[targetIndex].dataset.imagelightbox;
-                if(set) {
-                    newState.imageLightboxSet = set;
-                }
-                var newQuery = _addQueryField(document.location.search, 'imageLightboxIndex', newIndex);
-                if(set) {
-                    newQuery = _addQueryField(newQuery, 'imageLightboxSet', set);
-                }
-                window.history.pushState(newState, '', document.location.pathname + newQuery);
-            },
-            _removeQueryField = function(query, key) {
-                var newQuery = query;
-                if (newQuery) {
-                    var keyRegex1 = new RegExp('\\?' + key + '=[^&]*');
-                    var keyRegex2 = new RegExp('&' + key + '=[^&]*');
-                    newQuery = newQuery.replace(keyRegex1, '?');
-                    newQuery = newQuery.replace(keyRegex2, '');
-                }
-                return newQuery;
-            },
-            _pushQuitToHistory = function () {
-                if(!hasHistorySupport || !options.history) {
+            }
+            target = targets.eq(targetIndex);
+            _pushToHistory();
+            $wrapper.trigger("previous.ilb2", target);
+            _loadImage(+1);
+        }, _nextTarget = function () {
+            if (inProgress) {
+                return;
+            }
+            targetIndex++;
+            if (targetIndex >= targets.length) {
+                if (options.quitOnEnd === true) {
+                    _quitImageLightbox();
                     return;
                 }
-                var newQuery = _removeQueryField(document.location.search, 'imageLightboxIndex');
-                newQuery = _removeQueryField(newQuery, 'imageLightboxSet');
-                window.history.pushState({}, '', document.location.pathname + newQuery);
-            },
-            _getQueryField = function(key) {
-                var keyValuePair = new RegExp('[?&]' + key + '(=([^&#]*)|&|#|$)').exec(document.location.search);
-                if(!keyValuePair || !keyValuePair[2]) {
-                    return undefined;
+                else {
+                    targetIndex = 0;
                 }
-                return decodeURIComponent(keyValuePair[2].replace(/\+/g, ' '));
-            },
-            _openHistory = function () {
-                if(!hasHistorySupport || !options.history) {
-                    return;
+            }
+            _pushToHistory();
+            target = targets.eq(targetIndex);
+            $wrapper.trigger("next.ilb2", target);
+            _loadImage(-1);
+        }, activityIndicatorOn = function () {
+            $wrapper.append($activityObject);
+        }, activityIndicatorOff = function () {
+            $(".imagelightbox-loading").remove();
+        }, overlayOn = function () {
+            $wrapper.append($overlayObject);
+        }, closeButtonOn = function () {
+            $buttonObject
+                .appendTo($wrapper)
+                .on("click.ilb7", function () {
+                _quitImageLightbox();
+                return false;
+            });
+        }, captionReset = function () {
+            $captionObject.css("opacity", "0");
+            $captionObject.html("&nbsp;");
+            if ($(target).data("ilb2-caption")) {
+                $captionObject.css("opacity", "1");
+                $captionObject.html($(target).data("ilb2-caption"));
+            }
+            else if ($(target).find("img").attr("alt")) {
+                $captionObject.css("opacity", "1");
+                $captionObject.html($(target).find("img").attr("alt"));
+            }
+        }, navigationOn = function () {
+            if (!targets.length) {
+                return;
+            }
+            for (var i = 0; i < targets.length; i++) {
+                $navObject.append($navItem.clone());
+            }
+            var $navItems = $navObject.children("a");
+            $navItems.eq(targets.index(target)).addClass("active");
+            $wrapper.on("previous.ilb2 next.ilb2", function () {
+                $navItems
+                    .removeClass("active")
+                    .eq(targets.index(target))
+                    .addClass("active");
+            });
+            $wrapper.append($navObject);
+            $navObject
+                .on("click.ilb7 touchend.ilb7", function () {
+                return false;
+            })
+                .on("click.ilb7 touchend.ilb7", "a", function () {
+                var $this = $(this);
+                if (targets.eq($this.index()).attr("href") !==
+                    $(".imagelightbox").attr("src")) {
+                    var tmpTarget = targets.eq($this.index());
+                    if (tmpTarget.length) {
+                        currentIndex = targets.index(target);
+                        target = tmpTarget;
+                        _loadImage($this.index() < currentIndex ? -1 : 1);
+                    }
                 }
-                var id = _getQueryField('imageLightboxIndex');
-                if(!id) {
-                    return;
+                $this
+                    .addClass("active")
+                    .siblings()
+                    .removeClass("active");
+            });
+        }, arrowsOn = function () {
+            $wrapper.append($arrows);
+            $arrows.on("click.ilb7 touchend.ilb7", function (e) {
+                e.stopImmediatePropagation();
+                e.preventDefault();
+                if ($(this).hasClass("imagelightbox-arrow-left")) {
+                    _previousTarget();
                 }
-                var element = targets.filter('[data-ilb2-id="' + id + '"]');
-                if(element.length > 0) {
-                    targetIndex = targets.index(element);
-                } else {
-                    targetIndex = id;
-                    element = $(targets[targetIndex]);
+                else {
+                    _nextTarget();
                 }
-                var set = _getQueryField('imageLightboxSet');
-                if(!element[0] || (!!set && set !== element[0].dataset.imagelightbox)) {
-                    return;
+            });
+        }, isTargetValid = function (element) {
+            // eslint-disable-next-line
+            return $(element).prop('tagName').toLowerCase() === 'a' && ((new RegExp('\.(' + options.allowedTypes + ')$', 'i')).test($(element).attr('href')) || $(element).data('ilb2Video'));
+        }, _setImage = function () {
+            if (!image.length) {
+                return;
+            }
+            var captionHeight = options.caption
+                ? $captionObject.outerHeight()
+                : 0, screenWidth = $(window).width(), screenHeight = $(window).height() - captionHeight, gutterFactor = Math.abs(1 - options.gutter / 100);
+            function setSizes(imageWidth, imageHeight) {
+                if (imageWidth > screenWidth ||
+                    imageHeight > screenHeight) {
+                    var ratio = imageWidth / imageHeight >
+                        screenWidth / screenHeight
+                        ? imageWidth / screenWidth
+                        : imageHeight / screenHeight;
+                    imageWidth /= ratio;
+                    imageHeight /= ratio;
                 }
-                _openImageLightbox(element, true);
-            },
-            _popHistory = function (event) {
-                var newState = event.originalEvent.state;
-                if(!newState) {
-                    _quitImageLightbox(true);
-                    return;
+                var cssHeight = imageHeight * gutterFactor, cssWidth = imageWidth * gutterFactor, cssLeft = ($(window).width() - cssWidth) / 2;
+                image.css({
+                    width: cssWidth.toString() + "px",
+                    height: cssHeight.toString() + "px",
+                    left: cssLeft.toString() + "px"
+                });
+            }
+            var videoId = image.data("ilb2VideoId");
+            var videoHasDimensions = false;
+            $.each(videos, function (_, video) {
+                if (videoId === this.i) {
+                    setSizes(video.w, video.h);
+                    videoHasDimensions = true;
                 }
-                var newId = newState.imageLightboxIndex;
-                if(newId === undefined) {
-                    _quitImageLightbox(true);
-                    return;
+            });
+            if (videoHasDimensions) {
+                return;
+            }
+            var videoElement = image.get(0);
+            if (videoElement.videoWidth !== undefined) {
+                setSizes(videoElement.videoWidth, videoElement.videoHeight);
+                return;
+            }
+            var tmpImage = new Image();
+            tmpImage.src = image.attr("src");
+            tmpImage.onload = function () {
+                setSizes(tmpImage.width, tmpImage.height);
+            };
+        }, _loadImage = function (direction) {
+            if (inProgress) {
+                return;
+            }
+            if (image.length) {
+                var params = { opacity: 0 };
+                if (hasCssTransitionSupport) {
+                    cssTransitionTranslateX(image, (100 * direction - swipeDiff).toString() + "px", options.animationSpeed / 1000);
                 }
-                var element = targets.filter('[data-ilb2-id="' + newId + '"]');
-                if(element.length > 0) {
-                    var newIndex = targets.index(element);
-                } else {
-                    newIndex = newId;
-                    element = $(targets[newIndex]);
+                else {
+                    params.left =
+                        (parseInt(image.css("left")) +
+                            100 * direction).toString() + "px";
                 }
-                if(!element[0] || (newState.imageLightboxSet && newState.imageLightboxSet !== element[0].dataset.imagelightbox)) {
-                    return;
+                image.animate(params, options.animationSpeed, function () {
+                    _removeImage();
+                });
+                swipeDiff = 0;
+            }
+            inProgress = true;
+            _onLoadStart();
+            setTimeout(function () {
+                var swipeStart = 0;
+                var swipeEnd = 0;
+                var imagePosLeft = 0;
+                var imgPath = target.attr("href");
+                // if (imgPath === undefined) {
+                //     imgPath = target.attr('data-lightbox');
+                // }
+                var videoOptions = target.data("ilb2Video");
+                var element = $();
+                var preloadedVideo;
+                if (videoOptions) {
+                    $.each(videos, function (_, video) {
+                        if (video.i === target.data("ilb2VideoId")) {
+                            preloadedVideo = video.l;
+                            element = video.e;
+                            if (video.a) {
+                                if (preloadedVideo === false) {
+                                    element.attr("autoplay", video.a);
+                                }
+                                if (preloadedVideo === true) {
+                                    void element.get(0).play();
+                                }
+                            }
+                        }
+                    });
                 }
-                if(targetIndex < 0) {
-                    _openImageLightbox(element, true);
-                    return;
+                else {
+                    element = $("<img id='" + options.id + "' />").attr("src", imgPath);
                 }
-                var direction = +1;
-                if(newIndex > targetIndex) {
-                    direction = -1;
-                }
-                target = element;
-                targetIndex = newIndex;
-                _loadImage(direction);
-            },
-            _previousTarget = function () {
-                targetIndex--;
-                if (targetIndex < 0) {
-                    if (options.quitOnEnd === true) {
-                        _quitImageLightbox();
-                        return;
+                function onload() {
+                    var params = { opacity: 1 };
+                    image.appendTo($wrapper);
+                    _setImage();
+                    image.css("opacity", 0);
+                    if (hasCssTransitionSupport) {
+                        cssTransitionTranslateX(image, (-100 * direction).toString() + "px", 0);
+                        setTimeout(function () {
+                            cssTransitionTranslateX(image, "0px", options.animationSpeed / 1000);
+                        }, 50);
                     }
                     else {
-                        targetIndex = targets.length - 1;
+                        imagePosLeft = parseInt(image.css("left"));
+                        params.left = imagePosLeft.toString() + "px";
+                        image.css("left", (imagePosLeft - 100 * direction).toString() +
+                            "px");
                     }
+                    image.animate(params, options.animationSpeed, function () {
+                        inProgress = false;
+                        _onLoadEnd();
+                    });
+                    if (options.preloadNext) {
+                        var nextTarget = targets.eq(targets.index(target) + 1);
+                        if (!nextTarget.length) {
+                            nextTarget = targets.eq(0);
+                        }
+                        $("<img />").attr("src", nextTarget.attr("href"));
+                    }
+                    $wrapper.trigger("loaded.ilb2");
                 }
-                target = targets.eq(targetIndex);
-                _pushToHistory();
-                $wrapper.trigger('previous.ilb2', target);
-                _loadImage(+1);
-            },
-            _nextTarget = function () {
-                targetIndex++;
-                if (targetIndex >= targets.length) {
-                    if (options.quitOnEnd === true) {
+                function onclick(e) {
+                    e.preventDefault();
+                    if (options.quitOnImgClick) {
                         _quitImageLightbox();
                         return;
                     }
-                    else {
-                        targetIndex = 0;
+                    if (wasTouched(e.originalEvent)) {
+                        return;
                     }
-                }
-                _pushToHistory();
-                target = targets.eq(targetIndex);
-                $wrapper.trigger('next.ilb2', target);
-                _loadImage(-1);
-            },
-            activityIndicatorOn = function () {
-                $wrapper.append($activityObject);
-            },
-            activityIndicatorOff = function () {
-                $('.imagelightbox-loading').remove();
-            },
-            overlayOn = function () {
-                $wrapper.append($overlayObject);
-            },
-            closeButtonOn = function () {
-                $buttonObject.appendTo($wrapper).on('click.ilb7', function () {
-                    _quitImageLightbox();
-                    return false;
-                });
-            },
-            captionReset = function () {
-                $captionObject.css('opacity', '0');
-                $captionObject.html('&nbsp;');
-                if ($(target).data('ilb2-caption')) {
-                    $captionObject.css('opacity', '1');
-                    $captionObject.html($(target).data('ilb2-caption'));
-                } else if ($(target).find('img').attr('alt')) {
-                    $captionObject.css('opacity', '1');
-                    $captionObject.html($(target).find('img').attr('alt'));
-                }
-            },
-            navigationOn = function () {
-                if (!targets.length) {
-                    return;
-                }
-                for (var i = 0; i < targets.length; i++) {
-                    $navObject.append($navItem.clone());
-                }
-                var $navItems = $navObject.children('a');
-                $navItems.eq(targets.index(target)).addClass('active');
-
-                $wrapper.on('previous.ilb2 next.ilb2', function () {
-                    $navItems.removeClass('active').eq(targets.index(target)).addClass('active');
-                });
-                $wrapper.append($navObject);
-
-                $navObject
-                    .on('click.ilb7 touchend.ilb7', function () {
-                        return false;
-                    })
-                    .on('click.ilb7 touchend.ilb7', 'a', function () {
-                        var $this = $(this);
-                        if (targets.eq($this.index()).attr('href') !== $('.imagelightbox').attr('src')) {
-                            var tmpTarget = targets.eq($this.index());
-                            if (tmpTarget.length) {
-                                currentIndex = targets.index(target);
-                                target = tmpTarget;
-                                _loadImage($this.index() < currentIndex ? -1 : 1);
-                            }
-                        }
-                        $this.addClass('active').siblings().removeClass('active');
-                    });
-            },
-            arrowsOn = function () {
-                $wrapper.append($arrows);
-                $arrows.on('click.ilb7 touchend.ilb7', function (e) {
-                    e.stopImmediatePropagation();
-                    e.preventDefault();
-                    if ($(this).hasClass('imagelightbox-arrow-left')) {
+                    var posX = (e.pageX ||
+                        e.originalEvent.pageX) -
+                        e.target.offsetLeft;
+                    if (e.target.width / 3 > posX) {
                         _previousTarget();
-                    } else {
+                    }
+                    else {
                         _nextTarget();
                     }
-                    return false;
-                });
-            },
-
-            isTargetValid = function (element) {
-                // eslint-disable-next-line
-                return $(element).prop('tagName').toLowerCase() === 'a' && ((new RegExp('\.(' + options.allowedTypes + ')$', 'i')).test($(element).attr('href')) || $(element).data('ilb2Video'));
-            },
-
-            _setImage = function () {
-                if (!image.length) {
-                    return true;
                 }
-
-                var captionHeight = options.caption ? $captionObject.outerHeight() : 0,
-                    screenWidth = $(window).width(),
-                    screenHeight = $(window).height() - captionHeight,
-                    gutterFactor = Math.abs(1 - options.gutter/100);
-
-                function setSizes (imageWidth, imageHeight) {
-                    if (imageWidth > screenWidth || imageHeight > screenHeight) {
-                        var ratio = imageWidth / imageHeight > screenWidth / screenHeight ? imageWidth / screenWidth : imageHeight / screenHeight;
-                        imageWidth /= ratio;
-                        imageHeight /= ratio;
+                image = element
+                    .on("load.ilb7", onload)
+                    .on("error.ilb7", function () {
+                    _onLoadEnd();
+                })
+                    .on("touchstart.ilb7 pointerdown.ilb7 MSPointerDown.ilb7", function (e) {
+                    if (!wasTouched(e.originalEvent) ||
+                        options.quitOnImgClick) {
+                        return;
                     }
-                    var cssHeight = imageHeight*gutterFactor,
-                        cssWidth = imageWidth*gutterFactor,
-                        cssLeft = ($(window).width() - cssWidth ) / 2;
-
-                    image.css({
-                        'width': cssWidth + 'px',
-                        'height': cssHeight + 'px',
-                        'left':  cssLeft + 'px'
-                    });
-                }
-
-                var videoId = image.data('ilb2VideoId');
-                var videoHasDimensions = false;
-                videos.each(function() {
-                    if( videoId === this.i ) {
-                        setSizes(this.w, this.h);
-                        videoHasDimensions = true;
+                    if (hasCssTransitionSupport) {
+                        imagePosLeft = parseInt(image.css("left"));
                     }
-                });
-                if (videoHasDimensions) {
-                    return;
-                }
-                if(image.get(0).videoWidth !== undefined) {
-                    setSizes(image.get(0).videoWidth, image.get(0).videoHeight);
-                    return;
-                }
-
-                var tmpImage = new Image();
-                tmpImage.src = image.attr('src');
-                tmpImage.onload = function() {
-                    setSizes(tmpImage.width, tmpImage.height);
-                };
-            },
-
-            _loadImage = function (direction) {
-                if (inProgress) {
-                    return false;
-                }
-
-                if (image.length) {
-                    var params = {'opacity': 0};
+                    swipeStart =
+                        e.originalEvent.pageX ||
+                            e.originalEvent.touches[0]
+                                .pageX;
+                })
+                    .on("touchmove.ilb7 pointermove.ilb7 MSPointerMove.ilb7", function (e) {
+                    if ((!hasPointers &&
+                        e.type === "pointermove") ||
+                        !wasTouched(e.originalEvent) ||
+                        options.quitOnImgClick) {
+                        return;
+                    }
+                    e.preventDefault();
+                    swipeEnd =
+                        e.originalEvent.pageX ||
+                            e.originalEvent.touches[0]
+                                .pageX;
+                    swipeDiff = swipeStart - swipeEnd;
                     if (hasCssTransitionSupport) {
-                        cssTransitionTranslateX(image, (100 * direction) - swipeDiff + 'px', options.animationSpeed / 1000);
+                        cssTransitionTranslateX(image, (-swipeDiff).toString() + "px", 0);
                     }
                     else {
-                        params.left = parseInt(image.css('left')) + (100 * direction) + 'px';
+                        image.css("left", (imagePosLeft - swipeDiff).toString() +
+                            "px");
                     }
-                    image.animate(params, options.animationSpeed, function () {
-                        _removeImage();
-                    });
-                    swipeDiff = 0;
-                }
-
-                inProgress = true;
-                _onLoadStart();
-
-                setTimeout(function () {
-                    var imgPath = target.attr('href'),
-                        swipeStart = 0,
-                        swipeEnd = 0,
-                        imagePosLeft = 0;
-
-                    // if (imgPath === undefined) {
-                    //     imgPath = target.attr('data-lightbox');
-                    // }
-
-                    var videoOptions = target.data('ilb2Video');
-                    var preloadedVideo, element;
-                    if (videoOptions) {
-                        videos.each(function() {
-                            if(this.i === target.data('ilb2VideoId')) {
-                                preloadedVideo = this.l;
-                                element = this.e;
-                                if(this.a) {
-                                    if(preloadedVideo === false) {
-                                        element.attr('autoplay', this.a);
-                                    }
-                                    if(preloadedVideo === true) {
-                                        element.get(0).play();
-                                    }
-                                }
-                            }
-                        });
-                    } else {
-                        element = $('<img id=\'' + options.id + '\' />')
-                            .attr('src', imgPath);
+                })
+                    .on("touchend.ilb7 touchcancel.ilb7 pointerup.ilb7 pointercancel.ilb7 MSPointerUp.ilb7 MSPointerCancel.ilb7", function (e) {
+                    if (!wasTouched(e.originalEvent) ||
+                        options.quitOnImgClick) {
+                        return;
                     }
-                    function onload () {
-                        var params = {'opacity': 1};
-
-                        image.appendTo($wrapper);
-                        _setImage();
-                        image.css('opacity', 0);
-                        if (hasCssTransitionSupport) {
-                            cssTransitionTranslateX(image, -100 * direction + 'px', 0);
-                            setTimeout(function () {
-                                cssTransitionTranslateX(image, 0 + 'px', options.animationSpeed / 1000);
-                            }, 50);
-                        } else {
-                            var imagePosLeft = parseInt(image.css('left'));
-                            params.left = imagePosLeft + 'px';
-                            image.css('left', imagePosLeft - 100 * direction + 'px');
+                    if (Math.abs(swipeDiff) > 50) {
+                        if (swipeDiff < 0) {
+                            _previousTarget();
                         }
-
-                        image.animate(params, options.animationSpeed, function () {
-                            inProgress = false;
-                            _onLoadEnd();
-                        });
-                        if (options.preloadNext) {
-                            var nextTarget = targets.eq(targets.index(target) + 1);
-                            if (!nextTarget.length) {
-                                nextTarget = targets.eq(0);
-                            }
-                            $('<img />').attr('src', nextTarget.attr('href'));
+                        else {
+                            _nextTarget();
                         }
-                        $wrapper.trigger('loaded.ilb2');
                     }
-                    function onclick (e) {
-                        e.preventDefault();
-                        if (options.quitOnImgClick) {
-                            _quitImageLightbox();
-                            return false;
+                    else {
+                        if (hasCssTransitionSupport) {
+                            cssTransitionTranslateX(image, "0px", options.animationSpeed / 1000);
                         }
-                        if (wasTouched(e.originalEvent)) {
-                            return true;
+                        else {
+                            image.animate({
+                                left: imagePosLeft.toString() +
+                                    "px"
+                            }, options.animationSpeed / 2);
                         }
-                        var posX = (e.pageX || e.originalEvent.pageX) - e.target.offsetLeft;
-                        if (e.target.width / 2 > posX) {
-                            _previousTarget();
-                        } else {
-                            _nextTarget();
-                        }
                     }
-                    image = element
-                        .on('load.ilb7', onload)
-                        .on('error.ilb7', function () {
-                            _onLoadEnd();
-                        })
-                        .on('touchstart.ilb7 pointerdown.ilb7 MSPointerDown.ilb7', function (e) {
-                            if (!wasTouched(e.originalEvent) || options.quitOnImgClick) {
-                                return true;
-                            }
-                            if (hasCssTransitionSupport) {
-                                imagePosLeft = parseInt(image.css('left'));
-                            }
-                            swipeStart = e.originalEvent.pageX || e.originalEvent.touches[0].pageX;
-                        })
-                        .on('touchmove.ilb7 pointermove.ilb7 MSPointerMove.ilb7', function (e) {
-                            if ((!hasPointers && e.type === 'pointermove') || !wasTouched(e.originalEvent) || options.quitOnImgClick) {
-                                return true;
-                            }
-                            e.preventDefault();
-                            swipeEnd = e.originalEvent.pageX || e.originalEvent.touches[0].pageX;
-                            swipeDiff = swipeStart - swipeEnd;
-                            if (hasCssTransitionSupport) {
-                                cssTransitionTranslateX(image, -swipeDiff + 'px', 0);
-                            } else {
-                                image.css('left', imagePosLeft - swipeDiff + 'px');
-                            }
-                        })
-                        .on('touchend.ilb7 touchcancel.ilb7 pointerup.ilb7 pointercancel.ilb7 MSPointerUp.ilb7 MSPointerCancel.ilb7', function (e) {
-                            if (!wasTouched(e.originalEvent) || options.quitOnImgClick) {
-                                return true;
-                            }
-                            if (Math.abs(swipeDiff) > 50) {
-                                if (swipeDiff < 0) {
-                                    _previousTarget();
-                                } else {
-                                    _nextTarget();
-                                }
-                            } else {
-                                if (hasCssTransitionSupport) {
-                                    cssTransitionTranslateX(image, 0 + 'px', options.animationSpeed / 1000);
-                                } else {
-                                    image.animate({'left': imagePosLeft + 'px'}, options.animationSpeed / 2);
-                                }
-                            }
-                        });
-                    if(preloadedVideo === true) {
-                        onload();
-                    }
-                    if(preloadedVideo === false) {
-                        image = image.on('loadedmetadata.ilb7', onload);
-                    }
-                    if(!videoOptions) {
-                        image = image.on(hasPointers ? 'pointerup.ilb7 MSPointerUp.ilb7' : 'click.ilb7', onclick);
-                    }
-
-                }, options.animationSpeed + 100);
-            },
-
-            _removeImage = function () {
-                if (!image.length) {
-                    return false;
+                });
+                if (preloadedVideo === true) {
+                    onload();
                 }
-                image.remove();
-                image = $();
-            },
-
-            _openImageLightbox = function ($target, noHistory) {
-                if (inProgress) {
-                    return false;
+                if (preloadedVideo === false) {
+                    image = image.on("loadedmetadata.ilb7", onload);
                 }
+                if (!videoOptions) {
+                    image = image.on(hasPointers
+                        ? "pointerup.ilb7 MSPointerUp.ilb7"
+                        : "click.ilb7", onclick);
+                }
+            }, options.animationSpeed + 100);
+        }, _removeImage = function () {
+            if (!image.length) {
+                return;
+            }
+            image.remove();
+            image = $();
+        }, _openImageLightbox = function ($target, noHistory) {
+            if (inProgress) {
+                return;
+            }
+            inProgress = false;
+            target = $target;
+            targetIndex = targets.index(target);
+            if (!noHistory) {
+                _pushToHistory();
+            }
+            _onStart();
+            $body.append($wrapper).addClass("imagelightbox-open");
+            $wrapper.trigger("start.ilb2", $target);
+            _loadImage(0);
+        }, _quitImageLightbox = function (noHistory) {
+            if (noHistory === void 0) { noHistory = false; }
+            targetIndex = -1;
+            if (!noHistory) {
+                _pushQuitToHistory();
+            }
+            $wrapper.trigger("quit.ilb2");
+            $body.removeClass("imagelightbox-open");
+            if (!image.length) {
+                return;
+            }
+            image.animate({ opacity: 0 }, options.animationSpeed, function () {
+                _removeImage();
                 inProgress = false;
-                target = $target;
-                targetIndex = targets.index(target);
-                if(!noHistory) {
-                    _pushToHistory();
+                $wrapper.remove().find("*").remove();
+            });
+        }, _addTargets = function (newTargets) {
+            newTargets.each(function () {
+                targets = newTargets.add($(this));
+            });
+            newTargets.on("click.ilb7", { set: targetSet }, function (e) {
+                e.preventDefault();
+                targetSet = $(e.currentTarget).data("imagelightbox");
+                filterTargets();
+                if (targets.length < 1) {
+                    _quitImageLightbox();
                 }
-                _onStart();
-                $body.append($wrapper)
-                    .addClass('imagelightbox-open');
-                $wrapper.trigger('start.ilb2', $target);
-                _loadImage(0);
-            },
-
-            _quitImageLightbox = function (noHistory) {
-                targetIndex = -1;
-                if(!noHistory) {
-                    _pushQuitToHistory();
+                else {
+                    _openImageLightbox($(this), false);
                 }
-                $wrapper.trigger('quit.ilb2');
-                $body.removeClass('imagelightbox-open');
-                if (!image.length) {
-                    return false;
-                }
-                image.animate({'opacity': 0}, options.animationSpeed, function () {
-                    _removeImage();
-                    inProgress = false;
-                    $wrapper.remove().find('*').remove();
+            });
+            function filterTargets() {
+                newTargets
+                    .filter(function () {
+                    return $(this).data("imagelightbox") === targetSet;
+                })
+                    .filter(function () {
+                    return isTargetValid($(this));
+                })
+                    .each(function () {
+                    targets = targets.add($(this));
                 });
-            },
-
-            _addTargets = function (newTargets) {
-                newTargets.each(function() {
-                    targets = newTargets.add($(this));
-                });
-                newTargets.on('click.ilb7', {set: targetSet}, function (e) {
-                    e.preventDefault();
-                    targetSet = $(e.currentTarget).data('imagelightbox');
-                    filterTargets();
-                    if (targets.length < 1) {
-                        _quitImageLightbox();
-                    } else {
-                        _openImageLightbox($(this));
+            }
+        }, _preloadVideos = function (elements) {
+            elements.each(function () {
+                var videoOptions = $(this).data("ilb2Video");
+                if (videoOptions) {
+                    var id = $(this).data("ilb2Id");
+                    if (!id) {
+                        // Random id
+                        id =
+                            "a" +
+                                (((1 + Math.random()) * 0x10000) | 0).toString(16);
                     }
-                });
-                function filterTargets () {
-                    newTargets
-                        .filter(function () {
-                            return $(this).data('imagelightbox') === targetSet;
-                        })
-                        .filter(function () {
-                            return isTargetValid($(this));
-                        })
-                        .each(function () {
-                            targets = targets.add($(this));
-                        });
-                }
-            },
-
-            _preloadVideos = function (elements) {
-                elements.each(function() {
-                    var videoOptions = $(this).data('ilb2Video');
-                    if (videoOptions) {
-                        var id = $(this).data('ilb2Id');
-                        if(!id) {
-                            id = 'a' + (((1+Math.random())*0x10000)|0).toString(16); // Random id
-                        }
-                        $(this).data('ilb2VideoId', id);
-                        var container = {e: $('<video id=\'' + options.id + '\' preload=\'metadata\' data-ilb2-video-id=\'' + id + '\'>'), i: id, l: false, a: undefined, h: undefined, w: undefined}; // e = element, i = id, l = is metadata loaded, a = autoplay, h = height, w = width
-                        $.each(videoOptions, function(key, value) {
-                            switch(key) {
-                            case 'autoplay':
-                                container.a = value;
+                    $(this).data("ilb2VideoId", id);
+                    var container_1 = {
+                        e: $("<video id='" +
+                            options.id +
+                            "' preload='metadata' data-ilb2-video-id='" +
+                            id +
+                            "'>"),
+                        i: id,
+                        l: false,
+                        a: undefined,
+                        h: undefined,
+                        w: undefined
+                    };
+                    $.each(videoOptions, function (key, value) {
+                        switch (key) {
+                            case "autoplay":
+                                container_1.a = value;
                                 break;
-                            case 'height':
-                                container.h = value;
+                            case "height":
+                                container_1.h = value;
                                 break;
-                            case 'sources':
+                            case "sources":
                                 break;
-                            case 'width':
-                                container.w = value;
+                            case "width":
+                                container_1.w = value;
                                 break;
                             default:
-                                container.e = container.e.attr(key, value);
-                            }
-                        });
-                        if(videoOptions.sources) {
-                            $.each(videoOptions.sources, function (_, source) {
-                                var sourceElement = $('<source>');
-                                $.each(source, function(key, value) {
-                                    sourceElement = sourceElement.attr(key, value);
-                                });
-                                container.e.append(sourceElement);
+                                // TODO: Remove this general behaviour
+                                container_1.e = container_1.e.attr(key, value);
+                        }
+                    });
+                    if (videoOptions.sources) {
+                        $.each(videoOptions.sources, function (_, source) {
+                            var sourceElement = $("<source>");
+                            $.each(source, function (key, value) {
+                                // TODO: Remove this general behaviour
+                                sourceElement = sourceElement.attr(key, value);
                             });
-                        }
-                        container.e.on('loadedmetadata.ilb7', function() {
-                            container.l = true;
+                            container_1.e.append(sourceElement);
                         });
-                        videos = videos.add(container);
                     }
-                });
-            };
-
-        $(window).on('resize.ilb7', _setImage);
-        if(hasHistorySupport && options.history) {
-            $(window).on('popstate', _popHistory);
+                    container_1.e.on("loadedmetadata.ilb7", function () {
+                        container_1.l = true;
+                    });
+                    videos.push(container_1);
+                }
+            });
+        };
+        $(window).on("resize.ilb7", _setImage);
+        if (hasHistorySupport && options.history) {
+            $(window).on("popstate", _popHistory);
         }
-
-        $(document).ready(function() {
-
+        $(document).ready(function () {
             if (options.quitOnDocClick) {
-                $(document).on(hasTouch ? 'touchend.ilb7' : 'click.ilb7', function (e) {
+                $(document).on(hasTouch ? "touchend.ilb7" : "click.ilb7", function (e) {
                     if (image.length && !$(e.target).is(image)) {
@@ -725,13 +723,12 @@ e.preventDefault();
             }
-
             if (options.fullscreen && hasFullscreenSupport) {
-                $(document).on('keydown.ilb7', function (e) {
+                $(document).on("keydown.ilb7", function (e) {
                     if (!image.length) {
-                        return true;
+                        return;
                     }
-                    if([9,32,38,40].indexOf(e.which) > -1) {
+                    if ([9, 32, 38, 40].includes(e.which)) {
                         e.stopPropagation();
                         e.preventDefault();
                     }
-                    if ([13].indexOf(e.which) > -1) {
+                    if ([13].includes(e.which)) {
                         e.stopPropagation();
@@ -743,9 +740,8 @@ e.preventDefault();
             }
-
             if (options.enableKeyboard) {
-                $(document).on('keydown.ilb7', function (e) {
+                $(document).on("keydown.ilb7", function (e) {
                     if (!image.length) {
-                        return true;
+                        return;
                     }
-                    if ([27].indexOf(e.which) > -1 && options.quitOnEscKey) {
+                    if ([27].includes(e.which) && options.quitOnEscKey) {
                         e.stopPropagation();
@@ -755,3 +751,3 @@ e.preventDefault();
                     }
-                    if ([37].indexOf(e.which) > -1) {
+                    if ([37].includes(e.which)) {
                         e.stopPropagation();
@@ -761,3 +757,3 @@ e.preventDefault();
                     }
-                    if ([39].indexOf(e.which) > -1) {
+                    if ([39].includes(e.which)) {
                         e.stopPropagation();
@@ -770,43 +766,41 @@ e.preventDefault();
         });
-
         function toggleFullScreen() {
             var doc = window.document;
-            var docEl = document.getElementById(options.id).parentElement;
-
-            var requestFullScreen = docEl.requestFullscreen || docEl.mozRequestFullScreen || docEl.webkitRequestFullScreen || docEl.msRequestFullscreen;
-            var exitFullScreen = doc.exitFullscreen || doc.mozCancelFullScreen || doc.webkitExitFullscreen || doc.msExitFullscreen;
-
-            if(!doc.fullscreenElement && !doc.mozFullScreenElement && !doc.webkitFullscreenElement && !doc.msFullscreenElement) {
-                requestFullScreen.call(docEl);
+            var docEl = document.getElementById(options.id)
+                .parentElement;
+            var requestFullScreen = docEl.requestFullscreen ||
+                docEl.mozRequestFullScreen ||
+                docEl.webkitRequestFullScreen ||
+                docEl.msRequestFullscreen;
+            var exitFullScreen = doc.exitFullscreen ||
+                doc.mozCancelFullScreen ||
+                doc.webkitExitFullscreen ||
+                doc.msExitFullscreen;
+            if (!doc.fullscreenElement &&
+                !doc.mozFullScreenElement &&
+                !doc.webkitFullscreenElement &&
+                !doc.msFullscreenElement) {
+                void requestFullScreen.call(docEl);
             }
             else {
-                exitFullScreen.call(doc);
+                void exitFullScreen.call(doc);
             }
         }
-
-        $(document).off('.ilb7 .ilb2', options.selector);
-
+        $(document).off(".ilb7 .ilb2", options.selector);
         _addTargets($(this));
-
         _openHistory();
-
         _preloadVideos(targets);
-
-        this.addToImageLightbox = function (elements)  {
+        this.addToImageLightbox = function (elements) {
             _addTargets(elements);
             _preloadVideos(elements);
         };
-
-        this.openHistory = function() {
+        this.openHistory = function () {
             _openHistory();
         };
-
         this.loadPreviousImage = function () {
             _previousTarget();
         };
-
         this.loadNextImage = function () {
             _nextTarget();
         };
-
         this.quitImageLightbox = function () {
@@ -816,12 +810,21 @@ _quitImageLightbox();
         };
-
         this.startImageLightbox = function (element) {
-            if (element)
-                element.trigger('click.ilb7');
-            else
-                $(this).trigger('click.ilb7');
+            if (element) {
+                element.trigger("click.ilb7");
+            }
+            else {
+                $(this).trigger("click.ilb7");
+            }
         };
-
         return this;
     };
-}));
+});
+
+"use strict";
+/* exported PreloadedVideo */
+
+"use strict";
+/* exported VideoOptions */
+
+"use strict";
+/* exported VideoSourceOptions */

package.json

 {
   "name": "imagelightbox",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "description": "Image Lightbox, Responsive and Touch‑friendly",
@@ -10,2 +10,9 @@ "homepage": "https://marekdedic.github.io/imagelightbox",
   "style": "./src/imagelightbox.css",
+  "types": "./types/imagelightbox.d.ts",
+  "files": [
+    "dist",
+    "docs",
+    "types",
+    "CHANGELOG.md"
+  ],
   "dependencies": {
@@ -15,14 +22,27 @@ "jquery": ">=1.12.4 <4.0.0"
   "devDependencies": {
+    "@types/jquery": "^3.3.31",
+    "@typescript-eslint/eslint-plugin": "^5.32.0",
+    "@typescript-eslint/parser": "^5.32.0",
     "chai": "^4.2.0",
+    "csslint": "^1.0.5",
+    "eslint": "^8.21.0",
+    "eslint-config-prettier": "^8.5.0",
+    "eslint-plugin-compat": "^4.0.2",
+    "eslint-plugin-deprecation": "^1.3.2",
+    "eslint-plugin-prettier": "^4.2.1",
     "express": "^4.17.1",
     "gulp": "^4.0.2",
-    "gulp-autoprefixer": "^7.0.0",
+    "gulp-autoprefixer": "^8.0.0",
     "gulp-clean-css": "^4.2.0",
+    "gulp-concat": "^2.6.1",
     "gulp-connect": "^5.7.0",
-    "gulp-csslint": "^1.0.1",
-    "gulp-eslint": "^6.0.0",
     "gulp-rename": "^2.0.0",
+    "gulp-typescript": "^5.0.1",
     "gulp-uglify": "^3.0.2",
-    "mocha": "^8.0.1",
-    "puppeteer": "^3.0.0"
+    "mocha": "^10.0.0",
+    "npm-run-all": "^4.1.5",
+    "puppeteer": "^16.0.0",
+    "stylelint": "^14.9.1",
+    "stylelint-no-unsupported-browser-features": "^5.0.3",
+    "typescript": "^4.7.4"
   },
@@ -36,13 +56,19 @@ "keywords": [
     "start": "gulp dev",
-    "fix:js": "eslint --fix src/**/*.js",
-    "test": "npm run test:js && npm run test:html",
-    "test:html": "mocha --recursive test/src",
-    "test:js": "eslint src/**/*.js"
+    "test": "mocha --recursive test/src",
+    "lint:css:csslint": "csslint src/imagelightbox.css",
+    "lint:css:stylelint": "stylelint --color 'src/**/*.css'",
+    "lint:css": "run-p -c --aggregate-output lint:css:*",
+    "lint:ts:eslint": "eslint --color 'src/**/*.ts' 'gulpfile.js'",
+    "lint:ts": "run-p -c --aggregate-output lint:ts:*",
+    "lint": "run-p -c --aggregate-output lint:*",
+    "prepack": "npm run build"
   },
   "browserslist": [
-    "last 2 versions",
+    "cover 95%",
+    "not < 0.1%",
+    "Firefox ESR",
     "IE >= 9",
-    "Firefox ESR",
-    "Android >= 2.3"
+    "Android >= 2.3",
+    "not OperaMini all"
   ]
 }

README.md

@@ -48,3 +48,3 @@ imagelightbox
     history:        false,                   // bool;            enable image permalinks and history
-    fullscreen:     false                    // bool;            enable fullscreen (enter/return key)
+    fullscreen:     false,                   // bool;            enable fullscreen (enter/return key)
     gutter:         10,                      // integer;         window height less height of image as a percentage
@@ -51,0 +51,0 @@ offsetY:        0,                       // integer;         vertical offset in terms of gutter

No alert changes

Improved metrics

Lines of code

3491

increased by0.23%

Worsened metrics

Total package byte prevSize

7652159

decreased by-0.07%

Dev dependency count

25

increased by108.33%

Number of package files

35

decreased by-12.5%

No dependency changes