Skip to content

Instantly share code, notes, and snippets.

@codecademydev
Created February 7, 2021 05:37
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save codecademydev/06fe43b6c9bcf3ec803fabef1744374e to your computer and use it in GitHub Desktop.
Save codecademydev/06fe43b6c9bcf3ec803fabef1744374e to your computer and use it in GitHub Desktop.
Codecademy export
// Foursquare API Info
const clientId = 'CC14AMQ530KSVDU2ZJ2P11W0AT4SCCYIKUEVDFCDMKKQLLJ5';
const clientSecret = '0VVNH44BMSWVQW0JHLFZL3XHKWIOBQAIIIAKQ4XLSVKJZUZD';
const url = 'https://api.foursquare.com/v2/venues/explore?near=';
// OpenWeather Info
const openWeatherKey = '1df43e3c8fc9da8241016b1213359ad9';
const weatherUrl = 'https://api.openweathermap.org/data/2.5/weather?q=';
// Page Elements
const $input = $('#city');
const $submit = $('#button');
const $destination = $('#destination');
const $container = $('.container');
const $venueDivs = [$("#venue1"), $("#venue2"), $("#venue3"), $("#venue4")];
const $weatherDiv = $("#weather1");
const weekDays = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
// Add AJAX functions here:
const getVenues = async () => {
// 7.
const city = $input.val();
// 8.
const urlToFetch = `${url}${city}&limit=10&client_id=${clientId}&client_secret=${clientSecret}&v=20200106`;
// 9.
try {
const response = await fetch(urlToFetch);
if (response.ok) {
const jsonResponse = await response.json();
const venues = jsonResponse.response.groups[0].items.map(item => item.venue);
console.log(venues);
}
return venues;
} catch(error) {
console.log(error);
}
}
const getForecast = async () => {
const city = $input.val();
const urlToFetch = weatherUrl + city + '&appid=' + openWeatherKey;
try {
const response = await fetch(urlToFetch);
if (response.ok) {
const jsonResponse = await response.json();
console.log(jsonResponse);
return jsonResponse;
}
} catch(error) {
console.log(error);
}
}
// Render functions
const renderVenues = (venues) => {
$venueDivs.forEach(($venue, index) => {
// Add your code here:
const venue = venues[index];
console.log(venue);
const venueIcon = venue.categories[0].icon;
//console.log(venueIcon);
const venueImgSrc = venueIcon.prefix + "bg_64" + venueIcon.suffix;
let venueContent = createVenueHTML(venue.name,venue.location, venueImgSrc);
$venue.append(venueContent);
});
$destination.append(`<h2>${venues[0].location.city}</h2>`);
}
const renderForecast = (day) => {
// Add your code here:
let weatherContent = '';
$weatherDiv.append(weatherContent);
}
const executeSearch = () => {
$venueDivs.forEach(venue => venue.empty());
$weatherDiv.empty();
$destination.empty();
$container.css("visibility", "visible");
getVenues().then(venues => renderVenues(venues));
getForecast()
return false;
}
$submit.click(executeSearch)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment