First in Safari go to the Develop menu and select "Start Debugging JavaScript" from the drop down.
Next you'll want to add a call to debugger in your javaScript like this.

 
function onSomeThing() {
  debugger;
}
 

You will then be able to run your page and have the Safari JavaScript debugger add a break point where your debugger call is placed.

The player lives on veoh.com and as an embedable player on sites like facebook. It plays more than 3 million videos per day to a global audience. The player is also the primary vehicle for our Behavioral Ad Targeting.

Development

This player played a key role in monetizing Veoh's business model. With this in mind the player architecture must accommodate an intense product life cycle and reliability.

I was able to achieve a reliable, scaleable and, testable code with Test Driven Development and common Design Patterns. This worked out so well after months of adding/removing features and product directions the code base still has no cruft!

To improve performance during progressive seeking I implemented a Binary Search to find the closest keyframe.

Multiple Logging Systems such as Nielsen, Omniture, Quantcast, Visible Measures, TubeMogul and our own data center.

Multicore PureMVC my choice because it's alight weight framework that could control a Flex or a pure ActionScript project.

Veoh Data SDK

My first step in converting the Veoh player to OOP was to create an API for our REST service.
Here is an example of how to fetch a video.

 
var service:VeohService = new VeohService( VEOH_API_KEY );
service.addEventListener( VeohResultEvent.SEARCH_SEARCH, handle_response);
service.search.findByPermalink( _videoPermalink );
 

VeohPlayback Player

I developed a VeohPlayback object with s similar interface to Adobe's FLVPlayback Component.
Unlike the Adobe's Component ours will play videos from our CDN, the Veoh P2P network, YouTube or CBS.

In Player Advertising

In early 2007 we created one of the first in-stream ad systems. We later partnered up with Freewheel to deliver our in-stream ads. Since we one of Freewheels first clients I worked closely with their development team in NYC and China on their ActionScript SDK.

Event based ads was something I was pushing for before working with Veoh. At Aviatech I was able to use event based ads to sell products. This example for Calloway Golf is a great example. My theory here was that many users would react to the video auto playing and immediately click pause. When the user clicks the pause button we know they are looking at the player and in this demo we show the product. After bringing this idea to Veoh it proved to have a higher click through rate than a typical overlay ad.

We have also integrated ads from Axel Springer, Scanscout and DoubleClick.

Testing and Planning

Planning: During he planning phase we implemented new features in out UML charts and discussed it's impact before writing any code.

Testing: Since this player is responsible for Veoh's main revenue stream I saw the need implement Test Driven Development. After I fully emerged my team with TDD the product life cycle became much smoother and more manageable. We used AsUnit along with ProjectSprouts/Growl to auto run the test suite. We also forked the ProjectSprouts to add some generators for AsUnit and PureMVC.

Continuous Integration: We have Hudson set up to test and build the player.

DoubleClick and other ad servers often embed Flash movies with the click through url as a flashvar named "clickTag". Here is the code in ActionScript 2.0 and 3.0 to use the clickTag flashVar.

ActionScript 2.0

 
on (release) {
    var url:String = "";
    url = _level0.clickTag || _level0.ClickTag || "";
    getURL(url, "_blank");
}
 

ActionScript 3.0

 
var _clickTag:String = "";
if(stage.root.loaderInfo.parameters.clickTag) {
     _clickTag = stage.root.loaderInfo.parameters.clickTag;
}
private function handle_btnClick(e:MouseEvent):void {
     ExternalInterface.call("window.parent.open", _clickTag);
} 
 
myButton.addEventListener(MouseEvent.CLICK, handle_btnClick);
 

Test your swf by adding the clickTag flashVar to your embed code.

 
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="300" height="250" id="300x250_standard" align="middle"><param name="allowScriptAccess" value="sameDomain" /><param name="allowFullScreen" value="false" /><param name="flashVars" value="clickTag=http://shrelp.com" /><param name="movie" value="300x250_standard.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#000000" /><embed src="300x250_standard.swf" quality="high" bgcolor="#000000" width="300" height="250" name="300x250_standard" align="middle" allowScriptAccess="sameDomain"
	 allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" flashVars="clickTag=http://ss.jonathanspooner.com" />
	</object>
 

For each additional swf you'll create a new task in your rakefile like this.

 
desc 'Menu App'
task :menu => "bin/MenuApp.swf"
mxmlc 'bin/MenuApp.swf' do |t|
  t.input                    = "src/MenuApp.as"
  t.debug                    = false
  t.optimize                 = true
  t.default_size             = '540 436'
  t.default_background_color = "0x000000"
  t.library_path     << "lib/corelib.swc"
  t.source_path      << "config/environments/production"
  t.define           = "CONFIG::production,false
  t.title            = "'My Project'"
  t.description      = 'My Menu App'
  t.link_report      = 'menu_report.xml'
end

After your task has been added it should now be listed when you run rake -T

 
rake -T
> rake menu                     # Menu App
 

Now run the task by it's name.

 
rake menu
 

You should see the mxmlc command execute. Note that your new swf will not be opened up like the rake debug task.

This article will demonstrate how to use compile time variables to set a build number and environment type. I will be using Project Sprouts to compile a swf with the mxmlc compiler.

We'll start by creating a new variable in our rakefile like this. Since this number will always show up when you run rakeI prefixed it with dev so my local build will never get confused others.

 
build_number = '"\'dev.1.1.1.1001\'"'
 

Quark #1. It took me a few tries to get the quotes right. Since this var is passed through a command shell then into the mxmlc the triple quotes are necessary. If you don't you will be likely to see some strange results and your swf just not compiling at all. If you use the string above and just replace dev.1.1.1.1001 you should be in good shape.

The next step it to add our version number to either the project model or a task via the define method. I decided to add the define method to the task since I would need to change the production variable for the deploy task.

 
desc 'Compile and run the application for debugging'
debug :debug do |d|
  d.define = "CONFIG::production,false -define=CONFIG::version," + build_number
end
 
desc 'Compile and run the test harness'
unit :test do |d|
  d.define = "CONFIG::production,false -define=CONFIG::version," + build_number
end
 
desc 'Compile for deployment'
deploy :deploy  do |p|
  p.define = "CONFIG::production,true -define=CONFIG::version," + build_number
end
 

Did you notice how I'm passing multiple variables in the same line? This is because the define method can't be called more then one time. It doesn't look like this is by design and might be a little bug in the task. Getting around this is easy enough. You just need to append "-define=" for all other variables.

This next snippet is the ActionScript 3.0 code demonstrates how to access your variable.

 
package {
  class Constants {
    public static const VERSION:String        = String(CONFIG::version);
    public static const IS_PRODUCTION:Boolean = CONFIG::production;
  }
}
 

Now that you have these lines of code in your project the next time you try to run AsDoc everything is going to melt down. AsDoc is very finicky and doesn't like the CONFIG variable. I was able to get around this by using a c preprocessor to remove these lines before AsDoc executes.

Finally you'll want to have your continuous integration system insert the correct version number. For example I have Hudson use sed to insert the correct version number.

 
sed -i 's/dev.1.1.1.1001/{RELEASE_NUMBER}/' rakefile.rb
 

And now you never have to manually update version numbers again!

If your using Flex to profile your application you will have to add these additional compiler arguments to the project properties.