In this exercise you will incorporate the Aliconnect DMS into the application. For this application, you will use the Aliconnect JavaScript API Library library to make calls to the Aliconnect DMS.

In this section, you'll use the Aliconnect JavaScript API Library to create a Contact list.

1. Add the following to config.js.

   :::code language="javascript" source="../demo/config.js" id="dmsConfigInit":::

2. Add the following function to dms.js.

   :::code language="javascript" source="../demo/dms.js" id="initDmsSnippet":::

   Consider what this code is doing.

   • Schema configurations are initialized

3. Add the following function to dms.js.

   :::code language="javascript" source="../demo/dms.js" id="uploadConfigSnippet":::

   Consider what this code is doing.

   • Schema configurations are uploaded to the server

4. Add the following function to ui.js.

   Views.list = function(items) {
     Views.error({
       message: 'Contacts List',
       debug: items;
     })
   }

5. Add the following function to dms.js.

   :::code language="javascript" source="../demo/dms.js" id="getContactsSnippet":::

   Consider what this code is doing.

   • The URL that will be called is /Contacts.
   • The select method limits the fields returned for each events to just those the view will actually use.
   • The orderby method sorts the results by the start time, with the earliest event being first.
   • The top method requests up to 50 events in the response.

6. Save your changes and refresh the app. Sign in and click the Contacts link in the nav bar. If everything works, you should see a JSON dump of all contacts (that will be empty when used for the first time).

In this section you will update the Views.list function to display the events in a more user-friendly manner.

1. Replace the existing Views.list function with the following.

   :::code language="javascript" source="../demo/ui.js" id="viewsListSnippet":::

   This loops through the collection of events and adds a table row for each one.

2. Save the changes and refresh the app. Click on the Contacts link and the app should now render a list of Contacts.

1. Create Contact