I need help with twitch.tv - getting nowhere. ;-(
I need logo, name and status of the channels that are in array [“ESL_SC2”, “OgamingSC2”, “cretetion”, “freecodecamp”, “storbeck”, “habathcx”, “RobotCaleb”, “noobs2ninjas”, “brunofin”, “comster404”]-(given in instructions).
I have no problem with channels that do not exist, or with channels that are online.
But the one that are offline — I can not get, unless I cheat and use a constant for path. (see commented part of the code with IT WORKS)
However in a loop, even that channels[i] is correct (console.log check), somehow if I form the path
as concatenation of strings - all of the sudden the name is undefined and logo does not exist.
Here is my code (I got this by trial and error and do not know if it is correct to look under streams, and channels
for online, offline respectively)
here is my codepen link: [http://codepen.io/zvukmiro/pen/LbYZdY?editors=0001]
here is my code
$(document).ready(function() {
// array with channels from fcc project instructions, just so I do have all 3 kinds(online, offline and non-existing)
var channels = [“ESL_SC2”, “OgamingSC2”, “cretetion”, “freecodecamp”, “storbeck”, “habathcx”, “RobotCaleb”, “noobs2ninjas”, “brunofin”, “comster404”];
// id for twitch got when registered at twitch.tv, instructions:
//Go to https://www.twitch.tv/settings/connections
//Log in to twitch and scroll down to “Register your application”
//Add a name for your project and set the Redirect URI to your CodePen project URL without the editors part, register, now see your Client ID.
var id = “i0fk7wb0ymfkv9dz7g7oo02nm5y7ukz”;
var url = “https://api.twitch.tv/kraken/streams/”;
var urlOff = “https://api.twitch.tv/kraken/channels/”;
//iterate thru different channels and get if they are broadcasting, or offline, or do not exist
for (var i = 0; i < channels.length; i++) {
var url_channel = url + channels[i] + “?client_id=” + id + “&callback=?”;
console.log(channels[i]);
var url_channelOff=urlOff+ channels[i] +"?client_id="+ id + “&callback=?”;
//THIS WORKS: var url_channelOff=“https://api.twitch.tv/kraken/channels/noobs2ninjas?client_id=i0fk7wb0ymfkv9dz7g7oo02nm5y7ukz&callback=?";
console.log(url_channel);
console.log(url_channelOff);
$.getJSON(url_channel).done(function(dataChannels) {
var logo;
var status;
var name;
if (dataChannels.error) {
logo = “http://res.cloudinary.com/dplyxbspe/image/upload/v1478562512/A_Logo_06_dlhnan.jpg”;
name = dataChannels.message;
status = dataChannels.error;
$(”#list").prepend("
} //end of if
else if(dataChannels.stream === null){
//that means they are offline
$.getJSON(url_channelOff, function(dataOff){
logo=dataOff.logo;
name=dataOff.display_name;
status="Offline";
//console.log(name);
$("#list").prepend("<div class='row'>" + "<div class='col-md-4'>" + "<a href='https://api.twitch.tv/kraken/streams/'" + channels[i]+">"+"<img src='" + logo + "'>"+"</a>" + "</div>" + "<div class='col-md-4'>" + name + "</div>"+"<div class='col-md-4'>"+status+ "</div></div>");
});
}
else{
//this mean they are online - include message what they are broadcasting
logo=dataChannels.stream.channel.logo;
name=dataChannels.stream.channel.display_name;
status=dataChannels.stream.channel.status;
$("#list").prepend("<div class='row'>" + "<div class='col-md-4'>" + "<img src='" + logo + "'>" + "</div>" + "<div class='col-md-4'>" + name + "</div>"+"<div class='col-md-4'>"+status+ "</div></div>");
}
}); // end of getJSON.done call
} // end of for loop
});