Template designed by

Office 2013 loves Web Developers

Fabio FranziniMVP SharePoint, Senior Consultant & Trainer@franzinifabio

brought to you by

Introduction

Document-based Apps

Mail Apps

Distribution

Agenda

Introduction

Introduction

Microsoft Vision: Modernizing the Platform

Today’s MarketToday’s Trends

Microsoft Principles

A Web page loaded inside an Office ApplicationHTML 5 and CSS for rendering user interface

JavaScript and jQuery to add behavior

Calls to REST APIs to retrieve and update data from across network

Using Web Extensibility Framework for interaction with the documents

What is an App for Office?

App for OfficeManifest

<XML>

WebPage

HTML+JS

App for Office Catalog Server Web Server

App for Office

ServerClient

Bro

wse

r Hos

t

Common App Architecture

Web Server H

ost

SharePoint JS (CSOM)

SharePoint&

Exchange

Server-side LogicAny language

APPProvider-hosted

Oth

erE.

g. L

AM

P

IIS /

ASP

.Net

Win

dow

sAzu

re

CSOM REST

On-premises

IE

Chr

ome

Fire

Fox

Safa

ri

Tier 1 Tier 2

OtherECMAScript 5

Online

SharePoint

SQL

Workflow

Autohosted

SQL

Web Sites

Clie

nt A

PIs Server

APIsO

ther

Dev

ices

& C

lient

s

3rd P

arty

Ser

vice

s

Office JS

Office

Web

App

s

Win

RT

Mac

Mob

ile

Win

32

Client-side LogicHTML / CSS / Javascript

Development Tools: Visual Studio 2012, Napa or any standard Web development tool

Apps for Office

App

App ManifestWeb Page<XML>HTML/CSS/JS

Task Pane App for Office (Document-centric)Assists user working with one or more documents

Works in Word, Excel and Project

Content App for Office (Document-centric)Adds embedded content/functionality into document

Only used in Excel Application and Excel Web Application

Mail App for Office (Mailbox-centric)Used in Outlook Application and Outlook Web App (OWA)

Extends Outlook items with custom UI and behaviors

Outlook items can be messages and events

Mail Apps require Exchange 2013

Types of Apps for Office

Using App for Office

Cross PlatformDesigned from the ground up, Abstraction, Async

Cross AppCommon objects and methods across apps (selection, tables, settings)

Web StandardsECMAScript 5

PerformanceAsync, limits

Principles

Office Javascript API Overview

Document

Office.context

CustomXmlParts

Bindings

Settings

R/W Selection

Mailbox

Properties & Settings

User Profile

EWS

Item

Project

Tasks

Project Info

Document-based Apps

Apps for Office code run in separate sandboxed processSandbox infrastructure leverages Web Control from IE9/IE10

App for Office support for HTML5 and CSS3 consistent with IE9/IE10 support

Browser-rendered Apps basedWorks across all popular browsers (might require the latest version)

App runs its it own iFrame inside outer an iFrame with WEF runtime

Communications between iFrames relies on HTML5 postMessage API

Office Application Architecture

Document-based Apps for Office have common objectsUsed to read and write content to and from document

Used to create bindings and event handlers

A common API for document-based Apps

Common Objects x-Office!

Text Table Matrix

Charts

Shapes

Picture

Hyperlink

Word ArtXML

Parts

Clip Art

Core API Objects

All data access starts through document objectRead/write access to user selection

Event handler for selection change event

Three data types are supportedText

Matrix

Table

Interacting With Document Content

Working with Selections

Current selection

Task Pane App reads current selection and translates

Content App reads current selection and translates

Getting Selected Data

Content in binding/selection can be converted on read/writeText

Matrix

Table

HTML

Office Open XML (OOXML)

Coercion Types

Office.context.document.getSelectedDataAsync(‘ooxml’, etc…)

Bindings link an App for Office to a specific document sectionCan be defined current selection of a named item in a template

Arbitrarily read/write binding data at anytime

R/W operations do not depend on a selection.

Enable Event handling

Bindings support three different data shapesText binding for binding to an individual cell in Excel or text in word.

Matrix binding for a two dimension array representing rows and columns

Table binding is like a matrix binding with support for headers

What are App Bindings?

Uses of Apps for Office Bindings

Bound range of stock symbols

App handles SelectionChanged event associated with the binding to retrieve news associated with stock symbol

Adding a bindingBindings.addFromPromptAsync

Bindings.addFromSelectionAsync

Bindings.addFromNamedItem

Referencing a bindingBindings.getAllAsync

Bindings.getByIdAsync

Office.Select

Removing a bindingBindings.releaseByIdAsync

Binding event handler to a bindingBinding.addHandlerAsync(“type”, handler);

Using Bindings

A dialog is presented to the user experience when you call addFromPromptAsync.

You can read/write document settings

• ReadDocument

You have read access to document

You can subscribe to change events

• WriteDocument

Write content into document

• ReadWriteDocument

ReadDocument + WriteDocument

• FullAccess

All Permissions + use of Silverlight & Flash

Requested Capabilities

demo

Mail Apps

Write once, run anywhere Outlook runsSame Mail App runs on Outlook and OWA

Development model based on activation rulesActivation rules run whenever user selects item

Activated mail apps are added into Outlook UI

Designed to be secureMail apps run in an isolated, sandboxed process

