onelineplayer 1.0.0

package/dist/onelineplayer.mjs

@@ -0,0 +1,732 @@
+const R = `<div class="oneline-wrap">
+  <video style="display: none" class="oneline oneline-video" playsinline></video>
+  <div class="oneline-embed"></div>
+  <div class="oneline-error-box"><div class="oneline-error-message"></div></div>
+  <div class="oneline-poster" style="display: none"></div>
+  <div class="oneline-overlay" style="display: none"></div>
+  <div class="oneline-play-pause" style="display: none">
+    <button aria-label="Play" type="button">
+      <svg class="oneline-play-button" width="29px" height="29px" viewBox="-3 0 26 29" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+        <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.9">
+            <g class="oneline-icon" transform="translate(-308.000000, -226.000000)" fill="#EFEFEF" fill-rule="nonzero">
+                <g>
+                    <path d="M308,252.742128 L308,228.216201 C308,227.111631 308.895431,226.216201 310,226.216201 C310.395737,226.216201 310.782578,226.333602 311.111565,226.553545 L329.506011,238.85112 C330.42427,239.46502 330.671002,240.707081 330.057101,241.62534 C329.910345,241.844855 329.721572,242.033137 329.501676,242.179321 L311.10723,254.407674 C310.187374,255.01918 308.945961,254.769213 308.334454,253.849358 C308.116351,253.521277 308,253.13609 308,252.742128 Z"></path>
+                </g>
+            </g>
+        </g>
+      </svg>
+      <svg class="oneline-pause-button" width="20px" height="20px" viewBox="-1 0 19 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+        <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.9">
+            <g class="oneline-icon" transform="translate(-1034.000000, -1137.000000)" fill="#EFEFEF">
+                <g transform="translate(920.000000, 331.000000)">
+                    <g transform="translate(0.000000, 656.000000)">
+                        <g transform="translate(87.000000, 60.000000)">
+                            <path d="M29,90 L30.3333333,90 C31.4379028,90 32.3333333,90.8954305 32.3333333,92 L32.3333333,108 C32.3333333,109.104569 31.4379028,110 30.3333333,110 L29,110 C27.8954305,110 27,109.104569 27,108 L27,92 C27,90.8954305 27.8954305,90 29,90 Z M40.3333333,90 L41.6666667,90 C42.7712362,90 43.6666667,90.8954305 43.6666667,92 L43.6666667,108 C43.6666667,109.104569 42.7712362,110 41.6666667,110 L40.3333333,110 C39.2287638,110 38.3333333,109.104569 38.3333333,108 L38.3333333,92 C38.3333333,90.8954305 39.2287638,90 40.3333333,90 Z"></path>
+                        </g>
+                    </g>
+                </g>
+            </g>
+        </g>
+      </svg>
+    </button>
+  </div>
+  <div class="oneline-loader-container">
+    <div class="la-ball-pulse">
+      <div></div>
+      <div></div>
+      <div></div>
+    </div>
+  </div>
+  <div class="oneline-controls">
+    <div class="oneline-time" style="display: none"></div>
+    <div class="oneline-progress" style="display: none" tabindex="0" role="slider" aria-orientation="horizontal">
+      <div class="oneline-progress-fill-bg">
+        <div class="oneline-progress-fill"></div>
+      </div>
+      <div class="oneline-progress-seek-fill"></div>
+      <svg
+        class="ring"
+        width="120"
+        height="120">
+        <circle
+          class="ring-circle ring-bg"
+          stroke="white"
+          stroke-width="4"
+          fill="transparent"
+          r="52"
+          cx="60"
+          cy="60"/>
+        <circle
+          class="ring-circle ring-fill"
+          stroke="red"
+          stroke-width="4"
+          fill="transparent"
+          r="52"
+          cx="60"
+          cy="60"/>
+        <circle
+          class="ring-circle ring-seek"
+          stroke="blue"
+          stroke-width="4"
+          fill="transparent"
+          r="52"
+          cx="60"
+          cy="60"/>
+      </svg>
+    </div>
+    <div class="oneline-control-buttons">
+      <button class="oneline-mute-button" style="display: none" type="button">
+        <svg class="mute" width="16px" height="20px" viewBox="0 0 16 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+          <title>Mute</title>
+          <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+              <g transform="translate(-1392.000000, -1231.000000)" fill="#FFFFFF" fill-rule="nonzero">
+                  <g transform="translate(802.000000, 794.000000)">
+                      <path d="M602.985222,437 L602.985222,456.123535 L600.787842,456.123535 L592.44458,450.014526 L590,450.014526 L590,442.986084 L592.44458,442.986084 L600.787842,437 L602.985222,437 Z M606,444 L606,449 L604,449 L604,444 L606,444 Z"></path>
+                  </g>
+              </g>
+          </g>
+        </svg>
+        <svg class="unmute" width="16px" height="20px" viewBox="0 0 16 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+          <title>Unmute</title>
+          <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+              <g transform="translate(-1392.000000, -1197.000000)" fill="#FFFFFF" fill-rule="nonzero">
+                  <g transform="translate(802.000000, 794.000000)">
+                      <path d="M602.985,411.757 L602.985222,422.123535 L600.787842,422.123535 L596.072,418.67 L602.985,411.757 Z M606.424621,403.368272 L607.838835,404.782486 L592.282486,420.338835 L590.868272,418.924621 L606.424621,403.368272 Z M602.985222,403 L602.985,404.687 L591.658,416.014 L590,416.014526 L590,408.986084 L592.44458,408.986084 L600.787842,403 L602.985222,403 Z M606,410 L606,415 L604,415 L604,410.742 L604.743,409.999 L606,410 Z"></path>
+                  </g>
+              </g>
+          </g>
+        </svg>
+      </button>
+      <button class="oneline-fullscreen-button" style="display: none" type="button">
+        <svg width="19px" class="fullscreen-icon-on" height="19px" viewBox="0 0 19 19" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+          <title>Fullscreen</title>
+          <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+              <g transform="translate(-1351.000000, -1231.000000)" fill="#FFFFFF">
+                  <g transform="translate(802.000000, 794.000000)">
+                      <path d="M554.971733,448.344364 C555.432291,447.885212 556.177464,447.885212 556.638022,448.344364 L556.638022,448.344364 L556.654581,448.36091 C557.11514,448.821096 557.11514,449.566701 556.654581,450.025853 L556.654581,450.025853 L554.013357,452.664943 C553.750477,452.928645 553.750477,453.354705 554.013357,453.618407 L554.013357,453.618407 L555.245998,454.850052 C555.671367,455.274043 555.370193,456 554.769915,456 L554.769915,456 L549,456 L549,450.234747 C549,449.634953 549.726544,449.334023 550.150878,449.759049 L550.150878,449.759049 L551.377308,450.983454 C551.640189,451.247156 552.067628,451.247156 552.330509,450.983454 L552.330509,450.983454 Z M568,437 L568,442.764694 C568,443.36443 567.273456,443.665331 566.849122,443.240346 L566.849122,443.240346 L565.622692,442.01606 C565.359811,441.753417 564.932372,441.753417 564.669491,442.01606 L564.669491,442.01606 L562.028267,444.654894 C561.567709,445.115035 560.822536,445.115035 560.361978,444.654894 L560.361978,444.654894 L560.345419,444.638349 C559.88486,444.178208 559.88486,443.433709 560.345419,442.973568 L560.345419,442.973568 L562.986643,440.334734 C563.249523,440.071057 563.249523,439.645038 562.986643,439.381362 L562.986643,439.381362 L561.752967,438.149837 C561.328633,437.725886 561.629807,437 562.230085,437 L562.230085,437 L568,437 Z"></path>
+                  </g>
+              </g>
+          </g>
+        </svg>
+        <svg class="fullscreen-icon-off" width="19px" height="19px" viewBox="0 0 19 19" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+          <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+              <g transform="translate(-1351.000000, -1197.000000)" fill="#FFFFFF">
+                  <g transform="translate(802.000000, 794.000000)">
+                      <path d="M557,414 L557,419.764694 C557,420.36443 556.273456,420.665331 555.849122,420.240346 L555.849122,420.240346 L554.622692,419.01606 C554.359811,418.753417 553.932372,418.753417 553.669491,419.01606 L553.669491,419.01606 L551.028267,421.654894 C550.567709,422.115035 549.822536,422.115035 549.361978,421.654894 L549.361978,421.654894 L549.345419,421.638349 C548.88486,421.178208 548.88486,420.433709 549.345419,419.973568 L549.345419,419.973568 L551.986643,417.334734 C552.249523,417.071057 552.249523,416.645038 551.986643,416.381362 L551.986643,416.381362 L550.752967,415.149837 C550.328633,414.725886 550.629807,414 551.230085,414 L551.230085,414 L557,414 Z M565.971733,403.344364 C566.432291,402.885212 567.177464,402.885212 567.638022,403.344364 L567.638022,403.344364 L567.654581,403.36091 C568.11514,403.821096 568.11514,404.566701 567.654581,405.025853 L567.654581,405.025853 L565.013357,407.664943 C564.750477,407.928645 564.750477,408.354705 565.013357,408.618407 L565.013357,408.618407 L566.245998,409.850052 C566.671367,410.274043 566.370193,411 565.769915,411 L565.769915,411 L560,411 L560,405.234747 C560,404.634953 560.726544,404.334023 561.150878,404.759049 L561.150878,404.759049 L562.377308,405.983454 C562.640189,406.247156 563.067628,406.247156 563.330509,405.983454 L563.330509,405.983454 Z"></path>
+                  </g>
+              </g>
+          </g>
+        </svg>
+      </button>
+    </div>
+  </div>
+</div>
+`;
+function L(s) {
+  return !!(s && s.match(/vimeo\.com\/(\d+)/i));
+}
+function _(s) {
+  const n = [
+    "assets-1.entertainvideo.com/assets/video/30df75d701c29181572c47389a031c60.mp4"
+  ];
+  for (let l = 0; l < n.length; l++)
+    if (s && s.indexOf(n[l]) !== -1)
+      return !0;
+  return !1;
+}
+function V(s) {
+  s = Math.floor(s);
+  let n = Math.floor(s / 3600), l = Math.floor((s - n * 3600) / 60), e = s - n * 3600 - l * 60;
+  l = l < 10 ? "0" + l : l, e = e < 10 ? "0" + e : e;
+  let i = l + ":" + e;
+  return n > 0 && (i = n + ":" + i), i;
+}
+function D(s) {
+  if (!s)
+    throw new Error("onelineplayer.mount: target is required");
+  if (typeof s == "string") {
+    const n = document.querySelector(s);
+    if (!n)
+      throw new Error("onelineplayer.mount: element not found: " + s);
+    return n;
+  }
+  if (s.nodeType === 1)
+    return s;
+  throw new Error("onelineplayer.mount: target must be a selector or Element");
+}
+function N(s) {
+  const n = s || {};
+  return {
+    url: n.url || "",
+    poster: n.poster || "",
+    autoplay: !!n.autoplay,
+    loop: !!n.loop,
+    autopause: !!n.autopause,
+    muted: !!n.muted,
+    clickable: n.clickable !== !1,
+    time: !!n.time,
+    progressBar: !!n.progressBar,
+    playButton: n.playButton !== void 0 ? !!n.playButton : !0,
+    overlay: n.overlay !== void 0 ? !!n.overlay : !0,
+    muteButton: !!n.muteButton,
+    fullscreenButton: !!n.fullscreenButton,
+    style: n.style || "light",
+    buttonColor: n.buttonColor || null,
+    buttonSize: n.buttonSize || null,
+    overlayColor: n.overlayColor || null,
+    overlayOpacity: n.overlayOpacity != null ? n.overlayOpacity : null,
+    quality: n.quality || "auto"
+  };
+}
+function W(s, n, l) {
+  const e = s.video, i = s.wrap;
+  return e.style.display = "block", e.muted = !!n.muted, n.autoplay && e.setAttribute("autoplay", ""), n.loop && e.setAttribute("loop", ""), _(n.url) ? e.src = "restricted" : e.src = n.url, e.addEventListener("error", function() {
+    const o = i.querySelector(".oneline-error-message");
+    if (e.error === null)
+      return;
+    let t = "Video error";
+    switch (e.error.code) {
+      case 1:
+        t = "Video aborted";
+        break;
+      case 2:
+        t = "Video expired, reload the page";
+        break;
+      case 3:
+        t = "Network error";
+        break;
+      case 4:
+        t = "Video not found or not supported";
+        break;
+    }
+    o && (o.innerText = t), i.classList.add("oneline-error"), i.classList.remove("oneline-load");
+  }), e.addEventListener(
+    "waiting",
+    function() {
+      l && console.log("waiting"), i.classList.add("oneline-load");
+    },
+    !1
+  ), e.addEventListener(
+    "canplaythrough",
+    function() {
+      l && console.log("canplay"), i.classList.remove("oneline-load");
+    },
+    !1
+  ), {
+    type: "html",
+    load: function(o) {
+      e.src = o.url, o.autoplay && e.setAttribute("autoplay", "");
+    },
+    node: function() {
+      return e;
+    },
+    play: function() {
+      return e.play();
+    },
+    pause: function() {
+      e.pause();
+    },
+    mute: function() {
+      e.muted = !0;
+    },
+    unmute: function() {
+      e.muted = !1;
+    },
+    getPaused: function(o) {
+      o(e.paused);
+    },
+    getWidth: function(o) {
+      o(e.videoWidth);
+    },
+    getHeight: function(o) {
+      o(e.videoHeight);
+    },
+    getTime: function(o) {
+      o(e.currentTime);
+    },
+    setTime: function(o) {
+      e.currentTime = o;
+    },
+    setLoop: function(o) {
+      o ? e.setAttribute("loop", "") : e.removeAttribute("loop");
+    },
+    getDuration: function(o) {
+      o(e.duration);
+    },
+    getMuted: function(o) {
+      o(e.muted);
+    },
+    onLoadstart: function(o) {
+      e.addEventListener("loadstart", o, !1);
+    },
+    onLoadend: function(o) {
+      e.addEventListener("loadended", o, !1);
+    },
+    onReady: function(o) {
+      e.addEventListener("loadedmetadata", o, !1);
+    },
+    onPlay: function(o) {
+      e.addEventListener("play", o, !1);
+    },
+    onPause: function(o) {
+      e.addEventListener("pause", o, !1);
+    },
+    onTimeupdate: function(o) {
+      e.addEventListener("timeupdate", o, !1);
+    },
+    onVolumechange: function(o) {
+      e.addEventListener("volumechange", o, !1);
+    },
+    onEnded: function(o) {
+      e.addEventListener("ended", o, !1);
+    },
+    onSeeked: function(o) {
+      e.addEventListener("seeked", o, !1);
+    },
+    destroy: function() {
+      e.removeAttribute("src"), e.load();
+    }
+  };
+}
+const K = "https://player.vimeo.com/api/player.js";
+let g = null;
+function U() {
+  return typeof window < "u" && window.Vimeo && window.Vimeo.Player ? Promise.resolve(window.Vimeo) : g || (g = new Promise(function(s, n) {
+    const l = document.querySelector("script[data-onelineplayer-vimeo]");
+    if (l) {
+      l.addEventListener("load", function() {
+        s(window.Vimeo);
+      }), l.addEventListener("error", n);
+      return;
+    }
+    const e = document.createElement("script");
+    e.src = K, e.async = !0, e.dataset.onelineplayerVimeo = "1", e.onload = function() {
+      s(window.Vimeo);
+    }, e.onerror = n, document.head.appendChild(e);
+  }), g);
+}
+function A(s) {
+  return {
+    url: s.url,
+    controls: !1,
+    muted: s.muted,
+    autoplay: s.autoplay,
+    loop: s.loop,
+    quality: s.quality,
+    responsive: !0
+  };
+}
+async function j(s, n) {
+  s.embed.style.display = "block";
+  const l = await U(), e = new l.Player(s.embed, A(n));
+  return n.muted || e.setVolume(1), {
+    type: "vimeo",
+    load: function(i) {
+      e.loadVideo(A(i));
+    },
+    node: function() {
+      return e.element;
+    },
+    play: function() {
+      return e.play();
+    },
+    pause: function() {
+      return e.pause();
+    },
+    mute: function() {
+      e.setVolume(0);
+    },
+    unmute: function() {
+      e.setVolume(1);
+    },
+    getPaused: function(i) {
+      e.getPaused().then(i);
+    },
+    getWidth: function(i) {
+      e.getVideoWidth().then(i);
+    },
+    getHeight: function(i) {
+      e.getVideoHeight().then(i);
+    },
+    getTime: function(i) {
+      e.getCurrentTime().then(i);
+    },
+    setTime: function(i) {
+      e.setCurrentTime(i);
+    },
+    setLoop: function(i) {
+      e.setLoop(i);
+    },
+    getDuration: function(i) {
+      e.getDuration().then(i);
+    },
+    getMuted: function(i) {
+      e.getVolume().then(function(o) {
+        i(o === 0);
+      });
+    },
+    onLoadstart: function(i) {
+      e.on("bufferstart", i);
+    },
+    onLoadend: function(i) {
+      e.on("bufferend", i);
+    },
+    onReady: function(i) {
+      e.on("loaded", i);
+    },
+    onPlay: function(i) {
+      e.on("play", i);
+    },
+    onPause: function(i) {
+      e.on("pause", i);
+    },
+    onTimeupdate: function(i) {
+      e.on("timeupdate", i);
+    },
+    onVolumechange: function(i) {
+      e.on("volumechange", i);
+    },
+    onEnded: function(i) {
+      e.on("ended", i);
+    },
+    onSeeked: function(i) {
+      e.on("seeked", i);
+    },
+    destroy: function() {
+      return e.destroy();
+    }
+  };
+}
+function I(s) {
+  const { video: n, options: l, els: e, components: i, state: o } = s, t = e.play, r = e.wrap;
+  l && l.buttonSize ? (t.style.width = l.buttonSize + "px", t.style.marginTop = -(l.buttonSize / 2) + "px", t.style.marginLeft = -(l.buttonSize / 2) + "px") : (t.style.width = null, t.style.marginTop = null, t.style.marginLeft = null);
+  const a = l && l.buttonColor ? l.buttonColor : null, d = t.querySelectorAll(".oneline-icon");
+  for (let u = 0; u < d.length; u++)
+    d[u].style.fill = a;
+  if (i.playButton)
+    return i.playButton;
+  const p = o.userCanTouch ? "touchend" : "click";
+  return t.addEventListener(p, function() {
+    r.classList.add("oneline-started"), n.getPaused(function(u) {
+      u ? n.play() : n.pause();
+    });
+  }, !1), t.style.display = "block", i.playButton = t, i.playButton;
+}
+function Y(s) {
+  const { video: n, els: l, components: e, state: i } = s;
+  if (e.muteButton)
+    return e.muteButton;
+  const o = l.muteButton;
+  n.getMuted(function(r) {
+    r && o.classList.add("muted");
+  });
+  const t = i.userCanTouch ? "touchend" : "click";
+  return o.addEventListener(t, function() {
+    n.getMuted(function(r) {
+      r ? n.unmute() : n.mute();
+    });
+  }), n.onVolumechange(function() {
+    n.getMuted(function(r) {
+      r ? o.classList.add("muted") : o.classList.remove("muted");
+    });
+  }), o.style.display = "block", e.muteButton = o, e.muteButton;
+}
+function X(s) {
+  const { video: n, els: l, components: e, cleanup: i } = s, o = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream, t = l.fullscreenButton;
+  if (o && n.type === "vimeo")
+    return t.style.display = "none", null;
+  if (e.fullscreenButton)
+    return e.fullscreenButton;
+  function r() {
+    const u = l.wrap;
+    d() ? (u.classList.remove("oneline-fullscreen"), n.node().dispatchEvent(new CustomEvent("fullscreenExit"))) : (u.classList.add("oneline-fullscreen"), n.node().dispatchEvent(new CustomEvent("fullscreenEnter")));
+  }
+  function a() {
+    const u = l.root;
+    d() ? u.requestFullscreen ? u.requestFullscreen() : u.msRequestFullscreen ? u.msRequestFullscreen() : u.mozRequestFullScreen ? u.mozRequestFullScreen() : u.webkitRequestFullscreen ? u.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT) : o && n.type === "html" && n.node().webkitEnterFullscreen() : document.exitFullscreen ? document.exitFullscreen() : document.msExitFullscreen ? document.msExitFullscreen() : document.mozCancelFullScreen ? document.mozCancelFullScreen() : document.webkitExitFullscreen && document.webkitExitFullscreen();
+  }
+  function d() {
+    return !document.fullscreenElement && !document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement;
+  }
+  const p = function() {
+    a(), t.blur();
+  };
+  return t.addEventListener("click", p), document.addEventListener("webkitfullscreenchange", r), document.addEventListener("fullscreenchange", r), document.addEventListener("mozfullscreenchange", r), document.addEventListener("MSFullscreenChange", r), i.push(function() {
+    t.removeEventListener("click", p), document.removeEventListener("webkitfullscreenchange", r), document.removeEventListener("fullscreenchange", r), document.removeEventListener("mozfullscreenchange", r), document.removeEventListener("MSFullscreenChange", r);
+  }), t.style.display = "block", e.fullscreenButton = t, e.fullscreenButton;
+}
+function G(s) {
+  const { video: n, options: l, els: e, components: i, cleanup: o } = s;
+  if (i.progressBar)
+    return i.progressBar;
+  let t = !1, r = null;
+  const a = e.progress, d = e.progressFill, p = e.progressSeekFill, u = e.wrap;
+  n.onPlay(function() {
+    O();
+  }), n.onPause(function() {
+    S();
+  }), n.onEnded(function() {
+    d.style.width = a.offsetWidth + "px";
+  });
+  function m(c) {
+    z(c), t = !0;
+  }
+  function w() {
+    t = !1;
+  }
+  function k(c) {
+    B(c, !1);
+  }
+  function x(c) {
+    t = !0, c.returnValue = !1;
+  }
+  function E(c) {
+    B(c, !0);
+  }
+  function C() {
+    t = !1;
+  }
+  function F(c) {
+    c.keyCode === 39 && T(5), c.keyCode === 37 && T(-5);
+  }
+  return a.addEventListener("mousedown", m, !1), a.addEventListener("mouseup", w, !1), a.addEventListener("mousemove", k, !1), a.addEventListener("touchstart", x, !1), a.addEventListener("touchmove", E, !1), a.addEventListener("touchend", C, !1), document.addEventListener("keydown", F, !1), o.push(function() {
+    S(), a.removeEventListener("mousedown", m, !1), a.removeEventListener("mouseup", w, !1), a.removeEventListener("mousemove", k, !1), a.removeEventListener("touchstart", x, !1), a.removeEventListener("touchmove", E, !1), a.removeEventListener("touchend", C, !1), document.removeEventListener("keydown", F, !1);
+  }), a.style.display = "block", i.progressBar = a, a;
+  function T(c) {
+    n.getTime(function(f) {
+      n.setTime(f + c);
+    });
+  }
+  function B(c, f) {
+    f && (c.returnValue = !1);
+    const y = P(c);
+    H(y), t && z(c);
+  }
+  function z(c) {
+    const f = P(c);
+    L(l.url) || u.classList.add("oneline-load"), n.getDuration(function(y) {
+      n.setTime(f / 100 * y), M();
+    });
+  }
+  function O() {
+    (function c() {
+      M(), r = setTimeout(c, 50);
+    })();
+  }
+  function S() {
+    clearTimeout(r);
+  }
+  function M() {
+    n.getTime(function(c) {
+      n.getDuration(function(f) {
+        Z(c * 100 / f);
+      });
+    });
+  }
+  function Z(c) {
+    d.style.width = c + "%";
+  }
+  function H(c) {
+    p.style.width = c + "%";
+  }
+  function P(c) {
+    const f = c.changedTouches, y = a.getBoundingClientRect().left, h = (f ? c.pageX : c.clientX) - y, q = a.offsetWidth;
+    return h > 0 && h < q ? h * 100 / q : 0;
+  }
+}
+function J(s) {
+  const { video: n, els: l, components: e } = s, i = l.time;
+  if (n.getTime(function(t) {
+    i.innerHTML = V(t);
+  }), i.style.display = "block", e.time)
+    return e.time;
+  return o(), n.onTimeupdate(function() {
+    o();
+  }), e.time = i, i;
+  function o() {
+    n.getTime(function(t) {
+      i.innerHTML = V(t);
+    });
+  }
+}
+function Q(s) {
+  const { video: n, options: l, els: e, components: i } = s, o = e.poster, t = l.poster;
+  return !t || t === "null" ? (o.style.display = "none", null) : (o.style.backgroundColor = "#000", o.style.backgroundImage = "url(" + t + ")", i.poster ? i.poster : (o.style.display = "block", n.onPlay(function() {
+    o.style.display = "none";
+  }), i.poster = o, o));
+}
+function $(s) {
+  const { video: n, options: l, els: e, components: i, state: o } = s, t = e.overlay, r = e.wrap;
+  if (l && l.overlayColor ? t.style.backgroundColor = l.overlayColor : t.style.backgroundColor = null, l && l.overlayOpacity != null ? (t.dataset.opacity = l.overlayOpacity, n.getPaused(function(d) {
+    d && (t.style.opacity = t.dataset.opacity);
+  })) : (delete t.dataset.opacity, t.style.opacity = null), i.overlay)
+    return i.overlay;
+  t.classList.add("oneline-clickable");
+  const a = o.userCanTouch ? "touchend" : "click";
+  return t.addEventListener(a, function() {
+    r.classList.add("oneline-started"), n.getPaused(function(d) {
+      d ? n.play() : n.pause();
+    });
+  }, !1), n.onPlay(function() {
+    typeof t.dataset.opacity < "u" && (t.style.opacity = 0);
+  }), n.onPause(function() {
+    typeof t.dataset.opacity < "u" && (t.style.opacity = t.dataset.opacity);
+  }), t.addEventListener("mouseleave", function() {
+    r.classList.remove("oneline-hide-controls"), r.classList.remove("oneline-hide-all");
+  }), t.addEventListener("mouseenter", function() {
+    o.userCanTouch || (r.classList.remove("oneline-hide-controls"), r.classList.remove("oneline-hide-all"), o.hideTimeout && clearTimeout(o.hideTimeout));
+  }), t.style.display = "block", i.overlay = t, i.overlay;
+}
+const v = /* @__PURE__ */ new Set();
+function ee(s) {
+  const n = s.querySelector(".oneline-wrap");
+  return {
+    root: s,
+    wrap: n,
+    video: n.querySelector(".oneline-video"),
+    embed: n.querySelector(".oneline-embed"),
+    poster: n.querySelector(".oneline-poster"),
+    overlay: n.querySelector(".oneline-overlay"),
+    play: n.querySelector(".oneline-play-pause"),
+    time: n.querySelector(".oneline-time"),
+    progress: n.querySelector(".oneline-progress"),
+    progressFill: n.querySelector(".oneline-progress-fill"),
+    progressSeekFill: n.querySelector(".oneline-progress-seek-fill"),
+    muteButton: n.querySelector(".oneline-mute-button"),
+    fullscreenButton: n.querySelector(".oneline-fullscreen-button")
+  };
+}
+function ne(s) {
+  const n = document.createElement("template");
+  return n.innerHTML = R.trim(), s.classList.add("oneline-player"), s.replaceChildren(n.content.cloneNode(!0)), ee(s);
+}
+class te {
+  constructor(n, l) {
+    this.root = n, this.options = l, this.components = {}, this.cleanup = [], this.state = {
+      userCanTouch: !1,
+      hideTimeout: null,
+      debug: !1
+    }, this.video = null, this.els = null, this._ready = !1, this._destroyed = !1;
+  }
+  async init() {
+    this.els = ne(this.root);
+    const n = this.els, l = this.options, e = this.state, i = function() {
+      e.userCanTouch = !0;
+    };
+    n.root.addEventListener("touchstart", i, !0), this.cleanup.push(function() {
+      n.root.removeEventListener("touchstart", i, !0);
+    }), L(l.url) ? this.video = await j(n, l) : (this.video = W(n, l, e.debug), n.wrap.classList.add("oneline-load"));
+    const o = this.video, t = n.wrap;
+    if (l.style === "dark" && t.classList.add("oneline-dark"), l.poster && Q({ video: o, options: l, els: n, components: this.components }), l.overlay && $({ video: o, options: l, els: n, components: this.components, state: e }), l.autopause) {
+      const p = this;
+      o.onPlay(function() {
+        v.forEach(function(u) {
+          u !== p && !u._destroyed && u.pause();
+        });
+      });
+    }
+    o.onLoadstart(function() {
+      e.debug && console.log("loadstart"), L(l.url) || t.classList.add("oneline-load"), t.classList.remove("oneline-error");
+    }), o.onLoadend(function() {
+      e.debug && console.log("loadend"), t.classList.remove("oneline-load");
+    }), o.onPlay(function() {
+      e.debug && console.log("play"), t.classList.add("oneline-hide-controls"), t.classList.add("oneline-playing"), t.classList.remove("oneline-paused"), e.hideTimeout = setTimeout(function() {
+        t.classList.add("oneline-hide-all");
+      }, 3e3);
+    }), o.onPause(function() {
+      e.debug && console.log("pause"), t.classList.add("oneline-paused"), t.classList.remove("oneline-load"), t.classList.remove("oneline-playing"), t.classList.remove("oneline-hide-all"), clearTimeout(e.hideTimeout);
+    }), o.onSeeked(function() {
+      t.classList.remove("oneline-load");
+    });
+    const r = function() {
+      t.classList.remove("oneline-hide-controls"), t.classList.remove("oneline-hide-all"), t.classList.remove("active");
+    }, a = function() {
+      t.classList.remove("oneline-hide-controls"), t.classList.remove("oneline-hide-all"), clearTimeout(e.hideTimeout);
+    };
+    t.addEventListener("mouseleave", r), t.addEventListener("mouseenter", a), this.cleanup.push(function() {
+      t.removeEventListener("mouseleave", r), t.removeEventListener("mouseenter", a);
+    });
+    const d = this;
+    return o.onReady(function() {
+      if (d._destroyed) return;
+      e.debug && console.log("loadedmetadata"), t.classList.add("oneline-ready"), t.classList.remove("oneline-load"), l.autoplay || t.classList.add("oneline-paused");
+      const p = {
+        video: o,
+        options: l,
+        els: n,
+        components: d.components,
+        state: e,
+        cleanup: d.cleanup
+      };
+      l.time && J(p), l.progressBar && G(p), l.playButton && I(p), l.muteButton && Y(p), l.fullscreenButton && X(p), d._bindKeyboardFocus(p), d._ready = !0;
+    }), v.add(this), this;
+  }
+  _bindKeyboardFocus(n) {
+    const { video: l, els: e, components: i, cleanup: o } = n, t = e.wrap, r = ["playButton", "progressBar", "muteButton", "fullscreenButton"];
+    function a(p) {
+      p.keyCode === 9 && t.classList.add("keyboard-control");
+    }
+    function d(p) {
+      const u = document.activeElement && document.activeElement.tagName === "BUTTON";
+      p.keyCode === 32 && !u && l.getPaused(function(m) {
+        m ? l.play() : l.pause();
+      });
+    }
+    document.addEventListener("keyup", a), document.addEventListener("keydown", d), o.push(function() {
+      document.removeEventListener("keyup", a), document.removeEventListener("keydown", d);
+    }), r.forEach(function(p) {
+      const u = i[p];
+      u && (u.addEventListener("click", function(m) {
+        (m.clientX || m.clientY) && t.classList.remove("keyboard-control");
+      }), u.addEventListener("focus", function() {
+        t.classList.add("active");
+      }), u.addEventListener("blur", function() {
+        t.classList.remove("active");
+      }));
+    });
+  }
+  play() {
+    this.video && this.video.play();
+  }
+  pause() {
+    this.video && this.video.pause();
+  }
+  destroy() {
+    this._destroyed || (this._destroyed = !0, clearTimeout(this.state.hideTimeout), this.cleanup.forEach(function(n) {
+      try {
+        n();
+      } catch {
+      }
+    }), this.cleanup = [], this.video && this.video.destroy && this.video.destroy(), v.delete(this), this.root.classList.remove("oneline-player"), this.root.replaceChildren());
+  }
+}
+const oe = ".oneline-player{font-family:Helvetica,sans-serif;margin:0;background:transparent;display:flex;align-items:center;width:100%}.oneline-responsive video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;overflow:hidden}.oneline{width:100%;height:100%;display:block}.oneline-ready .oneline{height:auto}.oneline-clickable{cursor:pointer}.oneline-wrap{width:100%;position:relative;z-index:0;-webkit-tap-highlight-color:rgba(0,0,0,0)}.oneline-responsive .oneline-wrap{position:unset}.oneline-error-box{position:absolute;width:100%;height:100%;top:0;left:0;right:0;bottom:0;z-index:110;background:#efefef;color:#000;display:none}.oneline-error-message{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.oneline-error .oneline-error-box{display:block}.oneline-overlay{position:absolute;width:100%;height:100%;top:0;left:0;right:0;bottom:0;z-index:2;transition:opacity .8s cubic-bezier(.1,.79,0,.87);opacity:0}.oneline-overlay{opacity:.2}.oneline-playing .oneline-overlay{opacity:0}.oneline-load .oneline-overlay,.oneline-playing:hover .oneline-overlay{opacity:.2!important}.oneline-hide-controls.oneline-playing:hover .oneline-overlay{opacity:0!important}.oneline-controls{position:absolute;z-index:10;display:flex;align-items:center;flex-direction:row;justify-content:space-between;bottom:20px;left:0;width:100%;opacity:0;transform:translateY(8px);transition:all 1s cubic-bezier(.23,1,.32,1)}.oneline-started:hover .oneline-controls,.oneline-wrap.active .oneline-controls{opacity:1;transform:translateY(0)}.oneline-wrap.oneline-hide-all .oneline-controls{opacity:0;transform:translateY(8px)}.oneline-control-buttons{display:flex;justify-content:space-between;flex-direction:row;margin-left:auto}.oneline-time{padding-bottom:0;font-size:15px;letter-spacing:1px;padding-left:30px;font-family:Helvetica,sans-serif!important;-webkit-font-smoothing:auto}.oneline-progress{position:relative;margin:0 30px;padding:12px 0;flex-grow:1;cursor:pointer;display:block;border-radius:2px}.oneline-progress-fill{width:0;height:4px;border-radius:2px}.oneline-progress-fill-bg{width:100%;height:4px;border-radius:2px}.oneline-progress-seek{position:absolute;z-index:11;top:8px;left:0;width:10px;height:10px;border-radius:5px;transition:opacity .2s linear}.oneline-progress-seek-fill{position:absolute;z-index:12;top:12px;width:0;height:4px;border-radius:2px}.oneline-progress:hover .oneline-progress-fill{opacity:0}.oneline-progress:hover .oneline-progress-seek{opacity:1;-webkit-animation:in .2s ease-out;-webkit-animation-iteration-count:1}.oneline-progress:not(:hover) .oneline-progress-seek{opacity:0;-webkit-animation:out .2s ease-out;-webkit-animation-iteration-count:1}.oneline-progress:hover .oneline-progress-seek-fill{opacity:1}.oneline-progress:not(:hover) .oneline-progress-seek-fill{opacity:0}@-webkit-keyframes in{0%{-webkit-transform:scale(.1,.1)}to{-webkit-transform:scale(1,1)}}@-webkit-keyframes out{0%{-webkit-transform:scale(1,1)}to{-webkit-transform:scale(0,0)}}.oneline-loader-container{width:80px;position:absolute;top:50%;left:50%;margin-top:-15px;margin-left:-40px;height:30px;z-index:3;display:none}.oneline-load .oneline-loader-container{display:block}.oneline-play-pause{width:30px;height:30px;position:absolute;z-index:100;top:50%;left:50%;margin-top:-15px;margin-left:-15px;transition:transform 1s cubic-bezier(.075,.82,.165,1)}.oneline-play-pause:active,.oneline-wrap:active .oneline-play-pause{transform:scale(.9)!important}.oneline-play-pause button{cursor:pointer;display:block;position:relative;width:100%;padding:50%;background:transparent;border:none}.oneline-load .oneline-play-pause{opacity:0}.oneline-wrap:not(.oneline-started):hover .oneline-play-pause{transform:scale(1.2)}.oneline-play-button,.oneline-pause-button{top:0;left:0;position:absolute;transition:all .7s cubic-bezier(.1,.79,0,.87)}@media (max-width: 400px){.oneline-play-pause{width:10%;margin-top:-5%;margin-left:-5%}}.oneline-play-pause svg,.oneline-play-pause img{width:100%;height:auto}.oneline-playing .oneline-play-button{opacity:0}.oneline-paused .oneline-play-button{opacity:1}.oneline-pause-button{opacity:0}.oneline-playing:hover .oneline-pause-button{opacity:1}@media (hover: none){.oneline-playing:hover .oneline-pause-button{opacity:0}}.oneline-hide-controls.oneline-playing:hover .oneline-pause-button,.oneline-paused .oneline-pause-button{opacity:0}.oneline-mute-button svg{display:block}.oneline-mute-button.muted .mute,.oneline-mute-button .unmute{display:none}.oneline-mute-button.muted .unmute{display:block}.oneline-fullscreen-button svg{display:block}.oneline-fullscreen .oneline-fullscreen-button .fullscreen-icon-on,.oneline-fullscreen-button .fullscreen-icon-off{display:none}.oneline-fullscreen .oneline-fullscreen-button .fullscreen-icon-off{display:block}.oneline-mute-button,.oneline-fullscreen-button{width:100%;background:transparent;border:none;margin-right:30px;cursor:pointer;padding:0}button,div{outline-width:0}.keyboard-control button,.keyboard-control div{outline-width:2px!important}.keyboard-control.oneline-playing .oneline-play-pause button{outline-width:0!important}.oneline-logo{position:absolute;top:23px;left:30px;display:block;width:31px;height:20px;z-index:10;opacity:0;transition:opacity .1s linear;text-decoration:none;font-weight:500;font-size:18px}.oneline-wrap:hover .oneline-logo{opacity:.5}.oneline-wrap:hover .oneline-logo:hover{opacity:1}.oneline-poster{position:absolute;z-index:1;top:0;left:0;width:100%;height:100%;-moz-background-size:100% 100%;-o-background-size:100% 100%;-webkit-background-size:100% 100%;background-size:100% 100%}.oneline-play-button .oneline-icon,.oneline-pause-button .oneline-icon,.oneline-mute-button .oneline-icon,.oneline-fullscreen-button .oneline-icon{fill:#fff}.oneline-progress-fill{background-color:#fff}.oneline-progress-fill-bg{background-color:#fff3}.oneline-progress-seek,.oneline-progress-seek-fill{background-color:#fff}.oneline-overlay{background-color:#000}.oneline-loader{background-color:#fff}.oneline-logo,.oneline-time{color:#fff}.oneline-dark .oneline-play-button .oneline-icon,.oneline-dark .oneline-pause-button .oneline-icon,.oneline-dark .oneline-mute-button .oneline-icon,.oneline-dark .oneline-fullscreen-button .oneline-icon{fill:#333}.oneline-dark .oneline-progress-fill{background-color:#333}.oneline-dark .oneline-progress-fill-bg{background-color:#666}.oneline-dark .oneline-progress-seek,.oneline-dark .oneline-progress-seek-fill{background-color:#333}.oneline-dark .oneline-overlay{background-color:#000}.oneline-dark .oneline-loader{background-color:#333}.oneline-dark .la-ball-pulse,.oneline-dark .oneline-logo,.oneline-dark .oneline-time{color:#333}.theme-modern .oneline-controls{bottom:50%;height:100px;margin-bottom:-50px;align-items:center;justify-content:center}.theme-modern .oneline-progress-fill-bg,.theme-modern .oneline-progress-seek,.theme-modern .oneline-progress-seek-fill,.oneline-progress .ring{display:none}.theme-modern .oneline-progress .ring{display:block}.theme-modern .oneline-progress{flex-grow:0}.theme-modern .oneline-progress .ring-circle{transform:rotate(-90deg);transform-origin:50% 50%}.theme-modern .ring-seek{display:none}.theme-modern .oneline-control-buttons{margin-left:0}.la-ball-pulse,.la-ball-pulse>div{position:relative;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.la-ball-pulse{margin:0 auto;display:block;font-size:0;color:#fff}.la-ball-pulse>div{display:inline-block;float:none;background-color:currentColor;border:0 solid currentColor}.la-ball-pulse{width:54px;height:18px}.la-ball-pulse>div:nth-child(1){-webkit-animation-delay:-.2s;-moz-animation-delay:-.2s;-o-animation-delay:-.2s;animation-delay:-.2s}.la-ball-pulse>div:nth-child(2){-webkit-animation-delay:-.1s;-moz-animation-delay:-.1s;-o-animation-delay:-.1s;animation-delay:-.1s}.la-ball-pulse>div:nth-child(3){-webkit-animation-delay:0ms;-moz-animation-delay:0ms;-o-animation-delay:0ms;animation-delay:0ms}.la-ball-pulse>div{width:10px;height:10px;margin:4px;border-radius:100%;-webkit-animation:ball-pulse 1s ease infinite;-moz-animation:ball-pulse 1s ease infinite;-o-animation:ball-pulse 1s ease infinite;animation:ball-pulse 1s ease infinite}.la-ball-pulse.la-sm{width:26px;height:8px}.la-ball-pulse.la-sm>div{width:4px;height:4px;margin:2px}.la-ball-pulse.la-2x{width:108px;height:36px}.la-ball-pulse.la-2x>div{width:20px;height:20px;margin:8px}.la-ball-pulse.la-3x{width:162px;height:54px}.la-ball-pulse.la-3x>div{width:30px;height:30px;margin:12px}@-webkit-keyframes ball-pulse{0%,60%,to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}30%{opacity:.1;-webkit-transform:scale(.01);transform:scale(.01)}}@-moz-keyframes ball-pulse{0%,60%,to{opacity:1;-moz-transform:scale(1);transform:scale(1)}30%{opacity:.1;-moz-transform:scale(.01);transform:scale(.01)}}@-o-keyframes ball-pulse{0%,60%,to{opacity:1;-o-transform:scale(1);transform:scale(1)}30%{opacity:.1;-o-transform:scale(.01);transform:scale(.01)}}@keyframes ball-pulse{0%,60%,to{opacity:1;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}30%{opacity:.1;-webkit-transform:scale(.01);-moz-transform:scale(.01);-o-transform:scale(.01);transform:scale(.01)}}";
+let b = !1;
+function ie() {
+  if (b || typeof document > "u")
+    return;
+  if (document.querySelector("style[data-onelineplayer]")) {
+    b = !0;
+    return;
+  }
+  const s = document.createElement("style");
+  s.setAttribute("data-onelineplayer", "1"), s.textContent = oe, document.head.appendChild(s), b = !0;
+}
+function le(s, n) {
+  ie();
+  const l = D(s), e = N(n);
+  return new te(l, e).init();
+}
+function se(s) {
+  s && typeof s.destroy == "function" && s.destroy();
+}
+const ae = {
+  mount: le,
+  destroy: se
+};
+export {
+  ae as default,
+  se as destroy,
+  le as mount
+};
+//# sourceMappingURL=onelineplayer.mjs.map