JSON relating Twitchtv JSON API app

JSON relating Twitchtv JSON API app
0.0 0

#1

i cant understand the second .getjson
i can see that its using the bootstrap but it doesnt make sense
i get it that this defines the css for displayed channels but still i cant see why the variables are named so?
html and name?there is no such id or class in the html section so how does this html in javascript interact with the html in the html section?

$.getJSON(makeURL("channels", channel), function(data) {
        var logo = data.logo != null ? data.logo : "https://dummyimage.com/50x50/ecf0e7/5c5457.jpg&text=0x3F",
          name = data.display_name != null ? data.display_name : channel,
          description = status === "online" ? ': ' + data.status : "";
          html = '<div class="row ' + 
          status + '"><div class="col-xs-2 col-sm-1" id="icon"><img src="' + 
          logo + '" class="logo"></div><div class="col-xs-10 col-sm-3" id="name"><a href="' + 
          data.url + '" target="_blank">' + 
          name + '</a></div><div class="col-xs-10 col-sm-8" id="streaming">'+ 
          game + '<span class="hidden-xs">' + 
          description + '</span></div></div>';
        status === "online" ? $("#display").prepend(html) : $("#display").append(html);
      });

#2

Firstly, to post code in the forum use triple backticks. See here for more details.

Secondly, I’m not wholly sure that I understand your question. The variables html and name are JavaScript variables and do not have to correspond to id’s in the HTML. They are simply used to store data so that a HTML string can be built and appended/prepended to the page.

Thirdly, where did this code come from? Is it someone elses code that you are reading to try gain an understanding of how to complete this challenge yourself?

EDIT
I’ve only realized that that is actually the source code for FCC’s version of the challenge. To the best of my knowledge, that source code is not designed with study in mind. Realistically, you probably shouldn’t use that as a reference since it is designed with functionality, rather than readability, in mind.


#3

I cleaned up your code.
You need to use triple backticks to post code to the forum.
See this post for details.