imagelightbox - npm Package Compare versions

Comparing version 2.0.0 to 2.1.0

dist/imagelightbox.js

@@ -1,47 +0,445 @@
-import he from "jquery";
-const t = he, me = t("<div/>").attr("class", "imagelightbox-loading").append(t("<div/>")), be = t("<div/>", {
-  class: "imagelightbox-arrow imagelightbox-arrow-left"
-}), xe = t("<div/>", {
-  class: "imagelightbox-arrow imagelightbox-arrow-right"
-}), j = be.add(xe), E = t("<div/>", {
-  class: "imagelightbox-caption",
+import r from "jquery";
+function M(e, t, a) {
+  const i = t + "=" + a;
+  let o = "?" + i;
+  if (e) {
+    const n = new RegExp("([?&])" + t + "=[^&]*");
+    n.exec(e) !== null ? o = e.replace(n, "$1" + i) : o = e + "&" + i;
+  }
+  return o;
+}
+function T(e) {
+  const t = new RegExp("[?&]" + e + "(=([^&#]*)|&|#|$)").exec(
+    document.location.search
+  );
+  if ((t == null ? void 0 : t[2]) !== void 0)
+    return decodeURIComponent(t[2].replace(/\+/g, " "));
+}
+function D(e, t) {
+  let a = e;
+  if (a) {
+    const i = new RegExp("\\?" + t + "=[^&]*"), o = new RegExp("&" + t + "=[^&]*");
+    a = a.replace(i, "?"), a = a.replace(o, "");
+  }
+  return a;
+}
+var w = /* @__PURE__ */ ((e) => (e[e.Right = -1] = "Right", e[e.None = 0] = "None", e[e.Left = 1] = "Left", e))(w || {});
+function $() {
+  let e = D(
+    document.location.search,
+    "imageLightboxIndex"
+  );
+  e = D(e, "imageLightboxSet"), window.history.pushState({}, "", document.location.pathname + e);
+}
+function Q(e, t, a) {
+  const i = a[e].dataset.ilb2Id ?? e.toString();
+  let o = M(
+    document.location.search,
+    "imageLightboxIndex",
+    i
+  );
+  const n = {
+    imageLightboxIndex: i,
+    imageLightboxSet: ""
+  };
+  t !== void 0 && (n.imageLightboxSet = t, o = M(o, "imageLightboxSet", t)), window.history.pushState(
+    n,
+    "",
+    document.location.pathname + o
+  );
+}
+function P(e, t, a) {
+  if (T("imageLightboxSet") !== e)
+    return;
+  const i = T("imageLightboxIndex");
+  if (i === void 0)
+    return;
+  let o = t.index('[data-ilb2-id="' + i + '"]');
+  o < 0 && (o = parseInt(i)), a(o, !0);
+}
+function X(e, t, a, i, o, n, c) {
+  const u = e.originalEvent.state;
+  if (u === null) {
+    n(!0);
+    return;
+  }
+  if (u.imageLightboxSet !== t)
+    return;
+  const g = u.imageLightboxIndex;
+  if (g === void 0) {
+    n(!0);
+    return;
+  }
+  let b = a.get().findIndex((I) => I.dataset.ilb2Id === g);
+  if (b < 0 && (b = parseInt(g)), i === null) {
+    o(b, !0);
+    return;
+  }
+  c(
+    b,
+    b > i ? w.Right : w.Left,
+    !0
+  );
+}
+const L = r("<div/>", {
+  id: "ilb-container"
+});
+function _(e, t) {
+  L.removeClass("ilb-overlay"), r("body").addClass("ilb-body"), r("body").append(L), e && L.on("click.ilb7 touchend.ilb7", () => (t(), !1));
+}
+function j() {
+  L.addClass("ilb-overlay");
+}
+function B() {
+  L.remove(), L.empty(), r("body").removeClass("ilb-body");
+}
+function k(e, t) {
+  L.trigger(e, t);
+}
+function O() {
+  return L;
+}
+const H = r("<div/>").attr("id", "ilb-activity-indicator").append(r("<div/>"));
+function R() {
+  O().append(H);
+}
+function V() {
+  H.remove();
+}
+const W = r("<div/>", {
+  class: "ilb-arrow",
+  id: "ilb-arrow-left"
+}), z = r("<div/>", {
+  class: "ilb-arrow",
+  id: "ilb-arrow-right"
+});
+function U(e, t) {
+  O().append(
+    W.on("click.ilb7 touchend.ilb7", () => (e(), !1)),
+    z.on("click.ilb7 touchend.ilb7", () => (t(), !1))
+  );
+}
+const F = r("<div/>", {
+  id: "ilb-caption",
   html: "&nbsp;"
-}), ve = t("<div/>", {
-  class: "imagelightbox-close"
-}), we = t("<div/>", {
-  class: "imagelightbox-overlay"
-}), ye = t("<a/>", {
-  href: "#",
-  class: "imagelightbox-navitem"
-}), L = t("<div/>", {
-  class: "imagelightbox-nav"
-}), f = t("<div/>", {
-  class: "imagelightbox-wrapper"
-}), J = t("body"), Z = () => {
-  const p = (document.body ?? document.documentElement).style;
-  return p.transition === "" ? "" : p.webkitTransition === "" ? "-webkit-" : p.MozTransition === "" ? "-moz-" : p.OTransition === "" ? "-o-" : null;
-}, k = Z() !== null, _ = (p, q, a) => {
-  const m = {}, x = Z() ?? "";
-  m[x + "transform"] = "translateX(" + q + ") translateY(-50%)", m[x + "transition"] = x + "transform " + a.toString() + "s ease-in", p.css(m);
-}, ee = "ontouchstart" in window, W = window.navigator, Q = W.pointerEnabled || W.msPointerEnabled, F = (p) => {
-  if (ee)
-    return !0;
-  if (!Q || typeof p.pointerType > "u")
-    return !1;
-  if (typeof p.MSPOINTER_TYPE_MOUSE < "u") {
-    if (p.MSPOINTER_TYPE_MOUSE !== p.pointerType)
-      return !0;
-  } else if (p.pointerType !== "mouse")
-    return !0;
-  return !1;
-}, C = document, Se = C.fullscreenEnabled || (C.webkitFullscreenEnabled ?? C.mozFullScreenEnabled ?? C.msFullscreenEnabled ?? !1), P = (
-  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- Both can be undefined in very old browsers
-  window.history !== void 0 && history.pushState !== void 0
-);
-t.fn.imageLightbox = function(p) {
-  let q = 0, a = t(), m = !1, x = 0, c = t(), d = -1, s = t([]), D = "";
-  const R = [], n = t.extend(
+});
+function G() {
+  O().append(F);
+}
+function J(e) {
+  e !== null ? (F.css("display", ""), F.text(e)) : F.css("display", "none");
+}
+const Y = r("<div/>", {
+  id: "ilb-close-button"
+});
+function Z(e) {
+  O().append(
+    Y.on("click.ilb7", () => (e(), !1))
+  );
+}
+function ee(e, t, a) {
+  let i = 0, o = 0, n = r('<img id="ilb-image" />').attr(
+    "src",
+    e.attr("href")
+  );
+  const c = r(
+    '<div class="ilb-image-container">'
+  ).append(n);
+  let u;
+  const g = e.data("ilb2Video") !== void 0;
+  g && ([n, u] = a.element(
+    e.data("ilb2VideoId")
+  ));
+  function b(d, f, h, S) {
+    if (t.quitOnImgClick)
+      return S(), !1;
+    const v = d.target;
+    return (d.pageX - v.offsetLeft) / v.width <= 1 / 3 ? f() : h(), !1;
+  }
+  function I(d, f, h, S) {
+    !g && !("ontouchstart" in window) && n.on(
+      "click.ilb7",
+      (v) => b(v, f, h, S)
+    ), n.on("touchstart.ilb7", (v) => {
+      i = v.originalEvent.touches[0].pageX, n.css("transition-property", "opacity");
+    }).on("touchmove.ilb7", (v) => {
+      o = v.originalEvent.touches[0].pageX - i, n.css("left", o.toString() + "px");
+    }).on("touchend.ilb7 touchcancel.ilb7", () => (n.css("transition-property", "left, opacity"), o > 50 ? (f(), !1) : o < -50 ? (h(), !1) : (n.css("left", "0"), !0))), d();
+  }
+  function C(d, f) {
+    O().append(c);
+    const h = Math.abs(100 - t.gutter);
+    n.css({
+      // eslint-disable-next-line @typescript-eslint/naming-convention -- CSS property
+      "max-height": h.toString() + "%",
+      // eslint-disable-next-line @typescript-eslint/naming-convention -- CSS property
+      "max-width": h.toString() + "%",
+      left: (-100 * d).toString() + "px",
+      transition: "all ease " + t.animationSpeed.toString() + "ms",
+      // eslint-disable-next-line @typescript-eslint/naming-convention -- CSS property
+      "transition-property": "left, opacity",
+      opacity: "0"
+    }), n.show(f);
+  }
+  function E(d, f) {
+    n.on("error.ilb7", f), u === !0 ? d() : n.on("load.ilb7", d).on("loadedmetadata.ilb7", d);
+  }
+  function y(d, f, h, S) {
+    n.css({
+      left: "0",
+      opacity: "1"
+    }), setTimeout(() => {
+      I(d, f, h, S);
+    }, t.animationSpeed);
+  }
+  function m(d, f) {
+    if (d !== w.None) {
+      const h = parseInt(n.css("left"), 10) || 0;
+      n.css(
+        "left",
+        (h + 100 * d).toString() + "px"
+      );
+    }
+    n.css("opacity", "0"), setTimeout(() => {
+      f();
+    }, t.animationSpeed);
+  }
+  function x() {
+    c.remove();
+  }
+  return {
+    addToDOM: C,
+    startLoading: E,
+    transitionIn: y,
+    transitionOut: m,
+    removeFromDOM: x
+  };
+}
+const te = document.fullscreenEnabled || (document.webkitFullscreenEnabled ?? !1);
+function ie() {
+  const e = O().get(0), t = () => {
+    (e.requestFullscreen || e.webkitRequestFullScreen).call(e);
+  }, a = () => {
+    (document.exitFullscreen || document.webkitExitFullscreen).call(document);
+  };
+  !document.fullscreenElement && !document.webkitFullscreenElement ? t() : a();
+}
+function ne(e, t, a, i) {
+  e.fullscreen && te && r(document).on("keyup.ilb7", (o) => o.which === 13 ? (ie(), !1) : !0), e.enableKeyboard && r(document).on("keyup.ilb7", (o) => e.quitOnEscKey && o.which === 27 ? (t(), !1) : o.which === 37 ? (a(), !1) : o.which === 39 ? (i(), !1) : !0);
+}
+function oe() {
+  r(document).off("keyup.ilb7");
+}
+const ae = r("<a/>", {
+  href: "#"
+}), q = r("<div/>", {
+  class: "ilb-navigation"
+});
+function K(e) {
+  for (let t = 0; t < e.length; t++)
+    q.append(ae.clone());
+}
+function A(e) {
+  q.children().removeClass("ilb-navigation-active").eq(e).addClass("ilb-navigation-active");
+}
+function re(e, t, a) {
+  q.empty(), K(e()), A(t()), O().append(q), q.on("click.ilb7 touchend.ilb7", () => !1).children().on("click.ilb7 touchend.ilb7", function() {
+    const i = r(this);
+    if (e().eq(i.index()).attr("href") === r("#ilb-image").attr("src"))
+      return !1;
+    const o = i.index() < t() ? w.Left : w.Right;
+    return a(i.index(), o), !1;
+  });
+}
+function le(e, t) {
+  let a = e.data("ilb2Id");
+  a === void 0 && (a = "a" + ((1 + Math.random()) * 65536 | 0).toString(16)), e.data("ilb2VideoId", a);
+  const i = a, o = r(
+    "<video id='ilb-image' preload='metadata' data-ilb2-video-id='" + i + "'>"
+  );
+  let n = !1, c = !1, u, g;
+  r.each(t, (E, y) => {
+    switch (E) {
+      case "autoplay":
+        c = !0;
+        break;
+      case "height":
+        u = y;
+        break;
+      case "width":
+        g = y;
+        break;
+      case "controls":
+      case "loop":
+      case "muted":
+      case "poster":
+      case "preload":
+      case "src":
+        o.attr(E, y);
+    }
+  }), t.sources && r.each(t.sources, (E, y) => {
+    let m = r("<source>");
+    r.each(y, (x, d) => {
+      m = m.attr(x, d);
+    }), o.append(m);
+  }), o.on("loadedmetadata.ilb7", () => {
+    n = !0;
+  });
+  function b() {
+    return i;
+  }
+  function I() {
+    return [g ?? o.width(), u ?? o.height()];
+  }
+  function C() {
+    return c && (n ? o.get(0).play() : o.attr("autoplay", "autoplay")), [o, n];
+  }
+  return {
+    id: b,
+    dimensions: I,
+    element: C
+  };
+}
+function ce() {
+  const e = [];
+  function t(o) {
+    o.each((n, c) => {
+      const u = r(c).data("ilb2Video");
+      u !== void 0 && e.push(le(r(c), u));
+    });
+  }
+  function a(o) {
+    const n = e.find((c) => c.id() === o);
+    if (n !== void 0)
+      return n.dimensions();
+  }
+  function i(o) {
+    return e.find((c) => c.id() === o).element();
+  }
+  return {
+    add: t,
+    dimensions: a,
+    element: i
+  };
+}
+function de(e, t, a) {
+  let i = r();
+  const o = ce();
+  let n = null, c = null;
+  function u() {
+    return t;
+  }
+  function g() {
+    return i;
+  }
+  function b() {
+    return n;
+  }
+  function I(l, s) {
+    const p = c;
+    p.transitionOut(l, () => {
+      p.removeFromDOM(), s == null || s();
+    });
+  }
+  function C() {
+    c == null || c.transitionIn(
+      V,
+      /* eslint-disable @typescript-eslint/no-use-before-define -- Cyclical dependencies */
+      d,
+      f,
+      m
+    );
+  }
+  function E(l) {
+    c == null || c.addToDOM(l, () => {
+      const s = i.get(n);
+      if (J(
+        s.dataset.ilb2Caption ?? r(s).find("img").attr("alt") ?? null
+      ), C(), e.preloadNext && n + 1 < i.length) {
+        const p = i.eq(n + 1);
+        r("<img />").attr("src", p.attr("href"));
+      }
+      k("loaded.ilb2");
+    });
+  }
+  function y(l, s) {
+    const p = ee(
+      i.eq(l),
+      e,
+      o
+    );
+    p.startLoading(
+      () => {
+        n = l, c = p, E(s);
+      },
+      () => {
+        V();
+      }
+    );
+  }
+  function m(l = !1) {
+    n !== null && (e.activity && R(), oe(), e.history && !l && $(), k("quit.ilb2"), I(w.None, () => {
+      n = null, c = null, B();
+    }));
+  }
+  function x(l, s, p = !1) {
+    n !== null && (e.history && !p && Q(l, u(), g()), e.activity && R(), A(l), I(s), y(l, s));
+  }
+  function d() {
+    if (n === null)
+      return;
+    let l = n - 1;
+    if (n === 0)
+      if (e.quitOnEnd) {
+        m();
+        return;
+      } else
+        l = i.length - 1;
+    k("previous.ilb2", i.eq(l)), x(l, w.Left);
+  }
+  function f() {
+    if (n === null)
+      return;
+    let l = n + 1;
+    if (n === i.length - 1)
+      if (e.quitOnEnd) {
+        m();
+        return;
+      } else
+        l = 0;
+    k("next.ilb2", i.eq(l)), x(l, w.Right);
+  }
+  function h(l, s = !1) {
+    _(e.quitOnDocClick, m), e.activity && R(), ne(e, m, d, f), e.arrows && U(d, f), e.caption && G(), e.button && Z(m), e.navigation && re(g, b, x), e.overlay && j(), e.history && !s && Q(l, u(), g()), k("start.ilb2", i.eq(l)), y(l, w.None);
+  }
+  function S(l) {
+    const s = i.index(l);
+    s < 0 || h(s);
+  }
+  function v(l) {
+    const s = l.not(i).filter(
+      (p, N) => N.tagName.toLowerCase() === "a" && (new RegExp(".(" + e.allowedTypes + ")$", "i").test(
+        N.href
+      ) || N.dataset.ilb2Video !== void 0)
+    );
+    o.add(s), i = i.add(s), s.on("click.ilb7", (p) => (S(r(p.delegateTarget)), !1)), K(s);
+  }
+  return v(a), e.history && r(window).on("popstate.ilb7", (l) => {
+    X(l, u(), g(), b(), h, m, x);
+  }), {
+    set: u,
+    images: g,
+    currentIndex: b,
+    addImages: v,
+    openWithImage: S,
+    open: h,
+    close: m,
+    previous: d,
+    next: f,
+    change: x
+  };
+}
+r.fn.imageLightbox = function(e) {
+  const t = r.extend(
     {
-      selector: "a[data-imagelightbox]",
-      id: "imagelightbox",
       allowedTypes: "png|jpg|jpeg|gif",
@@ -58,4 +456,2 @@ animationSpeed: 250,
       // percentage of client height
-      offsetY: 0,
-      // percentage of gutter
       navigation: !1,
@@ -69,366 +465,28 @@ overlay: !1,
     },
-    p
-  ), X = (e, i) => {
-    let o = e;
-    if (o) {
-      const r = new RegExp("\\?" + i + "=[^&]*"), u = new RegExp("&" + i + "=[^&]*");
-      o = o.replace(r, "?"), o = o.replace(u, "");
-    }
-    return o;
-  }, te = () => {
-    if (!P || !n.history)
-      return;
-    let e = X(
-      document.location.search,
-      "imageLightboxIndex"
+    e
+  ), a = de(
+    t,
+    r(this).data("imagelightbox"),
+    r(this)
+  );
+  return this.addToImageLightbox = (i) => {
+    a.addImages(i);
+  }, this.openHistory = () => {
+    t.history && P(
+      a.set(),
+      a.images(),
+      (i, o) => {
+        a.open(i, o);
+      }
     );
-    e = X(e, "imageLightboxSet"), window.history.pushState(
-      {},
-      "",
-      document.location.pathname + e
-    );
-  }, z = () => {
-    a.length && (a.remove(), a = t());
-  }, v = (e = !1) => {
-    d = -1, e || te(), f.trigger("quit.ilb2"), J.removeClass("imagelightbox-open"), a.length && a.animate({ opacity: 0 }, n.animationSpeed, () => {
-      z(), m = !1, f.remove().find("*").remove();
-    });
-  }, H = (e, i, o) => {
-    const r = i + "=" + o;
-    let u = "?" + r;
-    if (e) {
-      const g = new RegExp("([?&])" + i + "=[^&]*");
-      g.exec(e) !== null ? u = e.replace(g, "$1" + r) : u = e + "&" + r;
-    }
-    return u;
-  }, $ = () => {
-    if (!P || !n.history)
-      return;
-    const e = s[d].dataset.ilb2Id ?? d.toString(), i = {
-      imageLightboxIndex: e,
-      imageLightboxSet: ""
-    }, o = s[d].dataset.imagelightbox;
-    let r = H(
-      document.location.search,
-      "imageLightboxIndex",
-      e
-    );
-    o !== void 0 && (i.imageLightboxSet = o, r = H(r, "imageLightboxSet", o)), window.history.pushState(
-      i,
-      "",
-      document.location.pathname + r
-    );
-  }, ie = () => {
-    f.append(me);
-  }, ne = () => {
-    E.css("opacity", "0"), E.html("&nbsp;"), t(c).data("ilb2-caption") !== void 0 ? (E.css("opacity", "1"), E.html(t(c).data("ilb2-caption"))) : t(c).find("img").attr("alt") !== void 0 && (E.css("opacity", "1"), E.html(t(c).find("img").attr("alt")));
-  }, oe = () => {
-    n.activity && ie(), n.caption && ne();
-  }, V = function() {
-    if (!a.length)
-      return;
-    const e = n.caption ? E.outerHeight() : 0, i = t(window).width(), o = t(window).height() - e, r = Math.abs(1 - n.gutter / 100);
-    function u(S, l) {
-      if (S > i || l > o) {
-        const G = S / l > i / o ? S / i : l / o;
-        S /= G, l /= G;
-      }
-      const h = l * r, A = S * r, pe = (t(window).width() - A) / 2;
-      a.css({
-        width: A.toString() + "px",
-        height: h.toString() + "px",
-        left: pe.toString() + "px"
-      });
-    }
-    const g = a.data("ilb2VideoId");
-    let b = !1;
-    if (t.each(R, function(S, l) {
-      g === this.i && (u(l.w, l.h), b = !0);
-    }), b)
-      return;
-    const w = a.get(0);
-    if (w.videoWidth !== void 0) {
-      u(w.videoWidth, w.videoHeight);
-      return;
-    }
-    const y = new Image();
-    y.src = a.attr("src"), y.onload = () => {
-      u(y.width, y.height);
-    };
-  }, ae = () => {
-    t(".imagelightbox-loading").remove();
-  }, N = () => {
-    n.activity && ae(), n.arrows && j.css("display", "block");
-  }, I = () => {
-    if (!m) {
-      if (d--, d < 0)
-        if (n.quitOnEnd) {
-          v();
-          return;
-        } else
-          d = s.length - 1;
-      c = s.eq(d), $(), f.trigger("previous.ilb2", c), T(1);
-    }
-  }, O = () => {
-    if (!m) {
-      if (d++, d >= s.length)
-        if (n.quitOnEnd) {
-          v();
-          return;
-        } else
-          d = 0;
-      $(), c = s.eq(d), f.trigger("next.ilb2", c), T(-1);
-    }
-  }, T = (e) => {
-    if (!m) {
-      if (a.length) {
-        const i = { opacity: 0 };
-        k ? _(
-          a,
-          (100 * e - x).toString() + "px",
-          n.animationSpeed / 1e3
-        ) : i.left = (parseInt(a.css("left")) + 100 * e).toString() + "px", a.animate(i, n.animationSpeed, () => {
-          z();
-        }), x = 0;
-      }
-      m = !0, oe(), setTimeout(() => {
-        let i = 0, o = 0, r = 0;
-        const u = c.attr("href"), g = c.data("ilb2Video");
-        let b = t(), w;
-        g ? t.each(R, (l, h) => {
-          h.i === c.data("ilb2VideoId") && (w = h.l, b = h.e, h.a !== void 0 && (w ? b.get(0).play() : b.attr("autoplay", h.a)));
-        }) : b = t("<img id='" + n.id + "' />").attr(
-          "src",
-          u
-        );
-        function y() {
-          const l = { opacity: 1 };
-          if (a.appendTo(f), V(), a.css("opacity", 0), k ? (_(
-            a,
-            (-100 * e).toString() + "px",
-            0
-          ), setTimeout(() => {
-            _(
-              a,
-              "0px",
-              n.animationSpeed / 1e3
-            );
-          }, 50)) : (r = parseInt(a.css("left")), l.left = r.toString() + "px", a.css(
-            "left",
-            (r - 100 * e).toString() + "px"
-          )), a.animate(l, n.animationSpeed, () => {
-            m = !1, N();
-          }), n.preloadNext) {
-            let h = s.eq(s.index(c) + 1);
-            h.length || (h = s.eq(0)), t("<img />").attr("src", h.attr("href"));
-          }
-          f.trigger("loaded.ilb2");
-        }
-        function S(l) {
-          if (l.preventDefault(), n.quitOnImgClick) {
-            v();
-            return;
-          }
-          if (F(l.originalEvent))
-            return;
-          const h = (l.pageX || l.originalEvent.pageX) - l.target.offsetLeft;
-          l.target.width / 3 > h ? I() : O();
-        }
-        a = b.on("load.ilb7", y).on("error.ilb7", () => {
-          N();
-        }).on(
-          "touchstart.ilb7 pointerdown.ilb7 MSPointerDown.ilb7",
-          (l) => {
-            !F(l.originalEvent) || n.quitOnImgClick || (k && (r = parseInt(a.css("left"))), i = l.originalEvent.pageX || l.originalEvent.touches[0].pageX);
-          }
-        ).on(
-          "touchmove.ilb7 pointermove.ilb7 MSPointerMove.ilb7",
-          (l) => {
-            !Q && l.type === "pointermove" || !F(l.originalEvent) || n.quitOnImgClick || (l.preventDefault(), o = l.originalEvent.pageX || l.originalEvent.touches[0].pageX, x = i - o, k ? _(
-              a,
-              (-x).toString() + "px",
-              0
-            ) : a.css(
-              "left",
-              (r - x).toString() + "px"
-            ));
-          }
-        ).on(
-          "touchend.ilb7 touchcancel.ilb7 pointerup.ilb7 pointercancel.ilb7 MSPointerUp.ilb7 MSPointerCancel.ilb7",
-          (l) => {
-            !F(l.originalEvent) || n.quitOnImgClick || (Math.abs(x) > 50 ? x < 0 ? I() : O() : k ? _(
-              a,
-              "0px",
-              n.animationSpeed / 1e3
-            ) : a.animate(
-              {
-                left: r.toString() + "px"
-              },
-              n.animationSpeed / 2
-            ));
-          }
-        ), w === !0 ? y() : w === !1 && (a = a.on("loadedmetadata.ilb7", y)), g || (a = a.on(
-          Q ? "pointerup.ilb7 MSPointerUp.ilb7" : "click.ilb7",
-          S
-        ));
-      }, n.animationSpeed + 100);
-    }
-  }, re = function() {
-    f.append(j), j.on("click.ilb7 touchend.ilb7", function(e) {
-      e.stopImmediatePropagation(), e.preventDefault(), t(this).hasClass("imagelightbox-arrow-left") ? I() : O();
-    });
-  }, le = function() {
-    if (!s.length)
-      return;
-    for (let i = 0; i < s.length; i++)
-      L.append(ye.clone());
-    const e = L.children("a");
-    e.eq(s.index(c)).addClass("active"), f.on("previous.ilb2 next.ilb2", () => {
-      e.removeClass("active").eq(s.index(c)).addClass("active");
-    }), f.append(L), L.on("click.ilb7 touchend.ilb7", () => !1).on("click.ilb7 touchend.ilb7", "a", function() {
-      const i = t(this);
-      if (s.eq(i.index()).attr("href") !== t(".imagelightbox").attr("src")) {
-        const o = s.eq(i.index());
-        o.length && (q = s.index(c), c = o, T(i.index() < q ? -1 : 1));
-      }
-      i.addClass("active").siblings().removeClass("active");
-    });
-  }, se = () => {
-    f.append(we);
-  }, ce = () => {
-    ve.appendTo(f).on("click.ilb7", () => (v(), !1));
-  }, de = () => {
-    n.arrows && re(), n.navigation && le(), n.overlay && se(), n.button && ce(), n.caption && f.append(E);
-  }, U = (e) => {
-    const i = new RegExp(
-      "[?&]" + e + "(=([^&#]*)|&|#|$)"
-    ).exec(document.location.search);
-    if ((i == null ? void 0 : i[2]) !== void 0)
-      return decodeURIComponent(i[2].replace(/\+/g, " "));
-  }, M = (e, i) => {
-    m || (m = !1, c = e, d = s.index(c), i || $(), de(), J.append(f).addClass("imagelightbox-open"), f.trigger("start.ilb2", e), T(0));
-  }, K = () => {
-    if (!P || !n.history)
-      return;
-    const e = U("imageLightboxIndex");
-    if (e === void 0)
-      return;
-    let i = s.filter('[data-ilb2-id="' + e + '"]');
-    i.length > 0 ? d = s.index(i) : (d = parseInt(e), i = t(s[d]));
-    const o = U("imageLightboxSet");
-    i.length === 0 || o !== void 0 && o !== i[0].dataset.imagelightbox || M(i, !0);
-  }, ue = (e) => {
-    const i = e.originalEvent.state;
-    if (!i) {
-      v(!0);
-      return;
-    }
-    const o = i.imageLightboxIndex;
-    if (o === void 0) {
-      v(!0);
-      return;
-    }
-    const r = s.filter('[data-ilb2-id="' + o + '"]');
-    if (r.length === 0 || i.imageLightboxSet !== void 0 && i.imageLightboxSet !== r[0].dataset.imagelightbox)
-      return;
-    if (d < 0) {
-      M(r, !0);
-      return;
-    }
-    const u = s.index(r);
-    let g = 1;
-    u > d && (g = -1), c = r, d = u, T(g);
-  }, ge = (e) => t(e).prop("tagName").toLowerCase() === "a" && new RegExp(".(" + n.allowedTypes + ")$", "i").test(
-    t(e).attr("href")
-  ) || t(e).data("ilb2Video") !== void 0, Y = function(e) {
-    function i() {
-      e.filter(function() {
-        return t(this).data("imagelightbox") === D;
-      }).filter(function() {
-        return ge(t(this));
-      }).each(function() {
-        s = s.add(t(this));
-      });
-    }
-    e.each(function() {
-      s = e.add(t(this));
-    }), e.on("click.ilb7", { set: D }, function(o) {
-      o.preventDefault(), D = t(o.currentTarget).data("imagelightbox"), i(), s.length < 1 ? v() : M(t(this), !1);
-    });
-  }, B = function(e) {
-    e.each(function() {
-      const i = t(this).data("ilb2Video");
-      if (i) {
-        let o = t(this).data("ilb2Id");
-        o || (o = "a" + ((1 + Math.random()) * 65536 | 0).toString(16)), t(this).data("ilb2VideoId", o);
-        const r = {
-          e: t(
-            "<video id='" + n.id + "' preload='metadata' data-ilb2-video-id='" + o + "'>"
-          ),
-          i: o,
-          l: !1,
-          a: void 0,
-          h: void 0,
-          w: void 0
-        };
-        t.each(i, (u, g) => {
-          switch (u) {
-            case "autoplay":
-              r.a = g;
-              break;
-            case "height":
-              r.h = g;
-              break;
-            case "sources":
-              break;
-            case "width":
-              r.w = g;
-              break;
-            default:
-              r.e = r.e.attr(
-                u,
-                g
-              );
-          }
-        }), i.sources && t.each(i.sources, (u, g) => {
-          let b = t("<source>");
-          t.each(g, (w, y) => {
-            b = b.attr(w, y);
-          }), r.e.append(b);
-        }), r.e.on("loadedmetadata.ilb7", () => {
-          r.l = !0;
-        }), R.push(r);
-      }
-    });
-  };
-  t(window).on("resize.ilb7", V), P && n.history && t(window).on("popstate", ue);
-  function fe() {
-    const e = window.document, i = document.getElementById(n.id).parentElement, o = i.requestFullscreen || i.mozRequestFullScreen || i.webkitRequestFullScreen || i.msRequestFullscreen, r = e.exitFullscreen || e.mozCancelFullScreen || e.webkitExitFullscreen || e.msExitFullscreen;
-    !e.fullscreenElement && !e.mozFullScreenElement && !e.webkitFullscreenElement && !e.msFullscreenElement ? o.call(i) : r.call(e);
-  }
-  return t(document).ready(() => {
-    n.quitOnDocClick && t(document).on(
-      ee ? "touchend.ilb7" : "click.ilb7",
-      (e) => {
-        a.length && !t(e.target).is(a) && (e.preventDefault(), v());
-      }
-    ), n.fullscreen && Se && t(document).on("keydown.ilb7", (e) => {
-      a.length && ([9, 32, 38, 40].includes(e.which) && (e.stopPropagation(), e.preventDefault()), [13].includes(e.which) && (e.stopPropagation(), e.preventDefault(), fe()));
-    }), n.enableKeyboard && t(document).on("keydown.ilb7", (e) => {
-      a.length && ([27].includes(e.which) && n.quitOnEscKey && (e.stopPropagation(), e.preventDefault(), v()), [37].includes(e.which) && (e.stopPropagation(), e.preventDefault(), I()), [39].includes(e.which) && (e.stopPropagation(), e.preventDefault(), O()));
-    });
-  }), t(document).off(".ilb7 .ilb2", n.selector), Y(t(this)), K(), B(s), this.addToImageLightbox = (e) => {
-    Y(e), B(e);
-  }, this.openHistory = () => {
-    K();
-  }, this.loadPreviousImage = () => {
-    I();
+  }, this.openHistory(), this.loadPreviousImage = () => {
+    a.previous();
   }, this.loadNextImage = () => {
-    O();
+    a.next();
   }, this.quitImageLightbox = function() {
-    return v(), this;
-  }, this.startImageLightbox = function(e) {
-    e ? e.trigger("click.ilb7") : t(this).trigger("click.ilb7");
+    return a.close(), this;
+  }, this.startImageLightbox = (i) => {
+    i !== void 0 ? a.openWithImage(i) : a.open(0);
   }, this;
 };
 //# sourceMappingURL=imagelightbox.js.map

package.json

 {
   "name": "imagelightbox",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "description": "Image Lightbox, Responsive and Touch‑friendly",
@@ -22,2 +22,3 @@ "homepage": "https://marekdedic.github.io/imagelightbox",
     "dist",
+    "!dist/webpack-stats.json",
     "docs",
@@ -31,3 +32,3 @@ "types",
   "devDependencies": {
-    "@playwright/test": "^1.41.2",
+    "@playwright/test": "^1.42.0",
     "@types/jquery": "^3.3.31",
@@ -49,3 +50,3 @@ "@types/node": "^20.11.20",
     "nyc": "^15.1.0",
-    "playwright": "^1.41.2",
+    "playwright": "^1.42.0",
     "playwright-test-coverage": "^1.2.12",
@@ -55,7 +56,10 @@ "postcss": "^8.4.35",
     "rimraf": "^5.0.1",
-    "stylelint": "^16.1.0",
-    "stylelint-config-recommended": "^14.0.0",
+    "rollup-plugin-webpack-stats": "^0.2.4",
+    "stylelint": "^16.3.1",
+    "stylelint-config-standard": "^36.0.0",
     "stylelint-no-unsupported-browser-features": "^8.0.0",
-    "typescript": "^5.0.3",
-    "vite": "^5.1.4"
+    "stylelint-prettier": "^5.0.0",
+    "typescript": "^5.3.3",
+    "vite": "^5.1.4",
+    "vite-plugin-istanbul": "^6.0.0"
   },
@@ -76,3 +80,4 @@ "keywords": [
     "lint:css": "run-p -c --aggregate-output lint:css:*",
-    "lint:ts:eslint": "eslint --color 'src/**/*.ts' 'tests/**/*.ts' 'docs.vite.config.ts' 'playwright.config.js' 'postcss.config.js' 'vite.config.ts'",
+    "lint:ts:eslint": "eslint --color 'src/**/*.ts' 'tests/**/*.ts' 'types/**/*.ts' 'docs.vite.config.ts' 'playwright.config.js' 'postcss.config.js' 'vite.config.ts'",
+    "lint:ts:typecheck": "tsc --noEmit",
     "lint:ts": "run-p -c --aggregate-output lint:ts:*",
@@ -85,8 +90,8 @@ "lint": "run-p -c --aggregate-output lint:*",
     "cover 95%",
-    "not < 0.1%",
+    "> 0.5%",
+    "last 2 versions",
     "Firefox ESR",
-    "IE >= 9",
-    "Android >= 2.3",
-    "not OperaMini all"
+    "not dead",
+    "not < 0.1%"
   ]
 }

README.md

 imagelightbox
 =============
 
-[![npm version](https://badge.fury.io/js/imagelightbox.svg)](https://badge.fury.io/js/imagelightbox)
-[![Build Status](https://secure.travis-ci.org/marekdedic/imagelightbox.png?branch=master)](http://travis-ci.org/marekdedic/imagelightbox)
+![NPM Version](https://img.shields.io/npm/v/imagelightbox)
+![GitHub](https://img.shields.io/github/license/marekdedic/imagelightbox)
+![GitHub CI](https://img.shields.io/github/actions/workflow/status/marekdedic/imagelightbox/CI.yml?logo=github)
+![Codecov](https://img.shields.io/codecov/c/github/marekdedic/imagelightbox/master?logo=codecov)
+![NPM downloads](https://img.shields.io/npm/dm/imagelightbox?logo=npm)
+![RelativeCI](https://badges.relative-ci.com/badges/mqvYqDg4xPM2gcxviDAG?branch=master&style=flat)
 
@@ -17,3 +21,2 @@ Image Lightbox, Responsive and Touch‑friendly.
 * All major desktop browsers and versions as well as mobile browsers on Android, iOS and Windows Phone.
-* IE8 is NOT supported
 
@@ -40,3 +43,2 @@ ## How to use
     selector:       'a[data-imagelightbox]', // string;
-    id:             'imagelightbox',         // string;
     allowedTypes:   'png|jpg|jpeg|gif',      // string;          use empty string to allow any file type
@@ -43,0 +45,0 @@ animationSpeed: 250,                     // integer;

types/imagelightbox.d.ts

 interface ILBOptions {
-    selector: string;
-    id: string;
-    allowedTypes: string;
-    animationSpeed: number;
-    activity: boolean;
-    arrows: boolean;
-    button: boolean;
-    caption: boolean;
-    enableKeyboard: boolean;
-    history: boolean;
-    fullscreen: boolean;
-    gutter: number;
-    offsetY: number;
-    navigation: boolean;
-    overlay: boolean;
-    preloadNext: boolean;
-    quitOnEnd: boolean;
-    quitOnImgClick: boolean;
-    quitOnDocClick: boolean;
-    quitOnEscKey: boolean;
+  allowedTypes: string;
+  animationSpeed: number;
+  activity: boolean;
+  arrows: boolean;
+  button: boolean;
+  caption: boolean;
+  enableKeyboard: boolean;
+  history: boolean;
+  fullscreen: boolean;
+  gutter: number;
+  navigation: boolean;
+  overlay: boolean;
+  preloadNext: boolean;
+  quitOnEnd: boolean;
+  quitOnImgClick: boolean;
+  quitOnDocClick: boolean;
+  quitOnEscKey: boolean;
 }
 
 interface JQuery {
-    imageLightbox(opts: Partial<ILBOptions>): JQuery;
-    addToImageLightbox(elements: JQuery): void;
-    openHistory(): void;
-    loadPreviousImage(): void;
-    loadNextImage(): void;
-    quitImageLightbox(): void;
-    startImageLightbox(element: JQuery): void;
+  imageLightbox(opts?: Partial<ILBOptions>): JQuery;
+  addToImageLightbox(elements: JQuery): void;
+  openHistory(): void;
+  loadPreviousImage(): void;
+  loadNextImage(): void;
+  quitImageLightbox(): void;
+  startImageLightbox(element?: JQuery): void;
 }

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Lines of code

990

increased by3.34%

Number of lines in readme file

256

increased by0.79%

Worsened metrics

Total package byte prevSize

8177337

decreased by-0.43%

Dev dependency count

30

increased by11.11%

No dependency changes