Wanderlust

Language Help JavaScript
1

at step 13 I am getting TypeError: cancelled and cannot figure out why…

2

Hey @jon_belloit,

Can you please post your code and a link to the challenge so we can help you :slight_smile:

Richard.

1 Like
3

// Foursquare API Info
const clientId = ‘XJR0E4B1RENVSQHQNAGUTRW2AQRBDMJL2HWIVAZPSMXWNBW3’;
const clientSecret = ‘5S5RCLJUMSLR2JQUHXYZ51NR5CPLPIQEORI0Q3LJGMCV2K0I’;
const url = ‘https://api.foursquare.com/v2/venues/explore?near=’;

// OpenWeather Info
const openWeatherKey = ‘239fff429d5a47cbc4e2abbf95b110bd’;
const weatherUrl = ‘https://api.openweathermap.org/data/2.5/weather’;

// 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 () => {
const city = $input.val();
const urlToFetch = url + city + ‘&limit=10&client_id=’ + clientId + ‘&client_secret=’ + clientSecret + ‘&v=20180401’;
try {
const response = await fetch(urlToFetch);
if (response.ok) {
console.log(response);
}
} catch (error) {
console.log(error);
}

const getForecast = () => {

}
};

// Render functions
const renderVenues = (venues) => {
$venueDivs.forEach(($venue, index) => {
// Add your code here:

let venueContent = '';
$venue.append(venueContent);

});
destination.append(`<h2>{venues[0].location.city}`);
}

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()
getForecast()
return false;
}

$submit.click(executeSearch)

Wanderlust link:
https://www.codecademy.com/paths/web-development/tracks/webdev-intermediate-javascript/modules/intermediate-javascript-requests/projects/wanderlust

4

Hello @jon_belloit,

Thank you for your updated response.

I’ve checked the activity and I can see an error in this code:

destination.append(`<h2>{venues[0].location.city}`);

It should have the $ prepended to the string literal such as the following:

destination.append(`<h2>${venues[0].location.city`);

This should fix that error.

Also, I’d recommend that you read this post about formatting your code on the forum to make it easier to read (section entitled formatting code):

In addition, and I am a little peeved that this challenge does not mention it. You should always keep your API Keys secret and never share them. This can lead to a lot of security vulnerabilities.

I’d suggest you delete them from your account and re-assign them.

Happy coding,

Richard.