I am not being able to pass one local variable’s value into another function.
Here is my code:
// constants
const key = 'my api key here';
const playlistId = 'UUuSrv3qgQA7SSi6R9bWag5A';
var URL = 'https://www.googleapis.com/youtube/v3/playlistItems';
//youtube API sees all these info, so that it knows what kind of information you want to retrieve
const options = {
playlistId: playlistId,
maxResults: 20,
key: key,
part: 'snippet'
};
Above is the preparation.
let loadMainVideo = function () {
//change URL to
URL += '?' + Object.keys(options).map((k) => k + '=' + encodeURIComponent(options[k])).join('&');
//use fetch to get HTTP request
fetch(URL)
.then(res => res.json())
.then(function (data) {
console.log(data);
loadPlayList(data); // THIS GIVES ME UNDEFINED
var id = data.items[0].snippet.resourceId.videoId;
console.log(id);
//put the 1st video in the playlist into the dom
document.getElementById('youtube_feed').innerHTML = `
<iframe width="1280" height="720" src="https://www.youtube.com/embed/${id}" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
`
})
.catch(err => console.log(err))
}
loadMainVideo();
The above code is the 1st function I created, in order to get youtube’s JSON from its server.
/*
Load Playlist
*/
function loadPlayList(data) {
console.log(data.items[0].snippet.descripton);
}
Youtube stores his data in this format:
If everything went right, I am supposed to get the description of the 1st video inside this JSON.
How do I pass the data
variable’s value to the newly created function loadPlayList()
?