YouTube Engineering and Developers Blog: May 2011

YouTube @ Google I/O: The iframe Player API

Tuesday, May 31, 2011

Google I/O 2011 may be over, but all the great developer information lives on! We want to start our recap of YouTube-related I/O activities by highlighting our developer presentation entitled “YouTube’s iframe Player: The Future of Embedding”.
The session features Jeff Posnick and Jarek Wilkiewicz from the YouTube Developer Relations team, and Greg Schechter, one of the engineers who works on the iframe Player and its API. Topics covered include the development of the iframe Player, challenges related to exposing an API on an iframe element, differences between the ActionScript 3 Player API and the iframe Player API, and real-world example applications that use the new API.

The full video of the session is embedded below (using the iframe Player, of course), and the slides from the talk are available if you’d prefer to read along with the presentation. Be sure to check out the sample web application (along with its source) that illustrates iframe Player API usage as well!

Cheers,
—Jeff Posnick, YouTube API Team

Reinventing News Video with Knight, Mozilla, and the YouTube API

Thursday, May 5, 2011

(This is a guest blog post by Ben Moskowitz of the Mozilla Foundation.)

Over the next few weeks, the Knight Foundation and Mozilla are running a series of news innovation challenges. The goal: get the world's smartest hackers thinking about how news organizations can harness the open web.

The first challenge, which runs through Sunday, May 8th, is all about video. This is a great opportunity to be creative with the YouTube APIs—if you have a big, ambitious idea, you could get support from Knight and Mozilla to make it real.

Check out the brief:

Video is a central part of many people's daily news experience. But despite all the opportunity offered by the open web (social, linkable, real-time, dynamic), most online video is still stuck in a boring embedded box, like "TV on a web page." This offers little in the way of context or opportunities for viewers to engage more deeply.

If you're reading this blog, you're probably interested in hacking web video. The challenge is: how can web video bring innovation to the news biz?

How would you take advantage of modern JavaScript, advanced HTML5 features, and the richness of web service APIs like YouTube's? How would you make use of the millions of connected YouTubers who upload 35 hours of video per minute? What are the news video opportunities that are unique to the web?

The YouTube API blog is rife with possibility: check out some posts on curation, remix, and the YouTube chromeless player. Read up on YouTube Direct, a cool open source app, or visit the YouTube API project gallery. While you're at it, check out popcorn.js, the HTML5 video framework (now including a wrapper for the YouTube Flash player!)

What kinds of innovations would you bring to the newsroom? How would you transform news video?

Head over to the challenge site and enter your idea. Submit a short abstract, a napkin sketch, or however you choose to best express yourself. By entering your idea, you'll be eligible to take part in an online learning lab with famous hackers like Christian Heilmann, Burt Herman, Aza Raskin, John Resig. And if your idea rocks, Knight and Mozilla will fly you to Berlin for an in-person development sprint, to take your idea from napkin sketch to prototype to deployment.

Finally: five participants will be invited to become Knight-Mozilla news technology fellows. Fellowships are paid positions inside newsrooms at the BBC, Boston.com, The Guardian, Al Jazeera English, and Zeit Online, to build world class web apps for a large audience.

The challenge ends May 8th, so hurry and study up on the YouTube APIs. For Sunday’s deadline, all you need is a great idea, a rough sketch. If you proceed to the next phases, there will be plenty of time and support to further prototype and build out your idea. Mostly, we want to get to know you through this challenge. Happy hacking!

Making stories with social media and YouTube videos

Sunday, May 1, 2011

By Xavier Damman, co-founder of Storify(Cross-posted from the Google Code blog, where the post is part of Who's at Google I/O, a series of guest blog posts written by developers who are appearing in the Developer Sandbox at Google I/O.)StorifyGoogle I/O SandboxSlideShareaudioboosee Storify in action hereYouTube Data APIPlayer APINodeJSMongoDB

The source of the sourceJSONpJSON-Crequest: function(formdata) {
return {
'url' : 'http://gdata.youtube.com/feeds/api/videos',
'params': {
'v' : 2,
'max-results' : 20,
'alt' : 'jsonc',
'q' : formdata.keywords
}
};
}
results: function(json) {

if (json.data && json.data.totalItems && json.data.totalItems == 0) {
throw "No results found";
}

var videos = json.data.items;
var results_array = [];

for (var i = 0; i < videos.length; i++) {
var normalizedResult = {
permalink : 'http://www.youtube.com/watch?v='+videos[i].id,
source : 'youtube',
elementClass : 'video',
metadata : videos[i],
thumbnail : videos[i].thumbnail.sqDefault,
title: videos[i].title,
description : videos[i].description.substr(0,140),
author: {username: videos[i].uploader },
created_at : videos[i].uploaded,
oembed: {html: '<iframe id="youtube-'+videos[i].id+'" type="text/html" width="360" height="294" src="http://www.youtube.com/embed/'+videos[i].id+'?enablejsapi=1&origin=storify.com" frameborder="0">'
}};

results_array.push(normalizedResult);
}
return results_array;
}
YouTube Player API with their new iframe embedStory.jsonstorify.com

http://storify.com/latest.json?topic=googleio returns the latest stories with the tag #googleio

http://storify.com/xdamman.json returns the user object and the user’s latest stories.

http://storify.com/xdamman/googleio.json returns the story object of the story “GoogleIO” of xdamman. You can use this to easily filter the elements of the story to retrieve only the YouTube videos of a given story and create a fancy HTML5 visualization (see the slideshow or this version). You can see some open source examples at http://github.com/storify/templates.

Add the Storify Editor to your sitehttp://storify.com/story/new?callback=yoursiteurlcallbackyoursiteurlcallback?permalink=storyPermalinkstoryPermalink<script src=”storyPermalink.js”></script>Google I/O Sandboxarticle in the New York TimesCome see Storify in the Developer Sandbox at Google I/O on May 10-11.Xavier Damman is the co-founder of Storify. He is also the founder of HackDemocracy, a community of hackers who want to improve our democracies using technology.

Engineering and Developers Blog

YouTube @ Google I/O: The iframe Player API

Reinventing News Video with Knight, Mozilla, and the YouTube API

Making stories with social media and YouTube videos

Labels

Archive

Feed