Mail apps run with a three-tier permission model

Mail Apps

Mail Apps – Up Close and Personal

Mail App Body

Context trigger

App Name

Mail Apps require Exchange 2013

Exchange Server hosts users mailbox

Exchange Server hosts app manifest files

Web server hosts HTML for Mail App

Mail App can make callback to Web server

Mail App can call Exchange Web Services (EWS)EWS calls can be brokered through Web server

Mail App Hosting

EWS

Exchange detects specific entitiesExchange 2013 inspects each incoming message for text, such as postal addresses, URLs, etc.

These entities are stamped on each item as a property.

Extracted Entities

Entity Type Text Detected

Address US postal addresses1 Microsoft Way, Redmond WA, 98052

EmailAddress Any SMTP address

MeetingSuggestion A reference to an event or meetingLet’s meet next Tuesday for lunch.

Contact A personal name related to other entitiesRandy Byrne, 1 Microsoft Way, Redmond WA, 98052

PhoneNumber US telephone numbers(555) 867-5309

TaskSuggestion Actionable sentences in an emailPlease install office 2013 on my computer.

Url A filename or web address

RuleCollectionGroups multiple rules together using AND or OR

Rule Collections can be nested within each other

ItemHasAttachment• Checks whether the item has an attachment

ItemHasRegularExpressionMatch• Checks for matches to the reg ex against body, subject

or sender’s email address

ItemHasKnownEntity• Checks whether the item has the specified entity

Activation rules

Access to item propertiesRecipients of the current message

Subject, date sent, and other message or appointment properties

Extracted Entities and regex matches

Item properties

.mailbox:

• userProfile

• item

• display forms

• user token

• call EWS

Office.context:

• roamingSettings

• displayLanguage

.item

.userProfile:

• name

• time zone

• email address

(Message)

• message properties

• entities

• reg ex matches

• custom props

(Appointment):

• appt properties

• entities

• reg ex matches

• custom props

Limited Exchange Web Services accessLook up items in mailbox

Create appointments, messages, tasks and contacts

Send messages/meeting invites

Display Outlook formsDisplay Outlook forms (existing messages, new appointments or reply)

Token for Single Sign On

Interact with Mailbox

.mailbox:

• userProfile

• item

• display forms

• user token

• call EWSOffice.context:

• roamingSettings

• displayLanguage

.item

.userProfile:

• name

• time zone

• email address

(Message)

• message properties

• entities

• reg ex matches

• custom props

(Appointment):

• appt properties

• entities

• reg ex matches

• custom props

User profile infoName

Email address

Time zone

User information

.mailbox:

• userProfile

• item

• display forms

• user token

• call EWS

Office.context:

• roamingSettings

• displayLanguage

.item

.userProfile:

• name

• time zone

• email address

(Message)

• message properties

• entities

• reg ex matches

• custom props

(Appointment):

• appt properties

• entities

• reg ex matches

• custom props

Per-app property bagDictionary of key-value pairs

Saved within user’s mailbox

Per-app, per-item property bagDictionary of key-value pairs

Saved on the specific item

Data storage

.mailbox:

• userProfile

• item

• display forms

• user token

• call EWS

Office.context:

• roamingSettings

• displayLanguage

.item

.userProfile:

• name

• time zone

• email address

(Message)

• message properties

• entities

• reg ex matches

• custom props

(Appointment):

• appt properties

• entities

• reg ex matches

• custom props

Low trust: end-user can install for self

High trust: Exchange administrator

must install

RestrictedUse only extracted item entities but no custom regular expressions

Partial OM access and no access makeEWSRequestAsync

ReadItemUse custom regular expressions

Full JSOM access except no access to makeEWSRequestAsync

Read & write properties for current item

ReadWriteMailboxUse Exchange Web Services (EWS) operations

Create, read, write items & folders

Send items

Permissions and CapabilitiesRead/write

mailbox permissi

on

Read item

permission

Restricted permissio

n

Activate on patternsBug tracking

Package tracking

Case number/PO status look-up

Possibilities

Activate on entities or item classesNews link summary

Phone dialer

Workflow around a custom Exchange item class

Activate on all itemsCRM

Social (LinkedIn)

Display information about recipients

demo

Distribution

Mommy, where do Apps for Office come from?App for Office distribution/deployment model based on App Catalogs

App for Office is published by uploading its manifest to an App Catalog

User inspect App Catalog with Office Applications UI to discover Apps

User can create and start an App for Office found in App Catalog

There are several different types of CatalogsOffice Store

SharePoint App Catalog

Exchange App Catalog

File Share App Catalog

Distribution of Apps for Office

The Office Store functions as public marketplaceProvides catalog of Apps for Office to consumers and general public

Office Store managed by Office.com

Consumer identity on Office.com established by Windows Live ID

Apps for Office tied to user by using identity established by Live ID logon

It's easy to publish a App for Office to the Office StoreYou just need to publish the App for Office manifest

The manifest points to a Web page anywhere on the Internet

Microsoft controls vetting process to ensure integrity of Apps in Office Store

The Office Store

The Office Store – Adding an App To Your Account

http://dev.office.com

For more info…

Grazie a tutti per la partecipazione

Riceverete il link per il download a slide e demo via email nei prossimi giorni

Per contattarmi

fabio@fabiofranzini.com@franzinifabio

Grazie

brought to you by