Twitch.tv project working but data gets mixed up. Please help

1

Hey guys,
I got my Twitchtv JSON API project mostly finished but I can’t figure out why the data gets mixed up between channels after it gets output to the page’s list. Sometimes it shows a channel offline and other then online again. Also the game statues gets mixed around between channels.

So it kind of looks like the object data is not always getting pulled from the API’s server. I’ll post my JavaScript code here but you can also mess with it on codepen. http://codepen.io/spoonhonda/full/pRapma/

var twitchUsers =  ["ESL_SC2", "seebotschat", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas", "pokimane", "streamerhouse", "nocopyrightsounds"];


function twitchTVinfo() {
	var onlineStatus;
	var channelURL;
	var channelName;
	var logo;
	var nowPlaying;
	var userTemp;

	
	//for (var i=0; i < twitchUsers.length; ++i) {
	twitchUsers.forEach(function(userTemp) {
		console.log(userTemp);
		$.getJSON({
			type: 'GET',
			url: 'https://wind-bow.gomix.me/twitch-api/streams/' + userTemp  + '?callback=?',
			dataType: 'jsonp',
			success: function(result) {
				if (result.stream === null) {
					nowPlaying = "Offline";
					onlineStatus = "offline";
				} else if (result.stream === undefined) {
					nowPlaying = "Account Closed";
					onlineStatus = "offline";
				} else {
					nowPlaying = result.stream.game;
					onlineStatus = "online";
				};
			}});
		
		$.getJSON({
			type: 'GET',
      url: 'https://wind-bow.gomix.me/twitch-api/channels/' + userTemp  + '?callback=?',
      dataType: 'jsonp',
      success: function(data) {
				channelURL = data.url;
				channelName = data.display_name;
				logo = data.logo;
				
				$("ul").append('<a class="well list-divs" target="_blank" href="' +
											 channelURL + '">' + '<li><img src="' + 
											 logo + '" alt="Smiley face" height="42" width="42"> <h3 class="title ">' + 
											 channelName + '</h3><h6>' +
											 nowPlaying + '</h6>' + '<div class="text">' + 
											 onlineStatus + '</div></li></a>'
											);
			}});
	});
}
	

$(document).ready(function() {

	$("#getResult").on("click", function() {
		$("ul").empty();
		twitchTVinfo();
	});	
	
});

Thanks

2

see this thread -

2 Likes
3

Oh, thanks. I didn’t find that thread when searching. I’ll take a look at it.

1 Like