Developer Overview of Office 2013 Apps

After attending the SharePoint Conference a couple of weeks ago in Las Vegas I was inspired to spend some time with Office Apps. Office Apps allow you to show a web page within an Office program. Literally, it is as basic as an iFrame within Word (or Excel etc) and a JavaScript library that provides an API into Office. An xml manifest file defines the app web URL and the permissions the app requires (plus some other settings) and is the only thing that the client application is required to install.

The Anatomy of an Office App – Thanks to Microsoft for the image

I’ll start with a quick overview in case you aren’t aware of what’s possible. I use the term ‘document’ generically to refer to any Office file type (docx, pptx, xlsx) unless I specify otherwise.

 

Office App Shapes

Office Apps come in three distinct ‘shapes’ (this is Microsoft’s term, read: types).

  1. Task Pane: This app shape is housed in a panel outside of the document. Think of the ‘Solution Explorer’ in Visual Studio. You can influence the document via the app but the app doesn’t constitute part of the document itself. This shape is very flexible; it can run in any of Word, PowerPoint, Excel and Project. That is; the exact same app can be published for use in any of these programs, unmodified. You will have to consider the programs you decide to support as there are some discrepancies that will need to be taken into account. An example of this is the DocumentSelectionChanged event which fires upon each key stroke in Word but only upon changing cell selection in Excel. I imagine that this will be the most common app shape as it can provide powerful tools to help a user create/modify/research a document or complete related tasks without opening your browser in order to visit SharePoint

    A Task Pane App – Thanks to Microsoft for the image
  2. Content: This app shape sits ‘in’ the document, as part of the content. Think of a chart in Excel. In fact, if you had a desire to reinvent the wheel, you could create a content app that replicates chart functionally. Currently, content apps are only supported in Excel but this only a temporary limitation (during the conference sessions Microsoft made a point of this on multiple occasions). Content apps can provide an easy way to share content (you can email them!) or bring dynamic content into documents. Perhaps this shape could be used to create powerful dynamic coversheets with a lot more pizazz than Quick Parts provide.

    A Content App – Thanks to Microsoft for the image
  3. Mail: This app shape is very similar to the Task Pane shape except that it is for Outlook. It also provides a pretty cool visibility model where you are able to define rules (e.g. is the item a message or an event) which when satisfied makes the app appear. I’m not going to cover this app shape in more depth specifically, however the flexible nature of Office Apps means that the concepts I do cover will be transferable in most cases.

    A Mail App – Thanks to Microsoft for the image

 

Environment

In order to start to developing Office Apps you require Visual Studio 2012 (Express is fine) with Microsoft Office Developer Tool for Visual Studio 2012 and Office 2013. I was only using Office 2013 Preview and was able to develop apps fine with a couple of caveats. Firstly, the API is slightly different between versions (you should be using a different version of office.js and I assume the gap will only get greater as the API matures). An example of this is trying to read the current document – you have to use a different method for Preview. Secondly, I couldn’t debug my apps in Visual Studio. I’m not sure if I’m overlooking something or whether it’s a limitation of using Office Preview. I will edit this blog when I have a chance to investigate this issue fully. I should also mention that you need IE9+ installed although it needn’t be your default browser.

Starting a New Project

The ‘App for Office 2013’ Visual Studio template goes a long way to getting you started. Start a new project: File > New > Project, then Installed > Templates > Visual C# > Office/SharePoint > App for Office 2013. If you know you want to create a Task Pane App of Content App then select accordingly but in either case it is very simple to convert one to the other, you just have to make a few small modifications to the manifest xml file.

 

Converting App Shapes

The xsi:type parameter can be ‘TaskPaneApp’ or ‘ContentApp’ accordingly, Task Pane Apps don’t support the RequestedWidth or RequestedHeight elements and lastly (and temporarily) Content Apps only support the Capability element when its Name attribute is ‘Workbook’.

Limitations

You can’t draw iFrames in Office Apps. At first I thought this wasn’t an issue, but it does mean that you can’t just host some related SharePoint content in an app, you have to go to the effort of getting the content via a web service (possibly having to write the web service) and then handle rendering it.

You can’t change the document from the app. You can read, write and close the document but you can’t open another document. I can imagine (and really hope) that this may change in the future as it could allow users who spend a lot of time modifying documents to switch between documents hosted in a range of sites without leaving Office.

You can’t pass arguments to Office Apps. I had hoped that it would be possible to provide a URL that would launch a document, insert a specified app (or prompt to install it), and initiate the app with some provided data. Unfortunately it can’t be done (yet?).

 

Please subscribe.

 

Published by

Paul Ryan

As a developer my professional interests are technical and tend to be SharePoint focused. I've been working with SharePoint since 2009 and hope my posts will give back a little to the community that's supported me over this time. I'm also a keen runner (half-marathon) and passionate Brompton bicycle owner.

2 thoughts on “Developer Overview of Office 2013 Apps”

  1. “Office 2013 Apps” in reality got myself simply hooked on your internet page!

    I reallydefinitely will be back again far more frequently.
    Thank you -Dwain

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.