Git Product home page Git Product logo

outlook-add-in-javascript-moduleextension's Introduction

Outlook module extension billable hours sample

This Outlook 2016 for Windows add-in sample uses the new module extenstion point <ExtensionPoint xsi:type="Module"> for Outlook. This code sample integrates a billable hours add-in with the built-in Outlook Mail, Calend, Tasks, etc. modules.

Table of Contents

Change History

March 31, 2016:

  • Published the first version of the sample

April 4, 2016:

  • Updated the README file

Prerequisites

  • Outlook 2016 for Windows
  • NodeJS to serve the module extension
  • npm to install dependencies. It comes with NodeJS
  • GitBash to run command line utilities
  • Clone this repo to your local computer.

Configure the project

You'll need to install a certificate to run this sample because add-in commands require HTTPS. Because add-in commands to not have a UI, you are not prompted to accept an invalid certificate.

  1. Run ./gen-cert.sh to create a certificate.
  2. Double-click ca.crt and install it in your Trusted Root Certification Authorities store

Start a local HTTPS web server to serve the files for the module extension:

  1. Install the package dependencies identified in packages.json by running npm install in the project root directory
  2. Start the local server by running node server.js

Run the project

  1. Start Outlook
  2. Choose the File tab, and then choose Manage Add-ins
  3. After the Add-in Manager opens, choose the "+" symbol, and then choose Add from a file
  4. Choose Browse and then navigate to the directory that contains the sample
  5. Select the module manifest (outlook-add-in-javascript-moduleextension.xml) and then click Open
  6. Choose Next and then choose Install to install the module
  7. Close the Module Manager

It may take Outlook a few moments to load the new module, but when it does you'll see your new module added to the navigation bar shortcuts. Using compact navigation, the shortcuts look like this:

Shows add-in commands in the compact Outlook navigation bar.

If you're not using compact navigation, the shortcuts will look like this:

Shows a single module extension the the expanded navigation bar.

Click either Billable hours or the module icon to open the module extension. Outlook will change to show the module UI.

Shows the user interface for the module extenstion.

There are three buttons on the ribbon. Click one to change the billing rate, and the totals in the main UI will change to reflect the new rate.

Understand the code

The new module extension is enabled in your manifest file by setting the extension type to "Module". This is the section of the manifest that you need to change:

<!--New Extension Point - Module for a ModuleApp -->
    <ExtensionPoint xsi:type="Module">

Questions and comments

We'd love to get your feedback on the Outlook-Add-in-JavaScript-ModuleExtension sample. You can send your feedback to us in the Issues section of this repository.

Questions about Office 365 development in general should be posted to Stack Overflow. Make sure that your questions are tagged with [Office365] and [API].

Additional resources

Copyright

Copyright (c) 2016 Microsoft. All rights reserved.

outlook-add-in-javascript-moduleextension's People

Contributors

chbighammsft avatar davidchesnut avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.