Building Video Appswith YouTube APIs : Workshop

Jarek Wilkiewicztwitter.com/wjarek

Mexico City, 03/31/2011

AppEngine - setup dev envPlayer API

Exercise 1 : Run API example Exercise 2 : Modify API example

Google YouTube Data APIExercise 3 : Run API example

Google YouTube Data API + AppEngineExercise 4 : Integrate YouTube API into AppEngine appExercise 5 : Deploy

Agenda

Download and install AppEngine SDK : http://code.google.com/appengine/downloads.html#Google_App_Engine_SDK_for_Java Install Eclipse and Google Plugin as documented here https://sites.google.com/site/gdevelopercodelabs/app-engine/java-codelab

Create and Run the "Guestbook" appYou should see "Hello App Engine"

AppEngine - setup

Mac JDK issues ? See : http://code.google.com/p/googleappengine/issues/detail?id=4712#c39

Add a file : player.html

Create player.html file under war/ directory

Read http://goo.gl/D30jKhttp://apiblog.youtube.com/2011/01/introducing-javascript-player-api-for.html

Copy the code to player.htmlRun it and point your browser at http://localhost:8888/player.htmlThe playback should stop after 6000ms Modify the code to use different videoId and a timeout other than 6000ms

Player API : Exercise 1

Continue with code from Exercise 1Modify the code to skip to second 20 rather than stopping at second 6, and continue playingAPI info :

http://code.google.com/apis/youtube/iframe_api_reference.html http://code.google.com/apis/youtube/js_api_reference.html

Player API : Exercise 2

function stopVideo() { player.seekTo(20, true); }

Player API : Exercise 2 Solution

Objective : Run sample API code

Steps :

1. Download Java Google Data Client Library and Samples JARs

2. Add Java Client Library JARs and dependencies to your project

3. Copy YouTubeReadonlyClient.java sample into your project and adjust package name

4. Run YouTubeReadonlyClient from Eclipse

Using YouTube Google Data APIs Exercise 3

Download the Java Client Library (1.43.0 source and 1.43.0 samples) : http://code.google.com/p/gdata-java-client/downloads/list

Google Data API : setupExercise 3

Unzip the gdata-src.java-1.43.0.zipCopy gdata jars (gdata/java/lib)to

Guestbook\war\WEB-INF\libCopy gdata dep jars (gdata/java/deps)to

Guestbook\war\WEB-INF\lib

Google Data API : setup libsExercise 3

gdata/java/lib$ cp * ~/projects/workspace/Guestbook/war/WEB-INF/lib/gdata/java/deps$ cp * ~/projects/workspace/Guestbook/war/WEB-INF/lib/

Update build path (Project/Properties/Java Build Path/Libraries/Add JARs) to include the jarRefresh

Google Data API : Add JARsExercise 3

Add YouTubeReadOnly.java from gdata-samples.java-1.43.0.zip to your project src directoryModify package to package guestbook

Google Data API : Add SampleExercise 3

gdata-samples/java/sample/youtube$ cp YouTubeReadonlyClient.java ~/projects/workspace/Guestbook/src/guestbook

Run YouTubeReadOnly ( option 2 Print Search Feed)

Google Data API : Run SampleExercise 3

Google Data API : Example Output

Integrate YouTube API invocation into an AppEngine appExercise 4

Objective : include YouTube search results in GuestbookServlet.java outputSteps : reuse implementation of private static void searchFeed(YouTubeService service) in your servletModify the printVideoEntry implementation to print using PrintWriter

Exercise 4 : move searchFeed to GuestBookServlet

Exercise 4 : move searchFeed to GuestBookServlet

Exercise 4 : modify doGetNow modify doGet to use searchFeed in your servlet, replace System.out references with HttpServletResponse.getWriter()

Register for YouTube developer key : http://code.google.com/apis/youtube/dashboardUse it in your app YouTubeService myService = new YouTubeService("gdataSample-YouTube-1", "AI39...")

Google Data API : Dev KeyExercise 4

Exercise 4 : run your code

Exercise 5 : Create AppEngine AppFollow the instructions here to create AppEngine application : https://sites.google.com/site/gdevelopercodelabs/app-engine/creating-your-app-engine-accountModify appengine-web.xml and specify the application name

Exercise 5 : Deploy to AppEngineDeploy to AppEngineTry http://your-application-name.appspot.com