'use strict';

var c = console;

window.onload = function(){
    var swurl = "http://swapi.co/api/people/1";
    var pokeurl = "http://pokeapi.co/api/v2/pokemon/1";

    var xhr = new XMLHttpRequest();

    c.log("xhr object created: " + xhr.readyState); // prints 0 in the console showing the object was created bu nothing has been sent.

    xhr.onreadystatechange = function(){
        if(xhr.readyState == 4 && xhr.status == 200){
            
            var data = xhr.responseText;
            var dataType = xhr.responseType;
            c.log(data);
            c.log("the type" + dataType);
            c.log(JSON.parse(data));

            var elem = document.getElementById("main"); // find the id where I want to insert the element
            var obj = JSON.parse(data);                 // parse the element
            elem.innerText = obj.name;                  // since it is an object I can bring what is in the object by looking in the console
        }
    }

    xhr.open("GET",swurl, true);
    xhr.send();
}