Wednesday, 15 March 2017

Outlook Add-in Attach Files from Dropbox

In this post I will walk you through how to create a simple Outlook Add-in which will allow you to attach files from your dropbox account. What you will need is:

  1. Sublime or Visual Studio Code (No need for Visual studio)
  2. Office Generator follow instructions @ https://github.com/OfficeDev/generator-office to make it works 
  3. Dropbox Account to create Dropbox App
  4. Client Library for dropnox API you can found it @https://github.com/dropbox/dropbox-js 
  5. Create an Empty directory and  run Yo Office
  6. follow the instructions as in my previous post here
  7. What we will create is the following:
    1. An Angular Service to read dropbox Directory 
    2. An Angular Directive to use the service and render the files
    3. Directive Isolated scope will have the following properties:
      1. Dir : represents the root directory default to "/"
      2. receiverUrl: redirect url (has to match one of the redirect urls in the dropbox developer app definition)
      3. clientId: dropbox app key
      4. template: url to the template
    4. The directive will use the DropboxAPI service to load the files initially from the root directory. 
    5. The directive will watch for any change in the "dir" property and we will use this to refresh the file list when clicking on a folder.
    6. This is How the Add-in works.
I'm polishing the code and it will be available soon on github happy Office Development.