Introduction to Web Intents

Paul Kinlan (@paul_kinlan)
G+: plus.ly/paul.kinlan

What's the problem?

Sharing

Pick

Editing

Saving

Authentication

http://www.flickr.com/photos/sermoa/2453162128/

Imagine integrating all these services?!?!1!

There is a solution in the works

Web Intents is a framework for client-side service discovery and inter-application communication

It's like an Android Intent

var intent = new Intent("http://webintents.org/share", 
                        "text/uri-list", 
                        window.location.href);
window.navigator.startActivity(intent);

Client App: I need a sharing service

Action

var intent = new Intent("http://webintents.org/share", 
                        "text/uri-list", 
                        window.location.href);
window.navigator.startActivity(intent);

A verb.

Type

var intent = new Intent("http://webintents.org/share", 
                        "text/uri-list", 
                        window.location.href);
window.navigator.startActivity(intent);

A description of the data being used

Data

var intent = new Intent("http://webintents.org/share", 
                        "text/uri-list", 
                        window.location.href);
window.navigator.startActivity(intent);

The data by value or reference (URL)

Can be complex types such as images, audio or documents

<intent
   action="http://webintents.org/share"
   type="image/*"
   href="shareimage.html" >

When launched, data on:

window.intent

Service: I can provide this service

And then what?

Nothing - you have just integrated your apps and services

Let's go Deeper

We can do two-way communication

Client: 

var intent = new Intent("http://webintents.org/pick", "image/*");
window.navigator.startActivity(intent, function(intentData) {
  // Do something with the response
});

Service: 

window.intent.postResponse({  ... some data ...  });

Demo - cloud file picker

var intent = new Intent("http://webintents.org/pick", "image/*");
window.navigator.startActivity(intent, function(intentData) {
  var pickedImage = document.getElementById("picked");
  pickedImage.src = intentData.data;
});

We can do long-lived connections*

* - next version of the shim

Client: 

var channel = MessageChannel();
var intent = new Intent("http://webintents.org/pick", 
    "image/*",
    channel.port1);
window.navigator.startActivity(intent);

Demo

PAUL CLICK THIS!!

Behind the Firewall

http://www.flickr.com/photos/dhabben/2779511984/

Closing thoughts

This will change the way we build apps on the web - Paul Kinlan

More Information

Thank you!

What are your use-cases?