https://www.its.ac.id/news/wp-content/plugins/its-network-core/assets/its-youtube-lightbox.js?ver=2.6.24

1(function () {
2  "use strict";
3
4  var lightbox = null;
5  var frame = null;
6  var closeBtn = null;
7
8  function init() {
9    var triggers = document.querySelectorAll('[data-action="youtube"]');
10    if (!triggers.length) {
11      return;
12    }
13
14    createLightbox();
15
16    triggers.forEach(function (trigger) {
17      trigger.addEventListener("click", function (e) {
18        e.preventDefault();
19        var url = trigger.getAttribute("data-url");
20        if (url) {
21          open(url);
22        }
23      });
24    });
25  }
26
27  function createLightbox() {
28    lightbox = document.querySelector(".its-youtube-lightbox");
29    if (lightbox) {
30      frame = lightbox.querySelector(".its-youtube-lightbox-frame");
31      closeBtn = lightbox.querySelector(".its-youtube-lightbox-close");
32      bindClose();
33      return;
34    }
35
36    lightbox = document.createElement("div");
37    lightbox.className = "its-youtube-lightbox";
38    lightbox.setAttribute("role", "dialog");
39    lightbox.setAttribute("aria-modal", "true");
40    lightbox.setAttribute("aria-label", "YouTube video");
41    lightbox.innerHTML =
42      '<button type="button" class="its-youtube-lightbox-close" aria-label="Close video">' +
43      '<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>' +
44      "</button>" +
45      '<div class="its-youtube-lightbox-frame"></div>';
46    document.body.appendChild(lightbox);
47
48    frame = lightbox.querySelector(".its-youtube-lightbox-frame");
49    closeBtn = lightbox.querySelector(".its-youtube-lightbox-close");
50    bindClose();
51  }
52
53  function bindClose() {
54    if (!lightbox || !closeBtn) {
55      return;
56    }
57
58    closeBtn.addEventListener("click", close);
59    lightbox.addEventListener("click", function (e) {
60      if (e.target === lightbox) {
61        close();
62      }
63    });
64    document.addEventListener("keydown", function (e) {
65      if (e.key === "Escape" && lightbox.classList.contains("is-open")) {
66        close();
67      }
68    });
69  }
70
71  function open(url) {
72    var videoId = extractYouTubeId(url);
73    if (!videoId || !frame) {
74      return;
75    }
76
77    frame.innerHTML =
78      '<iframe src="https://www.youtube.com/embed/' +
79      videoId +
80      '?autoplay=1&rel=0" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>';
81    lightbox.classList.add("is-open");
82    document.body.style.overflow = "hidden";
83  }
84
85  function close() {
86    if (!frame || !lightbox) {
87      return;
88    }
89    frame.innerHTML = "";
90    lightbox.classList.remove("is-open");
91    document.body.style.overflow = "";
92  }
93
94  function extractYouTubeId(url) {
95    var match = url.match(
96      /(?:youtu\.be\/|youtube\.com\/(?:embed\/|v\/|watch\?v=|watch\?.+&v=))([^&\n?#]+)/
97    );
98    return match ? match[1] : "";
99  }
100
101  if (document.readyState === "loading") {
102    document.addEventListener("DOMContentLoaded", init);
103  } else {
104    init();
105  }
106})();