I used a for loop to iterate through the list of twitch channels I want to display. I’ve now received three API responses within my call (which is great as previously I was doing one API call per channel). The problem I’m having now is I don’t know the best to iterate through my API responses to display whether the user is online/offline.
Below’s my code. When I console log data 2
I get three separate objects. I’m just not sure how to access them properly to display the game or display if the user is offline. Here’s my codepen: https://codepen.io/rgsoto/pen/aVRJYp?editors=1111
window.onload = function searchQuery() {
let baseUrl = 'https://wind-bow.gomix.me/twitch-api/channels/';
let fullUrlEsl = baseUrl + 'ESL_SC2';
let fullUrlOgaming = baseUrl + 'OgamingSC2';
let fullUrlFcc = baseUrl + 'freecodecamp';
let channels = ["ESL_SC2", "freecodecamp", "OgamingSC2"]
for (var i = 0; i < channels.length; i++) {
$.ajax ({
type: 'GET',
dataType: "jsonp",
url: baseUrl + channels[i],
success: function(dataI){
//console.log(dataI);
$.ajax({
type: 'GET',
dataType: "jsonp",
url: 'https://wind-bow.gomix.me/twitch-api/streams/'+ dataI.name,}).done(function(data2){
console.log(data2);
if (data2.stream == null) {
$("#ESL_SC2_stream").html('is offline');
$("#OgamingSC2_stream").html('is offline');
$("#freecodecamp_stream").html('is offline');
} else {
$("#ESL_SC2_stream").html(data2.stream.game);
$("#OgamingSC2_stream").html(data2.stream.game);
$("#freecodecamp_stream").html(data2.stream.game);
}
});
},
error: function (error) {
alert("Error: User not found");
}
});
}
};