//setup 'before' functions for countdown on keyup
    var typingTimer; //timer identifier
    var doneTypingInterval = 500;  //time in ms

     //on keyup, start the countdown
    $('.ui').keyup(function(){
      var value = $('.ui').val;
        clearTimeout(typingTimer);
        if (value) {
        typingTimer = setTimeout(doneTyping, doneTypingInterval);
        } 
    });

 //user is "finished typing," do something
    function doneTyping () {
     httprequest();
    }

function httprequest (){
// function to capture input and add to Wiki URL  
function add() {
  var up = document.getElementById('sbox').value;
  var tempurl = "";
  var urlsearchT = "https://en.wikipedia.org/w/api.php?action=query&format=json&origin=*&generator=search&gsrsearch=" + up + "&prop=extracts&gsrnamespace=0&gsrlimit=10&gsroffset=0&gsrwhat=text&exintro&explaintext&exsentences=1&exlimit=max";  
           if (up !== null) {
            return urlsearchT;
          } else if (up == ""){
            return tempurl;
           }
 };
  
var request = new XMLHttpRequest();
var method = 'GET';
var async = true;

// the request  
request.open(method, add(), async);
request.send(); 
request.onreadystatechange = function() {
    if (request.readyState == 4 && request.status == 200) {
      var data = JSON.parse(request.responseText);      
      var header = document.querySelector('header');
    }

//populate function pull data variable above
request.onload = function() {  
  populate(data);
  }
  function populate() { 
    header.innerHTML = ""; 
 
//getobj, the variable used twice
var getobj = Object.entries(data['query']["pages"]);

    //gets the Title and text
    var title = [];    
    for (var i=0;i<getobj.length;i++){
    var output = Object.values(getobj[i][1]);
    var link = "https://en.wikipedia.org/wiki/";
      
    title.push(Object.values("<div id='tcontainer'><p><a href='" + link + output[2] + "'target='_blank'>" + output[2]+"</a></br>" + output[4] + "</p></div>"));
      
    var re = title.toString().replace(/,/g,"");
 }   
   var mytitle = document.createElement('h1');
    mytitle.innerHTML = re;
    header.appendChild(mytitle);
  }
};
 
}

//resize variables and jquery actions
var inputW = '200px';
var inputWreturn = '38px';

$('.resize-close').hide();
$('.resize-input').focus(function(){
  $(this).animate({
    width: inputW}, 400);
  $('.resize-close').show();
})
$('.resize-close').click(function(){
 $('.resize-input').animate({
   width: inputWreturn}, 400);
  $('.resize-close').hide();
  $('#sbox').val('');
  doneTyping ();
});