单击时切换到另一个流抽搐API Laravel

时间:2019-02-28 08:52:58

标签: javascript twitch-api

我的问题是关于API的,我想发生的是,当我单击用户的链接时,它将在“”(这是html代码)上打开其特定的流通道:

<body>
<div class='page container-fluid'>
<a name="top"></a>

<div class='spacer'></div>

<div class='block text-center'>
  <h1>Twitch TV JSON API</h1>
  <a href='https://www.twitch.tv/freecodecamp' target='blank'><h3 >FreeCodeCamp<span id='fcc'> ...</span></h3></a>
</div>

<div class='spacer'></div>

<div class='block'>
  <div class='row'>
    <div class='col-md-4' id='user'>
      User:<br>
    </div>
    <div class='col-md-4' id='status'>
      Status:<br>
    </div>
    <div class='col-md-4' id='game'>
      Game:<br>
    </div>
  </div>

</div>

<div class='spacer'></div>

<div id="twitch-embed"></div>

这是JS的代码,我希望不难理解代码:

$(function() {

 var follower = ["monstercat", "OgamingSC2", "cretetion", "freecodecamp", 
"storbeck", "habathcx", "RobotCaleb", "noobs2ninjas", "brunofin"];

    var embed = new Twitch.Embed("twitch-embed", {
    width: 200,
    height: 200,
    channel: follower,
    layout: "video",
    autoplay: false
  });

  embed.addEventListener(Twitch.Embed.VIDEO_READY, () => {
    var player = embed.getPlayer();
    player.play();
    console.log('The video is ready');
  });

  $.ajax({
type: 'GET',
url: 'https://api.twitch.tv/kraken/streams/freecodecamp', //change this to 
 test active
headers: {
  'client-ID': '59x9ex7f5zzongzntqx0zrwleoxy12'
},
success: function(data) {
  console.log(data);
  if (data.stream === null) {
    $('#fcc').html(' is offline');
  } else {
    $('#fcc').html(' is ONLINE!');
  }
},
error: function(err) {
  alert("Error");
}
});

for (var i = 0; i < follower.length; i++) {

 $.ajax({
  type: 'GET',
  url: 'https://api.twitch.tv/kraken/channels/' + follower[i],
  headers: {
    'client-ID': '59x9ex7f5zzongzntqx0zrwleoxy12'
  },
  success: function(dataI) {
   console.log(dataI.display_name);        
        var logo=dataI.logo;

      $('#user').append( '<a target="blank" href="https://www.twitch.tv/' + dataI.name + '">' + dataI.display_name + '</a><br>')

              $.ajax({
                type: 'GET',
                url: 'https://api.twitch.tv/kraken/streams/' + dataI.name, 
                headers: {
                  'client-ID': '59x9ex7f5zzongzntqx0zrwleoxy12'
                },
                success: function(data2) {


                var name = data2._links.self.slice(37)
                //console.log(data2);

                if (data2.stream === null) {                      
                  $('#status').append(' is offline<br>');
                  $('#game').append('N/A<br>');
                } else {
                  $('#status').append(' is ONLINE!<br>');
                  $('#game').append(data2.stream.game + '<br>');
                }


              },
              error: function(err) {
                alert("Error");
              }
            });

     },
       error: function(err) {
       alert("Error: One or more users is no longer available");
     }

   });
};

})

有没有发生这种情况?像链接上的点击功能? TYIA!

0 个答案:

没有答案