CS701 Module5 Assignment Solved

35.00 $ 17.50 $

Category:

Description

You are strongly encouraged to add comments into your program!

Create a new folder named HW5_lastName. Write the following programs in this folder. Part 1 – Angular Services (50 Points)

Using Angular services, build the Angular application to display the directions from location A to location B. The data is obtained using the MapQuest API as shown in the following link:

https://developer.mapquest.com/documentation/open/directions-api/route/get/

Sign up on the Mapquest developer page to get the free API key: https://developer.mapquest.com

The data is returned in JSON format. The following data is used in this sample:

  • route.distance (Total distance)
  • route.formatteTime (Total time)
  • route.legs[0].maneuvers (array of Turn-by-turn directions)

From each maneuver object, use the following data:

  • narrative, distance, mapUrl, and iconUrl

The initial layout of the application is shown below. The From and To fields are prepopulated. When the page is loaded, the directions are shown for those entries.

When the user clicks the line item entry, the associated map is displayed in another window as shown below. The URL displayed is the mapUrl property.

Also, when either the From or the To location entries change, the directions should be loaded automatically for those entries.

 

Part2 – Angular Routing (50 points)

Using Angular Routing and the RoutingSample2 provided in the lecture, complete the application with the appropriate routes for adding a contact, editing an existing contact, deleting an existing contact, and information about an existing contact. Adding a contact should also have the option for Cancel and Save. Editing a contact should have the option for Cancel and Save. Deleting a contact should prompt for confirmation.