Looking for feedback/help on the FCC Twitch TV project

I Built This
,
1

Hi Everyone

I’m relatively new to FCC and love it. I was looking for some feedback on the Twitch TV API project if that’s possible?

I use the following URL to check if a channel is streaming

https://wind-bow.glitch.me/twitch-api/streams/[channel display name]

If a channel is offline, the 1st name value pair returns “stream”: null.

If you look at the URL below (FCC’s channel which rarely streams you can see the ‘null’ value.

https://wind-bow.gomix.me/twitch-api/streams/freecodecamp

I’ve set up an ajax call (script below) to check if ‘null’ is returned.

$.ajax({
url: https://wind-bow.gomix.me/twitch-api/streams/freecodecamp,
dataType: “jsonp”,
success: function(data){
if(data.stream === null ) {
// channel offline
// do something
} else {
// channel online
// do something
}
}
});

When I run the ajax request, approximately 50% of the time I get an ‘undefined’ returned.

Here’s the page I’ve built

If I refresh my page a couple of times, the ‘undefined’ disappears

I’d be really grateful for any insights on what’s going on

In case it’s not above here’s the URL of my project https://hugoelliott.com/projects/twitch.html and here’s where the code is stored on GitHub https://github.com/hugo-elliott/hugoelliott.com

many thanks

Hugo

2

Hi, really nice design!

The reason it sometimes show undefined is because you don’t wait for the first round of AJAX calls to finish. So, you are running the AJAX calls which determine the channel’s status (and pushes that to an array), while at the same time (with no guarantee that the other AJAX call is already finished) you also make an AJAX call which uses the value that you expect to be pushed to the array (but you can’t know for sure).

So, you should first check for all channels what their status is, and then continue with the AJAX call for info. Since the time it takes to finish the call varies, there is a chance (but you can’t be sure) that the first call finishes before the second, in which case everything seems to work as expected. Basically, if you refresh often enough, you will eventually get that all the calls for the different channels are executed in the order you expect them to.

3

Hi BenGitter

Thanks for the advice & hint. I’ve amended my code and it works!

I found this https://davidwalsh.name/write-javascript-promises which was really helpful in figuring it out.

Thanks for the nice design comment. I thought it would be good to have my own website which I can put my FCC code on rather than on code pen.

Hugo