https://www.gtcourmayeur.com/wp-content/plugins/bnj-floating_video/main.js?ver=1788797343

1let executed = false;
2let currentTime = 0;
3let videoID = null;
4const tag = document.createElement("script");
5
6tag.src = "https://www.youtube.com/iframe_api";
7const firstScriptTag = document.getElementsByTagName("script")[0];
8firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
9
10let player;
11let smallPlayer;
12let playerContainer;
13function onYouTubeIframeAPIReady() {
14  // console.log("onYouTubeIframeAPIReady");
15  // document.addEventListener("DOMContentLoaded", () => {
16    const firstVideoContainer = document.querySelectorAll(
17      //"[data-type='youtube']"
18      ".livetv .video-wrapper > div"
19    )[0];
20    // console.log('aaaa', firstVideoContainer, firstVideoContainer.dataset)
21    const iframe = firstVideoContainer.querySelectorAll("iframe")[0];
22    videoID = youtube_parser(firstVideoContainer.dataset.src);
23    // console.log("floating started", iframe, firstVideoContainer, videoID);
24  
25    // player = new YT.Player(iframe, {
26    //   events: {
27    //     onReady: onPlayerReady,
28    //     onStateChange: onPlayerStateChange,
29    //   },
30    // });
31
32    // console.log('player', player)
33  
34    document.body.addEventListener("touchmove", onScroll);
35    window.addEventListener("scroll", onScroll);
36  // });  
37  // player = new YT.Player('youtube-video', {
38  //   events: {
39  //     'onReady': onPlayerReady,
40  //     'onStateChange': onPlayerStateChange
41  //   }
42  // });
43}
44
45function onScroll(e) {
46  if (!executed && jQuery(window).scrollTop() > 100 /*window.innerHeight*/) {
47    executed = true;
48    //console.log("scroll", player.getCurrentTime());
49    // console.log('ct', player.getCurrentTime());
50    // player.pauseVideo();
51    createSmallPlayer();
52    // console.log('ct', player.getCurrentTime());
53  } else if (executed && jQuery(window).scrollTop() < 100) {
54    executed = false
55    // console.log('ct', player.getCurrentTime());
56    destroySmallPlayer();
57    // player.playVideo();
58    // console.log('ct', player.getCurrentTime());
59  }
60}
61
62function onPlayerReady() {
63    setTimeout(()=> {
64    // console.log("hey Im ready");
65    window.addEventListener("scroll", onScroll);
66    }, 2000)
67  //do whatever you want here. Like, player.playVideo();
68}
69
70function onPlayerStateChange() {
71  console.log("my state changed");
72}
73
74function createSmallPlayer () {
75    if (document.querySelectorAll('.smallplayer').length) return
76    console.log('createSmallPlayer')
77    const playerContainer = document.body
78    .appendChild(document.createElement("div"))
79    playerContainer.classList.add('smallplayer')
80    const playerDiv = playerContainer.appendChild(document.createElement("div"))
81
82    player = new YT.Player(playerDiv, {
83        height: '180',
84        width: '320',
85        videoId: videoID,
86        playerVars: {
87          'autoplay': 1,
88          'mute': 1 // N.B. here the mute settings.
89        },
90        events: {
91            'onReady': () => { 
92                // console.log('smallplayer Ready'); 
93                // const close = playerContainer.appendChild(document.createElement('div'))
94                // console.log('smallplayer Ready', close); 
95                // close.innerHTML = '✕';
96                // close.classList.add('close');
97                // console.log('smallplayer Ready', close); 
98                // close.addEventListener('click', destroySmallPlayer)
99            },
100        }
101    })
102}
103
104function destroySmallPlayer () {
105    console.log('destroySmallPlayer')
106    const players = document.querySelectorAll('.smallplayer')
107    players.forEach(element => {
108       element.remove()
109    });
110}
111
112function youtube_parser(url){
113    var regExp = /^.*((youtu.be\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#&?]*).*/;
114    var match = url.match(regExp);
115    return (match&&match[7].length==11)? match[7] : false;
116}
117/*
118
119  console.log('floating started', document.querySelectorAll("[data-type='youtube']"));
120  var tag = document.createElement('script');
121
122  tag.src = "https://www.youtube.com/iframe_api";
123  var firstScriptTag = document.getElementsByTagName('script')[0];
124  firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
125
126  // 3. This function creates an <iframe> (and YouTube player)
127  //    after the API code downloads.
128  var player;
129  function onYouTubeIframeAPIReady() {
130    player = new YT.Player('floating', {
131      height: '360',
132      width: '640',
133      videoId: 'WkBX4N79r4w',
134      playerVars: {
135        //'autoplay': 1,
136        //'mute': 1 // N.B. here the mute settings.
137      },
138      events: {
139        'onReady': onPlayerReady,
140        'onStateChange': onPlayerStateChange
141      }
142    });

143  }
144
145  // 4. The API will call this function when the video player is ready.
146  function onPlayerReady(event) {
147    // console.log('player ready', event)
148    setTimeout(function () {
149        console.log('player  2', player)
150        // player.playVideo();
151        event.target.playVideo();
152    }, 1500)
153    // 
154  }
155
156  // 5. The API calls this function when the player's state changes.
157  //    The function indicates that when playing a video (state=1),
158  //    the player should play for six seconds and then stop.
159  var done = false;
160  function onPlayerStateChange(event) {
161    console.log(event.data)
162    // if (event.data == YT.PlayerState.PLAYING && !done) {
163    //   setTimeout(stopVideo, 6000);
164    //   done = true;
165    // }
166  }
167  function stopVideo() {
168    player.stopVideo();
169  }
170
171*/