Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Annotating YouTube videos programmatically [closed]

I want to be able to display a normal YouTube video with overlaid annotations, consisting of coloured rectangles for each frame. The only requirement is that this should be done programmatically.

YouTube has annotations now, but require you to use their front end to create them by hand. I want to be able to generate them. What's the best way of doing this?

Some ideas:

  1. Build your own Flash player (ew?)
  2. Somehow draw over the YouTube Flash player. Will this work?
  3. Reverse engineer & hijack YouTube's annotation system. Either messing with the local files or redirecting its attempt to download the annotations. (using Greasemonkey? Firefox plugin?)

Idea that doesn't count:

download the video

like image 737
Louis Brandy Avatar asked Aug 01 '08 18:08

Louis Brandy


People also ask

Can you still annotate YouTube videos?

Update: YouTube has replaced annotation with end screen. You can find the latest informaiton about YouTube screen and YouTube cards here. YouTube Cards and Annotations are very useful if you want to encourage your viewrs to take an action, like Subscribe, go to another video or associated website, etc.

How does annotation work in YouTube?

Annotations can be used to add text to your videos to let your viewers know about updates and other information about your video, to create interactive YouTube campaigns and to link to other videos, channels, subscription pages and more on the YouTube site.


1 Answers

YouTube provides an ActionScript API.

Using this, you could load the videos into Flash using their API and then have your Flash app create the annotations on a layer above the video.

Or, alternatively, if you want to stay away from creating something in Flash, using YouTube's JavaScript API you could draw HTML DIVs over the YouTube player on your web page. Just remember when you embed the player to have WMODE="transparent" in the params list.

So using the example from YouTube:

  <script type="text/javascript">      var params = { allowScriptAccess: "always" };     var atts = { id: "myytplayer", wmode: "transparent" };     swfobject.embedSWF("http://www.youtube.com/v/VIDEO_ID&enablejsapi=1&playerapiid=ytplayer",                         "ytapiplayer", "425", "356", "8", null, null, params, atts);    </script> 

And then you should be able to draw your annotations over the YouTube movie using CSS/DHTML.

like image 100
nerdabilly Avatar answered Oct 14 '22 16:10

nerdabilly