twitch api

FreeCodeCamp API Call (OFFLINE)

//GET STREAMS
{  
   "_links":{  
      "self":"https://api.twitch.tv/kraken/streams/freecodecamp",
      "channel":"https://api.twitch.tv/kraken/channels/freecodecamp"
   },
   "stream":null
}

//GET USERS

/**/jQuery21308491401115898043_1440921888417({  
   "display_name":"FreeCodeCamp",
   "_id":79776140,
   "name":"freecodecamp",
   "type":"user",
   "bio":"We help you learn to code, then practice by building projects for nonprofits. Learn Full-stack JavaScript, build a portfolio, and get a coding job by joining our open source community at http://freecodecamp.com",
   "created_at":"2015-01-14T03:36:47Z",
   "updated_at":"2015-08-30T10:16:57Z",
   "logo":"http://static-cdn.jtvnw.net/jtv_user_pictures/freecodecamp-profile_image-f1b681380c0b0380-300x300.png",
   "_links":{  
      "self":"https://api.twitch.tv/kraken/users/freecodecamp"
   }
})

ONLINE API Call

//GET STREAMS

{  
   "_links":{  
      "self":"https://api.twitch.tv/kraken/streams/troydangaming",
      "channel":"https://api.twitch.tv/kraken/channels/troydangaming"
   },
   "stream":{  
      "_id":16065770816,
      "game":"Madden NFL 16",
      "viewers":1031,
      "created_at":"2015-08-29T16:05:03Z",
      "video_height":720,
      "average_fps":59.6125301205,
      "is_playlist":false,
      "_links":{  
         "self":"https://api.twitch.tv/kraken/streams/troydangaming"
      },
      "preview":{  
         "small":"http://static-cdn.jtvnw.net/previews-ttv/live_user_troydangaming-80x45.jpg",
         "medium":"http://static-cdn.jtvnw.net/previews-ttv/live_user_troydangaming-320x180.jpg",
         "large":"http://static-cdn.jtvnw.net/previews-ttv/live_user_troydangaming-640x360.jpg",
         "template":"http://static-cdn.jtvnw.net/previews-ttv/live_user_troydangaming-{width}x{height}.jpg"
      },
      "channel":{  
         "_links":{  
            "self":"https://api.twitch.tv/kraken/channels/troydangaming",
            "follows":"https://api.twitch.tv/kraken/channels/troydangaming/follows",
            "commercial":"https://api.twitch.tv/kraken/channels/troydangaming/commercial",
            "stream_key":"https://api.twitch.tv/kraken/channels/troydangaming/stream_key",
            "chat":"https://api.twitch.tv/kraken/chat/troydangaming",
            "features":"https://api.twitch.tv/kraken/channels/troydangaming/features",
            "subscriptions":"https://api.twitch.tv/kraken/channels/troydangaming/subscriptions",
            "editors":"https://api.twitch.tv/kraken/channels/troydangaming/editors",
            "videos":"https://api.twitch.tv/kraken/channels/troydangaming/videos",
            "teams":"https://api.twitch.tv/kraken/channels/troydangaming/teams"
         },
         "background":null,
         "banner":null,
         "broadcaster_language":"en",
         "display_name":"TroydanGaming",
         "game":"Madden NFL 16",
         "logo":"http://static-cdn.jtvnw.net/jtv_user_pictures/troydangaming-profile_image-394c00b5cd5c5e2b-300x300.png",
         "mature":null,
         "status":"24 Hour Stream Today OH BOY",
         "partner":true,
         "url":"http://www.twitch.tv/troydangaming",
         "video_banner":"http://static-cdn.jtvnw.net/jtv_user_pictures/troydangaming-channel_offline_image-97b2e6b289c025de-640x360.png",
         "_id":48478126,
         "name":"troydangaming",
         "created_at":"2013-09-02T17:29:29Z",
         "updated_at":"2015-08-30T10:17:34Z",
         "delay":0,
         "followers":70613,
         "profile_banner":"http://static-cdn.jtvnw.net/jtv_user_pictures/troydangaming-profile_banner-8ab9e72f01ab77f1-480.png",
         "profile_banner_background_color":"null",
         "views":726741,
         "language":"en"
      }
   }
}

//GET USER

{  
   "display_name":"TroydanGaming",
   "_id":48478126,
   "name":"troydangaming",
   "type":"user",
   "bio":"Troydan Gaming | In the heart of Nova Scotia | Community based stream - We give our subscribers control of what we do! ",
   "created_at":"2013-09-02T17:29:29Z",
   "updated_at":"2015-08-30T10:17:34Z",
   "logo":"http://static-cdn.jtvnw.net/jtv_user_pictures/troydangaming-profile_image-394c00b5cd5c5e2b-300x300.png",
   "_links":{  
      "self":"https://api.twitch.tv/kraken/users/troydangaming"
   }
}

Twitch.js

var offline = [];
var online = [];
var stat = [];
var user = ["freecodecamp", "storbeck", "terakilobyte", "habathcx", "RobotCaleb", "thomasballinger", "noobs2ninjas", "beohoff", "troydangaming", "brunofin", "twitch", "streamerhouse", "medrybw", "insomniacgamers12345",];
var users = user.join(',')
var id = "qfujbqegh33c7oxpx6eawsy947rixk1";
var userOnline = online.join(',');
var userOffline = offline.join(',');
var i = 0;
var stri = "";
var str = "";
var stry = "";

