Harry Potter Movies (JSON)

Dataset Information

For this exercise, we will use a JSON file called "hp-movies.json". that has been uploaded to the Internet. The JSON file contains information about Harry Potter movies.

Part 1

Write JavaScript code to answer the questions below. Log each of the answers to the console.

1. Fetch the movie data using the provided URL.
2. Display the number of movies (i.e. 8).
3. Loop through the movies, and display the title and year of each.
4. Perform a sorting operation to identify the movie that has the highest rating. Display the name and rating of that movie.

Part 2

Write JavaScript code to answer the questions below. Display the answers on the page in the designated areas.

1. See the provided a movie selector dropdown menu (i.e the designated select element). Loop through the movies and dynamically create a new option element for each movie. Use the movie's identifier as the option value, and the movie's title as the option text.
2. Create a function called updateMovieInfo. It should identify what movie is currently selected from the dropdown menu, then lookup the corresponding movie information using a find operation, and finally display information about that movie in the designated areas below. Specifically it should display the movie title, year, rating, and an image of the movie poster.
3. Add an event listener to the dropdown, such that when a new option is selected, it will invoke the updateMovieInfo function. As a result, you should be able to select different movies from the dropdown to see the corresponding info on the page.

Display