Use the Twitchtv JSON API: Codepen example appears broken

[hey-its-iota]

http://codepen.io/FreeCodeCamp/full/adBpOw

The Codepen example linked to in the challenge appears broken. It is not showing any information other than the "Twitch Streamers" bar at the top.

Inspecting with Chrome, the page is encountering 16 errors on loading all similar to the following:

GET https://api.twitch.tv/kraken/streams/ESL_SC2?callback=jQuery21307896199643146247_1455574213075&_=1455574213076 net::ERR_INSECURE_RESPONSE

[ltegman]

This is what certain browsers do when you try to access an HTTPS resource from an HTTP page. This link simply needs to be switched to https to prevent this from happening.

[raisedadead]

@ltegman I guess we can update all the codepen.io example links to HTTPS.
Better fix everywhere than just this challenge.

I'll put a PR if you agree.

[ltegman]

@raisedadead Unfortunately you can also end up with a problem if the pen uses http resources and you link to the https version, so I'd just change this one unless you want to audit them all for what kind of resources they use.

[raisedadead]

@ltegman yup you are right, I tested changing this challenge with HTTPS, and its already throwing warnings

Mixed Content: The page at 'https://s.codepen.io/FreeCodeCamp/fullpage/adBpOw?' was loaded over HTTPS, but requested an insecure image 'http://dummyimage.com/50x50/ecf0e7/5c5457.jpg&text=0x3F'. This content should also be served over HTTPS.

[raisedadead]

Closing in favor of #7700