Last active
May 14, 2020 18:30
-
-
Save YosiLeibman/0d9d936c39315453ff7fba8513e17803 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8" /> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> | |
<title>Document</title> | |
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> | |
<style> | |
* { | |
margin: 0; | |
} | |
body { | |
height: 100vh; | |
display: flex; | |
align-items: center; | |
justify-content: center; | |
flex-direction: column; | |
background-color: blanchedalmond; | |
} | |
#title { | |
font-size: 5em; | |
margin-bottom: 1em; | |
color: burlywood; | |
} | |
</style> | |
</head> | |
<body> | |
<h1 id="title">whiskey</h1> | |
<img | |
id="blah" | |
src="https://media.giphy.com/media/2voMAYGX4BhIRs3X3q/giphy.gif" | |
alt="some stupid gif" | |
/> | |
<script> | |
const wordAPI = | |
'https://api.wordnik.com/v4/words.json/randomWord?hasDictionaryDef=true&maxCorpusCount=-1&minDictionaryCount=1&maxDictionaryCount=-1&minLength=5&maxLength=-1&api_key=5a1d59fba2c80d6e9a20b0c83da02b0a4c862a9668479c8f2' | |
const giphyAPI = | |
'http://api.giphy.com/v1/gifs/search?api_key=0UTRbFtkMxAplrohufYco5IY74U8hOes&q=' | |
// CALL BACK | |
// $.get(wordAPI,function(response){ | |
// console.log(response.word) | |
// document.querySelector("#title").textContent = response.word | |
// $.get(giphyAPI+response.word, function(gifres){ | |
// console.log(gifres.data[0].images.fixed_width.url) | |
// document.querySelector("#blah").src = gifres.data[0].images.fixed_width.url | |
// }) | |
// }) | |
// PROMIESS | |
// MyFetch(wordAPI) | |
// .then(function(wordres){ | |
// return wordres.json() | |
// }) | |
// .then(function(word){ | |
// console.log(word) | |
// document.querySelector("#title").textContent = word.word | |
// return fetch(giphyAPI+word.word) | |
// }) | |
// .then(function(gifres){ | |
// return gifres.json() | |
// }) | |
// .then(function(gif){ | |
// document.querySelector("#blah").src = gif.data[0].images.fixed_width.url | |
// }) | |
// .catch(function(err){ | |
// alert("something went wrong") | |
// console.log(err) | |
// }) | |
// ASYNC AWAIT | |
async function randomgif() { | |
try { | |
console.log('randgif') | |
let word = await MyFetch(wordAPI) | |
// let word = await wordres.json() | |
document.querySelector('#title').textContent = word.word | |
let gifres = await fetch(giphyAPI + word.word) | |
let gif = await gifres.json() | |
document.querySelector('#blah').src = | |
gif.data[0].images.fixed_width.url | |
} catch (err) { | |
// alert("something went wrong") | |
console.log(err) | |
} | |
} | |
randomgif() | |
function MyFetch(url) { | |
console.log('myfetch') | |
return new Promise(function (resolve, reject) { | |
$.get(url,function (response) { | |
resolve(response) | |
},function(err){ | |
reject(err) | |
}) | |
}) | |
} | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment