youtube-live-stream-checker/example.html at master · ZoesDev/youtube-live-stream-checker · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
<html>
  <head>
    <script>
    var YoutubeChannelId = 'YOUR YOUTUBE CHANNEL ID';
    var Google_API_KEY = 'YOUR GOOGLE API KEY ID';
    var videoId;

      function init() {
        gapi.client.setApiKey(Google_API_KEY);
        gapi.client.load('youtube', 'v3').then(makeRequest);
      }


      function makeRequest() {

        var request = gapi.client.youtube.search.list({
            part: 'snippet',
            channelId: YoutubeChannelId,
            maxResults: 1,
            type: 'video',
            eventType: 'live'

        });

        request.then(function(response) {
          processResult(response);
        }, function(reason) {
          console.log('Error: ' + reason.result.error.message);
        });


      }

      function processResult(result){

        console.log(result);

        var json = JSON.parse(result.body);
        if(json.pageInfo.totalResults == 0){
                        document.getElementById('player').innerHTML = "<h3>There's no live video right now, please try later.</h3>" ;
        } else {
        videoId = json.items[0].id.videoId;
        createIframe();
        }

      }


      /*****************************CREATING IFRAME*********************************/

      function createIframe(){
      // This code loads the IFrame Player API code asynchronously.
      var tag = document.createElement('script');

      tag.src = "https://www.youtube.com/iframe_api";
      var firstScriptTag = document.getElementsByTagName('script')[0];
      firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
      }

      // This function creates an <iframe> (and YouTube player)
      //    after the API code downloads.
      var player;
      function onYouTubeIframeAPIReady() {
        player = new YT.Player('player', {
          height: '390',
          width: '640',
          videoId: videoId,
          events: {
            'onReady': onPlayerReady,
          }
        });
      }

            // 4. The API will call this function when the video player is ready.
      function onPlayerReady(event) {
        event.target.playVideo();
      }


    </script>
    <script src="https://apis.google.com/js/client.js?onload=init"></script>
  </head>
  <body>
    <!-- The <iframe> (and video player) will replace this <div> tag. -->
    <div id="player"></div>
  </body>
</html>