Code Along with Cam : Next Gen Embed Video in Facebook News Feed

Posted by: Cameron Church, October 28, 2009

I've been reading a great post by fellow Brightcove Blogger Chris Little over at our Ecosystem blogroll about how Brightcove Players have been whitelisted by Facebook. 

This essentially means that a user can share a video from your player/site and have it appear in their FB Newsfeed for immediate inline playback.

I have need of such an integration to help spread the word of a live event we're looking at doing with Drupal tomorrow.

After digging into the code - I found it had some limitations given the FB's architecture requires the metadata of the video and player to be hosted on a HTML page.   If you're doing contextual publishing then this can be relatively straightfoward.

But I'm more interested in build this out in a BEML component that can be transported to any of my player templates.

To do this I needed 3 things

1. A server side script to create the meta tags on the fly

2. A BEML component to call the FB Sharer URL

3. A BEML Image link added to the player to allow a user to action it

Read More →

 

Custom Component Design , Distribution Strategy , Player Publishing & Design Comments (0), Tags:

Accessiblity is Key - UPDATED!

Posted by: Cameron Church, August 21, 2009

I received a comment on a past post I did in April looking at creating a custom BEML component that allowed a player to be controlled via the keyboard. A big step needed to get towards a universally accessible player.

Chris kindly pointed out that although my component worked in IE it failed miserably in other browsers like Firefox.   So I opened up the code and did some repairs and modifications.  

Below you can see the player and you should be able to control it using the arrow keys:

  • UP - Play/Pause the video
  • DOWN - Stop the video (and send it back to the beginning)
  • LEFT - Seek back 15 seconds
  • Right - Seek forward 15 seconds

Read More →

 

Custom Component Design , Player Publishing & Design Comments (2), Tags:

Tools of the Trade

Posted by: Cameron Church, June 9, 2009

The Brightcove 3 Platform has more than a million and one things you can build on it.   Fact.

Here in the Brightcove Best Practices team we work tirelessly with our publishers and partners to get the most success possible from their online video initiatives. 

When developing with the BC3 Platform we've come across our fair share of helper tools that really helped to accelerate the development process.  I want to share with you 3 of my favourites.

Please note these 3 tools are all made to be used by the Firefox web browser.   Today Firefox has one of the best browser plugin extension models on the market (like Brightcove!) and, somewhat more importantly, has one of the best plugin developer communities (like Brightcove!) - net effect is there are realllllllly helpful tools out there to accelerate you towards your goals.

Flash Tracer

The Brightcove Player architecture is Adobe Flash based.    Its extensible BEML plugin architecture can accept any number and type of custom modules built using ActionScript 3.   This is great news for people really wanting to push the boundaries of the video consumption and interaction paradigms. 

One problem that has plagued Flash from its inception is its lacking debugging model.   You compile the SWF, you put that onto your website, you run it and you Trace Trace Trace.   Usually via visual tracing pop up dialogues. 

Enter Flash Tracer from Alessandro Crugnola at sephiroth.it.  Simply put a great tool that allows you to watch the Flash Debug trace real time beside the page as it loads up.   

It's invaluable for anybody looking to develop a Brightcove 3 custom player component and/or plugin.

Download it here: http://www.sephiroth.it/firefox/flashtracer/

Flash Switcher

This is another one from Alessandro at sephiroth.it which works very well with Flash Tracer.  
Just like web browsers, Flash has a wide spectrum of player versions out in the wild.  At the time of writing you can get anything from Flash Player v9.0.151.0 up to v10.0.22.87

On top of which you have debugging versions of each.   Making sure your SWF runs across all necessary versions can be a headache as you have to un/re/install the different versions to test.  

Add to that the hassle of running the debug version of a Player for standard browser usage and it quickly becomes impractical due to all the errors it throws up during everyday browsing.

Flash Switcher lets you download each version of a Flash Player, keep them in an isolated directory and switch them real time via a toggle in Firefox - nothing short of brilliant.  No need to un/re/install all the various version of Flash to test your SWF.

It does take a little bit of a set up, and you need keep the Flash versions up to date yourself but once up and running it is invaluable.

You can download it here: http://www.sephiroth.it/firefox/flash_switcher/

Charles HTTP Proxy

More often then not when it comes to custom integrations we need to look under the hood of the Brightcove engine to see how clear are the lines of communication between custom components and the BC3 platform.

This means watching the chatter between various platforms and there's nothing better then using Charles for this tool.   It is a standalone app available for all platforms and comes with a Firefox plugin that allows you to watch with a great degree of granularity exactly what calls, and responses are being made from the various applications that makes up your technical architecture.

Especially useful when seeing what happens between Brightcove and your Ad Server or Analytics Server.

You can download Charles application and Firefox extension here: http://www.charlesproxy.com/download/

These are just 3 tools that we use daily here in Brightcove.    Others to check out are

Let us know if you have any great tools that help accelerate your Brightcove 3 development efforts!

---
Cameron Church
Head of Best Practices EMEA

 

Custom Component Design Comments (0), Tags: