Twitch.tv app Issues

I have made an array of the statuses of different channels based on the data i got back from the api. All upto this is perfect, but I don’t know why I am not able to copy the channelStatus data so that I could display the status in my page and hence I am getting ‘undefined’ before each channel. I guess there’s a bit scoping issue maybe. Thanks in advance!
https://codepen.io/amritjha/pen/wJWYXM/

1 Like

Ajax calls are asynchronous. channelStatus is empty when you try to output it.
Do it like this:

function onLoading() {
  channels = ['ESL_SC2', 'OgamingSC2', 'cretetion', 'freecodecamp', 'habathcx', 'RobotCaleb', 'noobs2ninjas'];
  channelStatus = [];
  channels.forEach(function(channelname) {
    apiURL = 'https://wind-bow.glitch.me/twitch-api/channels/' + channelname;
    $.getJSON(apiURL).done(function(data) {
      channelStatus.push(data.status);
      updateChannel();
    });
  });
}

function updateChannel() {
  channel_text = document.querySelectorAll('.channel-status h3');
  for (i = 0; i < channel_text.length; i++) {
    channel_text[i].innerHTML = channelStatus[i];
  }
}

$(document).ready(onLoading);
2 Likes

thnx a lot @jenovs it worked!