SHARE
TWEET

main.js

hil_beer_t Mar 26th, 2020 60 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1.  
  2. document.querySelector(".js-go").addEventListener('click', function () {
  3.  
  4.   let input = document.querySelector("input").value;
  5.   pushToDOM(input);
  6.  
  7. });
  8.  
  9. document.querySelector(".js-userinput").addEventListener('keyup', function (e) {
  10.  
  11.   let input = document.querySelector("input").value;
  12.   // if the key ENTER is pressed...
  13.   if (e.which === 13) {
  14.     pushToDOM(input);
  15.   }
  16.  
  17. });
  18.  
  19. function pushToDOM(input) {
  20.  
  21.   if (input !== "") {
  22.     let newInput = input.split(' ').join('+');
  23.     console.log(newInput)
  24.  
  25.     const url = "http://api.giphy.com/v1/gifs/search?q=" + newInput + "&api_key=dc6zaTOxFJmzC";
  26.  
  27.     let GiphyAJAXCall = new XMLHttpRequest();
  28.     GiphyAJAXCall.open('GET', url);
  29.     GiphyAJAXCall.send();
  30.     GiphyAJAXCall.addEventListener('loadend', function (e) {
  31.       let bigData = e.target.response;
  32.       render(bigData);
  33.     });
  34.  
  35.     console.log(url);
  36.  
  37.     function render(bigData) {
  38.       let response = JSON.parse(bigData);
  39.       let imageUrls = response.data;
  40.  
  41.       imageUrls.forEach((image) => {
  42.         let imageUrl = image.images.fixed_height.url;
  43.  
  44.         let container = document.querySelector(".js-container");
  45.         container.innerHTML = container.innerHTML + "<img src=\"" + imageUrl + "\"/>";
  46.       });
  47.  
  48.     }
  49.   }
  50. }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
Top