Dial Number from any Outlook Message Part II

Last week I began by showing you how to created the XML manifest for an Outlook add-in to gather phones numbers from the message text.  This week we'll focus on the code in our website our manifest sends the message data to, and how to parse that data.  To begin in our java script file we need to start out with something like this.

// Global variables
var _Item;
var _MyEntities;

// The initialize function is required for all add-ins.
Office.initialize = function () {
    var _mailbox = Office.context.mailbox;
    // Obtains the current item.
    Item = _mailbox.item;
    // Reads all instances of supported entities from the subject 
    // and body of the current item.
    MyEntities = _Item.getEntities();
    
    // Checks for the DOM to load using the jQuery ready function.
    $(document).ready(function () {
    // After the DOM is loaded, app-specific code can run.
    });
}

We will use _MyEntities to store our found phone numbers.  Microsoft has build in the power to find a number of different things, addresses, emails, phone numbers, business names, contact names, and a whole bunch of meeting related stuff.  For this example we are going to focus on phone numbers.  It is important to note at this point, it works well with North American phones, but does not yet support the rest.

function myGetPhoneNumbers()
{
    var htmlText = "";

    // Gets an array of phone numbers. 
    // Each phone number is a PhoneNumber object.
    var phoneNumbersArray = _MyEntities.phoneNumbers;
    for (var i = 0; i < phoneNumbersArray.length; i++)
    {
        htmlText += "Phone Number : ( ";
        // Gets the type of phone number, for example, home, office.
        htmlText += "type = <span>" + phoneNumbersArray[i].type + 
           "</span> , ";

        // Gets the actual phone number represented by a string.
        htmlText += "phone string = <span>" + 
            phoneNumbersArray[i].phoneString + "</span> , ";

        // Gets the original text that was identified in the item 
        // as a phone number. 
        htmlText += "original phone string = <span>" + 
            phoneNumbersArray[i].originalPhoneString + "</span>";

        htmlText += " )<br/>";
    }

    document.getElementById("entities_box").innerHTML = htmlText;
}

In this sample function we are going to iterate through the phone numbers identified and build some html.  It's important to note it is returning 3 types of information.

1.  Type - If there is text preceding the number it can label it, work, mobile, fax, etc.  All the rest get a generic type.

2.  phoneString - this is a cleaned up formatted version of the telephone number.

3.  originalPhoneString - this is the block of text identified to contain the phone, it is not changed from the message format.

That will wrap it up for this week.  Next week I will show you how to create dialable hyperlinks from the phone numbers we detected.

I have also submitted my app to Microsoft internally, and to the Office Store, so one I have it approved there I will post the link so everyone can use it.

Doug Routledge, C# Lync, Skype for Business, SQL, Exchange, UC Developer  BridgeOC Twitter - @droutledge @ndbridge