Open Conference Protocol

How do I make my website Open Conference compatible?

When an application wants to query your conference data, they'll start by requesting your homepage. From there, here's how they find the data…

Conference Name

Where we find it (first match wins):

content attribute of the <meta property="og:title" content="…" /> tag (see Open Graph protocol spec)
value of the <title> tag

What you need to do for an optimal app experience:

Usually nothing - the <title> tag is generally sufficient.

Adding the <meta property="og:title" content="…" /> tag will also improve the experience for users posting your conference link on Facebook.

Conference Logo

Where we find it (first match wins):

value of the <meta property="og:image" content="…" /> tag (see Open Graph protocol spec)
src attribute of the first <img src="…" /> tag on the page where the src attribute contains "logo"

If neither approach yields a logo, client implementations will display their own placeholder.

What you need to do for an optimal app experience:

create a version of your conference logo that is 100px square
link to it using a <meta property="og:image" content="…" /> tag

Adding the <meta property="og:image" content="…" /> tag will also improve the experience for users posting your conference link on Facebook.

Session Data

Where we find it:

The session listing is loaded from the URL specified by a <link rel="conference-sessions" href="…" /> tag in the <head> section.

If the <link> tag doesn't exist, the homepage will be used as the session listing.

Individual session data is loaded from the session listing using the hCalendar microformat. The following mapping is used:

Session Code: uid
Title: summary
Time: dtstart and dtend
Room: location
Abstract: description
Speakers: contact (specified once per speaker)

What you need to do for an optimal app experience:

Add the <link rel="conference-sessions" href="…" /> tag to your homepage
Mark up your session listing page with the hCalendar microformat

Speaker Data

Where we find it:

The speaker listing is loaded from the URL specified by a <link rel="conference-speakers" href="…" /> tag in the <head> section.

If the <link> tag doesn't exist, the homepage will be used as the speaker listing.

Individual speaker data is loaded from the speaker listing using the hCard microformat. The following mapping is used:

Name: fn
Bio: note
Photo: photo
Website: url
Twitter Handle: nickname
Email: email
Company: org
Job Title: role

What you need to do for an optimal app experience:

Add the <link rel="conference-speakers" href="…" /> tag to your homepage
Mark up your speaker listing page with the hCard microformat

How do I query Open Conference data easily?

Being an open protocol, it's totally possible to implement it yourself. Of course, this isn't the most interesting code to write. To help you focus on building your client application instead of the protocol, we've implemented a JSON API bridge.

The API lives at:

http://openconferenceprotocol.org/api/conference-data?uri=[conference]

For example, to get all of the conference data for Web Directions East 2010 you'd call:

http://openconferenceprotocol.org/api/conference-data?uri=http://east.webdirections.org/2010/en/

We've posted a demo conference site with full meta data here:

http://openconferenceprotocol.org/demo-conf/

Go ahead, try it.

Cross Domain (JSONP) Support

The API endpoint supports JSONP requests. This allows you to call our API directly from client side code, without having to worry about any cross-domain issues. If you're not familiar with JSONP, check out jQuery's documentation for it or @rem's explanation.

The callback method is specified using a callback argument:

http://openconferenceprotocol.org/api/conference-data?uri=[conference]&callback=[callback]

If you're using jQuery, it will provide this callback argument automatically. Here's some sample jQuery code:

var conferenceUri = 'http://openconferenceprotocol.org/demo-conf';

$.ajax({
    url: 'http://openconferenceprotocol.org/api/conference-data',
    data: { uri: conferenceUri },
    dataType: 'jsonp',
    success: function (conference) {
        alert(
            conference.title + ' has ' +
            conference.sessions.length + ' sessions.');
    }
});

Caching

API responses are cached by our server for 60 seconds. This is done to maintain performance, as well as ensure that we don't innundate conference sites with too many requests.

Who built this?

The Open Conference Protocol, the JSON API bridge and the Windows Phone 7 client were all built by Brendan Forster (@shiftkey), Aaron Powell (@slace) and Tatham Oddie (@tathamoddie) for the Amped hackday. We built all of this in 10 hours on 16^th October 2010.

Update: We won the whole event. Here's our 3 minute pitch and the winning announcement. Next stop, Tokyo!