https://prosleduet.media/wp-content/themes/prosleduet/assets/js/custom-youtube.js?ver=7.1.2

1/**
2 * Get videos on load
3 */
4document.addEventListener('DOMContentLoaded', function () {
5    getVideos();
6})
7
8/**
9 * For each video player, create custom thumbnail or
10 * use Youtube max resolution default thumbnail and create
11 * iframe video.
12 */
13function getVideos() {
14    var v = document.getElementsByClassName("youtube-player");
15    for (var n = 0; n < v.length; n++) {
16        var p = document.createElement("div");
17        var id = v[n].getAttribute("data-id");
18
19        var placeholder = v[n].hasAttribute("data-thumbnail") ? v[n].getAttribute("data-thumbnail") : "";
20
21        if (placeholder.length) {
22            p.innerHTML = createCustomThumbail(placeholder)
23        } else {
24            p.innerHTML = createThumbail(id)
25        }
26        v[n].appendChild(p);
27        p.addEventListener("click", function () {
28            var parent = this.parentNode;
29            createIframe(parent, parent.getAttribute("data-id"));
30        });
31    }
32}
33
34/**
35 * Create custom thumbnail from data-attribute provided url
36 * @param {string} url
37 * @return {string} The HTML containing the <img> tag
38 */
39function createCustomThumbail(url) {
40    return ('<img class="youtube-thumbnail" src="' + url + '" alt="Youtube Preview" /><div class="youtube-play-btn"></div>');
41}
42
43/**
44 * Get Youtube default max resolution thumbnail
45 * @param {string} id The Youtube video id
46 * @return {string} The HTML containing the <img> tag
47 */
48function createThumbail(id) {
49    return ('<img class="youtube-thumbnail" src="//i.ytimg.com/vi_webp/' + id + '/maxresdefault.webp" alt="Youtube Preview"><div class="youtube-play-btn"></div>');
50}
51
52/**
53 * Create and load iframe in Youtube container
54 **/
55function createIframe(v, id) {
56    var iframe = document.createElement("iframe");
57    console.log(v);
58    iframe.setAttribute("src", "//www.youtube.com/embed/" + id + "?autoplay=1&color=white&autohide=2&modestbranding=1&border=0&wmode=opaque&enablejsapi=1&showinfo=0&rel=0");
59    iframe.setAttribute("frameborder", "0");
60    iframe.setAttribute("class", "youtube-iframe");
61    v.firstChild.replaceWith(iframe);
62}
63
64// /** Pause video on modal close **/
65// $("#video-modal").on("hidden.bs.modal", function (e) {
66//     $(this).find("iframe").remove();
67// });
68//
69// /** Pause video on modal close **/
70// $("#video-modal").on("show.bs.modal", function (e) {
71//     getVideos();
72// });