function getTwitch(user) {
  //calling the initial twitch api
  var url = 'https://api.twitch.tv/kraken/streams/' + user + '?callback=foo';
  $.ajax({
    url: url,
    dataType: 'jsonp',
    type: 'get',
    success: twitchSucc, //defining succces/error functions
    error: twitchErr,
  });
}

function twitchSucc(twitch) {
 var streamsObj = twitch.stream;
  
  if (twitch.stream !== undefined) { //as long as twitch.stream isn't undefined this should run
    var urk = twitch._links.channel; // url for second api call, this time to obtain the users references
    console.log(twitch._links.channel+"?callback=foo")

    function getUsers() {
      $.ajax({ //call for users
        url: urk + "?callback=foo",
        dataType: 'jsonp',
        type: 'get',
        success: function(data) {
          var url = data.url;
          var logo = data.logo;
          for (i; i < user.length; i++) {
            str += "<a href='" + url + "'>"
            str += "<div class='row border new'>";
            str += "<img class='col-md-2' id='profile' src='" + logo + "'>"
            str += "<p class='col-md-5'>";
            str += user[i];
            str += "</p>";
            if (streamsObj !== null) { //if this doesn't evalute as null run it, strangely enough it's running as if its all null
              stat.push(streamsObj.channel.status);
              str += "<span class='col-md-5 circle' id='online'>"
              str += "</span>"
              str += "<p class='col-md-12' id='status'>"
              str += stat[i];
              str += "</p>"
            } else if (streamsObj === null) { //If it's null run this, this is the only else if running, for some reason all the streamsObj is returning as null
              str += "<span class='col-md-5 circle' id='offline'>"
              str += "</span>"
              str += "<p class='col-md-12' id='status'>"
              str += "Ooops" + " " + user[i] + " " + "is Offline, maybe later?"
              str += "</p>"
            } else {
              str += "<span class='col-md-5 circle' id='closed'>"
              str += "</span>"
              str += "<p class='col-md-12' id='status'>"
              str += twitch.message + "Maybe they closed it?";
              str += "</p>"
            }
            str += "</div>"
            str += "</a>"

          }

        },
        error: function(error) {
          console.log("error");
        }
      });
      $('#allUsers').html(str);
    }
    getUsers();
  } else if (streamsObj === null) { //again refusing to show up why?
    var url = twitch._links.channel;
    if(twitch._links === null){
    console.log(twitch);
    }
    function getOff() {
      $.ajax({
        url: url,
        dataType: 'jsonp',
        type: 'get',
        success: function success(twitchOff) {
          offline.push(twitchOff.display_name);
          var profile = twitchOff.logo;
          for (i; i < offline.length; i++) {
            stry += "<a href='" + url + '>';
            stry += "<div class='row border new'>";
            stry += "<img class='col-md-2' id='profile' src='" + profile + "'>"
            stry += "<p class='col-md-5'>";
            stry += offline[i];
            stry += "</p>";
            stry += "<span class='col-md-5 circle' id='offline'>"
            stry += "</span>"
            stry += "<p class='col-md-12' id='status'>"
            stry += "Looks like" + " " + offline[i] + " " + "is Offline, maybe later?"
            stry += "</p>"
            stry += "</div>"
            stry += "</a>"
          }
          $('#use').html(stry); //should print this out to the html but it doesnt? 
        },
        error: function(error) {
          console.log('ERROR!!!!');
          $('#error').html('error');
        },
      });

    }
          

    getOff();
  console.log(offline);
  } else if (streamsObj !== null && streamsObj !== undefined) { /
    var chan = streamsObj.channel;
      online.push(chan.display_name);
      var oProfile = chan.logo;
      var uri = twitch._links.channel.url;
    console.log(uri)
      for (i; i < online.length; i++) {
        stri += "<a href='" + uri + '>';
        stri += "<div class='row border new'>";
        stri += "<img class='col-md-2' id='profile' src='" + oProfile + "'>"
        stri += "<p class='col-md-5'>";
        stri += online[i];
        stri += "</p>";
        stri += "<span class='col-md-5 circle' id='online'>"
        stri += "</span>"
        stri += "<p class='col-md-12' id='status'>"
        stri += stat[i]
        stri += "</p>"
        stri += "</div>"
        stri += "</a>"
      }

    
    $('#users').html(stri); //should print this out to the html but it doesnt? 
//
  } else {
    $('#closed').html("Error:" + twitch.status)
  }
  $('#all').click(function() {
    if ($('#users').not('.hidden') || $('#use').not('.hidden')) {
      $('#users').addClass('hidden');
      $('#use').addClass('hidden');
      $('#allUsers').removeClass('hidden')
    }
  });
  $('#on').click(function() {
    if ($('#allUsers').not('.hidden') || $('#use').not('.hidden')) {
      $('#allUsers').addClass('hidden');
      $('#use').addClass('hidden');
      $('#users').removeClass('hidden');
    }
  });
  $('#offl').click(function() {
    if ($('#users').not('.hidden') || $('#allUsers').not('.hidden')) {
      $('#users').addClass('hidden');
      $('#allUsers').addClass('hidden');
      $('#use').removeClass('hidden');
    }
  });
}

function twitchErr(err) {
  console.log("ERROR!")
};
$(document).ready(function() {

  user.forEach(getTwitch);
  

});