GiphyTV
Date of creation: June 01, 2021
Client-side Programming Language: JavaScript
About
Get up to 5 random gifs from Giphy , changing every 10 seconds.
Made for the Week 2 assignment of the JavaScript online course offered by One Month .
GiphyTV
JavaScript Code
function callGiphy(count) {
var url = "https://tv.giphy.com/v1/gifs/tv?api_key=CW27AW0nlp5u0&tag=giphytv";
// AJAX Request
var GiphyAJAXCall = new XMLHttpRequest();
GiphyAJAXCall.open( 'GET', url );
GiphyAJAXCall.send();
GiphyAJAXCall.addEventListener('load',function(e){
var data = e.target.response;
pushToDOM(data, count);
});
}
function pushToDOM(input, count) {
count--;
var container = document.querySelector("#sub-content");
container.innerHTML = "";
var response = JSON.parse(input);
var image = response.data;
console.log(image);
var src = image.images.original.url;
var title = image.title;
var alt = "gif image of " + title;
container.innerHTML = "<img src=\"" + src + "\" class=\"giphy-image\" title=\"" + title + "\" alt=\"" + alt + "\">";
if (count > 0) {
setTimeout(function(){ callGiphy(count); }, 10000);
}
}
document.addEventListener('DOMContentLoaded', () => {
callGiphy(5);
})