Merge branch 'hotfix/fix-chrome-seeking-spinner' into stable

Changed demo URLs to be local, so that they work with current release file, not old release on server.

.gitignore

@@ -0,0 +1,5 @@
+.DS_Store
+dist/*
+dev.html
+projects
+.zenflow-log

.zenflow

@@ -0,0 +1,10 @@
+--- 
+confirm_review: true
+backup_remote: false
+release_branch: stable
+project: videojs
+qa_branch: false
+staging_branch: false
+development_branch: master
+remote: origin
+confirm_staging: false

CHANGELOG.md

@@ -0,0 +1,58 @@
+--------------------------------------------------------------------------------
+                          ^ ADD NEW CHANGES ABOVE ^
+--------------------------------------------------------------------------------
+
+CHANGELOG
+=========
+
+---- 3.0.3 / 2012-01-12 / doc-change -------------------------------------------
+* Added line to docs to test zenflow
+
+---- 3.0.4 / 2012-01-12 / undefined-source-fix ---------------------------------
+* Fixing an undefined source when no sources exist on load
+
+---- 3.0.5 / 2012-01-12 / event-layer-x-deprecation-fix ------------------------
+* Removed deprecated event.layerX and layerY
+
+---- 3.0.6 / 2012-01-12 / docs-url-fix -----------------------------------------
+* Fixed wrong URL for CDN in docs
+
+---- 3.0.7 / 2012-01-12 / fixing-ie8-poster-bug --------------------------------
+* Fixed an ie8 breaking bug with the poster
+
+---- 3.0.8 / 2012-01-23 / fix-ie-controls-hiding -------------------------------
+* Fixed issue with controls not hiding in IE due to no opacity support
+
+---- 3.1.0 / 2012-01-30 / leonardo ---------------------------------------------
+* Added CSS fix for Firefox 9 fullscreen (in the rare case that it's enabled)
+* Replaced swfobject with custom embed to save file size.
+* Added  flash iframe-mode, an experimental method for getting around flash reloading issues.
+* Fixed issue with volume knob position. Improved controls fading.
+* Fixed ian issue with triggering fullscreen a second time.
+* Fixed issue with getting attributes in Firefox 3.0
+* Escaping special characters in source URL for Flash
+* Added a check for if Firefox is enabled which fixes a Firefox 9 issue
+* Stopped spinner from showing on 'stalled' events since browsers sometimes don't show that they've recovered.
+* Fixed CDN Version which was breaking dev.html
+* Made full-window mode more independent
+* Added rakefile for release generation
+
+---- 3.2.0 / 2012-03-20 / baxter -----------------------------------------------
+* Updated docs with more options.
+* Overhauled HTML5 Track support.
+* Fixed Flash always autoplaying when setting source.
+* Fixed localStorage context
+* Updated 'fullscreenchange' event to be called even if the user presses escape to exit fullscreen.
+* Automatically converting URsource URL to absolute for Flash fallback.
+* Created new 'loadedalldata' event for when  the source is completely downloaded
+* Improved player.destroy(). Now removes elements and references.
+* Refactored API to be more immediately available.
+
+---- 3.2.1 / 2012-04-06 / options-width-fix ------------------------------------
+* Fixed setting width/height with javascript options
+
+---- 3.2.2 / 2012-05-02 / multiple-control-fades-fix ---------------------------
+* Fixed error with multiple controls fading listeners
+
+---- 3.2.3 / 2012-11-12 / fix-chrome-seeking-spinner ---------------------------
+* Fixed chrome spinner continuing on seek

README.md

@@ -0,0 +1,30 @@
+VideoJS - [HTML5 Video Player](http://videojs.com)
+==================================================
+Version 3.0 BETA
+
+Visit the main site at [videojs.com](http://videojs.com) for download options and instructions.
+
+To build video-js from the latest version of the source, clone the source repository and run:
+sh build.sh
+in the video-js directory using the commnand-line/terminal of a unix-based system.
+
+Contributing
+------------
+If you'd like to help out on VideoJS, you are awesome. Updates should be made to the source files and then make a pull request.
+
+When working on VideoJS code, you can use dev.html as your test page. It doesn't exist in the repo and changes to it won't be tracked. To get your own copy simply clone the repo and copy dev.html.example.
+cp dev.html.example dev.html
+
+You can use dev.html to test new code. It's simple HTML doc that includes all the source files. Send a pull request for any updates.
+
+---
+BETA NOTES  
+Version 3 is almost a complete rewrite of the previous versions of VideoJS. New features includes:
+
+  - HTML/CSS Controls and API now work for both the HTML5 and Flash versions.
+  - Custom Super-lightweight Flash Fallback
+  - Embed Code is much simpler.
+    - No more "vjs-box" div required, just use the video tag.
+    - No more embedding of Flash fallback within the video tag HTML.
+
+---

Rakefile

@@ -0,0 +1,203 @@
+require 'rubygems'
+require 'yaml'
+require 'httparty'
+
+namespace :build do
+
+  desc "Build version for current '/c/' CDN copy and locked in version"
+  task :current do
+    Rake::Task["build:source"].execute
+
+    cdn_version_num = "#{version['major']}.#{version['minor']}"
+
+    ['c', cdn_version_num].each do |vsn|
+      Rake::Shell["mkdir dist/#{vsn}"]
+
+      File.open("dist/#{vsn}/video.js", "w+") do |file|
+        file.puts File.read("dist/video.min.js").sub('GENERATED_CDN_VSN', vsn)
+      end
+
+      Rake::Shell["cp dist/video-js.min.css dist/#{vsn}/video-js.css"]
+      Rake::Shell["cp dist/video-js.swf dist/#{vsn}/video-js.swf"]
+      Rake::Shell["cp dist/video-js.png dist/#{vsn}/video-js.png"]
+      Rake::Shell["cp dist/demo.html dist/#{vsn}/demo.html"]
+      Rake::Shell["cp dist/captions.vtt dist/#{vsn}/captions.vtt"]
+    end
+
+    Rake::Shell["mkdir dist/video-js"]
+
+    File.open("dist/video-js/video.min.js", "w+") do |file|
+      file.puts File.read("dist/video.min.js").sub('GENERATED_CDN_VSN', cdn_version_num)
+    end
+
+    File.open("dist/video-js/video.js", "w+") do |file|
+      file.puts File.read("dist/video.js").sub('GENERATED_CDN_VSN', cdn_version_num)
+    end
+
+    Rake::Shell["cp dist/video-js.min.css dist/video-js/video-js.min.css"]
+    Rake::Shell["cp dist/video-js.css dist/video-js/video-js.css"]
+    Rake::Shell["cp dist/video-js.swf dist/video-js/video-js.swf"]
+    Rake::Shell["cp dist/video-js.png dist/video-js/video-js.png"]
+    Rake::Shell["cp dist/demo.html dist/video-js/demo.html"]
+    Rake::Shell["cp dist/captions.vtt dist/video-js/captions.vtt"]
+
+    Rake::Shell["cd dist && zip -r video-js-#{version_number}.zip video-js && cd .."]
+
+    if `git name-rev --name-only HEAD`.strip != 'stable'
+      Rake::Log["*** WARNING: NOT ON STABLE BRANCH!!! ***"]
+    end
+  end
+
+  desc "Build source files for packaging"
+  task :source do
+    Rake::Log["Building Version: " << version_number]
+
+    if File.exist?("dist")
+      Rake::Shell["rm -r dist"]
+    end
+
+    # Make distribution folder
+    Rake::Shell["mkdir dist"]
+
+    Rake::Log["Combining source files"]
+    combined = ""
+
+    first_files = [ '_begin.js', 'core.js', 'lib.js' ]
+
+    first_files.each do |item|
+      Rake::Log[item]
+      combined << File.read("src/#{item}")
+    end
+
+    Dir.foreach('src') do |item|
+      next if (['.', '..', '.DS_Store', 'setup.js', '_end.js'] + first_files).include? item
+      combined << File.read("src/#{item}")
+    end
+
+    # combined << File.read("flash/swfobject.js")
+    combined << File.read("src/setup.js")
+    combined << File.read("src/_end.js")
+
+    Rake::Log["Adding version number"]
+    combined = combined.gsub('GENERATED_AT_BUILD', version_number)
+
+    File.open('dist/video.js', "w+") do |file|
+      file.puts "" << combined
+    end
+
+    Rake::Log["Copying CSS and updated version"]
+    File.open('dist/video-js.css', "w+") do |file|
+      file.puts File.read("design/video-js.css").gsub('GENERATED_AT_BUILD', version_number)
+    end
+
+    Rake::Log["Copying suppporting files"]
+    Rake::Shell["cp design/video-js.png dist/video-js.png"]
+    Rake::Shell["cp flash/video-js.swf dist/video-js.swf"]
+
+    Rake::Shell["cp build/release-files/README.md dist/README.md"]
+    Rake::Shell["cp build/release-files/demo.html dist/demo.html"]
+    Rake::Shell["cp build/release-files/captions.vtt dist/captions.vtt"]
+    Rake::Shell["cp LGPLv3-LICENSE.txt dist/LGPLv3-LICENSE.txt"]
+
+    Rake::Log["Minimizing JavaScript"]
+    Rake::Shell["java -jar build/lib/yuicompressor-2.4.7.jar dist/video.js -o dist/video.min.js"]
+
+    Rake::Log["Minimizing CSS"]
+    Rake::Shell["java -jar build/lib/yuicompressor-2.4.7.jar dist/video-js.css -o dist/video-js.min.css"]
+
+    Rake::Log[version_number << " Built"]
+  end
+
+  desc "Build list of source files for easy inclusion in projects"
+  task :js_source do
+
+    File.open("dev/source-list.js", "w+") do |file|
+      file.puts "var vjsSourceList = [];"
+
+      src_array = ["src/core", "src/lib"]
+      last = ["src/setup"] # "flash/swfobject", 
+      exclude = [".", "..", ".DS_Store", "_end.js", "_begin.js"]
+
+      Dir.foreach('src') do |item|
+        next if exclude.include? item
+
+        item_name = "src/" << item.sub(".js", "")
+
+        next if (src_array + last).include? item_name
+
+        src_array << item_name
+      end
+
+      src_array = src_array + last
+
+      src_array.each do |item|
+        file.puts "vjsSourceList.push('#{item}')"
+      end
+      # file.puts "vjsSourceList.push('src/#{item.sub(".js", "")}')"
+      # file.puts "vjsSourceList.push('flash/swfobject.js')"
+
+    end
+  end
+  
+  desc "Build list of source files for easy inclusion in projects"
+  task :source_html do
+
+    File.open("dev/source-list.html", "w+") do |file|
+      file.puts "<!-- Video.js Source Files -->"
+
+      src_array = ["src/core", "src/lib"]
+      last = ["src/setup"] # "flash/swfobject", 
+      exclude = [".", "..", ".DS_Store", "_end.js", "_begin.js"]
+
+      Dir.foreach('src') do |item|
+        next if exclude.include? item
+
+        item_name = "src/" << item.sub(".js", "")
+
+        next if (src_array + last).include? item_name
+
+        src_array << item_name
+      end
+
+      src_array = src_array + last
+
+      src_array.each do |item|
+        file.puts "<script src='#{item}.js'></script>"
+      end
+      # file.puts "vjsSourceList.push('src/#{item.sub(".js", "")}')"
+      # file.puts "vjsSourceList.push('flash/swfobject.js')"
+      
+      file.puts "<!-- END Video.js Source Files -->"
+
+    end
+  end
+
+end
+
+def version
+  YAML.load(File.read("VERSION.yml"))
+end
+
+def version_number
+  "#{version['major']}.#{version['minor']}.#{version['patch']}"
+end
+
+module Rake
+  class Shell
+    def self.[](command)
+      output = %x[#{command}]
+      if $?.to_i > 0
+        puts "-----> Process aborted"
+        puts "       Exit status: #{$?}"
+        exit($?.to_i)
+      end
+      puts output
+    end
+  end
+
+  class Log
+    def self.[](message)
+      puts "-----> #{message.split("\n").join("\n       ")}"
+    end
+  end
+end

VERSION.yml

@@ -0,0 +1,5 @@
+---
+major: 3
+minor: 2
+patch: 3
+pre: 

build.sh

@@ -0,0 +1,48 @@
+#! /bin/csh
+# Combines Source Files. In terminal, sh build.sh
+# It will put a new video.js file under dist/
+
+# Create dist directory if it doesn't already exist
+mkdir -p dist
+
+# FILES=../src/*
+# for f in $FILES
+# do
+#   echo "Processing $f file..."
+#   # take action on each file. $f store current file name
+#   cat $f
+# done
+
+cat src/_begin.js > dist/video.js
+
+cat src/core.js >> dist/video.js
+cat src/lib.js >> dist/video.js
+cat src/ecma.js >> dist/video.js
+cat src/json.js >> dist/video.js
+cat src/events.js >> dist/video.js
+
+cat src/component.js >> dist/video.js
+cat src/player.js >> dist/video.js
+cat src/tech.js >> dist/video.js
+cat src/controls.js >> dist/video.js
+
+cat src/tracks.js >> dist/video.js
+
+# h5swf temporarily requires swfobject
+# cat flash/swfobject.js >> dist/video.js
+
+cat src/setup.js >> dist/video.js
+cat src/_end.js >> dist/video.js
+
+
+# Copy Files
+cp design/video-js.css dist/video-js.css
+cp design/video-js.png dist/video-js.png
+cp flash/video-js.swf dist/video-js.swf
+
+cp build/release-files/README.md dist/README.md
+cp build/release-files/demo.html dist/demo.html
+cp LGPLv3-LICENSE.txt dist/LGPLv3-LICENSE.txt
+
+java -jar build/lib/yuicompressor-2.4.7.jar dist/video.js -o dist/video.min.js
+java -jar build/lib/yuicompressor-2.4.7.jar dist/video-js.css -o dist/video-js.min.css

build/Versioning Notes.md

@@ -0,0 +1,28 @@
+Deploying Version
+-----------------
+- Update SWF location for CDN
+
+Version Numbers
+---------------
+http://en.wikipedia.org/wiki/Software_versioning#Sequence-based_identifiers
+
+### Major Version (Integer, e.g 3.0)
+- Any features where we expect it could break plugins, skins, or any major API integration.
+
+### Minor Version (3.1)
+- Additional non-breaking features
+
+### Revision Versions
+
+- Beta (3.1b1)
+- Release Candidate (3.1rc1)
+- Release with revisions (3.1r1)
+
+Notes:
+The last level of one revision type (beta/release candidate) should match the first level of the next revision type. 4.0-b10 should match 4.0-rc1, assuming b10 is the last beta version.
+
+Release revisions means bug fixes. The CDN url should not reflect the revision number. 4.0-r2 would still be /4.0/.
+
+Tagging a Release
+-----------------
+git tag -a [version number] [commit]

build/release-files/README.md

@@ -0,0 +1,153 @@
+Video.js - [HTML5 Video Player](http://videojs.com)
+==================================================
+Version 3.0
+
+---
+Version 3 is almost a complete rewrite of the previous versions of Video.js. New features includes:
+
+  - HTML/CSS Controls and API now work for both the HTML5 and Flash versions.
+  - Custom Super-lightweight Flash Fallback
+  - Embed Code is much simpler.
+    - No more "vjs-box" div required, just use the video tag.
+    - No more embedding of Flash fallback within the video tag HTML.
+
+---
+
+View [videojs.com](http://videojs.com) for a demo and overview.  
+
+Video.js is an HTML5 video player that uses the HTML5 video tag built into modern browsers, and uses javascript to add custom controls, new functionality, and to fix cross browser bugs. For browsers that don't support HTML5, it will fallback to a Flash player.
+
+View demo.html for an example of how to use it.
+
+Originally based on [this tutorial](http://blog.steveheffernan.com/2010/04/how-to-build-an-html5-video-player/).
+
+Contributors (Github Username)
+------------------------------
+heff, dz0ny, sentientbit, tvdeyen, brandonarbini, gordonbrander, Shraymonks, albertogasparin, sandaru1, nicholasbs, majornista, Fredust85, @wonderboymusic, ellis-, emirpprime, eirikb, mbrubeck
+
+
+Getting Started
+---------------
+
+### Step 1: Include the Video.js Javascript and CSS files in the head of your page.
+Change the file urls to point to the files on your server.
+
+    <script src="video.js"></script>
+    <link href="video-js.css" rel="stylesheet">
+
+
+### Step 2: Add an HTML5 video tag to your page.
+Use the video tag as normal, with a few extra pieces for Video.js:
+
+  1. The 'data-setup' attribute tells Video.js to automatically set up the video when the page is ready, and read any options (in JSON format) from the attribute.
+  2. The 'id' Attribute: Should be used and unique for every video on the same page.
+  3. The 'class' attribute contains two classes:
+    - 'video-js' applies styles that are required for Video.js functionality, like fullscreen and subtitles.
+    - 'vjs-default-skin' applies the default skin to the HTML controls, and can be removed or overridden to create your own controls design.
+
+Otherwise include/exclude attributes, settings, sources, and tracks exactly as you would for HTML5 video.
+
+    <video id="example_video_1" class="video-js vjs-default-skin" controls preload="auto" width="640" height="264"
+        poster="http://video-js.zencoder.com/oceans-clip.png"
+        data-setup='{"example_option":true}'>
+      <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' />
+      <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm' />
+    </video>
+
+
+### Step 3: Nada!
+That's all it take to get started. See the [docs](http://videojs.com/docs/) for more advanced uses.
+
+
+Changelog
+---------
+3.0
+
+- Complete rewrite
+- HTML/CSS Controls and API now work for both the HTML5 and Flash versions
+- Custom Super-lightweight Flash Fallback
+- Embed Code is much simpler.
+  - No more "vjs-box" div required, just use the video tag.
+  - No more embedding of Flash fallback within the video tag HTML.
+
+2.0.3
+
+- Feature: Made returning to the start at the end of the movie an option ("returnToStart").
+- Feature: Added loop option to loop movie ("loop").
+- Feature: Reorganized player API and listeners.
+- Feature: Added option to disable controls. controlsEnabled: false
+- Feature: Setup method now has a callback, so you can more easily work with the player after setup
+- Feature: Added listeners for enter/exit full screen/window.
+- Feature: Added a VideoJS.player(id) function for getting the player for a video ID
+- Changes: setupAllWhenReady is now just setupAll (backward compatible)
+- Fix: Check for Android browser now excludes firefox and opera
+
+2.0.2 (2010-12-10)
+
+- Feature: Rewrote and optimized subtitle code.
+- Feature: Protecting against volume ranges outside of 1 and 0.
+- Fix: Bug in Safari for Mac OS 10.5 (Leopard) that was breaking fullscreen.
+
+2.0.1 (2010-11-22)
+
+- Fix: Issue with big play button when multiple videos are on the page.
+- Fix: Optimized play progress tracking.
+- Fix: Optimized buffer progress checking.
+- Fix: Firefox not showing Flash fallback object.
+
+2.0.0 (2010-11-21)
+
+- Feature: Created "behaviors" concept for adding behaviors to elements
+- Feature: Switched back to divs for controls, for more portable styles
+- Feature: Created playerFallbackOrder array option. ["html5", "flash", "links"]
+- Feature: Created playerType concept, for initializing different platforms
+- Feature: Added play button for Android
+- Feature: Added spinner for iPad (non-fullscreen)
+- Feature: Split into multiple files for easier development
+- Feature: Combined VideoJS & _V_ into the same variable to reduce confusion
+- Fix: Checking for m3u8 files (Apple HTTP Streaming)
+- Fix: Catching error on localStorage full that safari seems to randomly throw
+- Fix: Scrubbing to end doesn't trigger onEnded
+
+1.1.5 (2010-11-09)
+
+- Feature: Switched to track method for setting subtitles. Now works like spec.
+- Feature: Created "players" concept for defining fallbacks and fallback order
+- Fix: Android playback bug.
+- Fix: Massive reorganization of code to make easier to navigate
+
+1.1.4 (2010-11-06)
+
+- Feature: Added loading spinner.
+- Feature: Improved styles loaded checking.
+- Feature: Added volume() function to get and set volume through the player.
+- Fix: Fix issue where FF would loop video in background when ended.
+- Fix: Bug in Chrome that shows poster & plays audio if you set currentTime too quickly.
+- Fix: Bug in Safari where waiting is triggered and shows spinner when not needed
+- Fix: Updated to show links if only unplayable sources and no Flash.
+- Fix: Issue where if play button was loaded after play, it wouldn't hide.
+
+1.1.3 (2010-10-19)
+
+- Feature: Width/Height functions for resizing the player
+- Feature: Made initial click & hold trigger new value on progress and volume
+- Feature: Made controls not hide when hovering over them
+- Feature: Added big play button as default starting control.
+- Fix: Removed trailing comma that was breaking IE7
+- Fix: Removed some vars from global scope
+- Fix: Changed a document.onmousemove to an eventListener to prevent conflicts
+- Fix: Added a unique ID to FlowPlayer demo object to fix a FlowPlayer bug. Thanks @emirpprime.
+- Fix: Safari error on unloaded video
+
+1.1.2 (2010-09-20)
+
+- Added a fix for the poster bug in iPad/iPhone
+- Added more specificity to styles
+
+1.1.1 (2010-09-14)
+
+- First Formally Versioned Release
+  
+1.0.0 (2010-05-18)
+
+- First released

build/release-files/captions.vtt

@@ -0,0 +1,41 @@
+WEBVTT
+
+00:00.700 --> 00:04.110
+Captions describe all relevant audio for the hearing impaired.
+[ Heroic music playing for a seagull ]
+
+00:04.500 --> 00:05.000
+[ Splash!!! ]
+
+00:05.100 --> 00:06.000
+[ Sploosh!!! ]
+
+00:08.000 --> 00:09.225
+[ Splash...splash...splash splash splash ]
+
+00:10.525 --> 00:11.255
+[ Splash, Sploosh again ]
+
+00:13.500 --> 00:14.984
+Dolphin: eeeEEEEEeeee!
+
+00:14.984 --> 00:16.984
+Dolphin: Squawk! eeeEEE?
+
+00:25.000 --> 00:28.284
+[ A whole ton of splashes ]
+
+00:29.500 --> 00:31.000
+Mine. Mine. Mine.
+
+00:34.300 --> 00:36.000
+Shark: Chomp
+
+00:36.800 --> 00:37.900
+Shark: CHOMP!!!
+
+00:37.861 --> 00:41.193
+EEEEEEOOOOOOOOOOWHALENOISE
+
+00:42.593 --> 00:45.611
+[ BIG SPLASH ]

build/release-files/demo.html

@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>Video.js | HTML5 Video Player</title>
+
+  <!-- Chang URLs to wherever Video.js files will be hosted -->
+  <link href="video-js.css" rel="stylesheet" type="text/css">
+  <!-- video.js must be in the <head> for older IEs to work. -->
+  <script src="video.js"></script>
+
+  <!-- Unless using the CDN hosted version, update the URL to the Flash SWF -->
+  <script>
+    _V_.options.flash.swf = "video-js.swf";
+  </script>
+
+
+</head>
+<body>
+
+  <video id="example_video_1" class="video-js vjs-default-skin" controls preload="none" width="640" height="264"
+      poster="http://video-js.zencoder.com/oceans-clip.png"
+      data-setup="{}">
+    <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' />
+    <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm' />
+    <source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg' />
+    <track kind="captions" src="captions.vtt" srclang="en" label="English" />
+  </video>
+
+</body>
+</html>

comments.html

@@ -1,104 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <meta charset="utf-8" />
-  <title>Comments | HTML5 Video Player | Video JS</title>
-  <meta name="google-site-verification" content="QHf9MEYVlEWoNHbzTeUkSQsbRT5Twzqu6N0nX1i3nes" />
-  
-  <script src="video-js/video.js" type="text/javascript" charset="utf-8"></script>
-  <!-- JQuery not required, but used for dom ready function -->
-  <script src="javascripts/jquery-1.4.2.min.js" type="text/javascript" charset="utf-8"></script>
-
-  <link rel="stylesheet" href="stylesheets/base.css" type="text/css" media="all" charset="utf-8" />
-  <link rel="stylesheet" href="video-js/video-js.css" type="text/css" media="all" charset="utf-8" />
-  <link rel="stylesheet" href="stylesheets/site.css" type="text/css" media="all" charset="utf-8" />
-
-  <!--[if !IE 7]>
-    <style type="text/css">
-      #wrap {display:table;height:100%}
-    </style>
-  <![endif]-->
-
-  <script type="text/javascript" charset="utf-8">
-    // Using JQuery's DOM Ready function
-    // You can also use window.onload, but it loads slower
-    $(function(){
-      VideoJS.setup();
-    })
-    
-    // If not using a JS library
-    // window.onload = function(){
-    //   VideoJS.setup();
-    // }
-  </script>
-
-</head>
-<body>
-
-  <div id="wrap">
-    <div id="main">
-
-      <ul id="nav">
-        <li><a href="skins.html">Skins</a></li>
-        <li><a href="http://github.com/zencoder/video-js">Source</a></li>
-        <li><a href="http://wiki.github.com/zencoder/video-js/browser-device-compatibility">Compatibility</a></li>        
-        <li><a href="http://github.com/zencoder/video-js/issues">Issue Tracker</a></li>
-        <li><a href="http://wiki.github.com/zencoder/video-js/">Wiki</a></li>
-      </ul>
-
-      <h1>Video JS</h1>
-      <p class="tagline">Open Source HTML5 Video Player</p>
-
-        <div id="disqus_thread"></div> 
-        <script type="text/javascript">
-          /**
-            * var disqus_identifier; [Optional but recommended: Define a unique identifier (e.g. post id or slug) for this thread]
-            */
-          (function() {
-           var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
-           dsq.src = 'http://videojs.disqus.com/embed.js';
-           (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
-          })();
-        </script>
-        <noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript=videojs">comments powered by Disqus.</a></noscript>
-        <a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>
-
-      </div>
-    </div>
-
-    <div id="footer">
-      &copy; <a href="http://videojs.com">The Video JS Project</a>. Sponsored by <a href="http://zencoder.com">Zencoder</a>.
-    </div>
-  </div>
-
-  <script type="text/javascript">
-  //<![CDATA[
-  (function() {
-    var links = document.getElementsByTagName('a');
-    var query = '?';
-    for(var i = 0; i < links.length; i++) {
-    if(links[i].href.indexOf('#disqus_thread') >= 0) {
-      query += 'url' + i + '=' + encodeURIComponent(links[i].href) + '&';
-    }
-    }
-    document.write('<script charset="utf-8" type="text/javascript" src="http://disqus.com/forums/videojs/get_num_replies.js' + query + '"></' + 'script>');
-  })();
-  //]]>
-  </script>
-
-  <script type="text/javascript">
-
-    var _gaq = _gaq || [];
-    _gaq.push(['_setAccount', 'UA-16505296-1']);
-    _gaq.push(['_trackPageview']);
-
-    (function() {
-      var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
-      ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
-      var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
-    })();
-
-  </script>
-
-</body>
-</html>

decisions.txt

@@ -0,0 +1,8 @@
+Tracking/Polling CurrentTime Manually
+-------------------------------------
+- Necessary for most flash players and browsers that don't trigger timeupdate events. 
+- In VJS 1-2, we always tracked time because timeupdate was rare.
+- Now most browsers support it well. There is a delay bug in the current Chrome.
+    http://code.google.com/p/chromium/issues/detail?id=92251
+  Andrew from Chrome told me it would be fix in an upcoming release.
+Going to rely on browsers timeupdates when available now.

demo-subtitles.srt

@@ -0,0 +1,13 @@
+1
+00:00:00,000 --> 00:00:07,200
+[Background Music Playing]
+
+2
+00:00:16,000 --> 00:00:17,200
+Welcome to this week's episode
+
+3
+00:00:17,400 --> 00:00:19,000
+of explore California
+
+

design/skin.old.css

@@ -0,0 +1,190 @@
+/* DEFAULT SKIN (override in another file)
+================================================================================
+Using all CSS to draw the controls. Images could be used if desired.
+Instead of editing this file, I recommend creating your own skin CSS file to be included after this file,
+so you can upgrade to newer versions easier. */
+
+.vjs-original-skin .vjs-controls {
+  position: absolute; margin: 0; opacity: 0.85; color: #fff;
+  display: block; /* Start hidden */
+  left: 0; right: 0; /* 100% width of video-js-box */ 
+  width: 100%;
+  bottom: 0px; /* Distance from the bottom of the box/video. Keep 0. Use height to add more bottom margin. */
+  height: 35px; /* Including any margin you want above or below control items */
+  padding: 0; /* Controls are absolutely position, so no padding necessary */
+  -webkit-transition: opacity 0.5s linear;
+  -moz-transition: opacity 0.5s linear;
+  -o-transition: opacity 0.5s linear;
+  -ms-transition: opacity 0.5s linear;
+  transition: opacity 0.5s linear;
+}
+
+.vjs-original-skin .vjs-control {
+  position: absolute; /* Use top, bottom, left, and right to specifically position the control. */
+  text-align: center; margin: 0; padding: 0;
+  height: 25px; /* Default height of individual controls */
+  top: 5px; /* Top margin to put space between video and controls when controls are below */
+
+  /* CSS Background Gradients 
+     Using to give the aqua-ish look. */
+  /* Default */ background-color: #0B151A;
+  /* Webkit  */ background: #1F3744 -webkit-gradient(linear, left top, left bottom, from(#0B151A), to(#1F3744)) left 12px;
+  /* Firefox */ background: #1F3744 -moz-linear-gradient(top,  #0B151A,  #1F3744) left 12px;
+
+  /* CSS Curved Corners */
+  -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
+
+  /* CSS Shadows */
+  -webkit-box-shadow: 1px 1px 2px #000; -moz-box-shadow: 1px 1px 2px #000; box-shadow: 1px 1px 2px #000;
+}
+
+/* Placement of Control Items 
+   - Left side of pogress bar, use left & width
+   - Rigth side of progress bar, use right & width
+   - Expand with the video (like progress bar) use left & right
+   (using div.x to make more specific than vjs-control style)
+*/
+.vjs-original-skin div.vjs-play-control       { left: 5px;   width: 25px;  }
+.vjs-original-skin div.vjs-progress-control   { left: 35px;  right: 165px; } /* Using left & right so it expands with the width of the video */
+.vjs-original-skin div.vjs-time-control       { width: 75px; right: 90px;  } /* Time control and progress bar are combined to look like one */
+.vjs-original-skin div.vjs-volume-control     { width: 50px; right: 35px;  }
+.vjs-original-skin div.vjs-fullscreen-control { width: 25px; right: 5px;   }
+
+/* Removing curved corners on progress control and time control to join them. */
+.vjs-original-skin div.vjs-progress-control {
+  -webkit-border-top-right-radius: 0; -moz-border-radius-topright: 0; border-top-right-radius: 0;
+  -webkit-border-bottom-right-radius: 0; -moz-border-radius-bottomright: 0; border-bottom-right-radius: 0;
+}
+.vjs-original-skin div.vjs-time-control {
+  -webkit-border-top-left-radius: 0; -moz-border-radius-topleft: 0; border-top-left-radius: 0;
+  -webkit-border-bottom-left-radius: 0; -moz-border-radius-bottomleft: 0; border-bottom-left-radius: 0;
+}
+
+/* Play/Pause
+-------------------------------------------------------------------------------- */
+.vjs-original-skin .vjs-play-control { cursor: pointer !important; }
+/* Play Icon */
+.vjs-original-skin .vjs-play-control span { display: block; font-size: 0; line-height: 0; }
+.vjs-original-skin.vjs-paused .vjs-play-control span {
+  width: 0; height: 0; margin: 8px 0 0 8px;
+  /* Drawing the play triangle with borders - http://www.infimum.dk/HTML/slantinfo.html */
+  border-left: 10px solid #fff; /* Width & Color of play icon */
+  /* Height of play icon is total top & bottom border widths. Color is transparent. */
+  border-top: 5px solid rgba(0,0,0,0); border-bottom: 5px solid rgba(0,0,0,0);
+}
+.vjs-original-skin.vjs-playing .vjs-play-control span {
+  width: 3px; height: 10px; margin: 8px auto 0;
+  /* Drawing the pause bars with borders */
+  border-top: 0px; border-left: 3px solid #fff; border-bottom: 0px; border-right: 3px solid #fff;
+}
+
+/* Progress
+-------------------------------------------------------------------------------- */
+.vjs-original-skin .vjs-progress-holder { /* Box containing play and load progresses */
+  position: relative; padding: 0; overflow:hidden; cursor: pointer !important;
+  height: 9px; border: 1px solid #777;
+  margin: 7px 1px 0 5px; /* Placement within the progress control item */
+  -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
+}
+.vjs-original-skin .vjs-progress-holder div { /* Progress Bars */
+  position: absolute; display: block; width: 0; height: 9px; margin: 0; padding: 0;
+  left: 0; top: 0; /*Needed for IE6*/
+  -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
+}
+.vjs-original-skin .vjs-play-progress {
+  /* CSS Gradient */
+  /* Default */ background: #fff;
+  /* Webkit  */ background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#777));
+  /* Firefox */ background: -moz-linear-gradient(top,  #fff,  #777);
+}
+.vjs-original-skin .vjs-load-progress {
+  opacity: 0.8;
+  /* CSS Gradient */
+  /* Default */ background-color: #555;
+  /* Webkit  */ background: -webkit-gradient(linear, left top, left bottom, from(#555), to(#aaa));
+  /* Firefox */ background: -moz-linear-gradient(top,  #555,  #aaa);
+}
+
+/* Time Display
+-------------------------------------------------------------------------------- */
+.vjs-original-skin .vjs-time-control { font-size: 10px; line-height: 1; font-weight: normal; font-family: Helvetica, Arial, sans-serif; }
+.vjs-original-skin .vjs-time-control span { line-height: 25px; /* Centering vertically */ }
+
+/* Volume
+-------------------------------------------------------------------------------- */
+.vjs-original-skin .vjs-volume-control { cursor: pointer !important; }
+.vjs-original-skin .vjs-volume-control div { display: block; margin: 0 5px 0 5px; padding: 4px 0 0 0; }
+/* Drawing the volume icon using 6 span elements */
+.vjs-original-skin .vjs-volume-control div span { /* Individual volume bars */
+  float: left; padding: 0; font-size: 0; line-height: 0;
+  margin: 0 2px 0 0; /* Space between */
+  width: 5px; height: 0px; /* Total height is height + bottom border */
+  border-bottom: 18px solid #555; /* Default (off) color and height of visible portion */
+}
+.vjs-original-skin .vjs-volume-control div span.vjs-volume-level-on { border-color: #fff; /* Volume on bar color */ }
+/* Creating differnt bar heights through height (transparent) and bottom border (visible). */
+.vjs-original-skin .vjs-volume-control div span.vjs-vc-1 { border-bottom-width: 2px; height: 16px; }
+.vjs-original-skin .vjs-volume-control div span.vjs-vc-2 { border-bottom-width: 4px; height: 14px; }
+.vjs-original-skin .vjs-volume-control div span.vjs-vc-3 { border-bottom-width: 7px; height: 11px; }
+.vjs-original-skin .vjs-volume-control div span.vjs-vc-4 { border-bottom-width: 10px; height: 8px; }
+.vjs-original-skin .vjs-volume-control div span.vjs-vc-5 { border-bottom-width: 14px; height: 4px; }
+.vjs-original-skin .vjs-volume-control div span.vjs-vc-6 { margin-right: 0; }
+
+/* Fullscreen
+-------------------------------------------------------------------------------- */
+.vjs-original-skin .vjs-fullscreen-control { cursor: pointer !important; }
+.vjs-original-skin .vjs-fullscreen-control div {
+  padding: 0; text-align: left; vertical-align: top; cursor: pointer !important; 
+  margin: 5px 0 0 5px; /* Placement within the fullscreen control item */
+  width: 20px; height: 20px;
+}
+/* Drawing the fullscreen icon using 4 span elements */
+.vjs-original-skin .vjs-fullscreen-control div span { float: left; margin: 0; padding: 0; font-size: 0; line-height: 0; width: 0; text-align: left; vertical-align: top; }
+.vjs-original-skin .vjs-fullscreen-control div span.vjs-fc-1 { /* Top-left triangle */
+  margin-right: 3px; /* Space between top-left and top-right */
+  margin-bottom: 3px; /* Space between top-left and bottom-left */
+  border-top: 6px solid #fff; /* Height and color */
+  border-right: 6px solid rgba(0,0,0,0);  /* Width */
+}
+.vjs-original-skin .vjs-fullscreen-control div span.vjs-fc-2 { border-top: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
+.vjs-original-skin .vjs-fullscreen-control div span.vjs-fc-3 { clear: both; margin: 0 3px 0 0; border-bottom: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); }
+.vjs-original-skin .vjs-fullscreen-control div span.vjs-fc-4 { border-bottom: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
+/* Icon when video is in fullscreen mode */
+.vjs-original-skin.vjs-fullscreen .vjs-fullscreen-control div span.vjs-fc-1 { border: none; border-bottom: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
+.vjs-original-skin.vjs-fullscreen .vjs-fullscreen-control div span.vjs-fc-2 { border: none; border-bottom: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); }
+.vjs-original-skin.vjs-fullscreen .vjs-fullscreen-control div span.vjs-fc-3 { border: none; border-top: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
+.vjs-original-skin.vjs-fullscreen .vjs-fullscreen-control div span.vjs-fc-4 { border: none; border-top: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); }
+
+
+
+
+
+/* Big Play Button (at start)
+---------------------------------------------------------*/
+.vjs-original-skin .vjs-big-play-button {
+  display: block; /* Start hidden */ z-index: 2;
+  position: absolute; top: 50%; left: 50%; width: 80px; height: 80px; margin: -43px 0 0 -43px; text-align: center; vertical-align: center; cursor: pointer !important;
+  border: 3px solid #fff; opacity: 0.9;
+  -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;
+  
+  /* CSS Background Gradients */
+  /* Default */ background-color: #0B151A;
+  /* Webkit  */ background: #1F3744 -webkit-gradient(linear, left top, left bottom, from(#0B151A), to(#1F3744)) left 40px;
+  /* Firefox */ background: #1F3744 -moz-linear-gradient(top,  #0B151A,  #1F3744) left 40px;
+
+  /* CSS Shadows */
+  -webkit-box-shadow: 4px 4px 8px #000; -moz-box-shadow: 4px 4px 8px #000; box-shadow: 4px 4px 8px #000;
+}
+
+.vjs-original-skin div.vjs-big-play-button:hover {
+  -webkit-box-shadow: 0px 0px 80px #fff; -moz-box-shadow: 0px 0px 80px #fff; box-shadow: 0px 0px 80px #fff;
+}
+
+.vjs-original-skin div.vjs-big-play-button span {
+  display: block; font-size: 0; line-height: 0;
+  width: 0; height: 0; margin: 20px 0 0 23px;
+  /* Drawing the play triangle with borders - http://www.infimum.dk/HTML/slantinfo.html */
+  border-left: 40px solid #fff; /* Width & Color of play icon */
+  /* Height of play icon is total top & bottom border widths. Color is transparent. */
+  border-top: 20px solid rgba(0,0,0,0); border-bottom: 20px solid rgba(0,0,0,0);
+}

design/video-js.css

@@ -0,0 +1,499 @@
+/*
+VideoJS Default Styles (http://videojs.com)
+Version GENERATED_AT_BUILD
+*/
+
+/*
+REQUIRED STYLES (be careful overriding)
+================================================================================ */
+/* When loading the player, the video tag is replaced with a DIV,
+   that will hold the video tag or object tag for other playback methods.
+   The div contains the video playback element (Flash or HTML5) and controls, and sets the width and height of the video.
+
+   ** If you want to add some kind of border/padding (e.g. a frame), or special positioning, use another containing element.
+   Otherwise you risk messing up control positioning and full window mode. **
+*/
+.video-js {
+  background-color: #000; position: relative; padding: 0;
+
+  /* Start with 10px for base font size so other dimensions can be em based and easily calculable. */
+  font-size: 10px;
+
+  /* Allow poster to be vertially aligned. */
+  vertical-align: middle;
+  /*  display: table-cell; */ /*This works in Safari but not Firefox.*/
+}
+
+/* Playback technology elements expand to the width/height of the containing div. <video> or <object> */
+.video-js .vjs-tech { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
+
+/* Fix for Firefox 9 fullscreen (only if it is enabled). Not needed when checking fullScreenEnabled. */
+.video-js:-moz-full-screen { position: absolute; }
+
+/* Fullscreen Styles */
+body.vjs-full-window {
+  padding: 0; margin: 0;
+  height: 100%; overflow-y: auto; /* Fix for IE6 full-window. http://www.cssplay.co.uk/layouts/fixed.html */
+}
+.video-js.vjs-fullscreen {
+  position: fixed; overflow: hidden; z-index: 1000; left: 0; top: 0; bottom: 0; right: 0; width: 100% !important; height: 100% !important;
+  _position: absolute; /* IE6 Full-window (underscore hack) */
+}
+.video-js:-webkit-full-screen {
+  width: 100% !important; height: 100% !important;
+}
+
+/* Poster Styles */
+.vjs-poster {
+  margin: 0 auto; padding: 0; cursor: pointer;
+
+  /* Scale with the size of the player div. Works when poster is vertically shorter, but stretches when it's less wide. */
+  position: relative; width: 100%; max-height: 100%;
+}
+
+/* Text Track Styles */
+/* Overall track holder for both captions and subtitles */
+.video-js .vjs-text-track-display { text-align: center; position: absolute; bottom: 4em; left: 1em; right: 1em; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }
+/* Individual tracks */
+.video-js .vjs-text-track {
+  display: none; color: #fff; font-size: 1.4em; text-align: center; margin-bottom: 0.1em;
+  /* Transparent black background, or fallback to all black (IE6) */
+  background: rgb(0, 0, 0); background: rgba(0, 0, 0, 0.50);
+}
+.video-js .vjs-subtitles { color: #fff; }
+.video-js .vjs-captions { color: #fc6; }
+.vjs-tt-cue { display: block; }
+
+/* Fading sytles, used to fade control bar. */
+.vjs-fade-in {
+  visibility: visible !important; /* Needed to make sure things hide in older browsers too. */
+  opacity: 1 !important;
+
+  -webkit-transition: visibility 0s linear 0s, opacity 0.3s linear;
+  -moz-transition: visibility 0s linear 0s, opacity 0.3s linear;
+  -ms-transition: visibility 0s linear 0s, opacity 0.3s linear;
+  -o-transition: visibility 0s linear 0s, opacity 0.3s linear;
+  transition: visibility 0s linear 0s, opacity 0.3s linear;
+}
+.vjs-fade-out {
+  visibility: hidden !important;
+  opacity: 0 !important;
+
+  -webkit-transition: visibility 0s linear 1.5s,opacity 1.5s linear;
+  -moz-transition: visibility 0s linear 1.5s,opacity 1.5s linear;
+  -ms-transition: visibility 0s linear 1.5s,opacity 1.5s linear;
+  -o-transition: visibility 0s linear 1.5s,opacity 1.5s linear;
+  transition: visibility 0s linear 1.5s,opacity 1.5s linear;
+}
+
+/* DEFAULT SKIN (override in another file to create new skins)
+================================================================================
+Instead of editing this file, I recommend creating your own skin CSS file to be included after this file,
+so you can upgrade to newer versions easier. You can remove all these styles by removing the 'vjs-default-skin' class from the tag. */
+
+/* The default control bar. Created by bar.js */
+.vjs-default-skin .vjs-controls {
+  position: absolute;
+  bottom: 0; /* Distance from the bottom of the box/video. Keep 0. Use height to add more bottom margin. */
+  left: 0; right: 0; /* 100% width of div */
+  margin: 0; padding: 0; /* Controls are absolutely position, so no padding necessary */
+  height: 2.6em; /* Including any margin you want above or below control items */
+  color: #fff; border-top: 1px solid #404040;
+
+  /* CSS Gradient */
+  /* Can use the Ultimate CSS Gradient Generator: http://www.colorzilla.com/gradient-editor/ */
+  background: #242424; /* Old browsers */
+  background: -moz-linear-gradient(top, #242424 50%, #1f1f1f 50%, #171717 100%); /* FF3.6+ */
+  background: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(50%,#242424), color-stop(50%,#1f1f1f), color-stop(100%,#171717)); /* Chrome,Safari4+ */
+  background: -webkit-linear-gradient(top, #242424 50%,#1f1f1f 50%,#171717 100%); /* Chrome10+,Safari5.1+ */
+  background: -o-linear-gradient(top, #242424 50%,#1f1f1f 50%,#171717 100%); /* Opera11.10+ */
+  background: -ms-linear-gradient(top, #242424 50%,#1f1f1f 50%,#171717 100%); /* IE10+ */
+  /* Filter was causing a lot of weird issues in IE. Elements would stop showing up, or other styles would break. */
+  /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#242424', endColorstr='#171717',GradientType=0 );*/ /* IE6-9 */
+  background: linear-gradient(top, #242424 50%,#1f1f1f 50%,#171717 100%); /* W3C */
+
+  /* Start hidden and with 0 opacity. Opacity is used to fade in modern browsers. */
+  /* Can't use display block to hide initially because widths of slider handles aren't calculated and avaialbe for positioning correctly. */
+  visibility: hidden;
+  opacity: 0;
+}
+
+/* General styles for individual controls. */
+.vjs-default-skin .vjs-control {
+  position: relative; float: left;
+  text-align: center; margin: 0; padding: 0;
+  height: 2.6em; width: 2.6em;
+}
+
+.vjs-default-skin .vjs-control:focus {
+  outline: 0;
+/*  background-color: #555;*/
+}
+
+/* Hide control text visually, but have it available for screenreaders: h5bp.com/v */
+.vjs-default-skin .vjs-control-text { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
+
+
+/* Play/Pause
+-------------------------------------------------------------------------------- */
+.vjs-default-skin .vjs-play-control { width: 5em; cursor: pointer !important; }
+/* Play Icon */
+.vjs-default-skin.vjs-paused .vjs-play-control div { width: 15px; height: 17px; background: url('video-js.png'); margin: 0.5em auto 0; }
+.vjs-default-skin.vjs-playing .vjs-play-control div { width: 15px; height: 17px; background: url('video-js.png') -25px 0; margin: 0.5em auto 0; }
+
+/* Rewind
+-------------------------------------------------------------------------------- */
+.vjs-default-skin .vjs-rewind-control { width: 5em; cursor: pointer !important; }
+.vjs-default-skin .vjs-rewind-control div { width: 19px; height: 16px; background: url('video-js.png'); margin: 0.5em auto 0; }
+
+/* Volume/Mute
+-------------------------------------------------------------------------------- */
+.vjs-default-skin .vjs-mute-control { width: 3.8em; cursor: pointer !important; float: right; }
+.vjs-default-skin .vjs-mute-control div { width: 22px; height: 16px; background: url('video-js.png') -75px -25px; margin: 0.5em auto 0; }
+.vjs-default-skin .vjs-mute-control.vjs-vol-0 div { background: url('video-js.png') 0 -25px; }
+.vjs-default-skin .vjs-mute-control.vjs-vol-1 div { background: url('video-js.png') -25px -25px; }
+.vjs-default-skin .vjs-mute-control.vjs-vol-2 div { background: url('video-js.png') -50px -25px; }
+
+
+.vjs-default-skin .vjs-volume-control { width: 5em; float: right; }
+.vjs-default-skin .vjs-volume-bar {
+  position: relative; width: 5em; height: 0.6em; margin: 1em auto 0; cursor: pointer !important;
+
+  -moz-border-radius: 0.3em; -webkit-border-radius: 0.3em; border-radius: 0.3em;
+
+  background: #666;
+  background: -moz-linear-gradient(top, #333, #666);
+  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#333), to(#666));
+  background: -webkit-linear-gradient(top, #333, #666);
+  background: -o-linear-gradient(top, #333, #666);
+  background: -ms-linear-gradient(top, #333, #666);
+  background: linear-gradient(top, #333, #666);
+}
+.vjs-default-skin .vjs-volume-level {
+  position: absolute; top: 0; left: 0; height: 0.6em;
+
+  -moz-border-radius: 0.3em; -webkit-border-radius: 0.3em; border-radius: 0.3em;
+
+  background: #fff;
+  background: -moz-linear-gradient(top, #fff, #ccc);
+  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#ccc));
+  background: -webkit-linear-gradient(top, #fff, #ccc);
+  background: -o-linear-gradient(top, #fff, #ccc);
+  background: -ms-linear-gradient(top, #fff, #ccc);
+  background: linear-gradient(top, #fff, #ccc);
+}
+.vjs-default-skin .vjs-volume-handle {
+  position: absolute; top: -0.2em; width: 0.8em; height: 0.8em; background: #ccc; left: 0;
+  border: 1px solid #fff;
+  -moz-border-radius: 0.6em; -webkit-border-radius: 0.6em; border-radius: 0.6em;
+}
+
+/* Progress
+-------------------------------------------------------------------------------- */
+.vjs-default-skin div.vjs-progress-control {
+  position: absolute;
+  left: 4.8em; right: 4.8em; /* Leave room for time displays. */
+  height: 1.0em; width: auto;
+  top: -1.3em; /* Set above the rest of the controls. And leave room for 2px of borders (progress bottom and controls top). */
+  border-bottom: 1px solid #1F1F1F;
+  border-top: 1px solid #222;
+
+  /* CSS Gradient */
+  background: #333;
+  background: -moz-linear-gradient(top, #222, #333);
+  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#222), to(#333));
+  background: -webkit-linear-gradient(top, #222, #333);
+  background: -o-linear-gradient(top, #333, #222);
+  background: -ms-linear-gradient(top, #333, #222);
+  background: linear-gradient(top, #333, #222);
+
+
+  /* 1px top shadow */
+/*  -webkit-box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.15); box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.15);*/
+}
+
+/* Box containing play and load progresses. Also acts as seek scrubber. */
+.vjs-default-skin .vjs-progress-holder {
+  position: relative; cursor: pointer !important; /*overflow: hidden;*/
+  padding: 0; margin: 0; /* Placement within the progress control item */
+  height: 1.0em;
+  -moz-border-radius: 0.6em; -webkit-border-radius: 0.6em; border-radius: 0.6em;
+
+  /* CSS Gradient */
+  background: #111;
+  background: -moz-linear-gradient(top, #111, #262626);
+  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#111), to(#262626));
+  background: -webkit-linear-gradient(top, #111, #262626);
+  background: -o-linear-gradient(top, #111, #262626);
+  background: -ms-linear-gradient(top, #111, #262626);
+  background: linear-gradient(top, #111, #262626);
+}
+.vjs-default-skin .vjs-progress-holder .vjs-play-progress,
+.vjs-default-skin .vjs-progress-holder .vjs-load-progress { /* Progress Bars */
+  position: absolute; display: block; height: 1.0em; margin: 0; padding: 0;
+  left: 0; top: 0; /*Needed for IE6*/
+  -moz-border-radius: 0.6em; -webkit-border-radius: 0.6em; border-radius: 0.6em;
+
+  /*width: 0;*/
+}
+
+.vjs-default-skin .vjs-play-progress {
+  /* CSS Gradient. */
+  background: #fff; /* Old browsers */
+  background: -moz-linear-gradient(top, #fff 0%, #d6d6d6 50%, #fff 100%);
+  background: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%,#fff), color-stop(50%,#d6d6d6), color-stop(100%,#fff));
+  background: -webkit-linear-gradient(top, #fff 0%,#d6d6d6 50%,#fff 100%);
+  background: -o-linear-gradient(top, #fff 0%,#d6d6d6 50%,#fff 100%);
+  background: -ms-linear-gradient(top, #fff 0%,#d6d6d6 50%,#fff 100%);
+  background: linear-gradient(top, #fff 0%,#d6d6d6 50%,#fff 100%);
+
+  background: #efefef;
+  background: -moz-linear-gradient(top, #efefef 0%, #f5f5f5 50%, #dbdbdb 50%, #f1f1f1 100%);
+  background: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%,#efefef), color-stop(50%,#f5f5f5), color-stop(50%,#dbdbdb), color-stop(100%,#f1f1f1));
+  background: -webkit-linear-gradient(top, #efefef 0%,#f5f5f5 50%,#dbdbdb 50%,#f1f1f1 100%);
+  background: -o-linear-gradient(top, #efefef 0%,#f5f5f5 50%,#dbdbdb 50%,#f1f1f1 100%);
+  background: -ms-linear-gradient(top, #efefef 0%,#f5f5f5 50%,#dbdbdb 50%,#f1f1f1 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efefef', endColorstr='#f1f1f1',GradientType=0 );
+  background: linear-gradient(top, #efefef 0%,#f5f5f5 50%,#dbdbdb 50%,#f1f1f1 100%);
+}
+.vjs-default-skin .vjs-load-progress {
+  opacity: 0.8;
+
+  /* CSS Gradient */
+  background: #666;
+  background: -moz-linear-gradient(top, #666, #333);
+  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#666), to(#333));
+  background: -webkit-linear-gradient(top, #666, #333);
+  background: -o-linear-gradient(top, #666, #333);
+  background: -ms-linear-gradient(top, #666, #333);
+  background: linear-gradient(top, #666, #333);
+}
+
+.vjs-default-skin div.vjs-seek-handle {
+  position: absolute;
+  width: 16px; height: 16px; /* Match img pixles */
+  margin-top: -0.3em;
+  left: 0; top: 0; /*Needed for IE6*/
+
+  background: url('video-js.png') 0 -50px;
+  /* CSS Curved Corners. Needed to make shadows curved. */
+  -moz-border-radius: 0.8em; -webkit-border-radius: 0.8em; border-radius: 0.8em;
+  /* CSS Shadows */
+  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
+}
+/* Time Display
+-------------------------------------------------------------------------------- */
+.vjs-default-skin .vjs-time-controls {
+  position: absolute;
+  right: 0;
+  height: 1.0em; width: 4.8em;
+  top: -1.3em;
+  border-bottom: 1px solid #1F1F1F;
+  border-top: 1px solid #222;
+  background-color: #333;
+
+  font-size: 1em; line-height: 1.0em; font-weight: normal; font-family: Helvetica, Arial, sans-serif;
+
+  background: #333;
+  background: -moz-linear-gradient(top, #222, #333);
+  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#222), to(#333));
+  background: -webkit-linear-gradient(top, #222, #333);
+  background: -o-linear-gradient(top, #333, #222);
+  background: -ms-linear-gradient(top, #333, #222);
+  background: linear-gradient(top, #333, #222);
+
+  /* 1px top shadow */
+/*  -webkit-box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.15); box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.15);*/
+}
+
+.vjs-default-skin .vjs-current-time { left: 0; }
+
+.vjs-default-skin .vjs-duration { right: 0; display: none; }
+.vjs-default-skin .vjs-remaining-time { right: 0; }
+
+.vjs-time-divider { display:none; }
+
+.vjs-default-skin .vjs-time-control { font-size: 1em; line-height: 1; font-weight: normal; font-family: Helvetica, Arial, sans-serif; }
+.vjs-default-skin .vjs-time-control span { line-height: 25px; /* Centering vertically */ }
+
+/* Fullscreen
+-------------------------------------------------------------------------------- */
+.vjs-secondary-controls { float: right; }
+
+.vjs-default-skin .vjs-fullscreen-control { width: 3.8em; cursor: pointer !important; float: right; }
+.vjs-default-skin .vjs-fullscreen-control div { width: 16px; height: 16px; background: url('video-js.png') -50px 0; margin: 0.5em auto 0; }
+
+.vjs-default-skin.vjs-fullscreen .vjs-fullscreen-control div { background: url('video-js.png') -75px 0; }
+
+
+/* Big Play Button (at start)
+---------------------------------------------------------*/
+.vjs-default-skin .vjs-big-play-button {
+  display: block; /* Start hidden */ z-index: 2;
+  position: absolute; top: 50%; left: 50%; width: 8.0em; height: 8.0em; margin: -42px 0 0 -42px; text-align: center; vertical-align: center; cursor: pointer !important;
+  border: 0.2em solid #fff; opacity: 0.95;
+  -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px;
+
+  background: #454545;
+  background: -moz-linear-gradient(top, #454545 0%, #232323 50%, #161616 50%, #3f3f3f 100%);
+  background: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%,#454545), color-stop(50%,#232323), color-stop(50%,#161616), color-stop(100%,#3f3f3f));
+  background: -webkit-linear-gradient(top, #454545 0%,#232323 50%,#161616 50%,#3f3f3f 100%);
+  background: -o-linear-gradient(top, #454545 0%,#232323 50%,#161616 50%,#3f3f3f 100%);
+  background: -ms-linear-gradient(top, #454545 0%,#232323 50%,#161616 50%,#3f3f3f 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#454545', endColorstr='#3f3f3f',GradientType=0 );
+  background: linear-gradient(top, #454545 0%,#232323 50%,#161616 50%,#3f3f3f 100%);
+
+  /* CSS Shadows */
+  -webkit-box-shadow: 4px 4px 8px #000; -moz-box-shadow: 4px 4px 8px #000; box-shadow: 4px 4px 8px #000;
+}
+
+.vjs-default-skin div.vjs-big-play-button:hover {
+  -webkit-box-shadow: 0 0 80px #fff; -moz-box-shadow: 0 0 80px #fff; box-shadow: 0 0 80px #fff;
+}
+
+.vjs-default-skin div.vjs-big-play-button span {
+  position: absolute; top: 50%; left: 50%;
+  display: block; width: 35px; height: 42px;
+  margin: -20px 0 0 -15px; /* Using negative margin to center image. */
+  background: url('video-js.png') -100px 0;
+}
+
+/* Loading Spinner
+---------------------------------------------------------*/
+/* CSS Spinners by Kilian Valkhof - http://kilianvalkhof.com/2010/css-xhtml/css3-loading-spinners-without-images/ */
+.vjs-loading-spinner {
+  display: none;
+  position: absolute; top: 50%; left: 50%; width: 55px; height: 55px;
+  margin: -28px 0 0 -28px;
+  -webkit-animation-name: rotatethis;
+  -webkit-animation-duration:1s;
+  -webkit-animation-iteration-count:infinite;
+  -webkit-animation-timing-function:linear;
+  -moz-animation-name: rotatethis;
+  -moz-animation-duration:1s;
+  -moz-animation-iteration-count:infinite;
+  -moz-animation-timing-function:linear;
+}
+
+@-webkit-keyframes rotatethis {
+  0% {-webkit-transform:scale(0.6) rotate(0deg); }
+  12.5% {-webkit-transform:scale(0.6) rotate(0deg); }
+  12.51% {-webkit-transform:scale(0.6) rotate(45deg); }
+  25% {-webkit-transform:scale(0.6) rotate(45deg); }
+  25.01% {-webkit-transform:scale(0.6) rotate(90deg);}
+  37.5% {-webkit-transform:scale(0.6) rotate(90deg);}
+  37.51% {-webkit-transform:scale(0.6) rotate(135deg);}
+  50% {-webkit-transform:scale(0.6) rotate(135deg);}
+  50.01% {-webkit-transform:scale(0.6) rotate(180deg);}
+  62.5% {-webkit-transform:scale(0.6) rotate(180deg);}
+  62.51% {-webkit-transform:scale(0.6) rotate(225deg);}
+  75% {-webkit-transform:scale(0.6) rotate(225deg);}
+  75.01% {-webkit-transform:scale(0.6) rotate(270deg);}
+  87.5% {-webkit-transform:scale(0.6) rotate(270deg);}
+  87.51% {-webkit-transform:scale(0.6) rotate(315deg);}
+  100% {-webkit-transform:scale(0.6) rotate(315deg);}
+}
+
+@-moz-keyframes rotatethis {
+  0% {-moz-transform:scale(0.6) rotate(0deg);}
+  12.5% {-moz-transform:scale(0.6) rotate(0deg);}
+  12.51% {-moz-transform:scale(0.6) rotate(45deg);}
+  25% {-moz-transform:scale(0.6) rotate(45deg);}
+  25.01% {-moz-transform:scale(0.6) rotate(90deg);}
+  37.5% {-moz-transform:scale(0.6) rotate(90deg);}
+  37.51% {-moz-transform:scale(0.6) rotate(135deg);}
+  50% {-moz-transform:scale(0.6) rotate(135deg);}
+  50.01% {-moz-transform:scale(0.6) rotate(180deg);}
+  62.5% {-moz-transform:scale(0.6) rotate(180deg);}
+  62.51% {-moz-transform:scale(0.6) rotate(225deg);}
+  75% {-moz-transform:scale(0.6) rotate(225deg);}
+  75.01% {-moz-transform:scale(0.6) rotate(270deg);}
+  87.5% {-moz-transform:scale(0.6) rotate(270deg);}
+  87.51% {-moz-transform:scale(0.6) rotate(315deg);}
+  100% {-moz-transform:scale(0.6) rotate(315deg);}
+}
+/* Each circle */
+div.vjs-loading-spinner .ball1 { opacity: 0.12; position:absolute; left: 20px; top: 0px; width: 13px; height: 13px; background: #fff;
+  border-radius: 13px; -webkit-border-radius: 13px; -moz-border-radius: 13px; border: 1px solid #ccc; }
+
+div.vjs-loading-spinner .ball2 { opacity: 0.25; position:absolute; left: 34px; top: 6px; width: 13px; height: 13px; background: #fff;
+  border-radius: 13px; -webkit-border-radius: 13px; -moz-border-radius: 13px; border: 1px solid #ccc; }
+
+div.vjs-loading-spinner .ball3 { opacity: 0.37; position:absolute; left: 40px; top: 20px; width: 13px; height: 13px; background: #fff;
+  border-radius: 13px; -webkit-border-radius: 13px; -moz-border-radius: 13px; border: 1px solid #ccc; }
+
+div.vjs-loading-spinner .ball4 { opacity: 0.50; position:absolute; left: 34px; top: 34px; width: 13px; height: 13px; background: #fff;
+  border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 15px; border: 1px solid #ccc; }
+
+div.vjs-loading-spinner .ball5 { opacity: 0.62; position:absolute; left: 20px; top: 40px; width: 13px; height: 13px; background: #fff;
+  border-radius: 13px; -webkit-border-radius: 13px; -moz-border-radius: 13px; border: 1px solid #ccc; }
+
+div.vjs-loading-spinner .ball6 { opacity: 0.75; position:absolute; left: 6px; top: 34px; width: 13px; height: 13px; background: #fff;
+  border-radius: 13px; -webkit-border-radius: 13px; -moz-border-radius: 13px; border: 1px solid #ccc; }
+
+div.vjs-loading-spinner .ball7 { opacity: 0.87; position:absolute; left: 0px; top: 20px; width: 13px; height: 13px; background: #fff;
+  border-radius: 13px; -webkit-border-radius: 13px; -moz-border-radius: 13px; border: 1px solid #ccc; }
+
+div.vjs-loading-spinner .ball8 { opacity: 1.00; position:absolute; left: 6px; top: 6px; width: 13px; height: 13px; background: #fff;
+  border-radius: 13px; -webkit-border-radius: 13px; -moz-border-radius: 13px; border: 1px solid #ccc; }
+
+/* Menu Buttons (Captions/Subtitles/etc.)
+-------------------------------------------------------------------------------- */
+.vjs-default-skin .vjs-menu-button {
+  float: right; margin: 0.2em 0.5em 0 0; padding: 0; width: 3em; height: 2em; cursor: pointer !important;
+
+  border: 1px solid #111; -moz-border-radius: 0.3em; -webkit-border-radius: 0.3em; border-radius: 0.3em;
+
+  background: #4d4d4d;
+  background: -moz-linear-gradient(top,  #4d4d4d 0%, #3f3f3f 50%, #333333 50%, #252525 100%);
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4d4d4d), color-stop(50%,#3f3f3f), color-stop(50%,#333333), color-stop(100%,#252525));
+  background: -webkit-linear-gradient(top,  #4d4d4d 0%,#3f3f3f 50%,#333333 50%,#252525 100%);
+  background: -o-linear-gradient(top,  #4d4d4d 0%,#3f3f3f 50%,#333333 50%,#252525 100%);
+  background: -ms-linear-gradient(top,  #4d4d4d 0%,#3f3f3f 50%,#333333 50%,#252525 100%);
+  background: linear-gradient(top,  #4d4d4d 0%,#3f3f3f 50%,#333333 50%,#252525 100%);
+}
+/* Button Icon */
+.vjs-default-skin .vjs-menu-button div { background: url('video-js.png') 0px -75px no-repeat; width: 16px; height: 16px; margin: 0.2em auto 0; padding: 0; }
+
+/* Button Pop-up Menu */
+.vjs-default-skin .vjs-menu-button ul {
+  display: none; /* Start hidden. Hover will show. */
+  opacity: 0.8;
+  padding: 0; margin: 0;
+  position: absolute; width: 10em; bottom: 2em; max-height: 15em;
+  left: -3.5em; /* Width of menu - width of button / 2 */
+  background-color: #111;
+  border: 2px solid #333;
+  -moz-border-radius: 0.7em; -webkit-border-radius: 1em; border-radius: .5em;
+  -webkit-box-shadow: 0 2px 4px 0 #000; -moz-box-shadow: 0 2px 4px 0 #000; box-shadow: 0 2px 4px 0 #000;
+  overflow: auto;
+}
+
+.vjs-default-skin .vjs-menu-button:focus ul,
+.vjs-default-skin .vjs-menu-button:hover ul { display: block; list-style: none; }
+.vjs-default-skin .vjs-menu-button ul li { list-style: none; margin: 0; padding: 0.3em 0 0.3em 20px; line-height: 1.4em; font-size: 1.2em; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; text-align: left; }
+.vjs-default-skin .vjs-menu-button ul li.vjs-selected { text-decoration: underline; background: url('video-js.png') -125px -50px no-repeat; }
+.vjs-default-skin .vjs-menu-button ul li:focus,
+.vjs-default-skin .vjs-menu-button ul li:hover,
+.vjs-default-skin .vjs-menu-button ul li.vjs-selected:focus,
+.vjs-default-skin .vjs-menu-button ul li.vjs-selected:hover { background-color: #ccc; color: #111; outline: 0; }
+.vjs-default-skin .vjs-menu-button ul li.vjs-menu-title {
+  text-align: center; text-transform: uppercase; font-size: 1em; line-height: 2em; padding: 0; margin: 0 0 0.3em 0;
+
+  color: #fff; font-weight: bold;
+
+  cursor: default;
+
+  background: #4d4d4d;
+  background: -moz-linear-gradient(top,  #4d4d4d 0%, #3f3f3f 50%, #333333 50%, #252525 100%);
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4d4d4d), color-stop(50%,#3f3f3f), color-stop(50%,#333333), color-stop(100%,#252525));
+  background: -webkit-linear-gradient(top,  #4d4d4d 0%,#3f3f3f 50%,#333333 50%,#252525 100%);
+  background: -o-linear-gradient(top,  #4d4d4d 0%,#3f3f3f 50%,#333333 50%,#252525 100%);
+  background: -ms-linear-gradient(top,  #4d4d4d 0%,#3f3f3f 50%,#333333 50%,#252525 100%);
+  background: linear-gradient(top,  #4d4d4d 0%,#3f3f3f 50%,#333333 50%,#252525 100%);
+}
+
+/* Subtitles Button */
+.vjs-default-skin .vjs-captions-button div { background-position: -25px -75px; }
+.vjs-default-skin .vjs-chapters-button div { background-position: -100px -75px; }
+.vjs-default-skin .vjs-chapters-button ul { width: 20em; left: -8.5em; /* Width of menu - width of button / 2 */ }

dev.html.example

@@ -0,0 +1,51 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <title>HTML5 Video Player</title>
+
+  <link href="design/video-js.css" rel="stylesheet" type="text/css">
+
+  <!--[if IE]>
+    <script src="https://getfirebug.com/releases/lite/1.3/firebug-lite.js"></script>
+  <!--<![endif]-->
+
+  <script src="src/core.js"></script>
+  <script src="src/lib.js"></script>
+  <script src="src/ecma.js"></script>
+  <script src="src/json.js"></script>
+
+  <script src="src/component.js"></script>
+  <script src="src/player.js"></script>
+  <script src="src/tech.js"></script>
+  <script src="src/controls.js"></script>
+  <script src="src/events.js"></script>
+  <script src="src/tracks.js"></script>
+  
+  <script src="src/setup.js"></script>
+  
+  <script type="text/javascript" charset="utf-8">
+    // Easy access to test Flash over HTML5. Add ?flash to URL
+    if (window.location.href.indexOf("?flash") !== -1) {
+      _V_.options.techOrder = ["H5swf"]
+    }
+  </script>
+
+</head>
+<body>
+
+  <video id="vid1" class="video-js vjs-default-skin" controls preload="auto" width="640" height="264"
+      poster="http://video-js.zencoder.com/oceans-clip.png"
+      data-setup='{}'>
+    <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4'>
+    <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm'>
+    <source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg'>
+    <p>Video Playback Not Supported</p>
+  </video>
+
+  <script>
+    vid = document.getElementById("vid1");
+  </script>
+
+</body>
+</html>

dev/build-source-list.rb

@@ -0,0 +1,17 @@
+#! /usr/bin/env ruby
+# Create javascript file with list of source files for easy inclusion in other development files.
+
+# puts ARGV[0]
+
+File.open("source-list.js", "w+") do |file|
+  file.puts "var vjsSourceList = [];"
+  
+  
+  Dir.foreach('../src') do |item|
+    next if item == '.' or item == '..' or item == '.DS_Store'
+
+    file.puts "vjsSourceList.push('src/#{item}')"
+
+  end
+
+end

dev/require-list.js

@@ -0,0 +1,31 @@
+// Attempting to create a portable script that loads source files in order. So we can change which files are included and have it change multiple places.
+var vjsSourceList = ["require",
+  'order!../../src/core.js',
+  'order!../../src/lib.js',
+  'order!../../src/component.js',
+  'order!../../src/controls.js',
+  'order!../../src/ecma.js',
+  'order!../../src/events.js',
+  'order!../../src/json.js',
+  'order!../../src/player.js',
+  'order!../../src/tech.js',
+  'order!../../src/tracks.js',
+  'order!../../flash/swfobject.js',
+  'order!../../src/setup.js'
+];
+
+// Not going to be used in production, so eval ok.
+require([vjsSourceList])
+
+// var requireEval = '';
+// for (var i=0; i < vjsSourceList.length; i++) {
+//   requireEval += 'require(["order!'+vjsSourceList[i]+'"], function() { ';
+// }
+// 
+// requireEval += 'var libsLoaded = true;'
+// 
+// for (var i=0; i < vjsSourceList.length; i++) {
+//   requireEval += ' }); ';
+// }
+// 
+// eval(requireEval);

dev/source-list.html

@@ -0,0 +1,13 @@
+<!-- Video.js Source Files -->
+<script src='src/core.js'></script>
+<script src='src/lib.js'></script>
+<script src='src/component.js'></script>
+<script src='src/controls.js'></script>
+<script src='src/ecma.js'></script>
+<script src='src/events.js'></script>
+<script src='src/json.js'></script>
+<script src='src/player.js'></script>
+<script src='src/tech.js'></script>
+<script src='src/tracks.js'></script>
+<script src='src/setup.js'></script>
+<!-- END Video.js Source Files -->

dev/source-list.js

@@ -0,0 +1,13 @@
+var vjsSourceList = [];
+vjsSourceList.push('src/core')
+vjsSourceList.push('src/lib')
+vjsSourceList.push('src/component')
+vjsSourceList.push('src/controls')
+vjsSourceList.push('src/ecma')
+vjsSourceList.push('src/events')
+vjsSourceList.push('src/json')
+vjsSourceList.push('src/player')
+vjsSourceList.push('src/tech')
+vjsSourceList.push('src/tracks')
+vjsSourceList.push('flash/swfobject')
+vjsSourceList.push('src/setup')

docs/api.md

@@ -0,0 +1,288 @@
+---
+layout: docs
+title: API
+description: Video.JS API Docs - API settings based on the HTML5 video API
+body_id: api
+body_class: docs subpage
+---
+
+API
+===
+The Video.js API allows you to interact with the video through Javascript, whether the browser is playing the video through HTML5 video, Flash, or any other supported playback technologies.
+
+Referencing the Player
+----------------------
+To use the API functions, you need access to the player object. Luckily this is easy to get. You just need to make sure your video tag has an ID. The example embed code has an ID of "example\_video_1". If you have multiple videos on one page, make sure every video tag has a unique ID.
+
+<code type="javascript">
+
+    var myPlayer = _V_("example_video_1");
+
+</code>
+
+(If the player hasn't been initialized yet via the data-setup attribute or another method, this will also initialize the player.)
+
+Wait Until the Player is Ready
+------------------------------
+The time it takes Video.js to set up the video and API will vary depending on the playback technology being used (HTML5 will often be much faster to load than Flash). For that reason we want to use the player's 'ready' function to trigger any code that requires the player's API.
+
+<code type="javascript">
+
+    _V_("example_video_1").ready(function(){
+
+      var myPlayer = this;
+
+      // EXAMPLE: Start playing the video.
+      myPlayer.play();
+
+    });
+
+</code>
+
+API Methods
+-----------
+Now that you have access to a ready player, you can control the video, get values, or respond to video events using the following functions. The Video.js API function names follow the [HTML5 media API](http://www.w3.org/TR/html5/video.html). The main difference is that attributes which you would get or set on a video element using the equals sign ( `myVideoElement.currentTime = "120";` ), you would use a function argument syntax for Video.js ( `myPlayer.currentTime(120);` )
+
+### play() ###
+Start video playback. Returns the player object.
+
+<code type="javascript">
+
+    myPlayer.play();
+
+</code>
+
+
+### pause() ###
+Pause the video playback. Returns the player object
+
+<code type="javascript">
+
+    myPlayer.pause();
+
+</code>
+
+### src(newSource) ###
+The source function updates the video source. There are three types of variables you can pass as the argument.
+
+**URL String**: A URL to the the video file. Use this method if you're sure the current playback technology (HTML5/Flash) can support the source you provide. Currently only MP4 files can be used in both HTML5 and Flash.
+<code type="javascript">
+
+    myPlayer.src("http://www.example.com/path/to/video.mp4");
+
+</code>
+
+**Source Object (or element):** A javascript object containing information about the source file. Use this method if you want the player to determine if it can support the file using the type information.
+<code type="javascript">
+
+    myPlayer.src({ type: "video/mp4", src: "http://www.example.com/path/to/video.mp4" });
+
+</code>
+
+**Array of Source Objects:** To provide multiple versions of the source so that it can be played using HTML5 across browsers you can use an array of source objects. Video.js will detect which version is supported and load that file.
+<code type="javascript">
+
+    myPlayer.src([
+      { type: "video/mp4", src: "http://www.example.com/path/to/video.mp4" },
+      { type: "video/webm", src: "http://www.example.com/path/to/video.webm" },
+      { type: "video/ogg", src: "http://www.example.com/path/to/video.ogv" }
+    ]);
+
+</code>
+
+Returns the player object.
+
+### currentTime() ###
+Returns the current time of the video in seconds.
+
+<code type="javascript">
+
+    var whereYouAt = myPlayer.currentTime();
+
+</code>
+
+
+### currentTime(seconds) // Type: Integer or Float ###
+Seek to the supplied time (seconds). Returns the player object.
+
+<code type="javascript">
+
+    myPlayer.currentTime(120); // 2 minutes into the video
+
+</code>
+
+
+### duration() ###
+Returns the length in time of the video in seconds. NOTE: The video must have started loading before the duration can be known, and in the case of Flash, may not be known until the video starts playing.
+
+<code type="javascript">
+
+    var howLongIsThis = myPlayer.duration();
+
+</code>
+
+
+### buffered() ###
+Returns a [TimeRange](http://videojs.com/docs/glossary.html#timerange) object with sections of the video that have been downloaded. If you just want the percent of the video that's been downloaded, use bufferedPercent.
+
+<code type="javascript">
+
+    var bufferedTimeRange = myPlayer.buffered(),
+
+    // Number of different ranges of time have been buffered. Usually 1.
+    numberOfRanges = bufferedTimeRange.length,
+
+    // Time in seconds when the first range starts. Usually 0.
+    firstRangeStart = bufferedTimeRange.start(0),
+    
+    // Time in seconds when the first range ends
+    firstRangeEnd = bufferedTimeRange.end(0),
+
+    // Length in seconds of the first time range
+    firstRangeLength = firstRangeEnd - firstRangeStart;
+
+</code>
+
+
+### bufferedPercent() ###
+Returns the percent (as a decimal) of the video that's been downloaded. 0 means none, 1 means all.
+
+<code type="javascript">
+
+    var howMuchIsDownloaded = myPlayer.bufferedPercent();
+
+</code>
+
+
+### volume() ###
+Returns the current volume of the video as a percent in decimal form. 0 is off (muted), 1.0 is all the way up, 0.5 is half way.
+
+<code type="javascript">
+
+    var howLoudIsIt = myPlayer.volume();
+
+</code>
+
+### volume(percentAsDecimal) ###
+Set the volume to the supplied percent (as a decimal between 0 and 1).
+
+<code type="javascript">
+
+    myPlayer.volume(0.5); // Set volume to half
+
+</code>
+
+
+### width() ###
+Returns the current width of the video in pixels.
+
+<code type="javascript">
+
+    var howWideIsIt = myPlayer.width();
+
+</code>
+
+
+### width(pixels) ###
+Change the width of the video to the supplied width in pixels. Returns the player object
+
+<code type="javascript">
+
+    myPlayer.width(640);
+
+</code>
+
+
+### height() ###
+Returns the current height of the video in pixels.
+
+<code type="javascript">
+
+    var howTallIsIt = myPlayer.height();
+
+</code>
+
+
+### height(pixels) ###
+Change the height of the video to the supplied height in pixels. Returns the player object
+
+<code type="javascript">
+
+    myPlayer.height(480);
+
+</code>
+
+
+### size(width, height) ###
+Changes the width and height of the video to the supplied width and height. This is more efficient if you're changing both width and height (only triggers the player's resize event once). Returns the player object.
+
+<code type="javascript">
+
+    myPlayer.size(640,480);
+
+</code>
+
+
+### requestFullScreen() ###
+Increase the size of the video to full screen. In some browsers, full screen is not supported natively, so it enters full window mode, where the video fills the browser window. In browsers and devices that support native full screen, sometimes the browser's default controls will be shown, and not the Video.js custom skin. This includes most mobile devices (iOS, Android) and older versions of Safari. Returns the player object.
+
+<code type="javascript">
+
+    myPlayer.requestFullScreen();
+
+</code>
+
+
+### cancelFullScreen() ###
+Return the video to its normal size after having been in full screen mode. Returns the player object.
+
+<code type="javascript">
+
+    myPlayer.cancelFullScreen();
+
+</code>
+
+
+Events
+------
+You can attach event listeners to the player similarly to how you would for a video element.
+
+<code type="javascript">
+
+    var myFunc = function(){
+      var myPlayer = this;
+      // Do something when the event is fired
+    };
+    myPlayer.addEvent("eventName", myFunc);
+
+</code>
+
+You can also remove the listeners later.
+
+<code type="javascript">
+
+    myPlayer.removeEvent("eventName", myFunc);
+
+</code>
+
+
+### Event Types
+List of player events you can add listeners for.
+
+<table border="0" cellspacing="5" cellpadding="5">
+  <tr><th>Name</th><th>Description</th></tr>
+  <tr><td>loadstart</td><td>Fired when the user agent begins looking for media data.</td></tr>
+  <tr><td>loadedmetadata</td><td>Fired when the player has initial duration and dimension information.</td></tr>
+  <tr><td>loadeddata</td><td>Fired when the player has downloaded data at the current playback position.</td></tr>
+  <tr><td>loadedalldata</td><td>Fired when the player has finished downloading the source data.</td></tr>
+  <tr><td>play</td><td>Fired whenever the media begins or resumes playback.</td></tr>
+  <tr><td>pause</td><td>Fired whenever the media has been paused.</td></tr>
+  <tr><td>timeupdate</td><td>Fired when the current playback position has changed. During playback this is fired every 15-250 milliseconds, depnding on the playback technology in use.</td></tr>
+  <tr><td>ended</td><td>Fired when the end of the media resource is reached. currentTime == duration</td></tr>
+  <tr><td>durationchange</td><td>Fired when the duration of the media resource is changed, or known for the first time.</td></tr>
+  <tr><td>progress</td><td>Fired while the user agent is downloading media data.</td></tr>
+  <tr><td>resize</td><td>Fired when the width and/or height of the video window changes.</td></tr>
+  <tr><td>volumechange</td><td>Fired when the volume changes.</td></tr>
+  <tr><td>error</td><td>Fired when there is an error in playback.</td></tr>
+  <tr><td>fullscreenchange</td><td>Fired when the player switches in or out of fullscreen mode.</td></tr>
+</table>

docs/glossary.md

@@ -0,0 +1,47 @@
+---
+layout: docs
+title: VideoJS Glossary
+description: Video.JS Glossary
+body_id: glossary
+body_class: docs subpage
+---
+
+
+Glossary
+========
+
+### DOM (Document Object Model)
+The container of elements on the page that must be loaded before you can interact with the elements with through Javascript.
+http://en.wikipedia.org/wiki/Document_Object_Model
+
+### Flash Fallback
+The Flash video player (SWF) used to play a video when HTML5 isn't supported.
+
+<a name="timerange"></a>
+### TimeRange
+
+<a name="html5-video"></a>
+### HTML5 Video
+HTML is the markup language that makes up every page on the web. The newest version, HTML5, includes specifications for a video tag, that is meant to allow website developers to add a video to a page the same way they would add an image. In order for this to work, web browser developers (Mozilla, Apple, Microsoft, Google, Opera, etc.) have to build the video playback functionality into their browsers. The W3C has created directions on how video should work in browsers, and it’s up to browser developers to follow those directions, so that video works the same across all browsers. This doesn’t always happen thanks to technology, legal, and financial choices made by browser developers, but so far no one’s varying too far from the specifications. However the specifications are still being changed and refined, so browsers developers have to keep up with that as well.
+
+Playing video in a web page may not seem so special since you can already view video on a web page through plugins like Flash Player, Quicktime, Silverlight, and RealPlayer, however this is a big step forward for standardizing video playback across web browsers and devices. The goal is that in the future, developers will only need to use one method for embedding a video, that’s based on open standards (not controlled by one company), and it will work everywhere.
+
+A prime example of this is the iPhone and iPad. Apple has decided not to support Flash on their mobile devices, but they do support HTML5 video. Since Flash is currently the most common way video is added to web pages, most web video (aside from YouTube who has a special relationship with Apple) can’t be viewed on the iPhone or iPad. These devices are very popular, so many web sites are switching to hybrid HTML5/Flash player setups (like VideoJS).
+
+<a name="video-tag"></a>
+### Video Tag
+There are a number of great resources that will give you an introduction to the video tag an how it is used including:
+
+  - [Dive into HTML5](http://diveintohtml5.org/video.html)
+  - Lynda.com's ['HTML5 Video and Audio in Depth'](http://www.lynda.com/HTML-5-tutorials/HTML5-Video-and-Audio-in-Depth/80781-2.html) video tutorials created by yours truly.
+
+An if you really want to dig in, you can read the (W3C Spec)[http://www.w3.org/TR/html5/video.html]. (Warning - not for the faint of heart)
+
+
+<a name="skin"></a>
+### Skin
+"Skin" refers to the design of the player's controls, also sometimes called the chrome. With VideoJS, new skins can be built simply by creating a new stylesheet.
+
+<a name="cdn"></a>
+### Content Delivery Network (CDN)
+A network of servers around the world that host copies of a file. When your browser requests one of these files, the CDN automatically determines which server is closest to your location and delivers the file from there. This drastically increases delivery time, especially internationally.

docs/index.md

@@ -0,0 +1,29 @@
+---
+layout: docs
+title: Docs
+description: Video.JS Docs
+body_id: docs
+body_class: docs subpage
+---
+
+<h1>Start</h1>
+
+The Video.js documentation is here to help you setup and use the player. These docs can be found and contributed to in the [Video.js library repository](https://github.com/zencoder/video-js/tree/master/docs).
+
+### [Setup](/docs/setup)
+Check out the [5 second setup](/#setup) if you're just getting started. The setup documentation gives a deeper view of the additional methods you can use to trigger the player setup.
+
+### [Options](/docs/options/)
+There are a number of options that can be used to change how the player behaves, starting with the HTML5 media options like autoplay and preload, and expanding to Video.JS specific options.
+
+### [API](/docs/api/)
+The Video.js API allows you to control the video through javascript or trigger event listeners, whether the video is playing through HTML5, flash, or another playback technology.
+
+### [Skins](/docs/skins/)
+You can change the look of the player across playback technologies just by editing a CSS file. The skins documentation gives you a intro to how the HTML and CSS of the default skin is put together.
+
+### [Tech](/docs/tech/)
+A 'playback technology' is the term we're using to represent HTML5 video, Flash, and other video plugins, as well as other players like the YouTube player. Basically anything that has a unique API to audio or video. Additional playback technologies can be added relatively easily.
+
+### [Glossary](/docs/glossary/)
+Some helpful definitions.

docs/options.md

@@ -0,0 +1,139 @@
+---
+layout: docs
+title: Options
+description: Player Options
+body_id: options
+body_class: docs subpage
+---
+
+Options
+=======
+
+Setting Options
+---------------
+
+The Video.js emebed code is simply an HTML5 video tag, so for many of the options you can use the standard tag attributes to set the options.
+
+<code type="html">
+
+    <video controls autoplay preload="auto" ...>
+
+</code>
+
+Alternatively, you can use the data-setup attribute to provide options in the [JSON](http://json.org/example.html) format. This is also how you would set options that aren't standard to the video tag.
+
+<code type="html">
+
+    <video data-setup='{ "controls": true, "autoplay": false, "preload": "auto" }'...>
+
+</code>
+
+Finally, if you're not using the data-setup attribute to trigger the player setup, you can pass in an object with the player options as the second argument in the javascript setup function.
+
+<code type="javascript">
+
+    _V_("example_video_1", { "controls": true, "autoplay": false, "preload": "auto" });
+
+</code>
+
+
+Individual Options
+------------------
+
+> ### Note on Video Tag Attributes ###
+> With HTML5 video tag attributes that can only be true or false (boolean), you simply include the attribute (no equals sign) to turn it on, or exclude it to turn it off. For example, to turn controls on:
+>
+> WRONG
+> <code type="html">
+>
+>     <video controls="true" ...>
+>
+> </code>
+>  
+> RIGHT
+> <code type="html">
+>  
+>     <video controls ...>
+>  
+> </code>
+>  
+> The biggest issue people run into is trying to set these values to false using false as the value (e.g. controls="false") which actually does the opposite and sets the value to true because the attribute is still included. If you need the attribute to include an equals sign for XHTML validation, you can set the attribute's value to the same as its name (e.g. controls="controls").
+
+
+### controls ###
+The controls option sets whether or not the player has controls that the user can interact with. Without controls the only way to start the video playing is with the autoplay attribute or through the API.
+<code type="html">
+
+    <video controls ...>
+    or
+    { "controls": true }
+
+</code>
+
+### autoplay ###
+If autoplay is true, the video will start playing as soon as page is loaded (without any interaction from the user).  
+NOT SUPPORTED BY APPLE iOS DEVICES. Apple blocks the autoplay functionality in an effort to protect it's customers from unwillingly using a lot of their (often expensive) monthly data plans. A user touch/click is required to start the video in this case.
+<code type="html">
+
+    <video autoplay ...>
+    or
+    { "autoplay": true }
+
+</code>
+
+### preload ###
+The preload attribute informs the browser whether or not the video data should begin downloading as soon as the video tag is loaded. The options are auto, metadata, and none.
+
+'auto': Start loading the video immediately (if the browser agrees). Some mobile devices like iPhones and iPads will not preload the video in order to protect their users' bandwidth. This is why the value is called 'auto' and not something more final like 'true'.
+
+'metadata': Load only the meta data of the video, which includes information like the duration and dimensions of the video.
+
+'none': Don't preload any of the video data. This will wait until the user clicks play to begin downloading.
+
+<code type="html">
+
+    <video preload ...>
+    or
+    { "preload": "auto" }
+
+</code>
+
+### poster ###
+The poster attribute sets the image that displays before the video begins playing. This is often a frame of the video or a custom title screen. As soon as the user clicks play the image will go away.
+<code type="html">
+
+    <video poster="myPoster.jpg" ...>
+    or
+    { "poster": "myPoster.jpg" }
+
+</code>
+
+### loop ###
+The loop attribute causes the video to start over as soon as it ends. This could be used for a visual affect like clouds in the background.
+<code type="html">
+
+    <video loop ...>
+    or
+    { "loop": "true" }
+
+</code>
+
+### width ###
+The width attribute sets the display width of the video.
+<code type="html">
+
+    <video width="640" ...>
+    or
+    { "width": 640 }
+
+</code>
+
+### height ###
+The height attribute sets the display height of the video.
+<code type="html">
+
+    <video height="480" ...>
+    or
+    { "height": 480 }
+
+</code>

docs/setup.md

@@ -0,0 +1,87 @@
+---
+layout: docs
+title: Setup
+description: Setup
+body_id: setup
+body_class: docs subpage
+---
+
+Setup
+=====
+
+Video.js is pretty easy to set up. It can take a matter of seconds to get the player up and working on your web page.
+
+Step 1: Include the Video.js Javascript and CSS files in the head of your page.
+------------------------------------------------------------------------------
+
+You can download the Video.js source and host it on your own servers, or use the free CDN hosted version. It's often recommended now to put JavaScript before the end body tag (</body>) instead of the head (<head>), but Video.js includes an 'HTML5 Shiv', which needs to be in the head for older IE versions to respect the video tag as a valid element. 
+
+> NOTE: If you're already using an HTML5 shiv like [Modernizr](http://modernizr.com/) you can include the Video.js JavaScript anywhere, however make sure your version of Modernizr includes the shiv for video.
+
+### CDN Version ###
+<code type="html">
+
+    <link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet">
+    <script src="http://vjs.zencdn.net/c/video.js"></script>
+
+</code>
+
+### Self Hosted. ###
+With the self hosted option you'll also want to update the location of the video-js.swf file.
+<code type="html">
+
+    <link href="http://example.com/path/to/video-js.css" rel="stylesheet">
+    <script src="http://example.com/path/to/video.js"></script>
+    <script>
+      _V_.options.flash.swf = "http://example.com/path/to/video-js.swf"
+    </script>
+
+</code>
+
+
+Step 2: Add an HTML5 video tag to your page.
+--------------------------------------------
+With Video.js you just use an HTML5 video tag to embed a video. Video.js will then read the tag and make it work in all browsers, not just ones that support HTML5 video. Beyond the basic markup, Video.js needs a few extra pieces.
+
+  1. The 'data-setup' Atrribute tells Video.js to automatically set up the video when the page is ready, and read any options (in JSON format) from the attribute (see ['options'](http://videojs.com/docs/options/)). There are other methods for initializing the player, but this is the easiest.
+
+  2. The 'id' Attribute: Should be used and unique for every video on the same page.
+
+  3. The 'class' attribute contains two classes:
+    - 'video-js' applies styles that are required for Video.js functionality, like fullscreen and subtitles.
+    - 'vjs-default-skin' applies the default skin to the HTML controls, and can be removed or overridden to create your own controls design.
+
+Otherwise include/exclude attributes, settings, sources, and tracks exactly as you would for HTML5 video.
+
+<code type="html">
+
+    <video id="example_video_1" class="video-js vjs-default-skin"  
+      controls preload="auto" width="640" height="264"  
+      poster="http://video-js.zencoder.com/oceans-clip.png"  
+      data-setup='{"example_option":true}'>  
+     <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' />  
+     <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm' />  
+     <source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg' />  
+    </video>
+
+</code>
+
+
+Alternative Setup for Dynamically Loaded HTML
+---------------------------------------------
+If your web page or application loads the video tag dynamically (ajax, appendChild, etc.), so that it may not exist when the page loads, you'll want to manually set up the player instead of relying on the data-setup attribute. To do this, first remove the data-setup attribute from the tag so there's no confusion around when the player is initialized. Next, run the following javascript some time after the Video.js javascript library has loaded, and after the video tag has been loaded into the DOM.
+
+<code type="javascript">
+
+    _V_("example_video_1", {}, function(){
+      // Player (this) is initialized and ready.
+    });
+
+</code>
+
+The first argument in the \_V_ function is the ID of your video tag. Replace it with your own.  
+
+The second argument is an options object. It allows you to set additional options like you can with the data-setup attribute.  
+
+The third argument is a 'ready' callback. Once Video.js has initialized it will call this function.
+

docs/skins.md

@@ -0,0 +1,33 @@
+---
+layout: docs
+title: Skins
+description: Controls Skins, Chrome, Design, look-and-feel.
+body_id: skins
+body_class: docs subpage
+---
+
+Skins
+=====
+
+The default Video.js skin is made using HTML and CSS, so there's no need to learn a complicated skinning language to update colors or even create an entirely new skin. New in version 3.0 is the use of a sprites image file (video-js.png). The image allows for a little bit more classy design, as well as compatibility with older versions of IE now that the HTML skin also shows when Flash is used for those browsers.
+
+You can view the uncompressed CSS for the default skin by downloading the latest version of Video.js or viewing [the source version](https://github.com/zencoder/video-js/blob/master/design/video-js.css) on Github.
+
+You can either override styles in the default skin:
+
+{% highlight css %}
+
+.vjs-default-skin .vjs-play-progress { background: #900; }
+
+{% endhighlight %}
+
+Or remove the 'vjs-default-skin' class from the video tag and create your own skin.
+
+{% highlight html %}
+
+<video class="video-js my-custom-skin" ...>
+
+{% endhighlight %}
+
+More custom skins will be available for download soon. If you have one you'd like to contribute back, please email it to <script type="text/javascript">eval(decodeURIComponent('%64%6f%63%75%6d%65%6e%74%2e%77%72%69%74%65%28%27%3c%61%20%68%72%65%66%3d%22%6d%61%69%6c%74%6f%3a%73%6b%69%6e%73%40%76%69%64%65%6f%6a%73%2e%63%6f%6d%22%3e%73%6b%69%6e%73%40%76%69%64%65%6f%6a%73%2e%63%6f%6d%3c%2f%61%3e%27%29%3b'))</script>.
+

docs/tech.md

@@ -0,0 +1,46 @@
+---
+layout: docs
+title: Playback Technology
+description: Video.js Playback Technology
+body_id: tech
+body_class: docs subpage
+---
+
+Playback Technology ("Tech")
+============================
+Playback Technology refers to the specific browser or plugin technology used to play the video or audio. When using HTML5, the playback technology is the video or audio element. When using Flash, the playback technology is the specific Flash player used, e.g. Flowplayer, YouTube Player, video-js.swf, etc. (not just "Flash"). This could also include Silverlight, Quicktime, or any other plugin that will play back video in the browser, as long as there is an API wrapper written for it. 
+
+Essentially we're using HTML5 and plugins only as video decoders, and using HTML and JavaScript to create a consistent API and skinning experience across all of them.
+
+Building an API Wrapper
+-----------------------
+We'll write a more complete guide on writing a wrapper soon, but for now the best resource is the [Video.js](https://github.com/zencoder/video-js/tree/master/src) source where you can see how both the HTML5 and video-js.swf API wrappers were created.
+
+Required Methods
+----------------
+canPlayType
+play
+pause
+currentTime
+volume
+duration
+buffered
+supportsFullScreen
+
+Required Events
+---------------
+loadstart
+play
+pause
+playing
+ended
+volumechange
+durationchange
+error
+
+Optional Events (include if supported)
+--------------------------------------
+timeupdate
+progress
+enterFullScreen
+exitFullScreen

docs/tracks.md

@@ -0,0 +1,235 @@
+---
+layout: docs
+title: HTML5 Video Text Tracks (Subtitles, Captions, Chapters)
+description: Video.js support for captions, subtitles, and chapters through the use of the HTML5 video track element.
+body_id: tracks
+body_class: docs subpage
+---
+
+Tracks
+======
+
+Text Tracks are a function of HTML5 video for providing time triggered text to the viewer. Video.js makes tracks work across all browsers. There are currently five types of tracks:
+
+- **Subtitles**: Translations of the dialogue in the video for when audio is available but not understood. Subtitles are shown over the video.
+- **Captions**: Transcription of the dialogue, sound effects, musical cues, and other audio information for when the viewer is deaf/hard of hearing, or the video is muted. Captions are also shown over the video.
+- **Chapters**: Chapter titles that are used to create navigation within the video. Typically they're in the form of a list of chapters that the viewer can click on to go to a specific chapter.
+- **Descriptions** (not supported yet): Text descriptions of what's happening in the video for when the video portion isn't available, because the viewer is blind, not using a screen, or driving and about to crash because they're trying to enjoy a video while driving. Descriptions are read by a screen reader or turned into a separate audio track.
+- **Metadata** (not supported yet): Tracks that have data meant for javascript to parse and do something with. These aren't shown to the user.
+
+Creating the Text File
+----------------------
+Timed text requires a text file in [WebVTT](http://dev.w3.org/html5/webvtt/) format. This format defines a list of "cues" that have a start time, and end time, and text to display. [Microsoft has a builder](http://ie.microsoft.com/testdrive/Graphics/CaptionMaker/) that can help you get started on the file.
+
+When creating captions, there's also additional (caption formatting techniques)[http://www.theneitherworld.com/mcpoodle/SCC_TOOLS/DOCS/SCC_FORMAT.HTML#style] that would be good to use, like brackets around sound effects. [ sound effect ]
+
+Adding to Video.js
+------------------
+Once you have your WebVTT file created, you can add it to Video.js using the track trag. Put your track track tag after all the source elements, and before any fallback content.
+
+<code type="html">
+
+    <video id="example_video_1" class="video-js vjs-default-skin"  
+      controls preload="auto" width="640" height="264"  
+      data-setup='{"example_option":true}'>  
+     <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' />  
+     <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm' />  
+     <source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg' />  
+
+     <track kind="captions" src="http://example.com/path/to/captions.vtt" srclang="en" label="English" default>
+
+    </video>
+
+</code>
+
+Track Attributes
+----------------
+Additional settings for track tags.
+
+### kind
+One of the five track types listed above. Kind defaults to subtitles if no kind is included.
+
+### label
+The label for the track that will be show to the user, for example in a menu that list the different languages available for subtitles.
+
+### default
+The default attribute can be used to have a track default to showing. Otherwise the viewer would need to select their language from the captions or subtitles menu.
+NOTE: For chapters, default is required if you want the chapters menu to show.
+
+### srclang
+The two-letter code (valid BCP 47 language tag) for the language of the text track, for example "en" for English. Here's a list of available language codes.
+
+<table border="0" cellspacing="5" cellpadding="5">
+  <tr>
+    <td>
+
+      <table>
+        <tr><th>ab<th><td>Abkhazian</td></tr>
+        <tr><th>aa<th><td>Afar</td></tr>
+        <tr><th>af<th><td>Afrikaans</td></tr>
+        <tr><th>sq<th><td>Albanian</td></tr>
+        <tr><th>am<th><td>Amharic</td></tr>
+        <tr><th>ar<th><td>Arabic</td></tr>
+        <tr><th>an<th><td>Aragonese</td></tr>
+        <tr><th>hy<th><td>Armenian</td></tr>
+        <tr><th>as<th><td>Assamese</td></tr>
+        <tr><th>ay<th><td>Aymara</td></tr>
+        <tr><th>az<th><td>Azerbaijani</td></tr>
+        <tr><th>ba<th><td>Bashkir</td></tr>
+        <tr><th>eu<th><td>Basque</td></tr>
+        <tr><th>bn<th><td>Bengali (Bangla)</td></tr>
+        <tr><th>dz<th><td>Bhutani</td></tr>
+        <tr><th>bh<th><td>Bihari</td></tr>
+        <tr><th>bi<th><td>Bislama</td></tr>
+        <tr><th>br<th><td>Breton</td></tr>
+        <tr><th>bg<th><td>Bulgarian</td></tr>
+        <tr><th>my<th><td>Burmese</td></tr>
+        <tr><th>be<th><td>Byelorussian (Belarusian)</td></tr>
+        <tr><th>km<th><td>Cambodian</td></tr>
+        <tr><th>ca<th><td>Catalan</td></tr>
+        <tr><th>zh<th><td>Chinese (Simplified)</td></tr>
+        <tr><th>zh<th><td>Chinese (Traditional)</td></tr>
+        <tr><th>co<th><td>Corsican</td></tr>
+        <tr><th>hr<th><td>Croatian</td></tr>
+        <tr><th>cs<th><td>Czech</td></tr>
+        <tr><th>da<th><td>Danish</td></tr>
+        <tr><th>nl<th><td>Dutch</td></tr>
+        <tr><th>en<th><td>English</td></tr>
+        <tr><th>eo<th><td>Esperanto</td></tr>
+        <tr><th>et<th><td>Estonian</td></tr>
+        <tr><th>fo<th><td>Faeroese</td></tr>
+        <tr><th>fa<th><td>Farsi</td></tr>
+        <tr><th>fj<th><td>Fiji</td></tr>
+        <tr><th>fi<th><td>Finnish</td></tr>
+      </table>
+      
+    </td>
+    <td>
+      
+      <table>
+        <tr><th>fr<th><td>French</td></tr>
+        <tr><th>fy<th><td>Frisian</td></tr>
+        <tr><th>gl<th><td>Galician</td></tr>
+        <tr><th>gd<th><td>Gaelic (Scottish)</td></tr>
+        <tr><th>gv<th><td>Gaelic (Manx)</td></tr>
+        <tr><th>ka<th><td>Georgian</td></tr>
+        <tr><th>de<th><td>German</td></tr>
+        <tr><th>el<th><td>Greek</td></tr>
+        <tr><th>kl<th><td>Greenlandic</td></tr>
+        <tr><th>gn<th><td>Guarani</td></tr>
+        <tr><th>gu<th><td>Gujarati</td></tr>
+        <tr><th>ht<th><td>Haitian Creole</td></tr>
+        <tr><th>ha<th><td>Hausa</td></tr>
+        <tr><th>he<th><td>Hebrew</td></tr>
+        <tr><th>hi<th><td>Hindi</td></tr>
+        <tr><th>hu<th><td>Hungarian</td></tr>
+        <tr><th>is<th><td>Icelandic</td></tr>
+        <tr><th>io<th><td>Ido</td></tr>
+        <tr><th>id<th><td>Indonesian</td></tr>
+        <tr><th>ia<th><td>Interlingua</td></tr>
+        <tr><th>ie<th><td>Interlingue</td></tr>
+        <tr><th>iu<th><td>Inuktitut</td></tr>
+        <tr><th>ik<th><td>Inupiak</td></tr>
+        <tr><th>ga<th><td>Irish</td></tr>
+        <tr><th>it<th><td>Italian</td></tr>
+        <tr><th>ja<th><td>Japanese</td></tr>
+        <tr><th>jv<th><td>Javanese</td></tr>
+        <tr><th>kn<th><td>Kannada</td></tr>
+        <tr><th>ks<th><td>Kashmiri</td></tr>
+        <tr><th>kk<th><td>Kazakh</td></tr>
+        <tr><th>rw<th><td>Kinyarwanda (Ruanda)</td></tr>
+        <tr><th>ky<th><td>Kirghiz</td></tr>
+        <tr><th>rn<th><td>Kirundi (Rundi)</td></tr>
+        <tr><th>ko<th><td>Korean</td></tr>
+        <tr><th>ku<th><td>Kurdish</td></tr>
+        <tr><th>lo<th><td>Laothian</td></tr>
+        <tr><th>la<th><td>Latin</td></tr>
+      </table>
+      
+    </td>
+    <td>
+      
+      <table>
+        <tr><th>lv<th><td>Latvian (Lettish)</td></tr>
+        <tr><th>li<th><td>Limburgish ( Limburger)</td></tr>
+        <tr><th>ln<th><td>Lingala</td></tr>
+        <tr><th>lt<th><td>Lithuanian</td></tr>
+        <tr><th>mk<th><td>Macedonian</td></tr>
+        <tr><th>mg<th><td>Malagasy</td></tr>
+        <tr><th>ms<th><td>Malay</td></tr>
+        <tr><th>ml<th><td>Malayalam</td></tr>
+        <tr><th>mt<th><td>Maltese</td></tr>
+        <tr><th>mi<th><td>Maori</td></tr>
+        <tr><th>mr<th><td>Marathi</td></tr>
+        <tr><th>mo<th><td>Moldavian</td></tr>
+        <tr><th>mn<th><td>Mongolian</td></tr>
+        <tr><th>na<th><td>Nauru</td></tr>
+        <tr><th>ne<th><td>Nepali</td></tr>
+        <tr><th>no<th><td>Norwegian</td></tr>
+        <tr><th>oc<th><td>Occitan</td></tr>
+        <tr><th>or<th><td>Oriya</td></tr>
+        <tr><th>om<th><td>Oromo (Afan, Galla)</td></tr>
+        <tr><th>ps<th><td>Pashto (Pushto)</td></tr>
+        <tr><th>pl<th><td>Polish</td></tr>
+        <tr><th>pt<th><td>Portuguese</td></tr>
+        <tr><th>pa<th><td>Punjabi</td></tr>
+        <tr><th>qu<th><td>Quechua</td></tr>
+        <tr><th>rm<th><td>Rhaeto-Romance</td></tr>
+        <tr><th>ro<th><td>Romanian</td></tr>
+        <tr><th>ru<th><td>Russian</td></tr>
+        <tr><th>sm<th><td>Samoan</td></tr>
+        <tr><th>sg<th><td>Sangro</td></tr>
+        <tr><th>sa<th><td>Sanskrit</td></tr>
+        <tr><th>sr<th><td>Serbian</td></tr>
+        <tr><th>sh<th><td>Serbo-Croatian</td></tr>
+        <tr><th>st<th><td>Sesotho</td></tr>
+        <tr><th>tn<th><td>Setswana</td></tr>
+        <tr><th>sn<th><td>Shona</td></tr>
+        <tr><th>ii<th><td>Sichuan Yi</td></tr>
+        <tr><th>sd<th><td>Sindhi</td></tr>
+      </table>
+      
+    </td>
+    <td>
+      
+      <table>
+        <tr><th>si<th><td>Sinhalese</td></tr>
+        <tr><th>ss<th><td>Siswati</td></tr>
+        <tr><th>sk<th><td>Slovak</td></tr>
+        <tr><th>sl<th><td>Slovenian</td></tr>
+        <tr><th>so<th><td>Somali</td></tr>
+        <tr><th>es<th><td>Spanish</td></tr>
+        <tr><th>su<th><td>Sundanese</td></tr>
+        <tr><th>sw<th><td>Swahili (Kiswahili)</td></tr>
+        <tr><th>sv<th><td>Swedish</td></tr>
+        <tr><th>tl<th><td>Tagalog</td></tr>
+        <tr><th>tg<th><td>Tajik</td></tr>
+        <tr><th>ta<th><td>Tamil</td></tr>
+        <tr><th>tt<th><td>Tatar</td></tr>
+        <tr><th>te<th><td>Telugu</td></tr>
+        <tr><th>th<th><td>Thai</td></tr>
+        <tr><th>bo<th><td>Tibetan</td></tr>
+        <tr><th>ti<th><td>Tigrinya</td></tr>
+        <tr><th>to<th><td>Tonga</td></tr>
+        <tr><th>ts<th><td>Tsonga</td></tr>
+        <tr><th>tr<th><td>Turkish</td></tr>
+        <tr><th>tk<th><td>Turkmen</td></tr>
+        <tr><th>tw<th><td>Twi</td></tr>
+        <tr><th>ug<th><td>Uighur</td></tr>
+        <tr><th>uk<th><td>Ukrainian</td></tr>
+        <tr><th>ur<th><td>Urdu</td></tr>
+        <tr><th>uz<th><td>Uzbek</td></tr>
+        <tr><th>vi<th><td>Vietnamese</td></tr>
+        <tr><th>vo<th><td>Volapük</td></tr>
+        <tr><th>wa<th><td>Wallon</td></tr>
+        <tr><th>cy<th><td>Welsh</td></tr>
+        <tr><th>wo<th><td>Wolof</td></tr>
+        <tr><th>xh<th><td>Xhosa</td></tr>
+        <tr><th>yi<th><td>Yiddish</td></tr>
+        <tr><th>yo<th><td>Yoruba</td></tr>
+        <tr><th>zu<th><td>Zulu</td></tr>
+      </table>
+      
+    </td>
+  </tr>
+</table>

index.html

@@ -1,182 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <meta charset="utf-8" />
-  <title>HTML5 Video Player | Video JS</title>
-  <meta name="google-site-verification" content="QHf9MEYVlEWoNHbzTeUkSQsbRT5Twzqu6N0nX1i3nes" />
-  
-  <script src="video-js/video.js" type="text/javascript" charset="utf-8"></script>
-  <!-- JQuery not required, but used for dom ready function -->
-  <script src="javascripts/jquery-1.4.2.min.js" type="text/javascript" charset="utf-8"></script>
-
-  <link rel="stylesheet" href="stylesheets/base.css" type="text/css" media="all" charset="utf-8" />
-  <link rel="stylesheet" href="video-js/video-js.css" type="text/css" media="all" charset="utf-8" />
-  <link rel="stylesheet" href="stylesheets/site.css" type="text/css" media="all" charset="utf-8" />
-
-  <!--[if !IE 7]>
-    <style type="text/css">
-      #wrap {display:table;height:100%}
-    </style>
-  <![endif]-->
-
-  <script type="text/javascript" charset="utf-8">
-
-    VideoJS.setupAllWhenReady();
-    // See demo.html for other setup options
-    
-  </script>
-
-</head>
-<body>
-
-  <div id="wrap">
-    <div id="main">
-
-      <ul id="nav">
-        <li><a href="skins.html">Skins</a></li>
-        <li><a href="http://github.com/zencoder/video-js">Source</a></li>
-        <li><a href="http://wiki.github.com/zencoder/video-js/browser-device-compatibility">Compatibility</a></li>        
-        <li><a href="http://github.com/zencoder/video-js/issues">Issue Tracker</a></li>
-        <li><a href="http://wiki.github.com/zencoder/video-js/">Wiki</a></li>
-      </ul>
-
-      <h1>Video JS</h1>
-      <p class="tagline">Open Source HTML5 Video Player</p>
-
-      <!-- Begin VideoJS -->
-      <div class="video-js-box">
-        <!-- Using the Video for Everybody Embed Code http://camendesign.com/code/video_for_everybody -->
-        <video class="video-js" width="640" height="264" poster="//vjs.zencdn.net/v/oceans.png" controls preload>
-          <source src="//vjs.zencdn.net/v/oceans.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
-          <source src="//vjs.zencdn.net/v/oceans.webm" type='video/webm; codecs="vp8, vorbis"'>
-          <source src="//vjs.zencdn.net/v/oceans.ogg" type='video/ogg; codecs="theora, vorbis"'>
-          <object class="vjs-flash-fallback" width="640" height="264" type="application/x-shockwave-flash"
-            data="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf">
-            <param name="movie" value="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" />
-            <param name="allowfullscreen" value="true" />
-            <param name="flashvars" value='config={"clip":{"url":"//vjs.zencdn.net/v/oceans.mp4","autoPlay":false,"autoBuffering":true}}' />
-            <img src="//vjs.zencdn.net/v/oceans.png" width="640" height="264" alt="Poster Image"
-              title="No video playback capabilities." />
-          </object>
-        </video>
-        <p class="vjs-no-video"><strong>Download Video:</strong>
-          <a href="//vjs.zencdn.net/v/oceans.mp4">MP4</a>,
-          <a href="//vjs.zencdn.net/v/oceans.webm">WebM</a>,
-          <a href="//vjs.zencdn.net/v/oceans.ogg">Ogg</a><br>
-          <a href="http://videojs.com">HTML5 Video Player</a> by <a href="http://videojs.com">VideoJS</a>
-        </p>
-      </div>
-      <!-- End VideoJS -->
-      
-      <p id="video_note">Video clip is from <a href="http://disney.go.com/disneynature/oceans/" title="Oceans">Disney&rsquo;s Oceans</a></p>
-
-      <p>Video JS is a javascript-based video player that uses the HTML5 video functionality built into  advanced browsers. In general, the benefit of using an HTML5 player is a consistent look between browsers.</p>
-
-      <p id="sponsor">
-        <a href="http://zencoder.com">Video encoding &amp; hosting</a> provided by:<br>
-        <a href="http://zencoder.com"><img src="images/zencoder-logo.png" border="0" alt="Zencoder - Video Encoding"></a>
-      </p>
-
-      <div id="features_and_support" class="clearfix">
-        <div id="features">
-          <h6>Features</h6>
-          <ul id="feature_list">
-            <li>Free &amp; Open Source</li>
-            <li>Lightweight. <strong>NO IMAGES USED</strong></li>
-            <li>100% skinnable using CSS</li>
-            <li>Library independent</li>
-            <li>Easy to use</li>
-            <li>Easy to understand &amp; extend</li>
-            <li>Consistent look between browsers</li>
-            <li>Full Window Mode</li>
-            <li>Volume Control</li>
-            <li>Forced fallback to Flash (even when there is an unsupported source)</li>
-            <li></li>
-          </ul>
-        </div>
-        <div id="supported" class="clearfix">
-          <h6>Download</h6>
-          <div class="supported-section">
-            <a href="http://github.com/zencoder/video-js/zipball/master" title="Zip Download"><img src="images/icons/zip.png" alt="Zip Download"></a>
-            <a href="http://github.com/zencoder/video-js/tarball/master" title="Tar Download"><img src="images/icons/tar.png" alt="Tar Download"></a>
-          </div>
-          <h6>Supported Browsers</h6>
-          <div class="supported-section">
-            <a href="http://www.mozilla.com/en-US/firefox/firefox.html" title="Firefox"><img src="images/icons/firefox.png" alt="Firefox"></a>
-            <a href="http://www.apple.com/safari/" title="Safari"><img src="images/icons/safari.png" alt="Safari"></a>
-            <a href="http://www.google.com/chrome" title="Chrome"><img src="images/icons/chrome.png" alt="Chrome"></a>
-            <a href="http://www.opera.com/" title="Opera"><img src="images/icons/opera.png" alt="Opera"></a>
-          </div>
-          <h6>Fallback Support For</h6>
-          <div class="supported-section">
-            <a href="http://www.microsoft.com/windows/Internet-explorer/default.aspx" title="IE"><img src="images/icons/ie.png" alt="IE"></a>
-          </div>
-          <h6>Supported Formats</h6>
-          <div class="supported-section">
-            <a href="http://en.wikipedia.org/wiki/H.264/MPEG-4_AVC" title="h264"><img src="images/icons/h264.png" alt="h264"></a>
-            <a href="http://www.theora.org/" title="Ogg"><img src="images/icons/ogg.png" alt="Ogg"></a>
-            <a href="http://www.webmproject.org/" title="WebM"><img src="images/icons/webm.png" alt="WebM"></a>
-          </div>
-          <h6>Compatible With</h6>
-          <div class="supported-section">
-            <a href="http://www.apple.com/iphone/" title="iPhone"><img src="images/icons/iphone.png" alt="iPhone"></a>
-            <a href="http://www.apple.com/ipad/" title="iPad"><img src="images/icons/ipad.png" alt="iPad"></a>
-          </div>
-        </div>
-
-        <p id="issues_link">Submit any bugs in the <a href="http://github.com/zencoder/video-js/issues">Issue Tracker</a> or update the <a href="http://wiki.github.com/zencoder/video-js/browser-device-compatibility">Compatibility Table</a></p>
-        <p>Moved <a href="comments.html">comments</a> to another page temporarily.</p>
-        
-        <!-- <div id="disqus_thread"></div> 
-        <script type="text/javascript">
-          /**
-            * var disqus_identifier; [Optional but recommended: Define a unique identifier (e.g. post id or slug) for this thread]
-            */
-          (function() {
-           var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
-           dsq.src = 'http://videojs.disqus.com/embed.js';
-           (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
-          })();
-        </script>
-        <noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript=videojs">comments powered by Disqus.</a></noscript>
-        <a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a> -->
-
-      </div>
-    </div>
-
-    <div id="footer">
-      &copy; <a href="//videojs.github.io/video.js">The Video JS Project</a>. Sponsored by <a href="http://zencoder.com">Zencoder</a>.
-    </div>
-  </div>
-
-  <!-- <script type="text/javascript">
-  //<![CDATA[
-  (function() {
-    var links = document.getElementsByTagName('a');
-    var query = '?';
-    for(var i = 0; i < links.length; i++) {
-    if(links[i].href.indexOf('#disqus_thread') >= 0) {
-      query += 'url' + i + '=' + encodeURIComponent(links[i].href) + '&';
-    }
-    }
-    document.write('<script charset="utf-8" type="text/javascript" src="http://disqus.com/forums/videojs/get_num_replies.js' + query + '"></' + 'script>');
-  })();
-  //]]>
-  </script> -->
-
-  <script type="text/javascript">
-
-    var _gaq = _gaq || [];
-    _gaq.push(['_setAccount', 'UA-16505296-1']);
-    _gaq.push(['_trackPageview']);
-
-    (function() {
-      var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
-      ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
-      var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
-    })();
-
-  </script>
-
-</body>
-</html>

javascripts/jquery-1.4.2.min.js

@@ -1,154 +0,0 @@
-/*!
- * jQuery JavaScript Library v1.4.2
- * http://jquery.com/
- *
- * Copyright 2010, John Resig
- * Dual licensed under the MIT or GPL Version 2 licenses.
- * http://jquery.org/license
- *
- * Includes Sizzle.js
- * http://sizzlejs.com/
- * Copyright 2010, The Dojo Foundation
- * Released under the MIT, BSD, and GPL Licenses.
- *
- * Date: Sat Feb 13 22:33:48 2010 -0500
- */
-(function(A,w){function ma(){if(!c.isReady){try{s.documentElement.doScroll("left")}catch(a){setTimeout(ma,1);return}c.ready()}}function Qa(a,b){b.src?c.ajax({url:b.src,async:false,dataType:"script"}):c.globalEval(b.text||b.textContent||b.innerHTML||"");b.parentNode&&b.parentNode.removeChild(b)}function X(a,b,d,f,e,j){var i=a.length;if(typeof b==="object"){for(var o in b)X(a,o,b[o],f,e,d);return a}if(d!==w){f=!j&&f&&c.isFunction(d);for(o=0;o<i;o++)e(a[o],b,f?d.call(a[o],o,e(a[o],b)):d,j);return a}return i?
-e(a[0],b):w}function J(){return(new Date).getTime()}function Y(){return false}function Z(){return true}function na(a,b,d){d[0].type=a;return c.event.handle.apply(b,d)}function oa(a){var b,d=[],f=[],e=arguments,j,i,o,k,n,r;i=c.data(this,"events");if(!(a.liveFired===this||!i||!i.live||a.button&&a.type==="click")){a.liveFired=this;var u=i.live.slice(0);for(k=0;k<u.length;k++){i=u[k];i.origType.replace(O,"")===a.type?f.push(i.selector):u.splice(k--,1)}j=c(a.target).closest(f,a.currentTarget);n=0;for(r=
-j.length;n<r;n++)for(k=0;k<u.length;k++){i=u[k];if(j[n].selector===i.selector){o=j[n].elem;f=null;if(i.preType==="mouseenter"||i.preType==="mouseleave")f=c(a.relatedTarget).closest(i.selector)[0];if(!f||f!==o)d.push({elem:o,handleObj:i})}}n=0;for(r=d.length;n<r;n++){j=d[n];a.currentTarget=j.elem;a.data=j.handleObj.data;a.handleObj=j.handleObj;if(j.handleObj.origHandler.apply(j.elem,e)===false){b=false;break}}return b}}function pa(a,b){return"live."+(a&&a!=="*"?a+".":"")+b.replace(/\./g,"`").replace(/ /g,
-"&")}function qa(a){return!a||!a.parentNode||a.parentNode.nodeType===11}function ra(a,b){var d=0;b.each(function(){if(this.nodeName===(a[d]&&a[d].nodeName)){var f=c.data(a[d++]),e=c.data(this,f);if(f=f&&f.events){delete e.handle;e.events={};for(var j in f)for(var i in f[j])c.event.add(this,j,f[j][i],f[j][i].data)}}})}function sa(a,b,d){var f,e,j;b=b&&b[0]?b[0].ownerDocument||b[0]:s;if(a.length===1&&typeof a[0]==="string"&&a[0].length<512&&b===s&&!ta.test(a[0])&&(c.support.checkClone||!ua.test(a[0]))){e=
-true;if(j=c.fragments[a[0]])if(j!==1)f=j}if(!f){f=b.createDocumentFragment();c.clean(a,b,f,d)}if(e)c.fragments[a[0]]=j?f:1;return{fragment:f,cacheable:e}}function K(a,b){var d={};c.each(va.concat.apply([],va.slice(0,b)),function(){d[this]=a});return d}function wa(a){return"scrollTo"in a&&a.document?a:a.nodeType===9?a.defaultView||a.parentWindow:false}var c=function(a,b){return new c.fn.init(a,b)},Ra=A.jQuery,Sa=A.$,s=A.document,T,Ta=/^[^<]*(<[\w\W]+>)[^>]*$|^#([\w-]+)$/,Ua=/^.[^:#\[\.,]*$/,Va=/\S/,
-Wa=/^(\s|\u00A0)+|(\s|\u00A0)+$/g,Xa=/^<(\w+)\s*\/?>(?:<\/\1>)?$/,P=navigator.userAgent,xa=false,Q=[],L,$=Object.prototype.toString,aa=Object.prototype.hasOwnProperty,ba=Array.prototype.push,R=Array.prototype.slice,ya=Array.prototype.indexOf;c.fn=c.prototype={init:function(a,b){var d,f;if(!a)return this;if(a.nodeType){this.context=this[0]=a;this.length=1;return this}if(a==="body"&&!b){this.context=s;this[0]=s.body;this.selector="body";this.length=1;return this}if(typeof a==="string")if((d=Ta.exec(a))&&
-(d[1]||!b))if(d[1]){f=b?b.ownerDocument||b:s;if(a=Xa.exec(a))if(c.isPlainObject(b)){a=[s.createElement(a[1])];c.fn.attr.call(a,b,true)}else a=[f.createElement(a[1])];else{a=sa([d[1]],[f]);a=(a.cacheable?a.fragment.cloneNode(true):a.fragment).childNodes}return c.merge(this,a)}else{if(b=s.getElementById(d[2])){if(b.id!==d[2])return T.find(a);this.length=1;this[0]=b}this.context=s;this.selector=a;return this}else if(!b&&/^\w+$/.test(a)){this.selector=a;this.context=s;a=s.getElementsByTagName(a);return c.merge(this,
-a)}else return!b||b.jquery?(b||T).find(a):c(b).find(a);else if(c.isFunction(a))return T.ready(a);if(a.selector!==w){this.selector=a.selector;this.context=a.context}return c.makeArray(a,this)},selector:"",jquery:"1.4.2",length:0,size:function(){return this.length},toArray:function(){return R.call(this,0)},get:function(a){return a==null?this.toArray():a<0?this.slice(a)[0]:this[a]},pushStack:function(a,b,d){var f=c();c.isArray(a)?ba.apply(f,a):c.merge(f,a);f.prevObject=this;f.context=this.context;if(b===
-"find")f.selector=this.selector+(this.selector?" ":"")+d;else if(b)f.selector=this.selector+"."+b+"("+d+")";return f},each:function(a,b){return c.each(this,a,b)},ready:function(a){c.bindReady();if(c.isReady)a.call(s,c);else Q&&Q.push(a);return this},eq:function(a){return a===-1?this.slice(a):this.slice(a,+a+1)},first:function(){return this.eq(0)},last:function(){return this.eq(-1)},slice:function(){return this.pushStack(R.apply(this,arguments),"slice",R.call(arguments).join(","))},map:function(a){return this.pushStack(c.map(this,
-function(b,d){return a.call(b,d,b)}))},end:function(){return this.prevObject||c(null)},push:ba,sort:[].sort,splice:[].splice};c.fn.init.prototype=c.fn;c.extend=c.fn.extend=function(){var a=arguments[0]||{},b=1,d=arguments.length,f=false,e,j,i,o;if(typeof a==="boolean"){f=a;a=arguments[1]||{};b=2}if(typeof a!=="object"&&!c.isFunction(a))a={};if(d===b){a=this;--b}for(;b<d;b++)if((e=arguments[b])!=null)for(j in e){i=a[j];o=e[j];if(a!==o)if(f&&o&&(c.isPlainObject(o)||c.isArray(o))){i=i&&(c.isPlainObject(i)||
-c.isArray(i))?i:c.isArray(o)?[]:{};a[j]=c.extend(f,i,o)}else if(o!==w)a[j]=o}return a};c.extend({noConflict:function(a){A.$=Sa;if(a)A.jQuery=Ra;return c},isReady:false,ready:function(){if(!c.isReady){if(!s.body)return setTimeout(c.ready,13);c.isReady=true;if(Q){for(var a,b=0;a=Q[b++];)a.call(s,c);Q=null}c.fn.triggerHandler&&c(s).triggerHandler("ready")}},bindReady:function(){if(!xa){xa=true;if(s.readyState==="complete")return c.ready();if(s.addEventListener){s.addEventListener("DOMContentLoaded",
-L,false);A.addEventListener("load",c.ready,false)}else if(s.attachEvent){s.attachEvent("onreadystatechange",L);A.attachEvent("onload",c.ready);var a=false;try{a=A.frameElement==null}catch(b){}s.documentElement.doScroll&&a&&ma()}}},isFunction:function(a){return $.call(a)==="[object Function]"},isArray:function(a){return $.call(a)==="[object Array]"},isPlainObject:function(a){if(!a||$.call(a)!=="[object Object]"||a.nodeType||a.setInterval)return false;if(a.constructor&&!aa.call(a,"constructor")&&!aa.call(a.constructor.prototype,
-"isPrototypeOf"))return false;var b;for(b in a);return b===w||aa.call(a,b)},isEmptyObject:function(a){for(var b in a)return false;return true},error:function(a){throw a;},parseJSON:function(a){if(typeof a!=="string"||!a)return null;a=c.trim(a);if(/^[\],:{}\s]*$/.test(a.replace(/\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g,"@").replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g,"]").replace(/(?:^|:|,)(?:\s*\[)+/g,"")))return A.JSON&&A.JSON.parse?A.JSON.parse(a):(new Function("return "+
-a))();else c.error("Invalid JSON: "+a)},noop:function(){},globalEval:function(a){if(a&&Va.test(a)){var b=s.getElementsByTagName("head")[0]||s.documentElement,d=s.createElement("script");d.type="text/javascript";if(c.support.scriptEval)d.appendChild(s.createTextNode(a));else d.text=a;b.insertBefore(d,b.firstChild);b.removeChild(d)}},nodeName:function(a,b){return a.nodeName&&a.nodeName.toUpperCase()===b.toUpperCase()},each:function(a,b,d){var f,e=0,j=a.length,i=j===w||c.isFunction(a);if(d)if(i)for(f in a){if(b.apply(a[f],
-d)===false)break}else for(;e<j;){if(b.apply(a[e++],d)===false)break}else if(i)for(f in a){if(b.call(a[f],f,a[f])===false)break}else for(d=a[0];e<j&&b.call(d,e,d)!==false;d=a[++e]);return a},trim:function(a){return(a||"").replace(Wa,"")},makeArray:function(a,b){b=b||[];if(a!=null)a.length==null||typeof a==="string"||c.isFunction(a)||typeof a!=="function"&&a.setInterval?ba.call(b,a):c.merge(b,a);return b},inArray:function(a,b){if(b.indexOf)return b.indexOf(a);for(var d=0,f=b.length;d<f;d++)if(b[d]===
-a)return d;return-1},merge:function(a,b){var d=a.length,f=0;if(typeof b.length==="number")for(var e=b.length;f<e;f++)a[d++]=b[f];else for(;b[f]!==w;)a[d++]=b[f++];a.length=d;return a},grep:function(a,b,d){for(var f=[],e=0,j=a.length;e<j;e++)!d!==!b(a[e],e)&&f.push(a[e]);return f},map:function(a,b,d){for(var f=[],e,j=0,i=a.length;j<i;j++){e=b(a[j],j,d);if(e!=null)f[f.length]=e}return f.concat.apply([],f)},guid:1,proxy:function(a,b,d){if(arguments.length===2)if(typeof b==="string"){d=a;a=d[b];b=w}else if(b&&
-!c.isFunction(b)){d=b;b=w}if(!b&&a)b=function(){return a.apply(d||this,arguments)};if(a)b.guid=a.guid=a.guid||b.guid||c.guid++;return b},uaMatch:function(a){a=a.toLowerCase();a=/(webkit)[ \/]([\w.]+)/.exec(a)||/(opera)(?:.*version)?[ \/]([\w.]+)/.exec(a)||/(msie) ([\w.]+)/.exec(a)||!/compatible/.test(a)&&/(mozilla)(?:.*? rv:([\w.]+))?/.exec(a)||[];return{browser:a[1]||"",version:a[2]||"0"}},browser:{}});P=c.uaMatch(P);if(P.browser){c.browser[P.browser]=true;c.browser.version=P.version}if(c.browser.webkit)c.browser.safari=
-true;if(ya)c.inArray=function(a,b){return ya.call(b,a)};T=c(s);if(s.addEventListener)L=function(){s.removeEventListener("DOMContentLoaded",L,false);c.ready()};else if(s.attachEvent)L=function(){if(s.readyState==="complete"){s.detachEvent("onreadystatechange",L);c.ready()}};(function(){c.support={};var a=s.documentElement,b=s.createElement("script"),d=s.createElement("div"),f="script"+J();d.style.display="none";d.innerHTML="   <link/><table></table><a href='/a' style='color:red;float:left;opacity:.55;'>a</a><input type='checkbox'/>";
-var e=d.getElementsByTagName("*"),j=d.getElementsByTagName("a")[0];if(!(!e||!e.length||!j)){c.support={leadingWhitespace:d.firstChild.nodeType===3,tbody:!d.getElementsByTagName("tbody").length,htmlSerialize:!!d.getElementsByTagName("link").length,style:/red/.test(j.getAttribute("style")),hrefNormalized:j.getAttribute("href")==="/a",opacity:/^0.55$/.test(j.style.opacity),cssFloat:!!j.style.cssFloat,checkOn:d.getElementsByTagName("input")[0].value==="on",optSelected:s.createElement("select").appendChild(s.createElement("option")).selected,
-parentNode:d.removeChild(d.appendChild(s.createElement("div"))).parentNode===null,deleteExpando:true,checkClone:false,scriptEval:false,noCloneEvent:true,boxModel:null};b.type="text/javascript";try{b.appendChild(s.createTextNode("window."+f+"=1;"))}catch(i){}a.insertBefore(b,a.firstChild);if(A[f]){c.support.scriptEval=true;delete A[f]}try{delete b.test}catch(o){c.support.deleteExpando=false}a.removeChild(b);if(d.attachEvent&&d.fireEvent){d.attachEvent("onclick",function k(){c.support.noCloneEvent=
-false;d.detachEvent("onclick",k)});d.cloneNode(true).fireEvent("onclick")}d=s.createElement("div");d.innerHTML="<input type='radio' name='radiotest' checked='checked'/>";a=s.createDocumentFragment();a.appendChild(d.firstChild);c.support.checkClone=a.cloneNode(true).cloneNode(true).lastChild.checked;c(function(){var k=s.createElement("div");k.style.width=k.style.paddingLeft="1px";s.body.appendChild(k);c.boxModel=c.support.boxModel=k.offsetWidth===2;s.body.removeChild(k).style.display="none"});a=function(k){var n=
-s.createElement("div");k="on"+k;var r=k in n;if(!r){n.setAttribute(k,"return;");r=typeof n[k]==="function"}return r};c.support.submitBubbles=a("submit");c.support.changeBubbles=a("change");a=b=d=e=j=null}})();c.props={"for":"htmlFor","class":"className",readonly:"readOnly",maxlength:"maxLength",cellspacing:"cellSpacing",rowspan:"rowSpan",colspan:"colSpan",tabindex:"tabIndex",usemap:"useMap",frameborder:"frameBorder"};var G="jQuery"+J(),Ya=0,za={};c.extend({cache:{},expando:G,noData:{embed:true,object:true,
-applet:true},data:function(a,b,d){if(!(a.nodeName&&c.noData[a.nodeName.toLowerCase()])){a=a==A?za:a;var f=a[G],e=c.cache;if(!f&&typeof b==="string"&&d===w)return null;f||(f=++Ya);if(typeof b==="object"){a[G]=f;e[f]=c.extend(true,{},b)}else if(!e[f]){a[G]=f;e[f]={}}a=e[f];if(d!==w)a[b]=d;return typeof b==="string"?a[b]:a}},removeData:function(a,b){if(!(a.nodeName&&c.noData[a.nodeName.toLowerCase()])){a=a==A?za:a;var d=a[G],f=c.cache,e=f[d];if(b){if(e){delete e[b];c.isEmptyObject(e)&&c.removeData(a)}}else{if(c.support.deleteExpando)delete a[c.expando];
-else a.removeAttribute&&a.removeAttribute(c.expando);delete f[d]}}}});c.fn.extend({data:function(a,b){if(typeof a==="undefined"&&this.length)return c.data(this[0]);else if(typeof a==="object")return this.each(function(){c.data(this,a)});var d=a.split(".");d[1]=d[1]?"."+d[1]:"";if(b===w){var f=this.triggerHandler("getData"+d[1]+"!",[d[0]]);if(f===w&&this.length)f=c.data(this[0],a);return f===w&&d[1]?this.data(d[0]):f}else return this.trigger("setData"+d[1]+"!",[d[0],b]).each(function(){c.data(this,
-a,b)})},removeData:function(a){return this.each(function(){c.removeData(this,a)})}});c.extend({queue:function(a,b,d){if(a){b=(b||"fx")+"queue";var f=c.data(a,b);if(!d)return f||[];if(!f||c.isArray(d))f=c.data(a,b,c.makeArray(d));else f.push(d);return f}},dequeue:function(a,b){b=b||"fx";var d=c.queue(a,b),f=d.shift();if(f==="inprogress")f=d.shift();if(f){b==="fx"&&d.unshift("inprogress");f.call(a,function(){c.dequeue(a,b)})}}});c.fn.extend({queue:function(a,b){if(typeof a!=="string"){b=a;a="fx"}if(b===
-w)return c.queue(this[0],a);return this.each(function(){var d=c.queue(this,a,b);a==="fx"&&d[0]!=="inprogress"&&c.dequeue(this,a)})},dequeue:function(a){return this.each(function(){c.dequeue(this,a)})},delay:function(a,b){a=c.fx?c.fx.speeds[a]||a:a;b=b||"fx";return this.queue(b,function(){var d=this;setTimeout(function(){c.dequeue(d,b)},a)})},clearQueue:function(a){return this.queue(a||"fx",[])}});var Aa=/[\n\t]/g,ca=/\s+/,Za=/\r/g,$a=/href|src|style/,ab=/(button|input)/i,bb=/(button|input|object|select|textarea)/i,
-cb=/^(a|area)$/i,Ba=/radio|checkbox/;c.fn.extend({attr:function(a,b){return X(this,a,b,true,c.attr)},removeAttr:function(a){return this.each(function(){c.attr(this,a,"");this.nodeType===1&&this.removeAttribute(a)})},addClass:function(a){if(c.isFunction(a))return this.each(function(n){var r=c(this);r.addClass(a.call(this,n,r.attr("class")))});if(a&&typeof a==="string")for(var b=(a||"").split(ca),d=0,f=this.length;d<f;d++){var e=this[d];if(e.nodeType===1)if(e.className){for(var j=" "+e.className+" ",
-i=e.className,o=0,k=b.length;o<k;o++)if(j.indexOf(" "+b[o]+" ")<0)i+=" "+b[o];e.className=c.trim(i)}else e.className=a}return this},removeClass:function(a){if(c.isFunction(a))return this.each(function(k){var n=c(this);n.removeClass(a.call(this,k,n.attr("class")))});if(a&&typeof a==="string"||a===w)for(var b=(a||"").split(ca),d=0,f=this.length;d<f;d++){var e=this[d];if(e.nodeType===1&&e.className)if(a){for(var j=(" "+e.className+" ").replace(Aa," "),i=0,o=b.length;i<o;i++)j=j.replace(" "+b[i]+" ",
-" ");e.className=c.trim(j)}else e.className=""}return this},toggleClass:function(a,b){var d=typeof a,f=typeof b==="boolean";if(c.isFunction(a))return this.each(function(e){var j=c(this);j.toggleClass(a.call(this,e,j.attr("class"),b),b)});return this.each(function(){if(d==="string")for(var e,j=0,i=c(this),o=b,k=a.split(ca);e=k[j++];){o=f?o:!i.hasClass(e);i[o?"addClass":"removeClass"](e)}else if(d==="undefined"||d==="boolean"){this.className&&c.data(this,"__className__",this.className);this.className=
-this.className||a===false?"":c.data(this,"__className__")||""}})},hasClass:function(a){a=" "+a+" ";for(var b=0,d=this.length;b<d;b++)if((" "+this[b].className+" ").replace(Aa," ").indexOf(a)>-1)return true;return false},val:function(a){if(a===w){var b=this[0];if(b){if(c.nodeName(b,"option"))return(b.attributes.value||{}).specified?b.value:b.text;if(c.nodeName(b,"select")){var d=b.selectedIndex,f=[],e=b.options;b=b.type==="select-one";if(d<0)return null;var j=b?d:0;for(d=b?d+1:e.length;j<d;j++){var i=
-e[j];if(i.selected){a=c(i).val();if(b)return a;f.push(a)}}return f}if(Ba.test(b.type)&&!c.support.checkOn)return b.getAttribute("value")===null?"on":b.value;return(b.value||"").replace(Za,"")}return w}var o=c.isFunction(a);return this.each(function(k){var n=c(this),r=a;if(this.nodeType===1){if(o)r=a.call(this,k,n.val());if(typeof r==="number")r+="";if(c.isArray(r)&&Ba.test(this.type))this.checked=c.inArray(n.val(),r)>=0;else if(c.nodeName(this,"select")){var u=c.makeArray(r);c("option",this).each(function(){this.selected=
-c.inArray(c(this).val(),u)>=0});if(!u.length)this.selectedIndex=-1}else this.value=r}})}});c.extend({attrFn:{val:true,css:true,html:true,text:true,data:true,width:true,height:true,offset:true},attr:function(a,b,d,f){if(!a||a.nodeType===3||a.nodeType===8)return w;if(f&&b in c.attrFn)return c(a)[b](d);f=a.nodeType!==1||!c.isXMLDoc(a);var e=d!==w;b=f&&c.props[b]||b;if(a.nodeType===1){var j=$a.test(b);if(b in a&&f&&!j){if(e){b==="type"&&ab.test(a.nodeName)&&a.parentNode&&c.error("type property can't be changed");
-a[b]=d}if(c.nodeName(a,"form")&&a.getAttributeNode(b))return a.getAttributeNode(b).nodeValue;if(b==="tabIndex")return(b=a.getAttributeNode("tabIndex"))&&b.specified?b.value:bb.test(a.nodeName)||cb.test(a.nodeName)&&a.href?0:w;return a[b]}if(!c.support.style&&f&&b==="style"){if(e)a.style.cssText=""+d;return a.style.cssText}e&&a.setAttribute(b,""+d);a=!c.support.hrefNormalized&&f&&j?a.getAttribute(b,2):a.getAttribute(b);return a===null?w:a}return c.style(a,b,d)}});var O=/\.(.*)$/,db=function(a){return a.replace(/[^\w\s\.\|`]/g,
-function(b){return"\\"+b})};c.event={add:function(a,b,d,f){if(!(a.nodeType===3||a.nodeType===8)){if(a.setInterval&&a!==A&&!a.frameElement)a=A;var e,j;if(d.handler){e=d;d=e.handler}if(!d.guid)d.guid=c.guid++;if(j=c.data(a)){var i=j.events=j.events||{},o=j.handle;if(!o)j.handle=o=function(){return typeof c!=="undefined"&&!c.event.triggered?c.event.handle.apply(o.elem,arguments):w};o.elem=a;b=b.split(" ");for(var k,n=0,r;k=b[n++];){j=e?c.extend({},e):{handler:d,data:f};if(k.indexOf(".")>-1){r=k.split(".");
-k=r.shift();j.namespace=r.slice(0).sort().join(".")}else{r=[];j.namespace=""}j.type=k;j.guid=d.guid;var u=i[k],z=c.event.special[k]||{};if(!u){u=i[k]=[];if(!z.setup||z.setup.call(a,f,r,o)===false)if(a.addEventListener)a.addEventListener(k,o,false);else a.attachEvent&&a.attachEvent("on"+k,o)}if(z.add){z.add.call(a,j);if(!j.handler.guid)j.handler.guid=d.guid}u.push(j);c.event.global[k]=true}a=null}}},global:{},remove:function(a,b,d,f){if(!(a.nodeType===3||a.nodeType===8)){var e,j=0,i,o,k,n,r,u,z=c.data(a),
-C=z&&z.events;if(z&&C){if(b&&b.type){d=b.handler;b=b.type}if(!b||typeof b==="string"&&b.charAt(0)==="."){b=b||"";for(e in C)c.event.remove(a,e+b)}else{for(b=b.split(" ");e=b[j++];){n=e;i=e.indexOf(".")<0;o=[];if(!i){o=e.split(".");e=o.shift();k=new RegExp("(^|\\.)"+c.map(o.slice(0).sort(),db).join("\\.(?:.*\\.)?")+"(\\.|$)")}if(r=C[e])if(d){n=c.event.special[e]||{};for(B=f||0;B<r.length;B++){u=r[B];if(d.guid===u.guid){if(i||k.test(u.namespace)){f==null&&r.splice(B--,1);n.remove&&n.remove.call(a,u)}if(f!=
-null)break}}if(r.length===0||f!=null&&r.length===1){if(!n.teardown||n.teardown.call(a,o)===false)Ca(a,e,z.handle);delete C[e]}}else for(var B=0;B<r.length;B++){u=r[B];if(i||k.test(u.namespace)){c.event.remove(a,n,u.handler,B);r.splice(B--,1)}}}if(c.isEmptyObject(C)){if(b=z.handle)b.elem=null;delete z.events;delete z.handle;c.isEmptyObject(z)&&c.removeData(a)}}}}},trigger:function(a,b,d,f){var e=a.type||a;if(!f){a=typeof a==="object"?a[G]?a:c.extend(c.Event(e),a):c.Event(e);if(e.indexOf("!")>=0){a.type=
-e=e.slice(0,-1);a.exclusive=true}if(!d){a.stopPropagation();c.event.global[e]&&c.each(c.cache,function(){this.events&&this.events[e]&&c.event.trigger(a,b,this.handle.elem)})}if(!d||d.nodeType===3||d.nodeType===8)return w;a.result=w;a.target=d;b=c.makeArray(b);b.unshift(a)}a.currentTarget=d;(f=c.data(d,"handle"))&&f.apply(d,b);f=d.parentNode||d.ownerDocument;try{if(!(d&&d.nodeName&&c.noData[d.nodeName.toLowerCase()]))if(d["on"+e]&&d["on"+e].apply(d,b)===false)a.result=false}catch(j){}if(!a.isPropagationStopped()&&
-f)c.event.trigger(a,b,f,true);else if(!a.isDefaultPrevented()){f=a.target;var i,o=c.nodeName(f,"a")&&e==="click",k=c.event.special[e]||{};if((!k._default||k._default.call(d,a)===false)&&!o&&!(f&&f.nodeName&&c.noData[f.nodeName.toLowerCase()])){try{if(f[e]){if(i=f["on"+e])f["on"+e]=null;c.event.triggered=true;f[e]()}}catch(n){}if(i)f["on"+e]=i;c.event.triggered=false}}},handle:function(a){var b,d,f,e;a=arguments[0]=c.event.fix(a||A.event);a.currentTarget=this;b=a.type.indexOf(".")<0&&!a.exclusive;
-if(!b){d=a.type.split(".");a.type=d.shift();f=new RegExp("(^|\\.)"+d.slice(0).sort().join("\\.(?:.*\\.)?")+"(\\.|$)")}e=c.data(this,"events");d=e[a.type];if(e&&d){d=d.slice(0);e=0;for(var j=d.length;e<j;e++){var i=d[e];if(b||f.test(i.namespace)){a.handler=i.handler;a.data=i.data;a.handleObj=i;i=i.handler.apply(this,arguments);if(i!==w){a.result=i;if(i===false){a.preventDefault();a.stopPropagation()}}if(a.isImmediatePropagationStopped())break}}}return a.result},props:"altKey attrChange attrName bubbles button cancelable charCode clientX clientY ctrlKey currentTarget data detail eventPhase fromElement handler keyCode layerX layerY metaKey newValue offsetX offsetY originalTarget pageX pageY prevValue relatedNode relatedTarget screenX screenY shiftKey srcElement target toElement view wheelDelta which".split(" "),
-fix:function(a){if(a[G])return a;var b=a;a=c.Event(b);for(var d=this.props.length,f;d;){f=this.props[--d];a[f]=b[f]}if(!a.target)a.target=a.srcElement||s;if(a.target.nodeType===3)a.target=a.target.parentNode;if(!a.relatedTarget&&a.fromElement)a.relatedTarget=a.fromElement===a.target?a.toElement:a.fromElement;if(a.pageX==null&&a.clientX!=null){b=s.documentElement;d=s.body;a.pageX=a.clientX+(b&&b.scrollLeft||d&&d.scrollLeft||0)-(b&&b.clientLeft||d&&d.clientLeft||0);a.pageY=a.clientY+(b&&b.scrollTop||
-d&&d.scrollTop||0)-(b&&b.clientTop||d&&d.clientTop||0)}if(!a.which&&(a.charCode||a.charCode===0?a.charCode:a.keyCode))a.which=a.charCode||a.keyCode;if(!a.metaKey&&a.ctrlKey)a.metaKey=a.ctrlKey;if(!a.which&&a.button!==w)a.which=a.button&1?1:a.button&2?3:a.button&4?2:0;return a},guid:1E8,proxy:c.proxy,special:{ready:{setup:c.bindReady,teardown:c.noop},live:{add:function(a){c.event.add(this,a.origType,c.extend({},a,{handler:oa}))},remove:function(a){var b=true,d=a.origType.replace(O,"");c.each(c.data(this,
-"events").live||[],function(){if(d===this.origType.replace(O,""))return b=false});b&&c.event.remove(this,a.origType,oa)}},beforeunload:{setup:function(a,b,d){if(this.setInterval)this.onbeforeunload=d;return false},teardown:function(a,b){if(this.onbeforeunload===b)this.onbeforeunload=null}}}};var Ca=s.removeEventListener?function(a,b,d){a.removeEventListener(b,d,false)}:function(a,b,d){a.detachEvent("on"+b,d)};c.Event=function(a){if(!this.preventDefault)return new c.Event(a);if(a&&a.type){this.originalEvent=
-a;this.type=a.type}else this.type=a;this.timeStamp=J();this[G]=true};c.Event.prototype={preventDefault:function(){this.isDefaultPrevented=Z;var a=this.originalEvent;if(a){a.preventDefault&&a.preventDefault();a.returnValue=false}},stopPropagation:function(){this.isPropagationStopped=Z;var a=this.originalEvent;if(a){a.stopPropagation&&a.stopPropagation();a.cancelBubble=true}},stopImmediatePropagation:function(){this.isImmediatePropagationStopped=Z;this.stopPropagation()},isDefaultPrevented:Y,isPropagationStopped:Y,
-isImmediatePropagationStopped:Y};var Da=function(a){var b=a.relatedTarget;try{for(;b&&b!==this;)b=b.parentNode;if(b!==this){a.type=a.data;c.event.handle.apply(this,arguments)}}catch(d){}},Ea=function(a){a.type=a.data;c.event.handle.apply(this,arguments)};c.each({mouseenter:"mouseover",mouseleave:"mouseout"},function(a,b){c.event.special[a]={setup:function(d){c.event.add(this,b,d&&d.selector?Ea:Da,a)},teardown:function(d){c.event.remove(this,b,d&&d.selector?Ea:Da)}}});if(!c.support.submitBubbles)c.event.special.submit=
-{setup:function(){if(this.nodeName.toLowerCase()!=="form"){c.event.add(this,"click.specialSubmit",function(a){var b=a.target,d=b.type;if((d==="submit"||d==="image")&&c(b).closest("form").length)return na("submit",this,arguments)});c.event.add(this,"keypress.specialSubmit",function(a){var b=a.target,d=b.type;if((d==="text"||d==="password")&&c(b).closest("form").length&&a.keyCode===13)return na("submit",this,arguments)})}else return false},teardown:function(){c.event.remove(this,".specialSubmit")}};
-if(!c.support.changeBubbles){var da=/textarea|input|select/i,ea,Fa=function(a){var b=a.type,d=a.value;if(b==="radio"||b==="checkbox")d=a.checked;else if(b==="select-multiple")d=a.selectedIndex>-1?c.map(a.options,function(f){return f.selected}).join("-"):"";else if(a.nodeName.toLowerCase()==="select")d=a.selectedIndex;return d},fa=function(a,b){var d=a.target,f,e;if(!(!da.test(d.nodeName)||d.readOnly)){f=c.data(d,"_change_data");e=Fa(d);if(a.type!=="focusout"||d.type!=="radio")c.data(d,"_change_data",
-e);if(!(f===w||e===f))if(f!=null||e){a.type="change";return c.event.trigger(a,b,d)}}};c.event.special.change={filters:{focusout:fa,click:function(a){var b=a.target,d=b.type;if(d==="radio"||d==="checkbox"||b.nodeName.toLowerCase()==="select")return fa.call(this,a)},keydown:function(a){var b=a.target,d=b.type;if(a.keyCode===13&&b.nodeName.toLowerCase()!=="textarea"||a.keyCode===32&&(d==="checkbox"||d==="radio")||d==="select-multiple")return fa.call(this,a)},beforeactivate:function(a){a=a.target;c.data(a,
-"_change_data",Fa(a))}},setup:function(){if(this.type==="file")return false;for(var a in ea)c.event.add(this,a+".specialChange",ea[a]);return da.test(this.nodeName)},teardown:function(){c.event.remove(this,".specialChange");return da.test(this.nodeName)}};ea=c.event.special.change.filters}s.addEventListener&&c.each({focus:"focusin",blur:"focusout"},function(a,b){function d(f){f=c.event.fix(f);f.type=b;return c.event.handle.call(this,f)}c.event.special[b]={setup:function(){this.addEventListener(a,
-d,true)},teardown:function(){this.removeEventListener(a,d,true)}}});c.each(["bind","one"],function(a,b){c.fn[b]=function(d,f,e){if(typeof d==="object"){for(var j in d)this[b](j,f,d[j],e);return this}if(c.isFunction(f)){e=f;f=w}var i=b==="one"?c.proxy(e,function(k){c(this).unbind(k,i);return e.apply(this,arguments)}):e;if(d==="unload"&&b!=="one")this.one(d,f,e);else{j=0;for(var o=this.length;j<o;j++)c.event.add(this[j],d,i,f)}return this}});c.fn.extend({unbind:function(a,b){if(typeof a==="object"&&
-!a.preventDefault)for(var d in a)this.unbind(d,a[d]);else{d=0;for(var f=this.length;d<f;d++)c.event.remove(this[d],a,b)}return this},delegate:function(a,b,d,f){return this.live(b,d,f,a)},undelegate:function(a,b,d){return arguments.length===0?this.unbind("live"):this.die(b,null,d,a)},trigger:function(a,b){return this.each(function(){c.event.trigger(a,b,this)})},triggerHandler:function(a,b){if(this[0]){a=c.Event(a);a.preventDefault();a.stopPropagation();c.event.trigger(a,b,this[0]);return a.result}},
-toggle:function(a){for(var b=arguments,d=1;d<b.length;)c.proxy(a,b[d++]);return this.click(c.proxy(a,function(f){var e=(c.data(this,"lastToggle"+a.guid)||0)%d;c.data(this,"lastToggle"+a.guid,e+1);f.preventDefault();return b[e].apply(this,arguments)||false}))},hover:function(a,b){return this.mouseenter(a).mouseleave(b||a)}});var Ga={focus:"focusin",blur:"focusout",mouseenter:"mouseover",mouseleave:"mouseout"};c.each(["live","die"],function(a,b){c.fn[b]=function(d,f,e,j){var i,o=0,k,n,r=j||this.selector,
-u=j?this:c(this.context);if(c.isFunction(f)){e=f;f=w}for(d=(d||"").split(" ");(i=d[o++])!=null;){j=O.exec(i);k="";if(j){k=j[0];i=i.replace(O,"")}if(i==="hover")d.push("mouseenter"+k,"mouseleave"+k);else{n=i;if(i==="focus"||i==="blur"){d.push(Ga[i]+k);i+=k}else i=(Ga[i]||i)+k;b==="live"?u.each(function(){c.event.add(this,pa(i,r),{data:f,selector:r,handler:e,origType:i,origHandler:e,preType:n})}):u.unbind(pa(i,r),e)}}return this}});c.each("blur focus focusin focusout load resize scroll unload click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup error".split(" "),
-function(a,b){c.fn[b]=function(d){return d?this.bind(b,d):this.trigger(b)};if(c.attrFn)c.attrFn[b]=true});A.attachEvent&&!A.addEventListener&&A.attachEvent("onunload",function(){for(var a in c.cache)if(c.cache[a].handle)try{c.event.remove(c.cache[a].handle.elem)}catch(b){}});(function(){function a(g){for(var h="",l,m=0;g[m];m++){l=g[m];if(l.nodeType===3||l.nodeType===4)h+=l.nodeValue;else if(l.nodeType!==8)h+=a(l.childNodes)}return h}function b(g,h,l,m,q,p){q=0;for(var v=m.length;q<v;q++){var t=m[q];
-if(t){t=t[g];for(var y=false;t;){if(t.sizcache===l){y=m[t.sizset];break}if(t.nodeType===1&&!p){t.sizcache=l;t.sizset=q}if(t.nodeName.toLowerCase()===h){y=t;break}t=t[g]}m[q]=y}}}function d(g,h,l,m,q,p){q=0;for(var v=m.length;q<v;q++){var t=m[q];if(t){t=t[g];for(var y=false;t;){if(t.sizcache===l){y=m[t.sizset];break}if(t.nodeType===1){if(!p){t.sizcache=l;t.sizset=q}if(typeof h!=="string"){if(t===h){y=true;break}}else if(k.filter(h,[t]).length>0){y=t;break}}t=t[g]}m[q]=y}}}var f=/((?:\((?:\([^()]+\)|[^()]+)+\)|\[(?:\[[^[\]]*\]|['"][^'"]*['"]|[^[\]'"]+)+\]|\\.|[^ >+~,(\[\\]+)+|[>+~])(\s*,\s*)?((?:.|\r|\n)*)/g,
-e=0,j=Object.prototype.toString,i=false,o=true;[0,0].sort(function(){o=false;return 0});var k=function(g,h,l,m){l=l||[];var q=h=h||s;if(h.nodeType!==1&&h.nodeType!==9)return[];if(!g||typeof g!=="string")return l;for(var p=[],v,t,y,S,H=true,M=x(h),I=g;(f.exec(""),v=f.exec(I))!==null;){I=v[3];p.push(v[1]);if(v[2]){S=v[3];break}}if(p.length>1&&r.exec(g))if(p.length===2&&n.relative[p[0]])t=ga(p[0]+p[1],h);else for(t=n.relative[p[0]]?[h]:k(p.shift(),h);p.length;){g=p.shift();if(n.relative[g])g+=p.shift();
-t=ga(g,t)}else{if(!m&&p.length>1&&h.nodeType===9&&!M&&n.match.ID.test(p[0])&&!n.match.ID.test(p[p.length-1])){v=k.find(p.shift(),h,M);h=v.expr?k.filter(v.expr,v.set)[0]:v.set[0]}if(h){v=m?{expr:p.pop(),set:z(m)}:k.find(p.pop(),p.length===1&&(p[0]==="~"||p[0]==="+")&&h.parentNode?h.parentNode:h,M);t=v.expr?k.filter(v.expr,v.set):v.set;if(p.length>0)y=z(t);else H=false;for(;p.length;){var D=p.pop();v=D;if(n.relative[D])v=p.pop();else D="";if(v==null)v=h;n.relative[D](y,v,M)}}else y=[]}y||(y=t);y||k.error(D||
-g);if(j.call(y)==="[object Array]")if(H)if(h&&h.nodeType===1)for(g=0;y[g]!=null;g++){if(y[g]&&(y[g]===true||y[g].nodeType===1&&E(h,y[g])))l.push(t[g])}else for(g=0;y[g]!=null;g++)y[g]&&y[g].nodeType===1&&l.push(t[g]);else l.push.apply(l,y);else z(y,l);if(S){k(S,q,l,m);k.uniqueSort(l)}return l};k.uniqueSort=function(g){if(B){i=o;g.sort(B);if(i)for(var h=1;h<g.length;h++)g[h]===g[h-1]&&g.splice(h--,1)}return g};k.matches=function(g,h){return k(g,null,null,h)};k.find=function(g,h,l){var m,q;if(!g)return[];
-for(var p=0,v=n.order.length;p<v;p++){var t=n.order[p];if(q=n.leftMatch[t].exec(g)){var y=q[1];q.splice(1,1);if(y.substr(y.length-1)!=="\\"){q[1]=(q[1]||"").replace(/\\/g,"");m=n.find[t](q,h,l);if(m!=null){g=g.replace(n.match[t],"");break}}}}m||(m=h.getElementsByTagName("*"));return{set:m,expr:g}};k.filter=function(g,h,l,m){for(var q=g,p=[],v=h,t,y,S=h&&h[0]&&x(h[0]);g&&h.length;){for(var H in n.filter)if((t=n.leftMatch[H].exec(g))!=null&&t[2]){var M=n.filter[H],I,D;D=t[1];y=false;t.splice(1,1);if(D.substr(D.length-
-1)!=="\\"){if(v===p)p=[];if(n.preFilter[H])if(t=n.preFilter[H](t,v,l,p,m,S)){if(t===true)continue}else y=I=true;if(t)for(var U=0;(D=v[U])!=null;U++)if(D){I=M(D,t,U,v);var Ha=m^!!I;if(l&&I!=null)if(Ha)y=true;else v[U]=false;else if(Ha){p.push(D);y=true}}if(I!==w){l||(v=p);g=g.replace(n.match[H],"");if(!y)return[];break}}}if(g===q)if(y==null)k.error(g);else break;q=g}return v};k.error=function(g){throw"Syntax error, unrecognized expression: "+g;};var n=k.selectors={order:["ID","NAME","TAG"],match:{ID:/#((?:[\w\u00c0-\uFFFF-]|\\.)+)/,
-CLASS:/\.((?:[\w\u00c0-\uFFFF-]|\\.)+)/,NAME:/\[name=['"]*((?:[\w\u00c0-\uFFFF-]|\\.)+)['"]*\]/,ATTR:/\[\s*((?:[\w\u00c0-\uFFFF-]|\\.)+)\s*(?:(\S?=)\s*(['"]*)(.*?)\3|)\s*\]/,TAG:/^((?:[\w\u00c0-\uFFFF\*-]|\\.)+)/,CHILD:/:(only|nth|last|first)-child(?:\((even|odd|[\dn+-]*)\))?/,POS:/:(nth|eq|gt|lt|first|last|even|odd)(?:\((\d*)\))?(?=[^-]|$)/,PSEUDO:/:((?:[\w\u00c0-\uFFFF-]|\\.)+)(?:\((['"]?)((?:\([^\)]+\)|[^\(\)]*)+)\2\))?/},leftMatch:{},attrMap:{"class":"className","for":"htmlFor"},attrHandle:{href:function(g){return g.getAttribute("href")}},
-relative:{"+":function(g,h){var l=typeof h==="string",m=l&&!/\W/.test(h);l=l&&!m;if(m)h=h.toLowerCase();m=0;for(var q=g.length,p;m<q;m++)if(p=g[m]){for(;(p=p.previousSibling)&&p.nodeType!==1;);g[m]=l||p&&p.nodeName.toLowerCase()===h?p||false:p===h}l&&k.filter(h,g,true)},">":function(g,h){var l=typeof h==="string";if(l&&!/\W/.test(h)){h=h.toLowerCase();for(var m=0,q=g.length;m<q;m++){var p=g[m];if(p){l=p.parentNode;g[m]=l.nodeName.toLowerCase()===h?l:false}}}else{m=0;for(q=g.length;m<q;m++)if(p=g[m])g[m]=
-l?p.parentNode:p.parentNode===h;l&&k.filter(h,g,true)}},"":function(g,h,l){var m=e++,q=d;if(typeof h==="string"&&!/\W/.test(h)){var p=h=h.toLowerCase();q=b}q("parentNode",h,m,g,p,l)},"~":function(g,h,l){var m=e++,q=d;if(typeof h==="string"&&!/\W/.test(h)){var p=h=h.toLowerCase();q=b}q("previousSibling",h,m,g,p,l)}},find:{ID:function(g,h,l){if(typeof h.getElementById!=="undefined"&&!l)return(g=h.getElementById(g[1]))?[g]:[]},NAME:function(g,h){if(typeof h.getElementsByName!=="undefined"){var l=[];
-h=h.getElementsByName(g[1]);for(var m=0,q=h.length;m<q;m++)h[m].getAttribute("name")===g[1]&&l.push(h[m]);return l.length===0?null:l}},TAG:function(g,h){return h.getElementsByTagName(g[1])}},preFilter:{CLASS:function(g,h,l,m,q,p){g=" "+g[1].replace(/\\/g,"")+" ";if(p)return g;p=0;for(var v;(v=h[p])!=null;p++)if(v)if(q^(v.className&&(" "+v.className+" ").replace(/[\t\n]/g," ").indexOf(g)>=0))l||m.push(v);else if(l)h[p]=false;return false},ID:function(g){return g[1].replace(/\\/g,"")},TAG:function(g){return g[1].toLowerCase()},
-CHILD:function(g){if(g[1]==="nth"){var h=/(-?)(\d*)n((?:\+|-)?\d*)/.exec(g[2]==="even"&&"2n"||g[2]==="odd"&&"2n+1"||!/\D/.test(g[2])&&"0n+"+g[2]||g[2]);g[2]=h[1]+(h[2]||1)-0;g[3]=h[3]-0}g[0]=e++;return g},ATTR:function(g,h,l,m,q,p){h=g[1].replace(/\\/g,"");if(!p&&n.attrMap[h])g[1]=n.attrMap[h];if(g[2]==="~=")g[4]=" "+g[4]+" ";return g},PSEUDO:function(g,h,l,m,q){if(g[1]==="not")if((f.exec(g[3])||"").length>1||/^\w/.test(g[3]))g[3]=k(g[3],null,null,h);else{g=k.filter(g[3],h,l,true^q);l||m.push.apply(m,
-g);return false}else if(n.match.POS.test(g[0])||n.match.CHILD.test(g[0]))return true;return g},POS:function(g){g.unshift(true);return g}},filters:{enabled:function(g){return g.disabled===false&&g.type!=="hidden"},disabled:function(g){return g.disabled===true},checked:function(g){return g.checked===true},selected:function(g){return g.selected===true},parent:function(g){return!!g.firstChild},empty:function(g){return!g.firstChild},has:function(g,h,l){return!!k(l[3],g).length},header:function(g){return/h\d/i.test(g.nodeName)},
-text:function(g){return"text"===g.type},radio:function(g){return"radio"===g.type},checkbox:function(g){return"checkbox"===g.type},file:function(g){return"file"===g.type},password:function(g){return"password"===g.type},submit:function(g){return"submit"===g.type},image:function(g){return"image"===g.type},reset:function(g){return"reset"===g.type},button:function(g){return"button"===g.type||g.nodeName.toLowerCase()==="button"},input:function(g){return/input|select|textarea|button/i.test(g.nodeName)}},
-setFilters:{first:function(g,h){return h===0},last:function(g,h,l,m){return h===m.length-1},even:function(g,h){return h%2===0},odd:function(g,h){return h%2===1},lt:function(g,h,l){return h<l[3]-0},gt:function(g,h,l){return h>l[3]-0},nth:function(g,h,l){return l[3]-0===h},eq:function(g,h,l){return l[3]-0===h}},filter:{PSEUDO:function(g,h,l,m){var q=h[1],p=n.filters[q];if(p)return p(g,l,h,m);else if(q==="contains")return(g.textContent||g.innerText||a([g])||"").indexOf(h[3])>=0;else if(q==="not"){h=
-h[3];l=0;for(m=h.length;l<m;l++)if(h[l]===g)return false;return true}else k.error("Syntax error, unrecognized expression: "+q)},CHILD:function(g,h){var l=h[1],m=g;switch(l){case "only":case "first":for(;m=m.previousSibling;)if(m.nodeType===1)return false;if(l==="first")return true;m=g;case "last":for(;m=m.nextSibling;)if(m.nodeType===1)return false;return true;case "nth":l=h[2];var q=h[3];if(l===1&&q===0)return true;h=h[0];var p=g.parentNode;if(p&&(p.sizcache!==h||!g.nodeIndex)){var v=0;for(m=p.firstChild;m;m=
-m.nextSibling)if(m.nodeType===1)m.nodeIndex=++v;p.sizcache=h}g=g.nodeIndex-q;return l===0?g===0:g%l===0&&g/l>=0}},ID:function(g,h){return g.nodeType===1&&g.getAttribute("id")===h},TAG:function(g,h){return h==="*"&&g.nodeType===1||g.nodeName.toLowerCase()===h},CLASS:function(g,h){return(" "+(g.className||g.getAttribute("class"))+" ").indexOf(h)>-1},ATTR:function(g,h){var l=h[1];g=n.attrHandle[l]?n.attrHandle[l](g):g[l]!=null?g[l]:g.getAttribute(l);l=g+"";var m=h[2];h=h[4];return g==null?m==="!=":m===
-"="?l===h:m==="*="?l.indexOf(h)>=0:m==="~="?(" "+l+" ").indexOf(h)>=0:!h?l&&g!==false:m==="!="?l!==h:m==="^="?l.indexOf(h)===0:m==="$="?l.substr(l.length-h.length)===h:m==="|="?l===h||l.substr(0,h.length+1)===h+"-":false},POS:function(g,h,l,m){var q=n.setFilters[h[2]];if(q)return q(g,l,h,m)}}},r=n.match.POS;for(var u in n.match){n.match[u]=new RegExp(n.match[u].source+/(?![^\[]*\])(?![^\(]*\))/.source);n.leftMatch[u]=new RegExp(/(^(?:.|\r|\n)*?)/.source+n.match[u].source.replace(/\\(\d+)/g,function(g,
-h){return"\\"+(h-0+1)}))}var z=function(g,h){g=Array.prototype.slice.call(g,0);if(h){h.push.apply(h,g);return h}return g};try{Array.prototype.slice.call(s.documentElement.childNodes,0)}catch(C){z=function(g,h){h=h||[];if(j.call(g)==="[object Array]")Array.prototype.push.apply(h,g);else if(typeof g.length==="number")for(var l=0,m=g.length;l<m;l++)h.push(g[l]);else for(l=0;g[l];l++)h.push(g[l]);return h}}var B;if(s.documentElement.compareDocumentPosition)B=function(g,h){if(!g.compareDocumentPosition||
-!h.compareDocumentPosition){if(g==h)i=true;return g.compareDocumentPosition?-1:1}g=g.compareDocumentPosition(h)&4?-1:g===h?0:1;if(g===0)i=true;return g};else if("sourceIndex"in s.documentElement)B=function(g,h){if(!g.sourceIndex||!h.sourceIndex){if(g==h)i=true;return g.sourceIndex?-1:1}g=g.sourceIndex-h.sourceIndex;if(g===0)i=true;return g};else if(s.createRange)B=function(g,h){if(!g.ownerDocument||!h.ownerDocument){if(g==h)i=true;return g.ownerDocument?-1:1}var l=g.ownerDocument.createRange(),m=
-h.ownerDocument.createRange();l.setStart(g,0);l.setEnd(g,0);m.setStart(h,0);m.setEnd(h,0);g=l.compareBoundaryPoints(Range.START_TO_END,m);if(g===0)i=true;return g};(function(){var g=s.createElement("div"),h="script"+(new Date).getTime();g.innerHTML="<a name='"+h+"'/>";var l=s.documentElement;l.insertBefore(g,l.firstChild);if(s.getElementById(h)){n.find.ID=function(m,q,p){if(typeof q.getElementById!=="undefined"&&!p)return(q=q.getElementById(m[1]))?q.id===m[1]||typeof q.getAttributeNode!=="undefined"&&
-q.getAttributeNode("id").nodeValue===m[1]?[q]:w:[]};n.filter.ID=function(m,q){var p=typeof m.getAttributeNode!=="undefined"&&m.getAttributeNode("id");return m.nodeType===1&&p&&p.nodeValue===q}}l.removeChild(g);l=g=null})();(function(){var g=s.createElement("div");g.appendChild(s.createComment(""));if(g.getElementsByTagName("*").length>0)n.find.TAG=function(h,l){l=l.getElementsByTagName(h[1]);if(h[1]==="*"){h=[];for(var m=0;l[m];m++)l[m].nodeType===1&&h.push(l[m]);l=h}return l};g.innerHTML="<a href='#'></a>";
-if(g.firstChild&&typeof g.firstChild.getAttribute!=="undefined"&&g.firstChild.getAttribute("href")!=="#")n.attrHandle.href=function(h){return h.getAttribute("href",2)};g=null})();s.querySelectorAll&&function(){var g=k,h=s.createElement("div");h.innerHTML="<p class='TEST'></p>";if(!(h.querySelectorAll&&h.querySelectorAll(".TEST").length===0)){k=function(m,q,p,v){q=q||s;if(!v&&q.nodeType===9&&!x(q))try{return z(q.querySelectorAll(m),p)}catch(t){}return g(m,q,p,v)};for(var l in g)k[l]=g[l];h=null}}();
-(function(){var g=s.createElement("div");g.innerHTML="<div class='test e'></div><div class='test'></div>";if(!(!g.getElementsByClassName||g.getElementsByClassName("e").length===0)){g.lastChild.className="e";if(g.getElementsByClassName("e").length!==1){n.order.splice(1,0,"CLASS");n.find.CLASS=function(h,l,m){if(typeof l.getElementsByClassName!=="undefined"&&!m)return l.getElementsByClassName(h[1])};g=null}}})();var E=s.compareDocumentPosition?function(g,h){return!!(g.compareDocumentPosition(h)&16)}:
-function(g,h){return g!==h&&(g.contains?g.contains(h):true)},x=function(g){return(g=(g?g.ownerDocument||g:0).documentElement)?g.nodeName!=="HTML":false},ga=function(g,h){var l=[],m="",q;for(h=h.nodeType?[h]:h;q=n.match.PSEUDO.exec(g);){m+=q[0];g=g.replace(n.match.PSEUDO,"")}g=n.relative[g]?g+"*":g;q=0;for(var p=h.length;q<p;q++)k(g,h[q],l);return k.filter(m,l)};c.find=k;c.expr=k.selectors;c.expr[":"]=c.expr.filters;c.unique=k.uniqueSort;c.text=a;c.isXMLDoc=x;c.contains=E})();var eb=/Until$/,fb=/^(?:parents|prevUntil|prevAll)/,
-gb=/,/;R=Array.prototype.slice;var Ia=function(a,b,d){if(c.isFunction(b))return c.grep(a,function(e,j){return!!b.call(e,j,e)===d});else if(b.nodeType)return c.grep(a,function(e){return e===b===d});else if(typeof b==="string"){var f=c.grep(a,function(e){return e.nodeType===1});if(Ua.test(b))return c.filter(b,f,!d);else b=c.filter(b,f)}return c.grep(a,function(e){return c.inArray(e,b)>=0===d})};c.fn.extend({find:function(a){for(var b=this.pushStack("","find",a),d=0,f=0,e=this.length;f<e;f++){d=b.length;
-c.find(a,this[f],b);if(f>0)for(var j=d;j<b.length;j++)for(var i=0;i<d;i++)if(b[i]===b[j]){b.splice(j--,1);break}}return b},has:function(a){var b=c(a);return this.filter(function(){for(var d=0,f=b.length;d<f;d++)if(c.contains(this,b[d]))return true})},not:function(a){return this.pushStack(Ia(this,a,false),"not",a)},filter:function(a){return this.pushStack(Ia(this,a,true),"filter",a)},is:function(a){return!!a&&c.filter(a,this).length>0},closest:function(a,b){if(c.isArray(a)){var d=[],f=this[0],e,j=
-{},i;if(f&&a.length){e=0;for(var o=a.length;e<o;e++){i=a[e];j[i]||(j[i]=c.expr.match.POS.test(i)?c(i,b||this.context):i)}for(;f&&f.ownerDocument&&f!==b;){for(i in j){e=j[i];if(e.jquery?e.index(f)>-1:c(f).is(e)){d.push({selector:i,elem:f});delete j[i]}}f=f.parentNode}}return d}var k=c.expr.match.POS.test(a)?c(a,b||this.context):null;return this.map(function(n,r){for(;r&&r.ownerDocument&&r!==b;){if(k?k.index(r)>-1:c(r).is(a))return r;r=r.parentNode}return null})},index:function(a){if(!a||typeof a===
-"string")return c.inArray(this[0],a?c(a):this.parent().children());return c.inArray(a.jquery?a[0]:a,this)},add:function(a,b){a=typeof a==="string"?c(a,b||this.context):c.makeArray(a);b=c.merge(this.get(),a);return this.pushStack(qa(a[0])||qa(b[0])?b:c.unique(b))},andSelf:function(){return this.add(this.prevObject)}});c.each({parent:function(a){return(a=a.parentNode)&&a.nodeType!==11?a:null},parents:function(a){return c.dir(a,"parentNode")},parentsUntil:function(a,b,d){return c.dir(a,"parentNode",
-d)},next:function(a){return c.nth(a,2,"nextSibling")},prev:function(a){return c.nth(a,2,"previousSibling")},nextAll:function(a){return c.dir(a,"nextSibling")},prevAll:function(a){return c.dir(a,"previousSibling")},nextUntil:function(a,b,d){return c.dir(a,"nextSibling",d)},prevUntil:function(a,b,d){return c.dir(a,"previousSibling",d)},siblings:function(a){return c.sibling(a.parentNode.firstChild,a)},children:function(a){return c.sibling(a.firstChild)},contents:function(a){return c.nodeName(a,"iframe")?
-a.contentDocument||a.contentWindow.document:c.makeArray(a.childNodes)}},function(a,b){c.fn[a]=function(d,f){var e=c.map(this,b,d);eb.test(a)||(f=d);if(f&&typeof f==="string")e=c.filter(f,e);e=this.length>1?c.unique(e):e;if((this.length>1||gb.test(f))&&fb.test(a))e=e.reverse();return this.pushStack(e,a,R.call(arguments).join(","))}});c.extend({filter:function(a,b,d){if(d)a=":not("+a+")";return c.find.matches(a,b)},dir:function(a,b,d){var f=[];for(a=a[b];a&&a.nodeType!==9&&(d===w||a.nodeType!==1||!c(a).is(d));){a.nodeType===
-1&&f.push(a);a=a[b]}return f},nth:function(a,b,d){b=b||1;for(var f=0;a;a=a[d])if(a.nodeType===1&&++f===b)break;return a},sibling:function(a,b){for(var d=[];a;a=a.nextSibling)a.nodeType===1&&a!==b&&d.push(a);return d}});var Ja=/ jQuery\d+="(?:\d+|null)"/g,V=/^\s+/,Ka=/(<([\w:]+)[^>]*?)\/>/g,hb=/^(?:area|br|col|embed|hr|img|input|link|meta|param)$/i,La=/<([\w:]+)/,ib=/<tbody/i,jb=/<|&#?\w+;/,ta=/<script|<object|<embed|<option|<style/i,ua=/checked\s*(?:[^=]|=\s*.checked.)/i,Ma=function(a,b,d){return hb.test(d)?
-a:b+"></"+d+">"},F={option:[1,"<select multiple='multiple'>","</select>"],legend:[1,"<fieldset>","</fieldset>"],thead:[1,"<table>","</table>"],tr:[2,"<table><tbody>","</tbody></table>"],td:[3,"<table><tbody><tr>","</tr></tbody></table>"],col:[2,"<table><tbody></tbody><colgroup>","</colgroup></table>"],area:[1,"<map>","</map>"],_default:[0,"",""]};F.optgroup=F.option;F.tbody=F.tfoot=F.colgroup=F.caption=F.thead;F.th=F.td;if(!c.support.htmlSerialize)F._default=[1,"div<div>","</div>"];c.fn.extend({text:function(a){if(c.isFunction(a))return this.each(function(b){var d=
-c(this);d.text(a.call(this,b,d.text()))});if(typeof a!=="object"&&a!==w)return this.empty().append((this[0]&&this[0].ownerDocument||s).createTextNode(a));return c.text(this)},wrapAll:function(a){if(c.isFunction(a))return this.each(function(d){c(this).wrapAll(a.call(this,d))});if(this[0]){var b=c(a,this[0].ownerDocument).eq(0).clone(true);this[0].parentNode&&b.insertBefore(this[0]);b.map(function(){for(var d=this;d.firstChild&&d.firstChild.nodeType===1;)d=d.firstChild;return d}).append(this)}return this},
-wrapInner:function(a){if(c.isFunction(a))return this.each(function(b){c(this).wrapInner(a.call(this,b))});return this.each(function(){var b=c(this),d=b.contents();d.length?d.wrapAll(a):b.append(a)})},wrap:function(a){return this.each(function(){c(this).wrapAll(a)})},unwrap:function(){return this.parent().each(function(){c.nodeName(this,"body")||c(this).replaceWith(this.childNodes)}).end()},append:function(){return this.domManip(arguments,true,function(a){this.nodeType===1&&this.appendChild(a)})},
-prepend:function(){return this.domManip(arguments,true,function(a){this.nodeType===1&&this.insertBefore(a,this.firstChild)})},before:function(){if(this[0]&&this[0].parentNode)return this.domManip(arguments,false,function(b){this.parentNode.insertBefore(b,this)});else if(arguments.length){var a=c(arguments[0]);a.push.apply(a,this.toArray());return this.pushStack(a,"before",arguments)}},after:function(){if(this[0]&&this[0].parentNode)return this.domManip(arguments,false,function(b){this.parentNode.insertBefore(b,
-this.nextSibling)});else if(arguments.length){var a=this.pushStack(this,"after",arguments);a.push.apply(a,c(arguments[0]).toArray());return a}},remove:function(a,b){for(var d=0,f;(f=this[d])!=null;d++)if(!a||c.filter(a,[f]).length){if(!b&&f.nodeType===1){c.cleanData(f.getElementsByTagName("*"));c.cleanData([f])}f.parentNode&&f.parentNode.removeChild(f)}return this},empty:function(){for(var a=0,b;(b=this[a])!=null;a++)for(b.nodeType===1&&c.cleanData(b.getElementsByTagName("*"));b.firstChild;)b.removeChild(b.firstChild);
-return this},clone:function(a){var b=this.map(function(){if(!c.support.noCloneEvent&&!c.isXMLDoc(this)){var d=this.outerHTML,f=this.ownerDocument;if(!d){d=f.createElement("div");d.appendChild(this.cloneNode(true));d=d.innerHTML}return c.clean([d.replace(Ja,"").replace(/=([^="'>\s]+\/)>/g,'="$1">').replace(V,"")],f)[0]}else return this.cloneNode(true)});if(a===true){ra(this,b);ra(this.find("*"),b.find("*"))}return b},html:function(a){if(a===w)return this[0]&&this[0].nodeType===1?this[0].innerHTML.replace(Ja,
-""):null;else if(typeof a==="string"&&!ta.test(a)&&(c.support.leadingWhitespace||!V.test(a))&&!F[(La.exec(a)||["",""])[1].toLowerCase()]){a=a.replace(Ka,Ma);try{for(var b=0,d=this.length;b<d;b++)if(this[b].nodeType===1){c.cleanData(this[b].getElementsByTagName("*"));this[b].innerHTML=a}}catch(f){this.empty().append(a)}}else c.isFunction(a)?this.each(function(e){var j=c(this),i=j.html();j.empty().append(function(){return a.call(this,e,i)})}):this.empty().append(a);return this},replaceWith:function(a){if(this[0]&&
-this[0].parentNode){if(c.isFunction(a))return this.each(function(b){var d=c(this),f=d.html();d.replaceWith(a.call(this,b,f))});if(typeof a!=="string")a=c(a).detach();return this.each(function(){var b=this.nextSibling,d=this.parentNode;c(this).remove();b?c(b).before(a):c(d).append(a)})}else return this.pushStack(c(c.isFunction(a)?a():a),"replaceWith",a)},detach:function(a){return this.remove(a,true)},domManip:function(a,b,d){function f(u){return c.nodeName(u,"table")?u.getElementsByTagName("tbody")[0]||
-u.appendChild(u.ownerDocument.createElement("tbody")):u}var e,j,i=a[0],o=[],k;if(!c.support.checkClone&&arguments.length===3&&typeof i==="string"&&ua.test(i))return this.each(function(){c(this).domManip(a,b,d,true)});if(c.isFunction(i))return this.each(function(u){var z=c(this);a[0]=i.call(this,u,b?z.html():w);z.domManip(a,b,d)});if(this[0]){e=i&&i.parentNode;e=c.support.parentNode&&e&&e.nodeType===11&&e.childNodes.length===this.length?{fragment:e}:sa(a,this,o);k=e.fragment;if(j=k.childNodes.length===
-1?(k=k.firstChild):k.firstChild){b=b&&c.nodeName(j,"tr");for(var n=0,r=this.length;n<r;n++)d.call(b?f(this[n],j):this[n],n>0||e.cacheable||this.length>1?k.cloneNode(true):k)}o.length&&c.each(o,Qa)}return this}});c.fragments={};c.each({appendTo:"append",prependTo:"prepend",insertBefore:"before",insertAfter:"after",replaceAll:"replaceWith"},function(a,b){c.fn[a]=function(d){var f=[];d=c(d);var e=this.length===1&&this[0].parentNode;if(e&&e.nodeType===11&&e.childNodes.length===1&&d.length===1){d[b](this[0]);
-return this}else{e=0;for(var j=d.length;e<j;e++){var i=(e>0?this.clone(true):this).get();c.fn[b].apply(c(d[e]),i);f=f.concat(i)}return this.pushStack(f,a,d.selector)}}});c.extend({clean:function(a,b,d,f){b=b||s;if(typeof b.createElement==="undefined")b=b.ownerDocument||b[0]&&b[0].ownerDocument||s;for(var e=[],j=0,i;(i=a[j])!=null;j++){if(typeof i==="number")i+="";if(i){if(typeof i==="string"&&!jb.test(i))i=b.createTextNode(i);else if(typeof i==="string"){i=i.replace(Ka,Ma);var o=(La.exec(i)||["",
-""])[1].toLowerCase(),k=F[o]||F._default,n=k[0],r=b.createElement("div");for(r.innerHTML=k[1]+i+k[2];n--;)r=r.lastChild;if(!c.support.tbody){n=ib.test(i);o=o==="table"&&!n?r.firstChild&&r.firstChild.childNodes:k[1]==="<table>"&&!n?r.childNodes:[];for(k=o.length-1;k>=0;--k)c.nodeName(o[k],"tbody")&&!o[k].childNodes.length&&o[k].parentNode.removeChild(o[k])}!c.support.leadingWhitespace&&V.test(i)&&r.insertBefore(b.createTextNode(V.exec(i)[0]),r.firstChild);i=r.childNodes}if(i.nodeType)e.push(i);else e=
-c.merge(e,i)}}if(d)for(j=0;e[j];j++)if(f&&c.nodeName(e[j],"script")&&(!e[j].type||e[j].type.toLowerCase()==="text/javascript"))f.push(e[j].parentNode?e[j].parentNode.removeChild(e[j]):e[j]);else{e[j].nodeType===1&&e.splice.apply(e,[j+1,0].concat(c.makeArray(e[j].getElementsByTagName("script"))));d.appendChild(e[j])}return e},cleanData:function(a){for(var b,d,f=c.cache,e=c.event.special,j=c.support.deleteExpando,i=0,o;(o=a[i])!=null;i++)if(d=o[c.expando]){b=f[d];if(b.events)for(var k in b.events)e[k]?
-c.event.remove(o,k):Ca(o,k,b.handle);if(j)delete o[c.expando];else o.removeAttribute&&o.removeAttribute(c.expando);delete f[d]}}});var kb=/z-?index|font-?weight|opacity|zoom|line-?height/i,Na=/alpha\([^)]*\)/,Oa=/opacity=([^)]*)/,ha=/float/i,ia=/-([a-z])/ig,lb=/([A-Z])/g,mb=/^-?\d+(?:px)?$/i,nb=/^-?\d/,ob={position:"absolute",visibility:"hidden",display:"block"},pb=["Left","Right"],qb=["Top","Bottom"],rb=s.defaultView&&s.defaultView.getComputedStyle,Pa=c.support.cssFloat?"cssFloat":"styleFloat",ja=
-function(a,b){return b.toUpperCase()};c.fn.css=function(a,b){return X(this,a,b,true,function(d,f,e){if(e===w)return c.curCSS(d,f);if(typeof e==="number"&&!kb.test(f))e+="px";c.style(d,f,e)})};c.extend({style:function(a,b,d){if(!a||a.nodeType===3||a.nodeType===8)return w;if((b==="width"||b==="height")&&parseFloat(d)<0)d=w;var f=a.style||a,e=d!==w;if(!c.support.opacity&&b==="opacity"){if(e){f.zoom=1;b=parseInt(d,10)+""==="NaN"?"":"alpha(opacity="+d*100+")";a=f.filter||c.curCSS(a,"filter")||"";f.filter=
-Na.test(a)?a.replace(Na,b):b}return f.filter&&f.filter.indexOf("opacity=")>=0?parseFloat(Oa.exec(f.filter)[1])/100+"":""}if(ha.test(b))b=Pa;b=b.replace(ia,ja);if(e)f[b]=d;return f[b]},css:function(a,b,d,f){if(b==="width"||b==="height"){var e,j=b==="width"?pb:qb;function i(){e=b==="width"?a.offsetWidth:a.offsetHeight;f!=="border"&&c.each(j,function(){f||(e-=parseFloat(c.curCSS(a,"padding"+this,true))||0);if(f==="margin")e+=parseFloat(c.curCSS(a,"margin"+this,true))||0;else e-=parseFloat(c.curCSS(a,
-"border"+this+"Width",true))||0})}a.offsetWidth!==0?i():c.swap(a,ob,i);return Math.max(0,Math.round(e))}return c.curCSS(a,b,d)},curCSS:function(a,b,d){var f,e=a.style;if(!c.support.opacity&&b==="opacity"&&a.currentStyle){f=Oa.test(a.currentStyle.filter||"")?parseFloat(RegExp.$1)/100+"":"";return f===""?"1":f}if(ha.test(b))b=Pa;if(!d&&e&&e[b])f=e[b];else if(rb){if(ha.test(b))b="float";b=b.replace(lb,"-$1").toLowerCase();e=a.ownerDocument.defaultView;if(!e)return null;if(a=e.getComputedStyle(a,null))f=
-a.getPropertyValue(b);if(b==="opacity"&&f==="")f="1"}else if(a.currentStyle){d=b.replace(ia,ja);f=a.currentStyle[b]||a.currentStyle[d];if(!mb.test(f)&&nb.test(f)){b=e.left;var j=a.runtimeStyle.left;a.runtimeStyle.left=a.currentStyle.left;e.left=d==="fontSize"?"1em":f||0;f=e.pixelLeft+"px";e.left=b;a.runtimeStyle.left=j}}return f},swap:function(a,b,d){var f={};for(var e in b){f[e]=a.style[e];a.style[e]=b[e]}d.call(a);for(e in b)a.style[e]=f[e]}});if(c.expr&&c.expr.filters){c.expr.filters.hidden=function(a){var b=
-a.offsetWidth,d=a.offsetHeight,f=a.nodeName.toLowerCase()==="tr";return b===0&&d===0&&!f?true:b>0&&d>0&&!f?false:c.curCSS(a,"display")==="none"};c.expr.filters.visible=function(a){return!c.expr.filters.hidden(a)}}var sb=J(),tb=/<script(.|\s)*?\/script>/gi,ub=/select|textarea/i,vb=/color|date|datetime|email|hidden|month|number|password|range|search|tel|text|time|url|week/i,N=/=\?(&|$)/,ka=/\?/,wb=/(\?|&)_=.*?(&|$)/,xb=/^(\w+:)?\/\/([^\/?#]+)/,yb=/%20/g,zb=c.fn.load;c.fn.extend({load:function(a,b,d){if(typeof a!==
-"string")return zb.call(this,a);else if(!this.length)return this;var f=a.indexOf(" ");if(f>=0){var e=a.slice(f,a.length);a=a.slice(0,f)}f="GET";if(b)if(c.isFunction(b)){d=b;b=null}else if(typeof b==="object"){b=c.param(b,c.ajaxSettings.traditional);f="POST"}var j=this;c.ajax({url:a,type:f,dataType:"html",data:b,complete:function(i,o){if(o==="success"||o==="notmodified")j.html(e?c("<div />").append(i.responseText.replace(tb,"")).find(e):i.responseText);d&&j.each(d,[i.responseText,o,i])}});return this},
-serialize:function(){return c.param(this.serializeArray())},serializeArray:function(){return this.map(function(){return this.elements?c.makeArray(this.elements):this}).filter(function(){return this.name&&!this.disabled&&(this.checked||ub.test(this.nodeName)||vb.test(this.type))}).map(function(a,b){a=c(this).val();return a==null?null:c.isArray(a)?c.map(a,function(d){return{name:b.name,value:d}}):{name:b.name,value:a}}).get()}});c.each("ajaxStart ajaxStop ajaxComplete ajaxError ajaxSuccess ajaxSend".split(" "),
-function(a,b){c.fn[b]=function(d){return this.bind(b,d)}});c.extend({get:function(a,b,d,f){if(c.isFunction(b)){f=f||d;d=b;b=null}return c.ajax({type:"GET",url:a,data:b,success:d,dataType:f})},getScript:function(a,b){return c.get(a,null,b,"script")},getJSON:function(a,b,d){return c.get(a,b,d,"json")},post:function(a,b,d,f){if(c.isFunction(b)){f=f||d;d=b;b={}}return c.ajax({type:"POST",url:a,data:b,success:d,dataType:f})},ajaxSetup:function(a){c.extend(c.ajaxSettings,a)},ajaxSettings:{url:location.href,
-global:true,type:"GET",contentType:"application/x-www-form-urlencoded",processData:true,async:true,xhr:A.XMLHttpRequest&&(A.location.protocol!=="file:"||!A.ActiveXObject)?function(){return new A.XMLHttpRequest}:function(){try{return new A.ActiveXObject("Microsoft.XMLHTTP")}catch(a){}},accepts:{xml:"application/xml, text/xml",html:"text/html",script:"text/javascript, application/javascript",json:"application/json, text/javascript",text:"text/plain",_default:"*/*"}},lastModified:{},etag:{},ajax:function(a){function b(){e.success&&
-e.success.call(k,o,i,x);e.global&&f("ajaxSuccess",[x,e])}function d(){e.complete&&e.complete.call(k,x,i);e.global&&f("ajaxComplete",[x,e]);e.global&&!--c.active&&c.event.trigger("ajaxStop")}function f(q,p){(e.context?c(e.context):c.event).trigger(q,p)}var e=c.extend(true,{},c.ajaxSettings,a),j,i,o,k=a&&a.context||e,n=e.type.toUpperCase();if(e.data&&e.processData&&typeof e.data!=="string")e.data=c.param(e.data,e.traditional);if(e.dataType==="jsonp"){if(n==="GET")N.test(e.url)||(e.url+=(ka.test(e.url)?
-"&":"?")+(e.jsonp||"callback")+"=?");else if(!e.data||!N.test(e.data))e.data=(e.data?e.data+"&":"")+(e.jsonp||"callback")+"=?";e.dataType="json"}if(e.dataType==="json"&&(e.data&&N.test(e.data)||N.test(e.url))){j=e.jsonpCallback||"jsonp"+sb++;if(e.data)e.data=(e.data+"").replace(N,"="+j+"$1");e.url=e.url.replace(N,"="+j+"$1");e.dataType="script";A[j]=A[j]||function(q){o=q;b();d();A[j]=w;try{delete A[j]}catch(p){}z&&z.removeChild(C)}}if(e.dataType==="script"&&e.cache===null)e.cache=false;if(e.cache===
-false&&n==="GET"){var r=J(),u=e.url.replace(wb,"$1_="+r+"$2");e.url=u+(u===e.url?(ka.test(e.url)?"&":"?")+"_="+r:"")}if(e.data&&n==="GET")e.url+=(ka.test(e.url)?"&":"?")+e.data;e.global&&!c.active++&&c.event.trigger("ajaxStart");r=(r=xb.exec(e.url))&&(r[1]&&r[1]!==location.protocol||r[2]!==location.host);if(e.dataType==="script"&&n==="GET"&&r){var z=s.getElementsByTagName("head")[0]||s.documentElement,C=s.createElement("script");C.src=e.url;if(e.scriptCharset)C.charset=e.scriptCharset;if(!j){var B=
-false;C.onload=C.onreadystatechange=function(){if(!B&&(!this.readyState||this.readyState==="loaded"||this.readyState==="complete")){B=true;b();d();C.onload=C.onreadystatechange=null;z&&C.parentNode&&z.removeChild(C)}}}z.insertBefore(C,z.firstChild);return w}var E=false,x=e.xhr();if(x){e.username?x.open(n,e.url,e.async,e.username,e.password):x.open(n,e.url,e.async);try{if(e.data||a&&a.contentType)x.setRequestHeader("Content-Type",e.contentType);if(e.ifModified){c.lastModified[e.url]&&x.setRequestHeader("If-Modified-Since",
-c.lastModified[e.url]);c.etag[e.url]&&x.setRequestHeader("If-None-Match",c.etag[e.url])}r||x.setRequestHeader("X-Requested-With","XMLHttpRequest");x.setRequestHeader("Accept",e.dataType&&e.accepts[e.dataType]?e.accepts[e.dataType]+", */*":e.accepts._default)}catch(ga){}if(e.beforeSend&&e.beforeSend.call(k,x,e)===false){e.global&&!--c.active&&c.event.trigger("ajaxStop");x.abort();return false}e.global&&f("ajaxSend",[x,e]);var g=x.onreadystatechange=function(q){if(!x||x.readyState===0||q==="abort"){E||
-d();E=true;if(x)x.onreadystatechange=c.noop}else if(!E&&x&&(x.readyState===4||q==="timeout")){E=true;x.onreadystatechange=c.noop;i=q==="timeout"?"timeout":!c.httpSuccess(x)?"error":e.ifModified&&c.httpNotModified(x,e.url)?"notmodified":"success";var p;if(i==="success")try{o=c.httpData(x,e.dataType,e)}catch(v){i="parsererror";p=v}if(i==="success"||i==="notmodified")j||b();else c.handleError(e,x,i,p);d();q==="timeout"&&x.abort();if(e.async)x=null}};try{var h=x.abort;x.abort=function(){x&&h.call(x);
-g("abort")}}catch(l){}e.async&&e.timeout>0&&setTimeout(function(){x&&!E&&g("timeout")},e.timeout);try{x.send(n==="POST"||n==="PUT"||n==="DELETE"?e.data:null)}catch(m){c.handleError(e,x,null,m);d()}e.async||g();return x}},handleError:function(a,b,d,f){if(a.error)a.error.call(a.context||a,b,d,f);if(a.global)(a.context?c(a.context):c.event).trigger("ajaxError",[b,a,f])},active:0,httpSuccess:function(a){try{return!a.status&&location.protocol==="file:"||a.status>=200&&a.status<300||a.status===304||a.status===
-1223||a.status===0}catch(b){}return false},httpNotModified:function(a,b){var d=a.getResponseHeader("Last-Modified"),f=a.getResponseHeader("Etag");if(d)c.lastModified[b]=d;if(f)c.etag[b]=f;return a.status===304||a.status===0},httpData:function(a,b,d){var f=a.getResponseHeader("content-type")||"",e=b==="xml"||!b&&f.indexOf("xml")>=0;a=e?a.responseXML:a.responseText;e&&a.documentElement.nodeName==="parsererror"&&c.error("parsererror");if(d&&d.dataFilter)a=d.dataFilter(a,b);if(typeof a==="string")if(b===
-"json"||!b&&f.indexOf("json")>=0)a=c.parseJSON(a);else if(b==="script"||!b&&f.indexOf("javascript")>=0)c.globalEval(a);return a},param:function(a,b){function d(i,o){if(c.isArray(o))c.each(o,function(k,n){b||/\[\]$/.test(i)?f(i,n):d(i+"["+(typeof n==="object"||c.isArray(n)?k:"")+"]",n)});else!b&&o!=null&&typeof o==="object"?c.each(o,function(k,n){d(i+"["+k+"]",n)}):f(i,o)}function f(i,o){o=c.isFunction(o)?o():o;e[e.length]=encodeURIComponent(i)+"="+encodeURIComponent(o)}var e=[];if(b===w)b=c.ajaxSettings.traditional;
-if(c.isArray(a)||a.jquery)c.each(a,function(){f(this.name,this.value)});else for(var j in a)d(j,a[j]);return e.join("&").replace(yb,"+")}});var la={},Ab=/toggle|show|hide/,Bb=/^([+-]=)?([\d+-.]+)(.*)$/,W,va=[["height","marginTop","marginBottom","paddingTop","paddingBottom"],["width","marginLeft","marginRight","paddingLeft","paddingRight"],["opacity"]];c.fn.extend({show:function(a,b){if(a||a===0)return this.animate(K("show",3),a,b);else{a=0;for(b=this.length;a<b;a++){var d=c.data(this[a],"olddisplay");
-this[a].style.display=d||"";if(c.css(this[a],"display")==="none"){d=this[a].nodeName;var f;if(la[d])f=la[d];else{var e=c("<"+d+" />").appendTo("body");f=e.css("display");if(f==="none")f="block";e.remove();la[d]=f}c.data(this[a],"olddisplay",f)}}a=0;for(b=this.length;a<b;a++)this[a].style.display=c.data(this[a],"olddisplay")||"";return this}},hide:function(a,b){if(a||a===0)return this.animate(K("hide",3),a,b);else{a=0;for(b=this.length;a<b;a++){var d=c.data(this[a],"olddisplay");!d&&d!=="none"&&c.data(this[a],
-"olddisplay",c.css(this[a],"display"))}a=0;for(b=this.length;a<b;a++)this[a].style.display="none";return this}},_toggle:c.fn.toggle,toggle:function(a,b){var d=typeof a==="boolean";if(c.isFunction(a)&&c.isFunction(b))this._toggle.apply(this,arguments);else a==null||d?this.each(function(){var f=d?a:c(this).is(":hidden");c(this)[f?"show":"hide"]()}):this.animate(K("toggle",3),a,b);return this},fadeTo:function(a,b,d){return this.filter(":hidden").css("opacity",0).show().end().animate({opacity:b},a,d)},
-animate:function(a,b,d,f){var e=c.speed(b,d,f);if(c.isEmptyObject(a))return this.each(e.complete);return this[e.queue===false?"each":"queue"](function(){var j=c.extend({},e),i,o=this.nodeType===1&&c(this).is(":hidden"),k=this;for(i in a){var n=i.replace(ia,ja);if(i!==n){a[n]=a[i];delete a[i];i=n}if(a[i]==="hide"&&o||a[i]==="show"&&!o)return j.complete.call(this);if((i==="height"||i==="width")&&this.style){j.display=c.css(this,"display");j.overflow=this.style.overflow}if(c.isArray(a[i])){(j.specialEasing=
-j.specialEasing||{})[i]=a[i][1];a[i]=a[i][0]}}if(j.overflow!=null)this.style.overflow="hidden";j.curAnim=c.extend({},a);c.each(a,function(r,u){var z=new c.fx(k,j,r);if(Ab.test(u))z[u==="toggle"?o?"show":"hide":u](a);else{var C=Bb.exec(u),B=z.cur(true)||0;if(C){u=parseFloat(C[2]);var E=C[3]||"px";if(E!=="px"){k.style[r]=(u||1)+E;B=(u||1)/z.cur(true)*B;k.style[r]=B+E}if(C[1])u=(C[1]==="-="?-1:1)*u+B;z.custom(B,u,E)}else z.custom(B,u,"")}});return true})},stop:function(a,b){var d=c.timers;a&&this.queue([]);
-this.each(function(){for(var f=d.length-1;f>=0;f--)if(d[f].elem===this){b&&d[f](true);d.splice(f,1)}});b||this.dequeue();return this}});c.each({slideDown:K("show",1),slideUp:K("hide",1),slideToggle:K("toggle",1),fadeIn:{opacity:"show"},fadeOut:{opacity:"hide"}},function(a,b){c.fn[a]=function(d,f){return this.animate(b,d,f)}});c.extend({speed:function(a,b,d){var f=a&&typeof a==="object"?a:{complete:d||!d&&b||c.isFunction(a)&&a,duration:a,easing:d&&b||b&&!c.isFunction(b)&&b};f.duration=c.fx.off?0:typeof f.duration===
-"number"?f.duration:c.fx.speeds[f.duration]||c.fx.speeds._default;f.old=f.complete;f.complete=function(){f.queue!==false&&c(this).dequeue();c.isFunction(f.old)&&f.old.call(this)};return f},easing:{linear:function(a,b,d,f){return d+f*a},swing:function(a,b,d,f){return(-Math.cos(a*Math.PI)/2+0.5)*f+d}},timers:[],fx:function(a,b,d){this.options=b;this.elem=a;this.prop=d;if(!b.orig)b.orig={}}});c.fx.prototype={update:function(){this.options.step&&this.options.step.call(this.elem,this.now,this);(c.fx.step[this.prop]||
-c.fx.step._default)(this);if((this.prop==="height"||this.prop==="width")&&this.elem.style)this.elem.style.display="block"},cur:function(a){if(this.elem[this.prop]!=null&&(!this.elem.style||this.elem.style[this.prop]==null))return this.elem[this.prop];return(a=parseFloat(c.css(this.elem,this.prop,a)))&&a>-10000?a:parseFloat(c.curCSS(this.elem,this.prop))||0},custom:function(a,b,d){function f(j){return e.step(j)}this.startTime=J();this.start=a;this.end=b;this.unit=d||this.unit||"px";this.now=this.start;
-this.pos=this.state=0;var e=this;f.elem=this.elem;if(f()&&c.timers.push(f)&&!W)W=setInterval(c.fx.tick,13)},show:function(){this.options.orig[this.prop]=c.style(this.elem,this.prop);this.options.show=true;this.custom(this.prop==="width"||this.prop==="height"?1:0,this.cur());c(this.elem).show()},hide:function(){this.options.orig[this.prop]=c.style(this.elem,this.prop);this.options.hide=true;this.custom(this.cur(),0)},step:function(a){var b=J(),d=true;if(a||b>=this.options.duration+this.startTime){this.now=
-this.end;this.pos=this.state=1;this.update();this.options.curAnim[this.prop]=true;for(var f in this.options.curAnim)if(this.options.curAnim[f]!==true)d=false;if(d){if(this.options.display!=null){this.elem.style.overflow=this.options.overflow;a=c.data(this.elem,"olddisplay");this.elem.style.display=a?a:this.options.display;if(c.css(this.elem,"display")==="none")this.elem.style.display="block"}this.options.hide&&c(this.elem).hide();if(this.options.hide||this.options.show)for(var e in this.options.curAnim)c.style(this.elem,
-e,this.options.orig[e]);this.options.complete.call(this.elem)}return false}else{e=b-this.startTime;this.state=e/this.options.duration;a=this.options.easing||(c.easing.swing?"swing":"linear");this.pos=c.easing[this.options.specialEasing&&this.options.specialEasing[this.prop]||a](this.state,e,0,1,this.options.duration);this.now=this.start+(this.end-this.start)*this.pos;this.update()}return true}};c.extend(c.fx,{tick:function(){for(var a=c.timers,b=0;b<a.length;b++)a[b]()||a.splice(b--,1);a.length||
-c.fx.stop()},stop:function(){clearInterval(W);W=null},speeds:{slow:600,fast:200,_default:400},step:{opacity:function(a){c.style(a.elem,"opacity",a.now)},_default:function(a){if(a.elem.style&&a.elem.style[a.prop]!=null)a.elem.style[a.prop]=(a.prop==="width"||a.prop==="height"?Math.max(0,a.now):a.now)+a.unit;else a.elem[a.prop]=a.now}}});if(c.expr&&c.expr.filters)c.expr.filters.animated=function(a){return c.grep(c.timers,function(b){return a===b.elem}).length};c.fn.offset="getBoundingClientRect"in s.documentElement?
-function(a){var b=this[0];if(a)return this.each(function(e){c.offset.setOffset(this,a,e)});if(!b||!b.ownerDocument)return null;if(b===b.ownerDocument.body)return c.offset.bodyOffset(b);var d=b.getBoundingClientRect(),f=b.ownerDocument;b=f.body;f=f.documentElement;return{top:d.top+(self.pageYOffset||c.support.boxModel&&f.scrollTop||b.scrollTop)-(f.clientTop||b.clientTop||0),left:d.left+(self.pageXOffset||c.support.boxModel&&f.scrollLeft||b.scrollLeft)-(f.clientLeft||b.clientLeft||0)}}:function(a){var b=
-this[0];if(a)return this.each(function(r){c.offset.setOffset(this,a,r)});if(!b||!b.ownerDocument)return null;if(b===b.ownerDocument.body)return c.offset.bodyOffset(b);c.offset.initialize();var d=b.offsetParent,f=b,e=b.ownerDocument,j,i=e.documentElement,o=e.body;f=(e=e.defaultView)?e.getComputedStyle(b,null):b.currentStyle;for(var k=b.offsetTop,n=b.offsetLeft;(b=b.parentNode)&&b!==o&&b!==i;){if(c.offset.supportsFixedPosition&&f.position==="fixed")break;j=e?e.getComputedStyle(b,null):b.currentStyle;
-k-=b.scrollTop;n-=b.scrollLeft;if(b===d){k+=b.offsetTop;n+=b.offsetLeft;if(c.offset.doesNotAddBorder&&!(c.offset.doesAddBorderForTableAndCells&&/^t(able|d|h)$/i.test(b.nodeName))){k+=parseFloat(j.borderTopWidth)||0;n+=parseFloat(j.borderLeftWidth)||0}f=d;d=b.offsetParent}if(c.offset.subtractsBorderForOverflowNotVisible&&j.overflow!=="visible"){k+=parseFloat(j.borderTopWidth)||0;n+=parseFloat(j.borderLeftWidth)||0}f=j}if(f.position==="relative"||f.position==="static"){k+=o.offsetTop;n+=o.offsetLeft}if(c.offset.supportsFixedPosition&&
-f.position==="fixed"){k+=Math.max(i.scrollTop,o.scrollTop);n+=Math.max(i.scrollLeft,o.scrollLeft)}return{top:k,left:n}};c.offset={initialize:function(){var a=s.body,b=s.createElement("div"),d,f,e,j=parseFloat(c.curCSS(a,"marginTop",true))||0;c.extend(b.style,{position:"absolute",top:0,left:0,margin:0,border:0,width:"1px",height:"1px",visibility:"hidden"});b.innerHTML="<div style='position:absolute;top:0;left:0;margin:0;border:5px solid #000;padding:0;width:1px;height:1px;'><div></div></div><table style='position:absolute;top:0;left:0;margin:0;border:5px solid #000;padding:0;width:1px;height:1px;' cellpadding='0' cellspacing='0'><tr><td></td></tr></table>";
-a.insertBefore(b,a.firstChild);d=b.firstChild;f=d.firstChild;e=d.nextSibling.firstChild.firstChild;this.doesNotAddBorder=f.offsetTop!==5;this.doesAddBorderForTableAndCells=e.offsetTop===5;f.style.position="fixed";f.style.top="20px";this.supportsFixedPosition=f.offsetTop===20||f.offsetTop===15;f.style.position=f.style.top="";d.style.overflow="hidden";d.style.position="relative";this.subtractsBorderForOverflowNotVisible=f.offsetTop===-5;this.doesNotIncludeMarginInBodyOffset=a.offsetTop!==j;a.removeChild(b);
-c.offset.initialize=c.noop},bodyOffset:function(a){var b=a.offsetTop,d=a.offsetLeft;c.offset.initialize();if(c.offset.doesNotIncludeMarginInBodyOffset){b+=parseFloat(c.curCSS(a,"marginTop",true))||0;d+=parseFloat(c.curCSS(a,"marginLeft",true))||0}return{top:b,left:d}},setOffset:function(a,b,d){if(/static/.test(c.curCSS(a,"position")))a.style.position="relative";var f=c(a),e=f.offset(),j=parseInt(c.curCSS(a,"top",true),10)||0,i=parseInt(c.curCSS(a,"left",true),10)||0;if(c.isFunction(b))b=b.call(a,
-d,e);d={top:b.top-e.top+j,left:b.left-e.left+i};"using"in b?b.using.call(a,d):f.css(d)}};c.fn.extend({position:function(){if(!this[0])return null;var a=this[0],b=this.offsetParent(),d=this.offset(),f=/^body|html$/i.test(b[0].nodeName)?{top:0,left:0}:b.offset();d.top-=parseFloat(c.curCSS(a,"marginTop",true))||0;d.left-=parseFloat(c.curCSS(a,"marginLeft",true))||0;f.top+=parseFloat(c.curCSS(b[0],"borderTopWidth",true))||0;f.left+=parseFloat(c.curCSS(b[0],"borderLeftWidth",true))||0;return{top:d.top-
-f.top,left:d.left-f.left}},offsetParent:function(){return this.map(function(){for(var a=this.offsetParent||s.body;a&&!/^body|html$/i.test(a.nodeName)&&c.css(a,"position")==="static";)a=a.offsetParent;return a})}});c.each(["Left","Top"],function(a,b){var d="scroll"+b;c.fn[d]=function(f){var e=this[0],j;if(!e)return null;if(f!==w)return this.each(function(){if(j=wa(this))j.scrollTo(!a?f:c(j).scrollLeft(),a?f:c(j).scrollTop());else this[d]=f});else return(j=wa(e))?"pageXOffset"in j?j[a?"pageYOffset":
-"pageXOffset"]:c.support.boxModel&&j.document.documentElement[d]||j.document.body[d]:e[d]}});c.each(["Height","Width"],function(a,b){var d=b.toLowerCase();c.fn["inner"+b]=function(){return this[0]?c.css(this[0],d,false,"padding"):null};c.fn["outer"+b]=function(f){return this[0]?c.css(this[0],d,false,f?"margin":"border"):null};c.fn[d]=function(f){var e=this[0];if(!e)return f==null?null:this;if(c.isFunction(f))return this.each(function(j){var i=c(this);i[d](f.call(this,j,i[d]()))});return"scrollTo"in
-e&&e.document?e.document.compatMode==="CSS1Compat"&&e.document.documentElement["client"+b]||e.document.body["client"+b]:e.nodeType===9?Math.max(e.documentElement["client"+b],e.body["scroll"+b],e.documentElement["scroll"+b],e.body["offset"+b],e.documentElement["offset"+b]):f===w?c.css(e,d):this.css(d,typeof f==="string"?f:f+"px")}});A.jQuery=A.$=c})(window);

skins.html

@@ -1,126 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <meta charset="utf-8" />
-  <title>Skins | HTML5 Video Player | Video JS</title>
-  <meta name="google-site-verification" content="QHf9MEYVlEWoNHbzTeUkSQsbRT5Twzqu6N0nX1i3nes" />
-
-  <script src="video-js/video.js" type="text/javascript" charset="utf-8"></script>
-  <!-- JQuery not required, but used for dom ready function -->
-  <script src="javascripts/jquery-1.4.2.min.js" type="text/javascript" charset="utf-8"></script>
-
-  <link rel="stylesheet" href="stylesheets/base.css" type="text/css" media="all" charset="utf-8" />
-  <link rel="stylesheet" href="video-js/video-js.css" type="text/css" media="all" charset="utf-8" />
-  <link rel="stylesheet" href="stylesheets/site.css" type="text/css" media="all" charset="utf-8" />
-  <link rel="stylesheet" href="video-js/skins/tube.css" type="text/css" media="screen" title="Video JS" charset="utf-8">
-  <link rel="stylesheet" href="video-js/skins/vim.css" type="text/css" media="screen" title="Video JS" charset="utf-8">
-  <link rel="stylesheet" href="video-js/skins/hu.css" type="text/css" media="screen" title="Video JS" charset="utf-8">
-
-  <!--[if !IE 7]>
-    <style type="text/css">
-      #wrap {display:table;height:100%}
-    </style>
-  <![endif]-->
-
-  <script type="text/javascript" charset="utf-8">
-    // Using JQuery's DOM Ready function
-    // You can also use window.onload, but it loads slower
-    $(function(){
-      VideoJS.setup();
-    })
-
-    // If not using a JS library
-    // window.onload = function(){
-    //   VideoJS.setup();
-    // }
-  </script>
-
-</head>
-<body>
-
-  <div id="wrap">
-    <div id="main">
-
-      <ul id="nav">
-        <li><a href="skins.html">Skins</a></li>
-        <li><a href="http://github.com/zencoder/video-js">Source</a></li>
-        <li><a href="http://wiki.github.com/zencoder/video-js/browser-device-compatibility">Compatibility</a></li>
-        <li><a href="http://github.com/zencoder/video-js/issues">Issue Tracker</a></li>
-        <li><a href="http://wiki.github.com/zencoder/video-js/">Wiki</a></li>
-      </ul>
-
-      <h1>Video JS Skins</h1>
-      <p class="tagline">Replicas of some well known skins using just CSS</p>
-
-      <p>These skins were created to show how you can re-skin VideoJS using just CSS. To use these skins, download the CSS file and include in the same document as VideoJS. Then add the skin's classname to the video-js-box.</p>
-
-      <p>&lt;div class="video-js-box vim-css"&gt;</p>
-
-      <h2>The Original</h2>
-
-      <div class="video-js-box">
-        <video class="video-js" width="640" height="264" poster="//vjs.zencdn.net/v/oceans.png" controls preload>
-          <source src="//vjs.zencdn.net/v/oceans.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
-          <source src="//vjs.zencdn.net/v/oceans.webm" type='video/webm; codecs="vp8, vorbis"'>
-          <source src="//vjs.zencdn.net/v/oceans.ogg" type='video/ogg; codecs="theora, vorbis"'>
-          <p>You need an HTML5 video compatible browser to view these skins.</p>
-        </video>
-      </div>
-      <p>No additional files needed.</p>
-
-      <h2>VimCSS</h2>
-      <div class="video-js-box vim-css">
-        <video class="video-js" width="640" height="264" poster="//vjs.zencdn.net/v/oceans.png" controls preload>
-          <source src="//vjs.zencdn.net/v/oceans.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
-          <source src="//vjs.zencdn.net/v/oceans.webm" type='video/webm; codecs="vp8, vorbis"'>
-          <source src="//vjs.zencdn.net/v/oceans.ogg" type='video/ogg; codecs="theora, vorbis"'>
-        </video>
-      </div>
-      <p>Download <a href="video-js/skins/vim.css">VimCSS</a>. Add the class "vim-css".</p>
-
-      <h2>HuCSS</h2>
-      <!-- Begin VideoJS -->
-      <div class="video-js-box hu-css">
-        <video class="video-js" width="640" height="264" poster="//vjs.zencdn.net/v/oceans.png" controls preload>
-          <source src="//vjs.zencdn.net/v/oceans.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
-          <source src="//vjs.zencdn.net/v/oceans.webm" type='video/webm; codecs="vp8, vorbis"'>
-          <source src="//vjs.zencdn.net/v/oceans.ogg" type='video/ogg; codecs="theora, vorbis"'>
-        </video>
-      </div>
-      <p>Download <a href="video-js/skins/hu.css">HuCSS</a>. Add the class "hu-css".</p>
-
-
-      <h2>TubeCSS</h2>
-      <div class="video-js-box tube-css">
-        <video class="video-js" width="640" height="264" poster="//vjs.zencdn.net/v/oceans.png" controls preload>
-          <source src="//vjs.zencdn.net/v/oceans.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
-          <source src="//vjs.zencdn.net/v/oceans.webm" type='video/webm; codecs="vp8, vorbis"'>
-          <source src="//vjs.zencdn.net/v/oceans.ogg" type='video/ogg; codecs="theora, vorbis"'>
-        </video>
-      </div>
-      <p>Download <a href="video-js/skins/tube.css">TubeCSS</a>. Add the class "tube-css".</p>
-
-    </div>
-
-
-    <div id="footer">
-      &copy; <a href="//videojs.github.io/video.js">The Video JS Project</a>. Sponsored by <a href="http://zencoder.com">Zencoder</a>.
-    </div>
-  </div>
-
-  <script type="text/javascript">
-
-    var _gaq = _gaq || [];
-    _gaq.push(['_setAccount', 'UA-16505296-1']);
-    _gaq.push(['_trackPageview']);
-
-    (function() {
-      var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
-      ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
-      var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
-    })();
-
-  </script>
-
-</body>
-</html>

skins/hu.css

@@ -1,99 +0,0 @@
-.hu-css .vjs-controls { 
-  height: 47px; opacity: 0.95; color: #fff; 
-  padding-left: 84px; /* Width of play button + margin */
-  padding-right: 0px; /* Width of all the controls to the right of the progress control + margins */
-  background: #3A3835;
-}
-
-.hu-css .vjs-controls > li {
-  background: none;
-  border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0;
-  box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none;
-}
-
-/* Top Level Items */
-.hu-css .vjs-controls > li.vjs-play-control, 
-.hu-css .vjs-controls > li.vjs-volume-control, 
-.hu-css .vjs-controls > li.vjs-fullscreen-control {
-  bottom: 20px; height: 27px;
-}
-/* Bottom Level Items */
-.hu-css .vjs-controls > li.vjs-progress-control, .hu-css .vjs-controls > li.vjs-time-control {
-  margin-top: 28px; height: 19px;
-}
-
-/* Placement of Control Items */
-.hu-css .vjs-controls > li.vjs-play-control       { width: 33px; left: 0px; }
-.hu-css .vjs-controls > li.vjs-progress-control   { width: 100%; position: relative; }
-.hu-css .vjs-controls > li.vjs-time-control       { width: 84px; left: 0px; }
-.hu-css .vjs-controls > li.vjs-volume-control     { width: 43px; right: 44px; }
-.hu-css .vjs-controls > li.vjs-fullscreen-control { width: 43px; right: 0px; }
-
-/* Play/Pause
--------------------------------------------------------------------------------- */
-.hu-css .vjs-play-control.vjs-play span { margin: 9px 0 0 12px; }
-.hu-css .vjs-play-control.vjs-pause span { margin: 9px 0 0 12px; }
-.hu-css .vjs-play-control:hover { background-color: #000; }
-
-/* Progress
--------------------------------------------------------------------------------- */
-.hu-css .vjs-progress-holder { /* Box containing play and load progresses */
-  height: 19px; border: none;
-  margin: 0px 0px 0 0px; /* Placement within the progress control item */
-  background: #000;
-  border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0;
-}
-.hu-css .vjs-progress-holder li { height: 13px; margin-top: 3px; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; }
-.hu-css .vjs-play-progress {
-  /* Default */ background: #777;
-  /* Webkit  */ background: -webkit-gradient(linear, left top, left bottom, from(#999), to(#777));
-  /* Firefox */ background: -moz-linear-gradient(top,  #999,  #777);
-}
-.hu-css .vjs-load-progress { background: #555; }
-
-/* Time Display
--------------------------------------------------------------------------------- */
-.hu-css .vjs-controls .vjs-time-control { font-size: 11px; background: #000; }
-.hu-css .vjs-controls .vjs-time-control span { line-height: 19px; /* Centering vertically */ }
-
-/* Volume
--------------------------------------------------------------------------------- */
-/*.hu-css .vjs-volume-control:hover { background-color: #000; }*/
-.hu-css .vjs-volume-control ul { margin: 0 5px 0 5px; padding: 9px 0 0 0; }
-.hu-css .vjs-volume-control ul li { /* Individual volume bars */
-  margin: 0 2px 0 0; /* Space between */
-  width: 3px; height: 0px; /* Total height is height + bottom border */
-  border-bottom: 12px solid #555; /* Default (off) color and height of visible portion */
-}
-.hu-css .vjs-volume-control ul li.vjs-volume-level-on { border-color: #fff; /* Volume on bar color */ }
-/* Creating differnt bar heights through height (transparent) and bottom border (visible). */
-.hu-css .vjs-volume-control ul li:nth-child(1) { border-bottom-width: 2px; height: 10px; }
-.hu-css .vjs-volume-control ul li:nth-child(2) { border-bottom-width: 4px; height: 8px; }
-.hu-css .vjs-volume-control ul li:nth-child(3) { border-bottom-width: 6px; height: 6px; }
-.hu-css .vjs-volume-control ul li:nth-child(4) { border-bottom-width: 8px; height: 4px; }
-.hu-css .vjs-volume-control ul li:nth-child(5) { border-bottom-width: 10px; height: 2px; }
-
-/* Fullscreen
--------------------------------------------------------------------------------- */
-.hu-css .vjs-fullscreen-control:hover { background-color: #000; }
-.hu-css .vjs-fullscreen-control ul { margin: 8px 0 0 0px; padding-left: 13px; height: 13px; border-left: 1px solid #555; }
-.hu-css .vjs-fullscreen-control ul li:nth-child(1) { margin-right: 9px; margin-bottom: 5px; border-top: 4px solid #fff; border-right: 4px solid rgba(0,0,0,0); }
-.hu-css .vjs-fullscreen-control ul li:nth-child(2) { border-top: 4px solid #fff; border-left: 4px solid rgba(0,0,0,0); }
-.hu-css .vjs-fullscreen-control ul li:nth-child(3) { clear: both; margin: 0 9px 0 0; border-bottom: 4px solid #fff; border-right: 4px solid rgba(0,0,0,0); }
-.hu-css .vjs-fullscreen-control ul li:nth-child(4) { border-bottom: 4px solid #fff; border-left: 4px solid rgba(0,0,0,0); }
-/* Icon when video is in fullscreen mode */
-.hu-css.vjs-fullscreen .vjs-fullscreen-control ul li:nth-child(1) { border: none; border-bottom: 4px solid #fff; border-left: 4px solid rgba(0,0,0,0); }
-.hu-css.vjs-fullscreen .vjs-fullscreen-control ul li:nth-child(2) { border: none; border-bottom: 4px solid #fff; border-right: 4px solid rgba(0,0,0,0); }
-.hu-css.vjs-fullscreen .vjs-fullscreen-control ul li:nth-child(3) { border: none; border-top: 4px solid #fff; border-left: 4px solid rgba(0,0,0,0); }
-.hu-css.vjs-fullscreen .vjs-fullscreen-control ul li:nth-child(4) { border: none; border-top: 4px solid #fff; border-right: 4px solid rgba(0,0,0,0); }
-
-
-
-
-
-
-
-
-
-
-

skins/tube.css

@@ -1,82 +0,0 @@
-.tube-css .vjs-controls {
-  opacity: 1; color: #000;
-  height: 25px;
-  padding-left: 102px; /* Width of play button + margin */
-  padding-right: 83px; /* Width of all the controls to the right of the progress control + margins */
-
-  background-color: #ccc;
-  background: #fcfcfc -webkit-gradient(linear, left top, left bottom, from(#fcfcfc), to(#d0d0d0)) left top;
-  background: #fcfcfc -moz-linear-gradient(top,  #fcfcfc,  #d0d0d0) left top;
-}
-
-.tube-css .vjs-controls > li {
-  height: 23px; margin: 0; background: none;
-  border: 1px solid #b1b1b1; border-left-color: #eee;
-  border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0;
-  box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none;
-}
-
-/* Placement of Control Items */
-.tube-css .vjs-controls > li.vjs-play-control       { width: 25px; left: 0; }
-.tube-css .vjs-controls > li.vjs-progress-control   { width: 100%; position: relative; }
-.tube-css .vjs-controls > li.vjs-time-control       { width: 75px; left: 27px; }
-.tube-css .vjs-controls > li.vjs-volume-control     { width: 50px; right: 30px; }
-.tube-css .vjs-controls > li.vjs-fullscreen-control { width: 30px; right: 0; }
-
-/* Removing borders on time & progress to join them */
-.tube-css .vjs-controls > li.vjs-progress-control { border-left: none; }
-.tube-css .vjs-controls > li.vjs-time-control { border-right: none; }
-
-
-/* Play/Pause
--------------------------------------------------------------------------------- */
-.tube-css .vjs-controls > li:first-child { margin-left: 0; border-left-color: #b1b1b1; }
-.tube-css .vjs-play-control.vjs-play span { border-left-color: #333; border-top-width: 7px; border-left-width: 13px; border-bottom-width: 7px; margin: 5px 0 0 7px; }
-.tube-css .vjs-play-control.vjs-pause span { height: 14px; margin: 5px auto 0; border-left: 4px solid #333; border-right: 4px solid #333; }
-.tube-css .vjs-play-control.vjs-play:hover span { border-left-color: #CF1A1A; }
-.tube-css .vjs-play-control.vjs-pause:hover span { border-left-color: #CF1A1A; border-right-color: #CF1A1A; }
-
-/* Time Display
--------------------------------------------------------------------------------- */
-.tube-css .vjs-controls .vjs-time-control { font-size: 11px; }
-.tube-css .vjs-controls .vjs-time-control span { line-height: 25px; /* Centering vertically */ }
-
-/* Progress
--------------------------------------------------------------------------------- */
-.tube-css .vjs-progress-holder {
-  margin-right: 10px;
-  background-color: #b1b1b1;
-  background: #b1b1b1 -webkit-gradient(linear, left top, left bottom, from(#b1b1b1), to(#cacaca)) left top;
-  background: #b1b1b1 -moz-linear-gradient(top,  #b1b1b1,  #cacaca) left top;
-  border-color: #CACACA; border-bottom-color: #eaeaea;
-  border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0;
-}
-.tube-css .vjs-progress-control .vjs-load-progress { background: #C89191; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; }
-.tube-css .vjs-progress-control .vjs-play-progress { background: #f33; background: -webkit-gradient(linear, left top, left bottom, from(#f33), to(#CF1A1A)); background: -moz-linear-gradient(top,  #f33,  #CF1A1A); -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; }
-
-/* Volume
--------------------------------------------------------------------------------- */
-.tube-css .vjs-volume-control ul { padding: 3px 0 0 0; }
-.tube-css .vjs-volume-control ul li { border-bottom-color: #ccc; }
-/* Volume icon color */
-.tube-css .vjs-volume-control ul li.vjs-volume-level-on { border-color: #333; }
-/* Volume icon hovering color */
-.tube-css .vjs-volume-control:hover ul li.vjs-volume-level-on { border-color: #CF1A1A; }
-
-/* Fullscreen
--------------------------------------------------------------------------------- */
-.tube-css .vjs-fullscreen-control ul { margin: 4px 0 0 8px; }
-/* Fullscreen icon color */
-.tube-css .vjs-fullscreen-control ul li:nth-child(3), .tube-css .vjs-fullscreen-control ul li:nth-child(4), .tube-css.vjs-fullscreen .vjs-fullscreen-control ul li:nth-child(1), .tube-css.vjs-fullscreen .vjs-fullscreen-control ul li:nth-child(2) {
-  border-bottom-color: #333;
-}
-.tube-css .vjs-fullscreen-control ul li:nth-child(1), .tube-css .vjs-fullscreen-control ul li:nth-child(2), .tube-css.vjs-fullscreen .vjs-fullscreen-control ul li:nth-child(3), .tube-css.vjs-fullscreen .vjs-fullscreen-control ul li:nth-child(4) {
-  border-top-color: #333;
-}
-/* Fullscreen icon hovering color */
-.tube-css .vjs-fullscreen-control:hover ul li:nth-child(3), .tube-css .vjs-fullscreen-control:hover ul li:nth-child(4), .tube-css.vjs-fullscreen:hover .vjs-fullscreen-control ul li:nth-child(1), .tube-css.vjs-fullscreen:hover .vjs-fullscreen-control ul li:nth-child(2) {
-  border-bottom-color: #CF1A1A;
-}
-.tube-css .vjs-fullscreen-control:hover ul li:nth-child(1), .tube-css .vjs-fullscreen-control:hover ul li:nth-child(2), .tube-css.vjs-fullscreen:hover .vjs-fullscreen-control ul li:nth-child(3), .tube-css.vjs-fullscreen:hover .vjs-fullscreen-control ul li:nth-child(4) {
-  border-top-color: #CF1A1A;
-}

skins/vim.css

@@ -1,62 +0,0 @@
-.vim-css .vjs-controls { 
-  height: 50px; opacity: 0.9; color: #fff; 
-  padding-left: 85px; /* Width of play button + margin */
-  padding-right: 160px; /* Width of all the controls to the right of the progress control + margins */
-}
-.vim-css .vjs-controls > li { 
-  height: 32px; width: 25px; margin: 8px 0 0 0; padding: 0; text-align: center; background: rgba(23, 35, 34, 0.746094); 
-  border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; 
-  box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none;
-}
-/* Placement of Control Items */
-.vim-css .vjs-controls > li.vjs-play-control       { width: 65px; left: 10px; }
-.vim-css .vjs-controls > li.vjs-progress-control   { width: 100%; position: relative; }
-.vim-css .vjs-controls > li.vjs-time-control       { width: 75px; right: 85px; }
-.vim-css .vjs-controls > li.vjs-volume-control     { width: 50px; right: 35px; }
-.vim-css .vjs-controls > li.vjs-fullscreen-control { width: 25px; right: 10px; }
-
-/* Play/Pause
--------------------------------------------------------------------------------- */
-.vim-css .vjs-controls .vjs-play-control { margin: 0; height: 40px;  border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; }
-.vim-css .vjs-play-control.vjs-play span { border-left-color: #fff; border-top-width: 9px; border-left-width: 18px; border-bottom-width: 9px; margin: 11px 0 0 24px; }
-.vim-css .vjs-play-control:hover { background: #00ADEF; }
-.vim-css .vjs-play-control.vjs-pause span { width: 5px; height: 18px; margin: 5px auto 0; border-left: 5px solid #fff; border-right: 5px solid #fff; margin: 11px 0 0 24px; }
-
-/* Progress
--------------------------------------------------------------------------------- */
-.vim-css .vjs-controls .vjs-progress-control { border-radius: 5px 0 0 5px; -webkit-border-radius: 5px 0 0 5px; -moz-border-radius: 5px 0 0 5px; }
-.vim-css .vjs-progress-control .vjs-progress-holder { height: 8px; padding: 1px; margin: 10px 5px 0 10px; border-color: #666666; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; }
-.vim-css .vjs-progress-control .vjs-play-progress { height: 8px; background: #00ADEF; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; }
-.vim-css .vjs-progress-control .vjs-load-progress { height: 8px; background: #898F8F; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; }
-
-/* Time Display
--------------------------------------------------------------------------------- */
-.vim-css .vjs-controls .vjs-time-control { font-size: 11px; }
-.vim-css .vjs-controls .vjs-time-control span { line-height: 32px; /* Centering vertically */ }
-
-/* Volume
--------------------------------------------------------------------------------- */
-.vim-css .vjs-volume-control ul { padding: 7px 0 0 5px; width: 30px; }
-.vim-css .vjs-volume-control ul li { 
-  float: left; margin: 0 2px 0 0; padding: 0; list-style: none; width: 3px; height: 3px; border-bottom: 12px solid #666666; 
-  -webkit-transition: all 100ms linear; -moz-transition: all 100ms linear;
-}
-.vim-css .vjs-volume-control ul li.vjs-volume-level-on { border-color: #00ADEF; }
-.vim-css .vjs-volume-control ul li:hover { height: 0; border-bottom-width: 15px; }
-
-/* Fullscreen
--------------------------------------------------------------------------------- */
-.vim-css .vjs-fullscreen-control ul { margin: 10px 0 0 0; }
-.vim-css .vjs-controls .vjs-fullscreen-control { border-radius: 0 5px 5px 0; -webkit-border-radius: 0 5px 5px 0; -moz-border-radius: 0 5px 5px 0; }
-/* Making default fullscreen icon smaller */
-.vim-css .vjs-fullscreen-control ul li:nth-child(1) { margin: 0 4px 4px 0; border: none; border-top: 4px solid #fff; border-right: 4px solid rgba(0,0,0,0); }
-.vim-css .vjs-fullscreen-control ul li:nth-child(2) { border: none; border-top: 4px solid #fff; border-left: 4px solid rgba(0,0,0,0); }
-.vim-css .vjs-fullscreen-control ul li:nth-child(3) { clear: both; margin: 0 4px 0 0; border: none; border-bottom: 4px solid #fff; border-right: 4px solid rgba(0,0,0,0); }
-.vim-css .vjs-fullscreen-control ul li:nth-child(4) { border: none; border-bottom: 4px solid #fff; border-left: 4px solid rgba(0,0,0,0); }
-.vim-css.vjs-fullscreen .vjs-fullscreen-control ul li:nth-child(1) { border: none; border-bottom: 4px solid #fff; border-left: 4px solid rgba(0,0,0,0); }
-.vim-css.vjs-fullscreen .vjs-fullscreen-control ul li:nth-child(2) { border: none; border-bottom: 4px solid #fff; border-right: 4px solid rgba(0,0,0,0); }
-.vim-css.vjs-fullscreen .vjs-fullscreen-control ul li:nth-child(3) { border: none; border-top: 4px solid #fff; border-left: 4px solid rgba(0,0,0,0); }
-.vim-css.vjs-fullscreen .vjs-fullscreen-control ul li:nth-child(4) { border: none; border-top: 4px solid #fff; border-right: 4px solid rgba(0,0,0,0); }
-/* Fullscreen control hovering */
-.vim-css .vjs-fullscreen-control:hover ul li:nth-child(3), .vim-css .vjs-fullscreen-control:hover ul li:nth-child(4), .vim-css.vjs-fullscreen .vjs-fullscreen-control:hover ul li:nth-child(1), .vim-css.vjs-fullscreen .vjs-fullscreen-control:hover ul li:nth-child(2) { border-bottom-color: #00ADEF; }
-.vim-css .vjs-fullscreen-control:hover ul li:nth-child(1), .vim-css .vjs-fullscreen-control:hover ul li:nth-child(2), .vim-css.vjs-fullscreen .vjs-fullscreen-control:hover ul li:nth-child(3), .vim-css.vjs-fullscreen .vjs-fullscreen-control:hover ul li:nth-child(4) { border-top-color: #00ADEF; }

source-list.js

@@ -0,0 +1 @@
+var vjsSourceList = [];

src/_begin.js

@@ -0,0 +1,24 @@
+/*!
+Video.js - HTML5 Video Player
+Version GENERATED_AT_BUILD
+
+LGPL v3 LICENSE INFO
+This file is part of Video.js. Copyright 2011 Zencoder, Inc.
+
+Video.js is free software: you can redistribute it and/or modify
+it under the terms of the GNU Lesser General Public License as published by
+the Free Software Foundation, either version 3 of the License, or
+(at your option) any later version.
+
+Video.js is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+GNU Lesser General Public License for more details.
+
+You should have received a copy of the GNU Lesser General Public License
+along with Video.js.  If not, see <http://www.gnu.org/licenses/>.
+*/
+
+// Self-executing function to prevent global vars and help with minification
+;(function(window, undefined){
+  var document = window.document;

src/_end.js

@@ -0,0 +1,6 @@
+
+// Expose to global
+window.VideoJS = window._V_ = VideoJS;
+
+// End self-executing function
+})(window);

src/component.js

@@ -0,0 +1,230 @@
+// Using John Resig's Class implementation http://ejohn.org/blog/simple-javascript-inheritance/
+// (function(){var initializing=false, fnTest=/xyz/.test(function(){xyz;}) ? /\b_super\b/ : /.*/; _V_.Class = function(){}; _V_.Class.extend = function(prop) { var _super = this.prototype; initializing = true; var prototype = new this(); initializing = false; for (var name in prop) { prototype[name] = typeof prop[name] == "function" && typeof _super[name] == "function" && fnTest.test(prop[name]) ? (function(name, fn){ return function() { var tmp = this._super; this._super = _super[name]; var ret = fn.apply(this, arguments); this._super = tmp; return ret; }; })(name, prop[name]) : prop[name]; } function Class() { if ( !initializing && this.init ) this.init.apply(this, arguments); } Class.prototype = prototype; Class.constructor = Class; Class.extend = arguments.callee; return Class;};})();
+(function(){
+  var initializing = false, fnTest = /xyz/.test(function(){xyz;}) ? /\b_super\b/ : /.*/;
+  _V_.Class = function(){};
+  _V_.Class.extend = function(prop) {
+    var _super = this.prototype;
+    initializing = true;
+    var prototype = new this();
+    initializing = false;
+    for (var name in prop) {
+      prototype[name] = typeof prop[name] == "function" &&
+        typeof _super[name] == "function" && fnTest.test(prop[name]) ?
+        (function(name, fn){
+          return function() {
+            var tmp = this._super;
+            this._super = _super[name];
+            var ret = fn.apply(this, arguments);
+            this._super = tmp;
+            return ret;
+          };
+        })(name, prop[name]) :
+        prop[name];
+    }
+    function Class() {
+      if ( !initializing && this.init ) {
+        return this.init.apply(this, arguments);
+
+      // Attempting to recreate accessing function form of class.
+      } else if (!initializing) {
+        return arguments.callee.prototype.init()
+      }
+    }
+    Class.prototype = prototype;
+    Class.constructor = Class;
+    Class.extend = arguments.callee;
+    return Class;
+  };
+})();
+
+/* Player Component- Base class for all UI objects
+================================================================================ */
+_V_.Component = _V_.Class.extend({
+
+  init: function(player, options){
+    this.player = player;
+
+    // Allow for overridding default component options
+    options = this.options = _V_.merge(this.options || {}, options);
+
+    // Create element if one wasn't provided in options
+    if (options.el) {
+      this.el = options.el;
+    } else {
+      this.el = this.createElement();
+    }
+
+    // Add any components in options
+    this.initComponents();
+  },
+
+  destroy: function(){},
+
+  createElement: function(type, attrs){
+    return _V_.createElement(type || "div", attrs);
+  },
+
+  buildCSSClass: function(){
+    // Child classes can include a function that does:
+    // return "CLASS NAME" + this._super();
+    return "";
+  },
+
+  initComponents: function(){
+    var options = this.options;
+    if (options && options.components) {
+      // Loop through components and add them to the player
+      this.eachProp(options.components, function(name, opts){
+
+        // Allow waiting to add components until a specific event is called
+        var tempAdd = this.proxy(function(){
+          // Set property name on player. Could cause conflicts with other prop names, but it's worth making refs easy.
+          this[name] = this.addComponent(name, opts);
+        });
+
+        if (opts.loadEvent) {
+          this.one(opts.loadEvent, tempAdd)
+        } else {
+          tempAdd();
+        }
+      });
+    }
+  },
+
+  // Add child components to this component.
+  // Will generate a new child component and then append child component's element to this component's element.
+  // Takes either the name of the UI component class, or an object that contains a name, UI Class, and options.
+  addComponent: function(name, options){
+    var component, componentClass;
+
+    // If string, create new component with options
+    if (typeof name == "string") {
+
+      // Make sure options is at least an empty object to protect against errors
+      options = options || {};
+
+      // Assume name of set is a lowercased name of the UI Class (PlayButton, etc.)
+      componentClass = options.componentClass || _V_.uc(name);
+
+      // Create a new object & element for this controls set
+      // If there's no .player, this is a player
+      component = new _V_[componentClass](this.player || this, options);
+
+    } else {
+      component = name;
+    }
+
+    // Add the UI object's element to the container div (box)
+    this.el.appendChild(component.el);
+
+    // Return so it can stored on parent object if desired.
+    return component;
+  },
+
+  removeComponent: function(component){
+    this.el.removeChild(component.el);
+  },
+
+  /* Display
+  ================================================================================ */
+  show: function(){
+    this.el.style.display = "block";
+  },
+
+  hide: function(){
+    this.el.style.display = "none";
+  },
+  
+  fadeIn: function(){
+    this.removeClass("vjs-fade-out");
+    this.addClass("vjs-fade-in");
+  },
+
+  fadeOut: function(){
+    this.removeClass("vjs-fade-in");
+    this.addClass("vjs-fade-out");
+  },
+
+  lockShowing: function(){
+    var style = this.el.style;
+    style.display = "block";
+    style.opacity = 1;
+    style.visiblity = "visible";
+  },
+
+  unlockShowing: function(){
+    var style = this.el.style;
+    style.display = "";
+    style.opacity = "";
+    style.visiblity = "";
+  },
+
+  addClass: function(classToAdd){
+    _V_.addClass(this.el, classToAdd);
+  },
+
+  removeClass: function(classToRemove){
+    _V_.removeClass(this.el, classToRemove);
+  },
+
+  /* Events
+  ================================================================================ */
+  addEvent: function(type, fn, uid){
+    return _V_.addEvent(this.el, type, _V_.proxy(this, fn));
+  },
+  removeEvent: function(type, fn){
+    return _V_.removeEvent(this.el, type, fn);
+  },
+  triggerEvent: function(type, e){
+    return _V_.triggerEvent(this.el, type, e);
+  },
+  one: function(type, fn) {
+    _V_.one(this.el, type, _V_.proxy(this, fn));
+  },
+
+  /* Ready - Trigger functions when component is ready
+  ================================================================================ */
+  ready: function(fn){
+    if (!fn) return this;
+
+    if (this.isReady) {
+      fn.call(this);
+    } else {
+      if (this.readyQueue === undefined) {
+        this.readyQueue = [];
+      }
+      this.readyQueue.push(fn);
+    }
+
+    return this;
+  },
+
+  triggerReady: function(){
+    this.isReady = true;
+    if (this.readyQueue && this.readyQueue.length > 0) {
+      // Call all functions in ready queue
+      this.each(this.readyQueue, function(fn){
+        fn.call(this);
+      });
+
+      // Reset Ready Queue
+      this.readyQueue = [];
+
+      // Allow for using event listeners also, in case you want to do something everytime a source is ready.
+      this.triggerEvent("ready");
+    }
+  },
+
+  /* Utility
+  ================================================================================ */
+  each: function(arr, fn){ _V_.each.call(this, arr, fn); },
+
+  eachProp: function(obj, fn){ _V_.eachProp.call(this, obj, fn); },
+
+  extend: function(obj){ _V_.merge(this, obj) },
+
+  // More easily attach 'this' to functions
+  proxy: function(fn, uid){  return _V_.proxy(this, fn, uid); }
+
+});

src/controls.js

@@ -0,0 +1,852 @@
+/* Control - Base class for all control elements
+================================================================================ */
+_V_.Control = _V_.Component.extend({
+
+  buildCSSClass: function(){
+    return "vjs-control " + this._super();
+  }
+
+});
+
+/* Control Bar
+================================================================================ */
+_V_.ControlBar = _V_.Component.extend({
+
+  options: {
+    loadEvent: "play",
+    components: {
+      "playToggle": {},
+      "fullscreenToggle": {},
+      "currentTimeDisplay": {},
+      "timeDivider": {},
+      "durationDisplay": {},
+      "remainingTimeDisplay": {},
+      "progressControl": {},
+      "volumeControl": {},
+      "muteToggle": {}
+    }
+  },
+
+  init: function(player, options){
+    this._super(player, options);
+
+    player.one("play", this.proxy(function(){
+      this.fadeIn();
+      this.player.addEvent("mouseover", this.proxy(this.fadeIn));
+      this.player.addEvent("mouseout", this.proxy(this.fadeOut));
+    }));
+
+  },
+
+  createElement: function(){
+    return _V_.createElement("div", {
+      className: "vjs-controls"
+    });
+  },
+
+  fadeIn: function(){
+    this._super();
+    this.player.triggerEvent("controlsvisible");
+  },
+
+  fadeOut: function(){
+    this._super();
+    this.player.triggerEvent("controlshidden");
+  },
+
+  lockShowing: function(){
+    this.el.style.opacity = "1";
+  }
+
+});
+
+/* Button - Base class for all buttons
+================================================================================ */
+_V_.Button = _V_.Control.extend({
+
+  init: function(player, options){
+    this._super(player, options);
+
+    this.addEvent("click", this.onClick);
+    this.addEvent("focus", this.onFocus);
+    this.addEvent("blur", this.onBlur);
+  },
+
+  createElement: function(type, attrs){
+    // Add standard Aria and Tabindex info
+    attrs = _V_.merge({
+      className: this.buildCSSClass(),
+      innerHTML: '<div><span class="vjs-control-text">' + (this.buttonText || "Need Text") + '</span></div>',
+      role: "button",
+      tabIndex: 0
+    }, attrs);
+
+    return this._super(type, attrs);
+  },
+
+  // Click - Override with specific functionality for button
+  onClick: function(){},
+
+  // Focus - Add keyboard functionality to element
+  onFocus: function(){
+    _V_.addEvent(document, "keyup", _V_.proxy(this, this.onKeyPress));
+  },
+
+  // KeyPress (document level) - Trigger click when keys are pressed
+  onKeyPress: function(event){
+    // Check for space bar (32) or enter (13) keys
+    if (event.which == 32 || event.which == 13) {
+      event.preventDefault();
+      this.onClick();
+    }
+  },
+
+  // Blur - Remove keyboard triggers
+  onBlur: function(){
+    _V_.removeEvent(document, "keyup", _V_.proxy(this, this.onKeyPress));
+  }
+
+});
+
+/* Play Button
+================================================================================ */
+_V_.PlayButton = _V_.Button.extend({
+
+  buttonText: "Play",
+
+  buildCSSClass: function(){
+    return "vjs-play-button " + this._super();
+  },
+
+  onClick: function(){
+    this.player.play();
+  }
+
+});
+
+/* Pause Button
+================================================================================ */
+_V_.PauseButton = _V_.Button.extend({
+
+  buttonText: "Pause",
+
+  buildCSSClass: function(){
+    return "vjs-pause-button " + this._super();
+  },
+
+  onClick: function(){
+    this.player.pause();
+  }
+
+});
+
+/* Play Toggle - Play or Pause Media
+================================================================================ */
+_V_.PlayToggle = _V_.Button.extend({
+
+  buttonText: "Play",
+
+  init: function(player, options){
+    this._super(player, options);
+
+    player.addEvent("play", _V_.proxy(this, this.onPlay));
+    player.addEvent("pause", _V_.proxy(this, this.onPause));
+  },
+
+  buildCSSClass: function(){
+    return "vjs-play-control " + this._super();
+  },
+
+  // OnClick - Toggle between play and pause
+  onClick: function(){
+    if (this.player.paused()) {
+      this.player.play();
+    } else {
+      this.player.pause();
+    }
+  },
+
+  // OnPlay - Add the vjs-playing class to the element so it can change appearance
+  onPlay: function(){
+    _V_.removeClass(this.el, "vjs-paused");
+    _V_.addClass(this.el, "vjs-playing");
+  },
+
+  // OnPause - Add the vjs-paused class to the element so it can change appearance
+  onPause: function(){
+    _V_.removeClass(this.el, "vjs-playing");
+    _V_.addClass(this.el, "vjs-paused");
+  }
+
+});
+
+
+/* Fullscreen Toggle Behaviors
+================================================================================ */
+_V_.FullscreenToggle = _V_.Button.extend({
+
+  buttonText: "Fullscreen",
+
+  buildCSSClass: function(){
+    return "vjs-fullscreen-control " + this._super();
+  },
+
+  onClick: function(){
+    if (!this.player.isFullScreen) {
+      this.player.requestFullScreen();
+    } else {
+      this.player.cancelFullScreen();
+    }
+  }
+
+});
+
+/* Big Play Button
+================================================================================ */
+_V_.BigPlayButton = _V_.Button.extend({
+  init: function(player, options){
+    this._super(player, options);
+
+    player.addEvent("play", _V_.proxy(this, this.hide));
+    player.addEvent("ended", _V_.proxy(this, this.show));
+  },
+
+  createElement: function(){
+    return this._super("div", {
+      className: "vjs-big-play-button",
+      innerHTML: "<span></span>"
+    });
+  },
+
+  onClick: function(){
+    // Go back to the beginning if big play button is showing at the end.
+    // Have to check for current time otherwise it might throw a 'not ready' error.
+    if(this.player.currentTime()) {
+      this.player.currentTime(0);
+    }
+    this.player.play();
+  }
+});
+
+/* Loading Spinner
+================================================================================ */
+_V_.LoadingSpinner = _V_.Component.extend({
+  init: function(player, options){
+    this._super(player, options);
+
+    player.addEvent("canplay", _V_.proxy(this, this.hide));
+    player.addEvent("canplaythrough", _V_.proxy(this, this.hide));
+    player.addEvent("playing", _V_.proxy(this, this.hide));
+
+    player.addEvent("seeking", _V_.proxy(this, this.show));
+
+    // in some browsers seeking does not trigger the 'playing' event,
+    // so we also need to trap 'seeked' if we are going to set a
+    // 'seeking' event
+    player.addEvent("seeked", _V_.proxy(this, this.hide));
+
+    player.addEvent("error", _V_.proxy(this, this.show));
+
+    // Not showing spinner on stalled any more. Browsers may stall and then not trigger any events that would remove the spinner.
+    // Checked in Chrome 16 and Safari 5.1.2. http://help.videojs.com/discussions/problems/883-why-is-the-download-progress-showing
+    // player.addEvent("stalled", _V_.proxy(this, this.show));
+
+    player.addEvent("waiting", _V_.proxy(this, this.show));
+  },
+
+  createElement: function(){
+
+    var classNameSpinner, innerHtmlSpinner;
+
+    if ( typeof this.player.el.style.WebkitBorderRadius == "string"
+         || typeof this.player.el.style.MozBorderRadius == "string"
+         || typeof this.player.el.style.KhtmlBorderRadius == "string"
+         || typeof this.player.el.style.borderRadius == "string")
+      {
+        classNameSpinner = "vjs-loading-spinner";
+        innerHtmlSpinner = "<div class='ball1'></div><div class='ball2'></div><div class='ball3'></div><div class='ball4'></div><div class='ball5'></div><div class='ball6'></div><div class='ball7'></div><div class='ball8'></div>";
+      } else {
+        classNameSpinner = "vjs-loading-spinner-fallback";
+        innerHtmlSpinner = "";
+      }
+
+    return this._super("div", {
+      className: classNameSpinner,
+      innerHTML: innerHtmlSpinner
+    });
+  }
+});
+
+/* Time
+================================================================================ */
+_V_.CurrentTimeDisplay = _V_.Component.extend({
+
+  init: function(player, options){
+    this._super(player, options);
+
+    player.addEvent("timeupdate", _V_.proxy(this, this.updateContent));
+  },
+
+  createElement: function(){
+    var el = this._super("div", {
+      className: "vjs-current-time vjs-time-controls vjs-control"
+    });
+
+    this.content = _V_.createElement("div", {
+      className: "vjs-current-time-display",
+      innerHTML: '0:00'
+    });
+
+    el.appendChild(_V_.createElement("div").appendChild(this.content));
+    return el;
+  },
+
+  updateContent: function(){
+    // Allows for smooth scrubbing, when player can't keep up.
+    var time = (this.player.scrubbing) ? this.player.values.currentTime : this.player.currentTime();
+    this.content.innerHTML = _V_.formatTime(time, this.player.duration());
+  }
+
+});
+
+_V_.DurationDisplay = _V_.Component.extend({
+
+  init: function(player, options){
+    this._super(player, options);
+
+    player.addEvent("timeupdate", _V_.proxy(this, this.updateContent));
+  },
+
+  createElement: function(){
+    var el = this._super("div", {
+      className: "vjs-duration vjs-time-controls vjs-control"
+    });
+
+    this.content = _V_.createElement("div", {
+      className: "vjs-duration-display",
+      innerHTML: '0:00'
+    });
+
+    el.appendChild(_V_.createElement("div").appendChild(this.content));
+    return el;
+  },
+
+  updateContent: function(){
+    if (this.player.duration()) { this.content.innerHTML = _V_.formatTime(this.player.duration()); }
+  }
+
+});
+
+// Time Separator (Not used in main skin, but still available, and could be used as a 'spare element')
+_V_.TimeDivider = _V_.Component.extend({
+
+  createElement: function(){
+    return this._super("div", {
+      className: "vjs-time-divider",
+      innerHTML: '<div><span>/</span></div>'
+    });
+  }
+
+});
+
+_V_.RemainingTimeDisplay = _V_.Component.extend({
+
+  init: function(player, options){
+    this._super(player, options);
+
+    player.addEvent("timeupdate", _V_.proxy(this, this.updateContent));
+  },
+
+  createElement: function(){
+    var el = this._super("div", {
+      className: "vjs-remaining-time vjs-time-controls vjs-control"
+    });
+
+    this.content = _V_.createElement("div", {
+      className: "vjs-remaining-time-display",
+      innerHTML: '-0:00'
+    });
+
+    el.appendChild(_V_.createElement("div").appendChild(this.content));
+    return el;
+  },
+
+  updateContent: function(){
+    if (this.player.duration()) { this.content.innerHTML = "-"+_V_.formatTime(this.player.remainingTime()); }
+
+    // Allows for smooth scrubbing, when player can't keep up.
+    // var time = (this.player.scrubbing) ? this.player.values.currentTime : this.player.currentTime();
+    // this.content.innerHTML = _V_.formatTime(time, this.player.duration());
+  }
+
+});
+
+/* Slider - Parent for seek bar and volume slider
+================================================================================ */
+_V_.Slider = _V_.Component.extend({
+
+  init: function(player, options){
+    this._super(player, options);
+
+    player.addEvent(this.playerEvent, _V_.proxy(this, this.update));
+
+    this.addEvent("mousedown", this.onMouseDown);
+    this.addEvent("focus", this.onFocus);
+    this.addEvent("blur", this.onBlur);
+
+    this.player.addEvent("controlsvisible", this.proxy(this.update));
+
+    // This is actually to fix the volume handle position. http://twitter.com/#!/gerritvanaaken/status/159046254519787520
+    // this.player.one("timeupdate", this.proxy(this.update));
+
+    this.update();
+  },
+
+  createElement: function(type, attrs) {
+    attrs = _V_.merge({
+      role: "slider",
+      "aria-valuenow": 0,
+      "aria-valuemin": 0,
+      "aria-valuemax": 100,
+      tabIndex: 0
+    }, attrs);
+
+    return this._super(type, attrs);
+  },
+
+  onMouseDown: function(event){
+    event.preventDefault();
+    _V_.blockTextSelection();
+
+    _V_.addEvent(document, "mousemove", _V_.proxy(this, this.onMouseMove));
+    _V_.addEvent(document, "mouseup", _V_.proxy(this, this.onMouseUp));
+
+    this.onMouseMove(event);
+  },
+
+  onMouseUp: function(event) {
+    _V_.unblockTextSelection();
+    _V_.removeEvent(document, "mousemove", this.onMouseMove, false);
+    _V_.removeEvent(document, "mouseup", this.onMouseUp, false);
+
+    this.update();
+  },
+
+  update: function(){
+    // If scrubbing, we could use a cached value to make the handle keep up with the user's mouse.
+    // On HTML5 browsers scrubbing is really smooth, but some flash players are slow, so we might want to utilize this later.
+    // var progress =  (this.player.scrubbing) ? this.player.values.currentTime / this.player.duration() : this.player.currentTime() / this.player.duration();
+
+    var barProgress,
+        progress = this.getPercent();
+        handle = this.handle,
+        bar = this.bar;
+
+    // Protect against no duration and other division issues
+    if (isNaN(progress)) { progress = 0; }
+
+    barProgress = progress;
+
+    // If there is a handle, we need to account for the handle in our calculation for progress bar
+    // so that it doesn't fall short of or extend past the handle.
+    if (handle) {
+
+      var box = this.el,
+          boxWidth = box.offsetWidth,
+
+          handleWidth = handle.el.offsetWidth,
+
+          // The width of the handle in percent of the containing box
+          // In IE, widths may not be ready yet causing NaN
+          handlePercent = (handleWidth) ? handleWidth / boxWidth : 0,
+
+          // Get the adjusted size of the box, considering that the handle's center never touches the left or right side.
+          // There is a margin of half the handle's width on both sides.
+          boxAdjustedPercent = 1 - handlePercent;
+
+          // Adjust the progress that we'll use to set widths to the new adjusted box width
+          adjustedProgress = progress * boxAdjustedPercent,
+
+          // The bar does reach the left side, so we need to account for this in the bar's width
+          barProgress = adjustedProgress + (handlePercent / 2);
+
+      // Move the handle from the left based on the adjected progress
+      handle.el.style.left = _V_.round(adjustedProgress * 100, 2) + "%";
+    }
+
+    // Set the new bar width
+    bar.el.style.width = _V_.round(barProgress * 100, 2) + "%";
+  },
+
+  calculateDistance: function(event){
+    var box = this.el,
+        boxX = _V_.findPosX(box),
+        boxW = box.offsetWidth,
+        handle = this.handle;
+
+    if (handle) {
+      var handleW = handle.el.offsetWidth;
+
+      // Adjusted X and Width, so handle doesn't go outside the bar
+      boxX = boxX + (handleW / 2);
+      boxW = boxW - handleW;
+    }
+
+    // Percent that the click is through the adjusted area
+    return Math.max(0, Math.min(1, (event.pageX - boxX) / boxW));
+  },
+
+  onFocus: function(event){
+    _V_.addEvent(document, "keyup", _V_.proxy(this, this.onKeyPress));
+  },
+
+  onKeyPress: function(event){
+    if (event.which == 37) { // Left Arrow
+      event.preventDefault();
+      this.stepBack();
+    } else if (event.which == 39) { // Right Arrow
+      event.preventDefault();
+      this.stepForward();
+    }
+  },
+
+  onBlur: function(event){
+    _V_.removeEvent(document, "keyup", _V_.proxy(this, this.onKeyPress));
+  }
+});
+
+
+/* Progress
+================================================================================ */
+
+// Progress Control: Seek, Load Progress, and Play Progress
+_V_.ProgressControl = _V_.Component.extend({
+
+  options: {
+    components: {
+      "seekBar": {}
+    }
+  },
+
+  createElement: function(){
+    return this._super("div", {
+      className: "vjs-progress-control vjs-control"
+    });
+  }
+
+});
+
+// Seek Bar and holder for the progress bars
+_V_.SeekBar = _V_.Slider.extend({
+
+  options: {
+    components: {
+      "loadProgressBar": {},
+
+      // Set property names to bar and handle to match with the parent Slider class is looking for
+      "bar": { componentClass: "PlayProgressBar" },
+      "handle": { componentClass: "SeekHandle" }
+    }
+  },
+
+  playerEvent: "timeupdate",
+
+  init: function(player, options){
+    this._super(player, options);
+  },
+
+  createElement: function(){
+    return this._super("div", {
+      className: "vjs-progress-holder"
+    });
+  },
+
+  getPercent: function(){
+    return this.player.currentTime() / this.player.duration();
+  },
+
+  onMouseDown: function(event){
+    this._super(event);
+
+    this.player.scrubbing = true;
+
+    this.videoWasPlaying = !this.player.paused();
+    this.player.pause();
+  },
+
+  onMouseMove: function(event){
+    var newTime = this.calculateDistance(event) * this.player.duration();
+
+    // Don't let video end while scrubbing.
+    if (newTime == this.player.duration()) { newTime = newTime - 0.1; }
+
+    // Set new time (tell player to seek to new time)
+    this.player.currentTime(newTime);
+  },
+
+  onMouseUp: function(event){
+    this._super(event);
+
+    this.player.scrubbing = false;
+    if (this.videoWasPlaying) {
+      this.player.play();
+    }
+  },
+
+  stepForward: function(){
+    this.player.currentTime(this.player.currentTime() + 1);
+  },
+
+  stepBack: function(){
+    this.player.currentTime(this.player.currentTime() - 1);
+  }
+
+});
+
+// Load Progress Bar
+_V_.LoadProgressBar = _V_.Component.extend({
+
+  init: function(player, options){
+    this._super(player, options);
+    player.addEvent("progress", _V_.proxy(this, this.update));
+  },
+
+  createElement: function(){
+    return this._super("div", {
+      className: "vjs-load-progress",
+      innerHTML: '<span class="vjs-control-text">Loaded: 0%</span>'
+    });
+  },
+
+  update: function(){
+    if (this.el.style) { this.el.style.width = _V_.round(this.player.bufferedPercent() * 100, 2) + "%"; }
+  }
+
+});
+
+// Play Progress Bar
+_V_.PlayProgressBar = _V_.Component.extend({
+
+  createElement: function(){
+    return this._super("div", {
+      className: "vjs-play-progress",
+      innerHTML: '<span class="vjs-control-text">Progress: 0%</span>'
+    });
+  }
+
+});
+
+// Seek Handle
+// SeekBar Behavior includes play progress bar, and seek handle
+// Needed so it can determine seek position based on handle position/size
+_V_.SeekHandle = _V_.Component.extend({
+
+  createElement: function(){
+    return this._super("div", {
+      className: "vjs-seek-handle",
+      innerHTML: '<span class="vjs-control-text">00:00</span>'
+    });
+  }
+
+});
+
+/* Volume Scrubber
+================================================================================ */
+// Progress Control: Seek, Load Progress, and Play Progress
+_V_.VolumeControl = _V_.Component.extend({
+
+  options: {
+    components: {
+      "volumeBar": {}
+    }
+  },
+
+  createElement: function(){
+    return this._super("div", {
+      className: "vjs-volume-control vjs-control"
+    });
+  }
+
+});
+
+_V_.VolumeBar = _V_.Slider.extend({
+
+  options: {
+    components: {
+      "bar": { componentClass: "VolumeLevel" },
+      "handle": { componentClass: "VolumeHandle" }
+    }
+  },
+
+  playerEvent: "volumechange",
+
+  createElement: function(){
+    return this._super("div", {
+      className: "vjs-volume-bar"
+    });
+  },
+
+  onMouseMove: function(event) {
+    this.player.volume(this.calculateDistance(event));
+  },
+
+  getPercent: function(){
+   return this.player.volume();
+  },
+
+  stepForward: function(){
+    this.player.volume(this.player.volume() + 0.1);
+  },
+
+  stepBack: function(){
+    this.player.volume(this.player.volume() - 0.1);
+  }
+});
+
+_V_.VolumeLevel = _V_.Component.extend({
+
+  createElement: function(){
+    return this._super("div", {
+      className: "vjs-volume-level",
+      innerHTML: '<span class="vjs-control-text"></span>'
+    });
+  }
+
+});
+
+_V_.VolumeHandle = _V_.Component.extend({
+
+  createElement: function(){
+    return this._super("div", {
+      className: "vjs-volume-handle",
+      innerHTML: '<span class="vjs-control-text"></span>'
+      // tabindex: 0,
+      // role: "slider", "aria-valuenow": 0, "aria-valuemin": 0, "aria-valuemax": 100
+    });
+  }
+
+});
+
+_V_.MuteToggle = _V_.Button.extend({
+
+  init: function(player, options){
+    this._super(player, options);
+
+    player.addEvent("volumechange", _V_.proxy(this, this.update));
+  },
+
+  createElement: function(){
+    return this._super("div", {
+      className: "vjs-mute-control vjs-control",
+      innerHTML: '<div><span class="vjs-control-text">Mute</span></div>'
+    });
+  },
+
+  onClick: function(event){
+    this.player.muted( this.player.muted() ? false : true );
+  },
+
+  update: function(event){
+    var vol = this.player.volume(),
+        level = 3;
+
+    if (vol == 0 || this.player.muted()) {
+      level = 0;
+    } else if (vol < 0.33) {
+      level = 1;
+    } else if (vol < 0.67) {
+      level = 2;
+    }
+
+    /* TODO improve muted icon classes */
+    _V_.each.call(this, [0,1,2,3], function(i){
+      _V_.removeClass(this.el, "vjs-vol-"+i);
+    });
+    _V_.addClass(this.el, "vjs-vol-"+level);
+  }
+
+});
+
+
+/* Poster Image
+================================================================================ */
+_V_.PosterImage = _V_.Button.extend({
+  init: function(player, options){
+    this._super(player, options);
+
+    if (!this.player.options.poster) {
+      this.hide();
+    }
+
+    player.addEvent("play", _V_.proxy(this, this.hide));
+  },
+
+  createElement: function(){
+    return _V_.createElement("img", {
+      className: "vjs-poster",
+      src: this.player.options.poster,
+
+      // Don't want poster to be tabbable.
+      tabIndex: -1
+    });
+  },
+
+  onClick: function(){
+    this.player.play();
+  }
+});
+
+/* Menu
+================================================================================ */
+// The base for text track and settings menu buttons.
+_V_.Menu = _V_.Component.extend({
+
+  init: function(player, options){
+    this._super(player, options);
+  },
+
+  addItem: function(component){
+    this.addComponent(component);
+    component.addEvent("click", this.proxy(function(){
+      this.unlockShowing();
+    }));
+  },
+
+  createElement: function(){
+    return this._super("ul", {
+      className: "vjs-menu"
+    });
+  }
+
+});
+
+_V_.MenuItem = _V_.Button.extend({
+
+  init: function(player, options){
+    this._super(player, options);
+
+    if (options.selected) {
+      this.addClass("vjs-selected");
+    }
+  },
+
+  createElement: function(type, attrs){
+    return this._super("li", _V_.merge({
+      className: "vjs-menu-item",
+      innerHTML: this.options.label
+    }, attrs));
+  },
+
+  onClick: function(){
+    this.selected(true);
+  },
+
+  selected: function(selected){
+    if (selected) {
+      this.addClass("vjs-selected");
+    } else {
+      this.removeClass("vjs-selected")
+    }
+  }
+
+});

src/core.js

@@ -0,0 +1,116 @@
+// HTML5 Shiv. Must be in <head> to support older browsers.
+document.createElement("video");document.createElement("audio");
+
+var VideoJS = function(id, addOptions, ready){
+  var tag; // Element of ID
+
+  // Allow for element or ID to be passed in
+  // String ID
+  if (typeof id == "string") {
+
+    // Adjust for jQuery ID syntax
+    if (id.indexOf("#") === 0) {
+      id = id.slice(1);
+    }
+
+    // If a player instance has already been created for this ID return it.
+    if (_V_.players[id]) {
+      return _V_.players[id];
+
+    // Otherwise get element for ID
+    } else {
+      tag = _V_.el(id)
+    }
+
+  // ID is a media element
+  } else {
+    tag = id;
+  }
+
+  // Check for a useable element
+  if (!tag || !tag.nodeName) { // re: nodeName, could be a box div also
+    throw new TypeError("The element or ID supplied is not valid. (VideoJS)"); // Returns
+  }
+
+  // Element may have a player attr referring to an already created player instance.
+  // If not, set up a new player and return the instance.
+  return tag.player || new _V_.Player(tag, addOptions, ready);
+},
+
+// Shortcut
+_V_ = VideoJS,
+
+// CDN Version. Used to target right flash swf.
+CDN_VERSION = "GENERATED_CDN_VSN";
+
+VideoJS.players = {};
+
+VideoJS.options = {
+
+  // Default order of fallback technology
+  techOrder: ["html5","flash"],
+  // techOrder: ["flash","html5"],
+
+  html5: {},
+  flash: { swf: "http://vjs.zencdn.net/c/video-js.swf" },
+
+  // Default of web browser is 300x150. Should rely on source width/height.
+  width: 300,
+  height: 150,
+
+  // defaultVolume: 0.85,
+  defaultVolume: 0.00, // The freakin seaguls are driving me crazy!
+
+  // Included control sets
+  components: {
+    "posterImage": {},
+    "textTrackDisplay": {},
+    "loadingSpinner": {},
+    "bigPlayButton": {},
+    "controlBar": {}
+  }
+
+  // components: [
+  //   "poster",
+  //   "loadingSpinner",
+  //   "bigPlayButton",
+  //   { name: "controlBar", options: {
+  //     components: [
+  //       "playToggle",
+  //       "fullscreenToggle",
+  //       "currentTimeDisplay",
+  //       "timeDivider",
+  //       "durationDisplay",
+  //       "remainingTimeDisplay",
+  //       { name: "progressControl", options: {
+  //         components: [
+  //           { name: "seekBar", options: {
+  //             components: [
+  //               "loadProgressBar",
+  //               "playProgressBar",
+  //               "seekHandle"
+  //             ]}
+  //           }
+  //         ]}
+  //       },
+  //       { name: "volumeControl", options: {
+  //         components: [
+  //           { name: "volumeBar", options: {
+  //             components: [
+  //               "volumeLevel",
+  //               "volumeHandle"
+  //             ]}
+  //           }
+  //         ]}
+  //       },
+  //       "muteToggle"
+  //     ]
+  //   }},
+  //   "subtitlesDisplay"/*, "replay"*/
+  // ]
+};
+
+// Set CDN Version of swf
+if (CDN_VERSION != "GENERATED_CDN_VSN") {
+  _V_.options.flash.swf = "http://vjs.zencdn.net/"+CDN_VERSION+"/video-js.swf"
+}

src/ecma.js

@@ -0,0 +1,217 @@
+// ECMA-262 is the standard for javascript.
+// The following methods are impelemented EXACTLY as described in the standard (according to Mozilla Docs), and do not override the default method if one exists.
+// This may conflict with other libraries that modify the array prototype, but those libs should update to use the standard.
+
+// [].indexOf
+// https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/indexOf
+if (!Array.prototype.indexOf) {
+    Array.prototype.indexOf = function (searchElement /*, fromIndex */ ) {
+        "use strict";
+        if (this === void 0 || this === null) {
+            throw new TypeError();
+        }
+        var t = Object(this);
+        var len = t.length >>> 0;
+        if (len === 0) {
+            return -1;
+        }
+        var n = 0;
+        if (arguments.length > 0) {
+            n = Number(arguments[1]);
+            if (n !== n) { // shortcut for verifying if it's NaN
+                n = 0;
+            } else if (n !== 0 && n !== (1 / 0) && n !== -(1 / 0)) {
+                n = (n > 0 || -1) * Math.floor(Math.abs(n));
+            }
+        }
+        if (n >= len) {
+            return -1;
+        }
+        var k = n >= 0 ? n : Math.max(len - Math.abs(n), 0);
+        for (; k < len; k++) {
+            if (k in t && t[k] === searchElement) {
+                return k;
+            }
+        }
+        return -1;
+    }
+}
+
+// NOT NEEDED YET
+// [].lastIndexOf
+// https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/lastIndexOf
+// if (!Array.prototype.lastIndexOf)
+// {
+//   Array.prototype.lastIndexOf = function(searchElement /*, fromIndex*/)
+//   {
+//     "use strict";
+// 
+//     if (this === void 0 || this === null)
+//       throw new TypeError();
+// 
+//     var t = Object(this);
+//     var len = t.length >>> 0;
+//     if (len === 0)
+//       return -1;
+// 
+//     var n = len;
+//     if (arguments.length > 1)
+//     {
+//       n = Number(arguments[1]);
+//       if (n !== n)
+//         n = 0;
+//       else if (n !== 0 && n !== (1 / 0) && n !== -(1 / 0))
+//         n = (n > 0 || -1) * Math.floor(Math.abs(n));
+//     }
+// 
+//     var k = n >= 0
+//           ? Math.min(n, len - 1)
+//           : len - Math.abs(n);
+// 
+//     for (; k >= 0; k--)
+//     {
+//       if (k in t && t[k] === searchElement)
+//         return k;
+//     }
+//     return -1;
+//   };
+// }
+
+
+// NOT NEEDED YET
+// Array forEach per ECMA standard https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/array/foreach
+// Production steps of ECMA-262, Edition 5, 15.4.4.18
+// Reference: http://es5.github.com/#x15.4.4.18
+// if ( !Array.prototype.forEach ) {
+// 
+//   Array.prototype.forEach = function( callback, thisArg ) {
+// 
+//     var T, k;
+// 
+//     if ( this == null ) {
+//       throw new TypeError( " this is null or not defined" );
+//     }
+// 
+//     // 1. Let O be the result of calling ToObject passing the |this| value as the argument.
+//     var O = Object(this);
+// 
+//     // 2. Let lenValue be the result of calling the Get internal method of O with the argument "length".
+//     // 3. Let len be ToUint32(lenValue).
+//     var len = O.length >>> 0;
+// 
+//     // 4. If IsCallable(callback) is false, throw a TypeError exception.
+//     // See: http://es5.github.com/#x9.11
+//     if ( {}.toString.call(callback) != "[object Function]" ) {
+//       throw new TypeError( callback + " is not a function" );
+//     }
+// 
+//     // 5. If thisArg was supplied, let T be thisArg; else let T be undefined.
+//     if ( thisArg ) {
+//       T = thisArg;
+//     }
+// 
+//     // 6. Let k be 0
+//     k = 0;
+// 
+//     // 7. Repeat, while k < len
+//     while( k < len ) {
+// 
+//       var kValue;
+// 
+//       // a. Let Pk be ToString(k).
+//       //   This is implicit for LHS operands of the in operator
+//       // b. Let kPresent be the result of calling the HasProperty internal method of O with argument Pk.
+//       //   This step can be combined with c
+//       // c. If kPresent is true, then
+//       if ( k in O ) {
+// 
+//         // i. Let kValue be the result of calling the Get internal method of O with argument Pk.
+//         kValue = O[ Pk ];
+// 
+//         // ii. Call the Call internal method of callback with T as the this value and
+//         // argument list containing kValue, k, and O.
+//         callback.call( T, kValue, k, O );
+//       }
+//       // d. Increase k by 1.
+//       k++;
+//     }
+//     // 8. return undefined
+//   };
+// }
+
+
+// NOT NEEDED YET
+// https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/map
+// Production steps of ECMA-262, Edition 5, 15.4.4.19
+// Reference: http://es5.github.com/#x15.4.4.19
+// if (!Array.prototype.map) {
+//   Array.prototype.map = function(callback, thisArg) {
+// 
+//     var T, A, k;
+// 
+//     if (this == null) {
+//       throw new TypeError(" this is null or not defined");
+//     }
+// 
+//     // 1. Let O be the result of calling ToObject passing the |this| value as the argument.
+//     var O = Object(this);
+// 
+//     // 2. Let lenValue be the result of calling the Get internal method of O with the argument "length".
+//     // 3. Let len be ToUint32(lenValue).
+//     var len = O.length >>> 0;
+// 
+//     // 4. If IsCallable(callback) is false, throw a TypeError exception.
+//     // See: http://es5.github.com/#x9.11
+//     if ({}.toString.call(callback) != "[object Function]") {
+//       throw new TypeError(callback + " is not a function");
+//     }
+// 
+//     // 5. If thisArg was supplied, let T be thisArg; else let T be undefined.
+//     if (thisArg) {
+//       T = thisArg;
+//     }
+// 
+//     // 6. Let A be a new array created as if by the expression new Array(len) where Array is
+//     // the standard built-in constructor with that name and len is the value of len.
+//     A = new Array(len);
+// 
+//     // 7. Let k be 0
+//     k = 0;
+// 
+//     // 8. Repeat, while k < len
+//     while(k < len) {
+// 
+//       var kValue, mappedValue;
+// 
+//       // a. Let Pk be ToString(k).
+//       //   This is implicit for LHS operands of the in operator
+//       // b. Let kPresent be the result of calling the HasProperty internal method of O with argument Pk.
+//       //   This step can be combined with c
+//       // c. If kPresent is true, then
+//       if (k in O) {
+// 
+//         // i. Let kValue be the result of calling the Get internal method of O with argument Pk.
+//         kValue = O[ k ];
+// 
+//         // ii. Let mappedValue be the result of calling the Call internal method of callback
+//         // with T as the this value and argument list containing kValue, k, and O.
+//         mappedValue = callback.call(T, kValue, k, O);
+// 
+//         // iii. Call the DefineOwnProperty internal method of A with arguments
+//         // Pk, Property Descriptor {Value: mappedValue, Writable: true, Enumerable: true, Configurable: true},
+//         // and false.
+// 
+//         // In browsers that support Object.defineProperty, use the following:
+//         // Object.defineProperty(A, Pk, { value: mappedValue, writable: true, enumerable: true, configurable: true });
+// 
+//         // For best browser support, use the following:
+//         A[ k ] = mappedValue;
+//       }
+//       // d. Increase k by 1.
+//       k++;
+//     }
+// 
+//     // 9. return A
+//     return A;
+//   };      
+// }

src/events.js

@@ -0,0 +1,302 @@
+// Event System (J.Resig - Secrets of a JS Ninja http://jsninja.com/ [Go read it, really])
+// (Book version isn't completely usable, so fixed some things and borrowed from jQuery where it's working)
+// 
+// This should work very similarly to jQuery's events, however it's based off the book version which isn't as
+// robust as jquery's, so there's probably some differences.
+// 
+// When you add an event listener using _V_.addEvent, 
+//   it stores the handler function in seperate cache object, 
+//   and adds a generic handler to the element's event,
+//   along with a unique id (guid) to the element.
+
+_V_.extend({
+
+  // Add an event listener to element
+  // It stores the handler function in a separate cache object
+  // and adds a generic handler to the element's event,
+  // along with a unique id (guid) to the element.
+  addEvent: function(elem, type, fn){
+    var data = _V_.getData(elem), handlers;
+
+    // We only need to generate one handler per element
+    if (data && !data.handler) {
+      // Our new meta-handler that fixes the event object and the context
+      data.handler = function(event){
+        event = _V_.fixEvent(event);
+        var handlers = _V_.getData(elem).events[event.type];
+        // Go through and call all the real bound handlers
+        if (handlers) {
+          
+          // Copy handlers so if handlers are added/removed during the process it doesn't throw everything off.
+          var handlersCopy = [];
+          _V_.each(handlers, function(handler, i){
+            handlersCopy[i] = handler;
+          })
+          
+          for (var i = 0, l = handlersCopy.length; i < l; i++) {
+            handlersCopy[i].call(elem, event);
+          }
+        }
+      };
+    }
+
+    // We need a place to store all our event data
+    if (!data.events) { data.events = {}; }
+
+    // And a place to store the handlers for this event type
+    handlers = data.events[type];
+
+    if (!handlers) {
+      handlers = data.events[ type ] = [];
+
+      // Attach our meta-handler to the element, since one doesn't exist
+      if (document.addEventListener) {
+        elem.addEventListener(type, data.handler, false);
+      } else if (document.attachEvent) {
+        elem.attachEvent("on" + type, data.handler);
+      }
+    }
+
+    if (!fn.guid) { fn.guid = _V_.guid++; }
+
+    handlers.push(fn);
+  },
+
+  removeEvent: function(elem, type, fn) {
+    var data = _V_.getData(elem), handlers;
+    // If no events exist, nothing to unbind
+    if (!data.events) { return; }
+
+    // Are we removing all bound events?
+    if (!type) {
+      for (type in data.events) {
+        _V_.cleanUpEvents(elem, type);
+      }
+      return;
+    }
+
+    // And a place to store the handlers for this event type
+    handlers = data.events[type];
+
+    // If no handlers exist, nothing to unbind
+    if (!handlers) { return; }
+
+    // See if we're only removing a single handler
+    if (fn && fn.guid) {
+      for (var i = 0; i < handlers.length; i++) {
+        // We found a match (don't stop here, there could be a couple bound)
+        if (handlers[i].guid === fn.guid) {
+          // Remove the handler from the array of handlers
+          handlers.splice(i--, 1);
+        }
+      }
+    }
+
+    _V_.cleanUpEvents(elem, type);
+  },
+
+  cleanUpEvents: function(elem, type) {
+    var data = _V_.getData(elem);
+    // Remove the events of a particular type if there are none left
+
+    if (data.events[type].length === 0) {
+      delete data.events[type];
+
+      // Remove the meta-handler from the element
+      if (document.removeEventListener) {
+        elem.removeEventListener(type, data.handler, false);
+      } else if (document.detachEvent) {
+        elem.detachEvent("on" + type, data.handler);
+      }
+    }
+
+    // Remove the events object if there are no types left
+    if (_V_.isEmpty(data.events)) {
+      delete data.events;
+      delete data.handler;
+    }
+
+    // Finally remove the expando if there is no data left
+    if (_V_.isEmpty(data)) {
+      _V_.removeData(elem);
+    }
+  },
+
+  fixEvent: function(event) {
+    if (event[_V_.expando]) { return event; }
+    // store a copy of the original event object
+    // and "clone" to set read-only properties
+    var originalEvent = event;
+    event = new _V_.Event(originalEvent);
+
+    for ( var i = _V_.Event.props.length, prop; i; ) {
+      prop = _V_.Event.props[ --i ];
+      event[prop] = originalEvent[prop];
+    }
+
+    // Fix target property, if necessary
+    if (!event.target) { event.target = event.srcElement || document; }
+
+    // check if target is a textnode (safari)
+    if (event.target.nodeType === 3) { event.target = event.target.parentNode; }
+
+    // Add relatedTarget, if necessary
+    if (!event.relatedTarget && event.fromElement) {
+      event.relatedTarget = event.fromElement === event.target ? event.toElement : event.fromElement;
+    }
+
+    // Calculate pageX/Y if missing and clientX/Y available
+    if ( event.pageX == null && event.clientX != null ) {
+      var eventDocument = event.target.ownerDocument || document,
+        doc = eventDocument.documentElement,
+        body = eventDocument.body;
+
+      event.pageX = event.clientX + (doc && doc.scrollLeft || body && body.scrollLeft || 0) - (doc && doc.clientLeft || body && body.clientLeft || 0);
+      event.pageY = event.clientY + (doc && doc.scrollTop  || body && body.scrollTop  || 0) - (doc && doc.clientTop  || body && body.clientTop  || 0);
+    }
+
+    // Add which for key events
+    if (event.which == null && (event.charCode != null || event.keyCode != null)) {
+      event.which = event.charCode != null ? event.charCode : event.keyCode;
+    }
+
+    // Add metaKey to non-Mac browsers (use ctrl for PC's and Meta for Macs)
+    if ( !event.metaKey && event.ctrlKey ) {
+      event.metaKey = event.ctrlKey;
+    }
+
+    // Add which for click: 1 === left; 2 === middle; 3 === right
+    // Note: button is not normalized, so don't use it
+    if ( !event.which && event.button !== undefined ) {
+      event.which = (event.button & 1 ? 1 : ( event.button & 2 ? 3 : ( event.button & 4 ? 2 : 0 ) ));
+    }
+
+    return event;
+  },
+
+  triggerEvent: function(elem, event) {
+    var data = _V_.getData(elem),
+        parent = elem.parentNode || elem.ownerDocument,
+        type = event.type || event,
+        handler;
+
+    if (data) { handler = data.handler }
+
+    // Added in attion to book. Book code was broke.
+    event = typeof event === "object" ?
+      event[_V_.expando] ? 
+        event :
+        new _V_.Event(type, event) :
+      new _V_.Event(type);
+
+    event.type = type;
+    if (handler) {
+      handler.call(elem, event);
+    }
+
+    // Clean up the event in case it is being reused
+    event.result = undefined;
+    event.target = elem;
+
+    // Bubble the event up the tree to the document,
+    // Unless it's been explicitly stopped
+    // if (parent && !event.isPropagationStopped()) {
+    //   _V_.triggerEvent(parent, event);
+    // 
+    // // We're at the top document so trigger the default action
+    // } else if (!parent && !event.isDefaultPrevented()) {
+    //   // log(type);
+    //   var targetData = _V_.getData(event.target);
+    //   // log(targetData);
+    //   var targetHandler = targetData.handler;
+    //   // log("2");
+    //   if (event.target[event.type]) {
+    //     // Temporarily disable the bound handler,
+    //     // don't want to execute it twice
+    //     if (targetHandler) {
+    //       targetData.handler = function(){};
+    //     }
+    // 
+    //     // Trigger the native event (click, focus, blur)
+    //     event.target[event.type]();
+    // 
+    //     // Restore the handler
+    //     if (targetHandler) {
+    //       targetData.handler = targetHandler;
+    //     }
+    //   }
+    // }
+  },
+  
+  one: function(elem, type, fn) {
+    _V_.addEvent(elem, type, function(){
+      _V_.removeEvent(elem, type, arguments.callee)
+      fn.apply(this, arguments);
+    });
+  }
+});
+
+// Custom Event object for standardizing event objects between browsers.
+_V_.Event = function(src, props){
+  // Event object
+  if (src && src.type) {
+    this.originalEvent = src;
+    this.type = src.type;
+
+    // Events bubbling up the document may have been marked as prevented
+    // by a handler lower down the tree; reflect the correct value.
+    this.isDefaultPrevented = (src.defaultPrevented || src.returnValue === false ||
+      src.getPreventDefault && src.getPreventDefault()) ? returnTrue : returnFalse;
+
+  // Event type
+  } else {
+    this.type = src;
+  }
+
+  // Put explicitly provided properties onto the event object
+  if (props) { _V_.merge(this, props); }
+
+  this.timeStamp = (new Date).getTime();
+
+  // Mark it as fixed
+  this[_V_.expando] = true;
+};
+
+_V_.Event.prototype = {
+  preventDefault: function() {
+    this.isDefaultPrevented = returnTrue;
+
+    var e = this.originalEvent;
+    if (!e) { return; }
+
+    // if preventDefault exists run it on the original event
+    if (e.preventDefault) { 
+      e.preventDefault();
+    // otherwise set the returnValue property of the original event to false (IE)
+    } else {
+      e.returnValue = false;
+    }
+  },
+  stopPropagation: function() {
+    this.isPropagationStopped = returnTrue;
+
+    var e = this.originalEvent;
+    if (!e) { return; }
+    // if stopPropagation exists run it on the original event
+    if (e.stopPropagation) { e.stopPropagation(); }
+    // otherwise set the cancelBubble property of the original event to true (IE)
+    e.cancelBubble = true;
+  },
+  stopImmediatePropagation: function() {
+    this.isImmediatePropagationStopped = returnTrue;
+    this.stopPropagation();
+  },
+  isDefaultPrevented: returnFalse,
+  isPropagationStopped: returnFalse,
+  isImmediatePropagationStopped: returnFalse
+};
+_V_.Event.props = "altKey attrChange attrName bubbles button cancelable charCode clientX clientY ctrlKey currentTarget data detail eventPhase fromElement handler keyCode metaKey newValue offsetX offsetY pageX pageY prevValue relatedNode relatedTarget screenX screenY shiftKey srcElement target toElement view wheelDelta which".split(" ");
+
+function returnTrue(){ return true; }
+function returnFalse(){ return false; }
+

src/json.js

@@ -0,0 +1,54 @@
+// Javascript JSON implementation
+// (Parse Method Only)
+// https://github.com/douglascrockford/JSON-js/blob/master/json2.js
+
+var JSON;
+if (!JSON) { JSON = {}; }
+
+(function(){
+  var cx = /[\u0000\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g;
+
+  if (typeof JSON.parse !== 'function') {
+      JSON.parse = function (text, reviver) {
+          var j;
+
+          function walk(holder, key) {
+              var k, v, value = holder[key];
+              if (value && typeof value === 'object') {
+                  for (k in value) {
+                      if (Object.prototype.hasOwnProperty.call(value, k)) {
+                          v = walk(value, k);
+                          if (v !== undefined) {
+                              value[k] = v;
+                          } else {
+                              delete value[k];
+                          }
+                      }
+                  }
+              }
+              return reviver.call(holder, key, value);
+          }
+          text = String(text);
+          cx.lastIndex = 0;
+          if (cx.test(text)) {
+              text = text.replace(cx, function (a) {
+                  return '\\u' +
+                      ('0000' + a.charCodeAt(0).toString(16)).slice(-4);
+              });
+          }
+
+          if (/^[\],:{}\s]*$/
+                  .test(text.replace(/\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g, '@')
+                      .replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g, ']')
+                      .replace(/(?:^|:|,)(?:\s*\[)+/g, ''))) {
+
+              j = eval('(' + text + ')');
+
+              return typeof reviver === 'function' ?
+                  walk({'': j}, '') : j;
+          }
+
+          throw new SyntaxError('JSON.parse');
+      };
+  }
+}());

src/lib.js

@@ -0,0 +1,354 @@
+_V_.merge = function(obj1, obj2, safe){
+  // Make sure second object exists
+  if (!obj2) { obj2 = {}; };
+
+  for (var attrname in obj2){
+    if (obj2.hasOwnProperty(attrname) && (!safe || !obj1.hasOwnProperty(attrname))) { obj1[attrname]=obj2[attrname]; }
+  }
+  return obj1;
+};
+_V_.extend = function(obj){ this.merge(this, obj, true); };
+
+_V_.extend({
+  tech: {}, // Holder for playback technology settings
+  controlSets: {}, // Holder for control set definitions
+
+  // Device Checks
+  isIE: function(){ return !+"\v1"; },
+  isFF: function(){ return !!_V_.ua.match("Firefox") },
+  isIPad: function(){ return navigator.userAgent.match(/iPad/i) !== null; },
+  isIPhone: function(){ return navigator.userAgent.match(/iPhone/i) !== null; },
+  isIOS: function(){ return VideoJS.isIPhone() || VideoJS.isIPad(); },
+  iOSVersion: function() {
+    var match = navigator.userAgent.match(/OS (\d+)_/i);
+    if (match && match[1]) { return match[1]; }
+  },
+  isAndroid: function(){ return navigator.userAgent.match(/Android.*AppleWebKit/i) !== null; },
+  androidVersion: function() {
+    var match = navigator.userAgent.match(/Android (\d+)\./i);
+    if (match && match[1]) { return match[1]; }
+  },
+
+  testVid: document.createElement("video"),
+  ua: navigator.userAgent,
+  support: {},
+
+  each: function(arr, fn){
+    if (!arr || arr.length === 0) { return; }
+    for (var i=0,j=arr.length; i<j; i++) {
+      fn.call(this, arr[i], i);
+    }
+  },
+
+  eachProp: function(obj, fn){
+    if (!obj) { return; }
+    for (var name in obj) {
+      if (obj.hasOwnProperty(name)) {
+        fn.call(this, name, obj[name]);
+      }
+    }
+  },
+
+  el: function(id){ return document.getElementById(id); },
+  createElement: function(tagName, attributes){
+    var el = document.createElement(tagName),
+        attrname;
+    for (attrname in attributes){
+      if (attributes.hasOwnProperty(attrname)) {
+        if (attrname.indexOf("-") !== -1) {
+          el.setAttribute(attrname, attributes[attrname]);
+        } else {
+          el[attrname] = attributes[attrname];
+        }
+      }
+    }
+    return el;
+  },
+
+  insertFirst: function(node, parent){
+    if (parent.firstChild) {
+      parent.insertBefore(node, parent.firstChild);
+    } else {
+      parent.appendChild(node);
+    }
+  },
+
+  addClass: function(element, classToAdd){
+    if ((" "+element.className+" ").indexOf(" "+classToAdd+" ") == -1) {
+      element.className = element.className === "" ? classToAdd : element.className + " " + classToAdd;
+    }
+  },
+
+  removeClass: function(element, classToRemove){
+    if (element.className.indexOf(classToRemove) == -1) { return; }
+    var classNames = element.className.split(" ");
+    classNames.splice(classNames.indexOf(classToRemove),1);
+    element.className = classNames.join(" ");
+  },
+  
+  remove: function(item, array){
+    if (!array) return;
+    var i = array.indexOf(item);
+    if (i != -1) { 
+      return array.splice(i, 1)
+    };
+  },
+
+  // Attempt to block the ability to select text while dragging controls
+  blockTextSelection: function(){
+    document.body.focus();
+    document.onselectstart = function () { return false; };
+  },
+  // Turn off text selection blocking
+  unblockTextSelection: function(){ document.onselectstart = function () { return true; }; },
+
+  // Return seconds as H:MM:SS or M:SS
+  // Supplying a guide (in seconds) will include enough leading zeros to cover the length of the guide
+  formatTime: function(seconds, guide) {
+    guide = guide || seconds; // Default to using seconds as guide
+    var s = Math.floor(seconds % 60),
+        m = Math.floor(seconds / 60 % 60),
+        h = Math.floor(seconds / 3600),
+        gm = Math.floor(guide / 60 % 60),
+        gh = Math.floor(guide / 3600);
+
+    // Check if we need to show hours
+    h = (h > 0 || gh > 0) ? h + ":" : "";
+
+    // If hours are showing, we may need to add a leading zero.
+    // Always show at least one digit of minutes.
+    m = (((h || gm >= 10) && m < 10) ? "0" + m : m) + ":";
+
+    // Check if leading zero is need for seconds
+    s = (s < 10) ? "0" + s : s;
+
+    return h + m + s;
+  },
+
+  uc: function(string){
+    return string.charAt(0).toUpperCase() + string.slice(1);
+  },
+
+  // Return the relative horizonal position of an event as a value from 0-1
+  getRelativePosition: function(x, relativeElement){
+    return Math.max(0, Math.min(1, (x - _V_.findPosX(relativeElement)) / relativeElement.offsetWidth));
+  },
+  
+  getComputedStyleValue: function(element, style){
+    return window.getComputedStyle(element, null).getPropertyValue(style);
+  },
+
+  trim: function(string){ return string.toString().replace(/^\s+/, "").replace(/\s+$/, ""); },
+  round: function(num, dec) {
+    if (!dec) { dec = 0; }
+    return Math.round(num*Math.pow(10,dec))/Math.pow(10,dec);
+  },
+
+  isEmpty: function(object) {
+    for (var prop in object) {
+      return false;
+    }
+    return true;
+  },
+
+  // Mimic HTML5 TimeRange Spec.
+  createTimeRange: function(start, end){
+    return {
+      length: 1,
+      start: function() { return start; },
+      end: function() { return end; }
+    };
+  },
+
+  /* Element Data Store. Allows for binding data to an element without putting it directly on the element.
+     Ex. Event listneres are stored here.
+     (also from jsninja.com)
+  ================================================================================ */
+  cache: {}, // Where the data is stored
+  guid: 1, // Unique ID for the element
+  expando: "vdata" + (new Date).getTime(), // Unique attribute to store element's guid in
+
+  // Returns the cache object where data for the element is stored
+  getData: function(elem){
+    var id = elem[_V_.expando];
+    if (!id) {
+      id = elem[_V_.expando] = _V_.guid++;
+      _V_.cache[id] = {};
+    }
+    return _V_.cache[id];
+  },
+  // Delete data for the element from the cache and the guid attr from element
+  removeData: function(elem){
+    var id = elem[_V_.expando];
+    if (!id) { return; }
+    // Remove all stored data
+    delete _V_.cache[id];
+    // Remove the expando property from the DOM node
+    try {
+      delete elem[_V_.expando];
+    } catch(e) {
+      if (elem.removeAttribute) {
+        elem.removeAttribute(_V_.expando);
+      } else {
+        // IE doesn't appear to support removeAttribute on the document element
+        elem[_V_.expando] = null;
+      }
+    }
+  },
+
+  /* Proxy (a.k.a Bind or Context). A simple method for changing the context of a function
+     It also stores a unique id on the function so it can be easily removed from events
+  ================================================================================ */
+  proxy: function(context, fn, uid) {
+    // Make sure the function has a unique ID
+    if (!fn.guid) { fn.guid = _V_.guid++; }
+
+    // Create the new function that changes the context
+    var ret = function() {
+      return fn.apply(context, arguments);
+    }
+
+    // Allow for the ability to individualize this function
+    // Needed in the case where multiple objects might share the same prototype
+    // IF both items add an event listener with the same function, then you try to remove just one
+    // it will remove both because they both have the same guid.
+    // when using this, you need to use the proxy method when you remove the listener as well.
+    ret.guid = (uid) ? uid + "_" + fn.guid : fn.guid;
+
+    return ret;
+  },
+
+  get: function(url, onSuccess, onError){
+    // if (netscape.security.PrivilegeManager.enablePrivilege) {
+    //   netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");
+    // }
+
+    var local = (url.indexOf("file:") == 0 || (window.location.href.indexOf("file:") == 0 && url.indexOf("http:") == -1));
+
+    if (typeof XMLHttpRequest == "undefined") {
+      XMLHttpRequest = function () {
+        try { return new ActiveXObject("Msxml2.XMLHTTP.6.0"); } catch (e) {}
+        try { return new ActiveXObject("Msxml2.XMLHTTP.3.0"); } catch (f) {}
+        try { return new ActiveXObject("Msxml2.XMLHTTP"); } catch (g) {}
+        throw new Error("This browser does not support XMLHttpRequest.");
+      };
+    }
+
+    var request = new XMLHttpRequest();
+
+    try {
+      request.open("GET", url);
+    } catch(e) {
+      _V_.log("VideoJS XMLHttpRequest (open)", e);
+      // onError(e);
+      return false;
+    }
+
+    request.onreadystatechange = _V_.proxy(this, function() {
+      if (request.readyState == 4) {
+        if (request.status == 200 || local && request.status == 0) {
+          onSuccess(request.responseText);
+        } else {
+          if (onError) {
+            onError();
+          }
+        }
+      }
+    });
+
+    try {
+      request.send();
+    } catch(e) {
+      _V_.log("VideoJS XMLHttpRequest (send)", e);
+      if (onError) {
+        onError(e);
+      }
+    }
+  },
+
+  /* Local Storage
+  ================================================================================ */
+  setLocalStorage: function(key, value){
+    // IE was throwing errors referencing the var anywhere without this
+    var localStorage = window.localStorage || false;
+    if (!localStorage) { return; }
+    try {
+      localStorage[key] = value;
+    } catch(e) {
+      if (e.code == 22 || e.code == 1014) { // Webkit == 22 / Firefox == 1014
+        _V_.log("LocalStorage Full (VideoJS)", e);
+      } else {
+        _V_.log("LocalStorage Error (VideoJS)", e);
+      }
+    }
+  },
+
+  // Get abosolute version of relative URL. Used to tell flash correct URL.
+  // http://stackoverflow.com/questions/470832/getting-an-absolute-url-from-a-relative-one-ie6-issue
+  getAbsoluteURL: function(url){
+
+    // Check if absolute URL
+    if (!url.match(/^https?:\/\//)) {
+      // Convert to absolute URL. Flash hosted off-site needs an absolute URL.
+      url = _V_.createElement('div', {
+        innerHTML: '<a href="'+url+'">x</a>'
+      }).firstChild.href;
+    }
+
+    return url;
+  }
+
+});
+
+// usage: log('inside coolFunc', this, arguments);
+// paulirish.com/2009/log-a-lightweight-wrapper-for-consolelog/
+_V_.log = function(){
+  _V_.log.history = _V_.log.history || [];// store logs to an array for reference
+  _V_.log.history.push(arguments);
+  if(window.console) {
+    arguments.callee = arguments.callee.caller;
+    var newarr = [].slice.call(arguments);
+    (typeof console.log === 'object' ? _V_.log.apply.call(console.log, console, newarr) : console.log.apply(console, newarr));
+  }
+};
+
+// make it safe to use console.log always
+(function(b){function c(){}for(var d="assert,count,debug,dir,dirxml,error,exception,group,groupCollapsed,groupEnd,info,log,timeStamp,profile,profileEnd,time,timeEnd,trace,warn".split(","),a;a=d.pop();){b[a]=b[a]||c}})((function(){try
+{console.log();return window.console;}catch(err){return window.console={};}})());
+
+// Offset Left
+// getBoundingClientRect technique from John Resig http://ejohn.org/blog/getboundingclientrect-is-awesome/
+if ("getBoundingClientRect" in document.documentElement) {
+  _V_.findPosX = function(el) {
+    var box;
+
+    try {
+      box = el.getBoundingClientRect();
+    } catch(e) {}
+
+    if (!box) { return 0; }
+
+    var docEl = document.documentElement,
+        body = document.body,
+        clientLeft = docEl.clientLeft || body.clientLeft || 0,
+        scrollLeft = window.pageXOffset || body.scrollLeft,
+        left = box.left + scrollLeft - clientLeft;
+
+    return left;
+  };
+} else {
+  _V_.findPosX = function(el) {
+    var curleft = el.offsetLeft;
+    // _V_.log(obj.className, obj.offsetLeft)
+    while(el = obj.offsetParent) {
+      if (el.className.indexOf("video-js") == -1) {
+        // _V_.log(el.offsetParent, "OFFSETLEFT", el.offsetLeft)
+        // _V_.log("-webkit-full-screen", el.webkitMatchesSelector("-webkit-full-screen"));
+        // _V_.log("-webkit-full-screen", el.querySelectorAll(".video-js:-webkit-full-screen"));
+      } else {
+      }
+      curleft += el.offsetLeft;
+    }
+    return curleft;
+  };
+}

src/player.js

@@ -0,0 +1,898 @@
+/* UI Component- Base class for all UI objects
+================================================================================ */
+_V_.Player = _V_.Component.extend({
+
+  init: function(tag, addOptions, ready){
+
+    this.tag = tag; // Store the original tag used to set options
+
+    var el = this.el = _V_.createElement("div"), // Div to contain video and controls
+        options = this.options = {};
+
+    // Set Options
+    _V_.merge(options, _V_.options); // Copy Global Defaults
+    _V_.merge(options, this.getVideoTagSettings()); // Override with Video Tag Options
+    _V_.merge(options, addOptions); // Override/extend with options from setup call
+
+    // Add callback to ready queue
+    this.ready(ready);
+
+    // Store controls setting, and then remove immediately so native controls don't flash.
+    tag.removeAttribute("controls");
+
+    // Poster will be handled by a manual <img>
+    tag.removeAttribute("poster");
+
+    // Make player findable on elements
+    tag.player = el.player = this;
+
+    // Wrap video tag in div (el/box) container
+    tag.parentNode.insertBefore(el, tag);
+    el.appendChild(tag); // Breaks iPhone, fixed in HTML5 setup.
+
+    // Give video tag properties to box
+    // ID will now reference box, not the video tag
+    this.id = el.id = tag.id;
+    el.className = tag.className;
+
+    // Update tag id/class for use as HTML5 playback tech
+    tag.id += "_html5_api";
+    tag.className = "vjs-tech";
+
+    // Make player easily findable by ID
+    _V_.players[el.id] = this;
+
+    // Make box use width/height of tag, or default 300x150
+    el.setAttribute("width", options.width);
+    el.setAttribute("height", options.height);
+
+    // Enforce with CSS since width/height attrs don't work on divs
+    el.style.width = options.width+"px";
+    el.style.height = options.height+"px";
+
+    // Remove width/height attrs from tag so CSS can make it 100% width/height
+    tag.removeAttribute("width");
+    tag.removeAttribute("height");
+
+    // Empty video tag sources and tracks so the built-in player doesn't use them also.
+    if (tag.hasChildNodes()) {
+      for (var i=0,j=tag.childNodes;i<j.length;i++) {
+        if (j[i].nodeName == "SOURCE" || j[i].nodeName == "TRACK") {
+          tag.removeChild(j[i]);
+        }
+      }
+    }
+
+    // Cache for video property values.
+    this.values = {};
+
+    this.addClass("vjs-paused");
+
+    this.addEvent("ended", this.onEnded);
+    this.addEvent("play", this.onPlay);
+    this.addEvent("pause", this.onPause);
+    this.addEvent("progress", this.onProgress);
+    this.addEvent("error", this.onError);
+
+    // When the API is ready, loop through the components and add to the player.
+    if (options.controls) {
+      this.ready(function(){
+        this.initComponents();
+      });
+    }
+
+    // Tracks defined in tracks.js
+    this.textTracks = [];
+    if (options.tracks && options.tracks.length > 0) {
+      this.addTextTracks(options.tracks);
+    }
+
+    // If there are no sources when the player is initialized,
+    // load the first supported playback technology.
+    if (!options.sources || options.sources.length == 0) {
+      for (var i=0,j=options.techOrder; i<j.length; i++) {
+        var techName = j[i],
+            tech = _V_[techName];
+
+        // Check if the browser supports this technology
+        if (tech.isSupported()) {
+          this.loadTech(techName);
+          break;
+        }
+      }
+    } else {
+      // Loop through playback technologies (HTML5, Flash) and check for support. Then load the best source.
+      // A few assumptions here:
+      //   All playback technologies respect preload false.
+      this.src(options.sources);
+    }
+  },
+
+  // Cache for video property values.
+  values: {},
+
+  destroy: function(){
+    // Ensure that tracking progress and time progress will stop and plater deleted
+    this.stopTrackingProgress();
+    this.stopTrackingCurrentTime();
+    _V_.players[this.id] = null;
+    delete _V_.players[this.id];
+    this.tech.destroy();
+    this.el.parentNode.removeChild(this.el);
+  },
+
+  createElement: function(type, options){},
+
+  getVideoTagSettings: function(){
+    var options = {
+      sources: [],
+      tracks: []
+    },
+    tag = this.tag,
+    getAttribute = "getAttribute"; // For better minification
+
+    options.src = tag[getAttribute]("src");
+    options.controls = tag[getAttribute]("controls") !== null;
+    options.poster = tag[getAttribute]("poster");
+    options.preload = tag[getAttribute]("preload");
+    options.autoplay = tag[getAttribute]("autoplay") !== null; // hasAttribute not IE <8 compatible
+    options.loop = tag[getAttribute]("loop") !== null;
+    options.muted = tag[getAttribute]("muted") !== null;
+
+    if (this.tag.hasChildNodes()) {
+      for (var c,i=0,j=this.tag.childNodes;i<j.length;i++) {
+        c = j[i];
+        if (c.nodeName == "SOURCE") {
+          options.sources.push({
+            src: c[getAttribute]('src'),
+            type: c[getAttribute]('type'),
+            media: c[getAttribute]('media'),
+            title: c[getAttribute]('title')
+          });
+        }
+        if (c.nodeName == "TRACK") {
+          options.tracks.push({
+            src: c[getAttribute]("src"),
+            kind: c[getAttribute]("kind"),
+            srclang: c[getAttribute]("srclang"),
+            label: c[getAttribute]("label"),
+            'default': c[getAttribute]("default") !== null,
+            title: c[getAttribute]("title")
+          });
+        }
+      }
+    }
+    return options;
+  },
+
+  /* PLayback Technology (tech)
+  ================================================================================ */
+  // Load/Create an instance of playback technlogy including element and API methods
+  // And append playback element in player div.
+  loadTech: function(techName, source){
+
+    // Pause and remove current playback technology
+    if (this.tech) {
+      this.unloadTech();
+
+    // If the first time loading, HTML5 tag will exist but won't be initialized
+    // So we need to remove it if we're not loading HTML5
+    } else if (techName != "html5" && this.tag) {
+      this.el.removeChild(this.tag);
+      this.tag = false;
+    }
+
+    this.techName = techName;
+
+    // Turn off API access because we're loading a new tech that might load asynchronously
+    this.isReady = false;
+
+    var techReady = function(){
+      this.player.triggerReady();
+
+      // Manually track progress in cases where the browser/flash player doesn't report it.
+      if (!this.support.progressEvent) {
+        this.player.manualProgressOn();
+      }
+
+      // Manually track timeudpates in cases where the browser/flash player doesn't report it.
+      if (!this.support.timeupdateEvent) {
+        this.player.manualTimeUpdatesOn();
+      }
+    }
+
+    // Grab tech-specific options from player options and add source and parent element to use.
+    var techOptions = _V_.merge({ source: source, parentEl: this.el }, this.options[techName])
+
+    if (source) {
+      if (source.src == this.values.src && this.values.currentTime > 0) {
+        techOptions.startTime = this.values.currentTime;
+      }
+
+      this.values.src = source.src;
+    }
+
+    // Initialize tech instance
+    this.tech = new _V_[techName](this, techOptions);
+    this.tech.ready(techReady);
+  },
+
+  unloadTech: function(){
+    this.tech.destroy();
+
+    // Turn off any manual progress or timeupdate tracking
+    if (this.manualProgress) { this.manualProgressOff(); }
+
+    if (this.manualTimeUpdates) { this.manualTimeUpdatesOff(); }
+
+    this.tech = false;
+  },
+
+  // There's many issues around changing the size of a Flash (or other plugin) object.
+  // First is a plugin reload issue in Firefox that has been around for 11 years: https://bugzilla.mozilla.org/show_bug.cgi?id=90268
+  // Then with the new fullscreen API, Mozilla and webkit browsers will reload the flash object after going to fullscreen.
+  // To get around this, we're unloading the tech, caching source and currentTime values, and reloading the tech once the plugin is resized.
+  // reloadTech: function(betweenFn){
+  //   _V_.log("unloadingTech")
+  //   this.unloadTech();
+  //   _V_.log("unloadedTech")
+  //   if (betweenFn) { betweenFn.call(); }
+  //   _V_.log("LoadingTech")
+  //   this.loadTech(this.techName, { src: this.values.src })
+  //   _V_.log("loadedTech")
+  // },
+
+  /* Fallbacks for unsupported event types
+  ================================================================================ */
+  // Manually trigger progress events based on changes to the buffered amount
+  // Many flash players and older HTML5 browsers don't send progress or progress-like events
+  manualProgressOn: function(){
+    this.manualProgress = true;
+
+    // Trigger progress watching when a source begins loading
+    this.trackProgress();
+
+    // Watch for a native progress event call on the tech element
+    // In HTML5, some older versions don't support the progress event
+    // So we're assuming they don't, and turning off manual progress if they do.
+    this.tech.addEvent("progress", function(){
+
+      // Remove this listener from the element
+      this.removeEvent("progress", arguments.callee);
+
+      // Update known progress support for this playback technology
+      this.support.progressEvent = true;
+
+      // Turn off manual progress tracking
+      this.player.manualProgressOff();
+    });
+  },
+
+  manualProgressOff: function(){
+    this.manualProgress = false;
+    this.stopTrackingProgress();
+  },
+
+  trackProgress: function(){
+    this.progressInterval = setInterval(_V_.proxy(this, function(){
+      // Don't trigger unless buffered amount is greater than last time
+      // log(this.values.bufferEnd, this.buffered().end(0), this.duration())
+      /* TODO: update for multiple buffered regions */
+      if (this.values.bufferEnd < this.buffered().end(0)) {
+        this.triggerEvent("progress");
+      } else if (this.bufferedPercent() == 1) {
+        this.stopTrackingProgress();
+        this.triggerEvent("progress"); // Last update
+      }
+    }), 500);
+  },
+  stopTrackingProgress: function(){ clearInterval(this.progressInterval); },
+
+  /* Time Tracking -------------------------------------------------------------- */
+  manualTimeUpdatesOn: function(){
+    this.manualTimeUpdates = true;
+
+    this.addEvent("play", this.trackCurrentTime);
+    this.addEvent("pause", this.stopTrackingCurrentTime);
+    // timeupdate is also called by .currentTime whenever current time is set
+
+    // Watch for native timeupdate event
+    this.tech.addEvent("timeupdate", function(){
+
+      // Remove this listener from the element
+      this.removeEvent("timeupdate", arguments.callee);
+
+      // Update known progress support for this playback technology
+      this.support.timeupdateEvent = true;
+
+      // Turn off manual progress tracking
+      this.player.manualTimeUpdatesOff();
+    });
+  },
+
+  manualTimeUpdatesOff: function(){
+    this.manualTimeUpdates = false;
+    this.stopTrackingCurrentTime();
+    this.removeEvent("play", this.trackCurrentTime);
+    this.removeEvent("pause", this.stopTrackingCurrentTime);
+  },
+
+  trackCurrentTime: function(){
+    if (this.currentTimeInterval) { this.stopTrackingCurrentTime(); }
+    this.currentTimeInterval = setInterval(_V_.proxy(this, function(){
+      this.triggerEvent("timeupdate");
+    }), 250); // 42 = 24 fps // 250 is what Webkit uses // FF uses 15
+  },
+
+  // Turn off play progress tracking (when paused or dragging)
+  stopTrackingCurrentTime: function(){ clearInterval(this.currentTimeInterval); },
+
+  /* Player event handlers (how the player reacts to certain events)
+  ================================================================================ */
+  onEnded: function(){
+    if (this.options.loop) {
+      this.currentTime(0);
+      this.play();
+    } else {
+      this.pause();
+      this.currentTime(0);
+      this.pause();
+    }
+  },
+
+  onPlay: function(){
+    _V_.removeClass(this.el, "vjs-paused");
+    _V_.addClass(this.el, "vjs-playing");
+  },
+
+  onPause: function(){
+    _V_.removeClass(this.el, "vjs-playing");
+    _V_.addClass(this.el, "vjs-paused");
+  },
+
+  onProgress: function(){
+    // Add custom event for when source is finished downloading.
+    if (this.bufferedPercent() == 1) {
+      this.triggerEvent("loadedalldata");
+    }
+  },
+
+  onError: function(e) {
+    _V_.log("Video Error", e);
+  },
+
+/* Player API
+================================================================================ */
+
+  // Pass values to the playback tech
+  techCall: function(method, arg){
+
+    // If it's not ready yet, call method when it is
+    if (!this.tech.isReady) {
+      this.tech.ready(function(){
+        this[method](arg);
+      });
+
+    // Otherwise call method now
+    } else {
+      try {
+        this.tech[method](arg);
+      } catch(e) {
+        _V_.log(e);
+      }
+    }
+  },
+
+  // Get calls can't wait for the tech, and sometimes don't need to.
+  techGet: function(method){
+
+    // Make sure tech is ready
+    if (this.tech.isReady) {
+
+      // Flash likes to die and reload when you hide or reposition it.
+      // In these cases the object methods go away and we get errors.
+      // When that happens we'll catch the errors and inform tech that it's not ready any more.
+      try {
+        return this.tech[method]();
+      } catch(e) {
+
+        // When building additional tech libs, an expected method may not be defined yet
+        if (this.tech[method] === undefined) {
+          _V_.log("Video.js: " + method + " method not defined for "+this.techName+" playback technology.", e);
+
+        } else {
+
+          // When a method isn't available on the object it throws a TypeError
+          if (e.name == "TypeError") {
+            _V_.log("Video.js: " + method + " unavailable on "+this.techName+" playback technology element.", e);
+            this.tech.isReady = false;
+
+          } else {
+            _V_.log(e);
+          }
+        }
+      }
+    }
+
+    return;
+  },
+
+  // Method for calling methods on the current playback technology
+  // techCall: function(method, arg){
+  // 
+  //   // if (this.isReady) {
+  //   //   
+  //   // } else {
+  //   //   _V_.log("The playback technology API is not ready yet. Use player.ready(myFunction)."+" ["+method+"]", arguments.callee.caller.arguments.callee.caller.arguments.callee.caller)
+  //   //   return false;
+  //   //   // throw new Error("The playback technology API is not ready yet. Use player.ready(myFunction)."+" ["+method+"]");
+  //   // }
+  // },
+
+  // http://dev.w3.org/html5/spec/video.html#dom-media-play
+  play: function(){
+    this.techCall("play");
+    return this;
+  },
+
+  // http://dev.w3.org/html5/spec/video.html#dom-media-pause
+  pause: function(){
+    this.techCall("pause");
+    return this;
+  },
+  
+  // http://dev.w3.org/html5/spec/video.html#dom-media-paused
+  // The initial state of paused should be true (in Safari it's actually false)
+  paused: function(){
+    return (this.techGet("paused") === false) ? false : true;
+  },
+
+  // http://dev.w3.org/html5/spec/video.html#dom-media-currenttime
+  currentTime: function(seconds){
+    if (seconds !== undefined) {
+
+      // Cache the last set value for smoother scrubbing.
+      this.values.lastSetCurrentTime = seconds;
+
+      this.techCall("setCurrentTime", seconds);
+
+      // Improve the accuracy of manual timeupdates
+      if (this.manualTimeUpdates) { this.triggerEvent("timeupdate"); }
+
+      return this;
+    }
+
+    // Cache last currentTime and return
+    // Default to 0 seconds
+    return this.values.currentTime = (this.techGet("currentTime") || 0);
+  },
+
+  // http://dev.w3.org/html5/spec/video.html#dom-media-duration
+  // Duration should return NaN if not available. ParseFloat will turn false-ish values to NaN.
+  duration: function(){
+    return parseFloat(this.techGet("duration"));
+  },
+
+  // Calculates how much time is left. Not in spec, but useful.
+  remainingTime: function(){
+    return this.duration() - this.currentTime();
+  },
+
+  // http://dev.w3.org/html5/spec/video.html#dom-media-buffered
+  // Buffered returns a timerange object. Kind of like an array of portions of the video that have been downloaded.
+  // So far no browsers return more than one range (portion)
+  buffered: function(){
+    var buffered = this.techGet("buffered"),
+        start = 0,
+        end = this.values.bufferEnd = this.values.bufferEnd || 0, // Default end to 0 and store in values
+        timeRange;
+
+    if (buffered && buffered.length > 0 && buffered.end(0) !== end) {
+      end = buffered.end(0);
+      // Storing values allows them be overridden by setBufferedFromProgress
+      this.values.bufferEnd = end;
+    }
+
+    return _V_.createTimeRange(start, end);
+  },
+
+  // Calculates amount of buffer is full. Not in spec but useful.
+  bufferedPercent: function(){
+    return (this.duration()) ? this.buffered().end(0) / this.duration() : 0;
+  },
+
+  // http://dev.w3.org/html5/spec/video.html#dom-media-volume
+  volume: function(percentAsDecimal){
+    var vol;
+
+    if (percentAsDecimal !== undefined) {
+      vol = Math.max(0, Math.min(1, parseFloat(percentAsDecimal))); // Force value to between 0 and 1
+      this.values.volume = vol;
+      this.techCall("setVolume", vol);
+      _V_.setLocalStorage("volume", vol);
+      return this;
+    }
+
+    // Default to 1 when returning current volume.
+    vol = parseFloat(this.techGet("volume"));
+    return (isNaN(vol)) ? 1 : vol;
+  },
+
+  // http://dev.w3.org/html5/spec/video.html#attr-media-muted
+  muted: function(muted){
+    if (muted !== undefined) {
+      this.techCall("setMuted", muted);
+      return this;
+    }
+    return this.techGet("muted") || false; // Default to false
+  },
+
+  // http://dev.w3.org/html5/spec/dimension-attributes.html#attr-dim-height
+  // Video tag width/height only work in pixels. No percents.
+  // We could potentially allow percents but won't for now until we can do testing around it.
+  width: function(width, skipListeners){
+    if (width !== undefined) {
+      this.el.width = width;
+      this.el.style.width = width+"px";
+
+      // skipListeners allows us to avoid triggering the resize event when setting both width and height
+      if (!skipListeners) { this.triggerEvent("resize"); }
+      return this;
+    }
+    return parseInt(this.el.getAttribute("width"));
+  },
+  height: function(height){
+    if (height !== undefined) {
+      this.el.height = height;
+      this.el.style.height = height+"px";
+      this.triggerEvent("resize");
+      return this;
+    }
+    return parseInt(this.el.getAttribute("height"));
+  },
+  // Set both width and height at the same time.
+  size: function(width, height){
+    // Skip resize listeners on width for optimization
+    return this.width(width, true).height(height);
+  },
+
+  // Check if current tech can support native fullscreen (e.g. with built in controls lik iOS, so not our flash swf)
+  supportsFullScreen: function(){ return this.techGet("supportsFullScreen") || false; },
+
+  // Turn on fullscreen (or window) mode
+  requestFullScreen: function(){
+    var requestFullScreen = _V_.support.requestFullScreen;
+
+    this.isFullScreen = true;
+
+    // Check for browser element fullscreen support
+    if (requestFullScreen) {
+
+      // Trigger fullscreenchange event after change
+      _V_.addEvent(document, requestFullScreen.eventName, this.proxy(function(){
+        this.isFullScreen = document[requestFullScreen.isFullScreen];
+
+        // If cancelling fullscreen, remove event listener.
+        if (this.isFullScreen == false) {
+          _V_.removeEvent(document, requestFullScreen.eventName, arguments.callee);
+        }
+
+        this.triggerEvent("fullscreenchange");
+      }));
+
+      // Flash and other plugins get reloaded when you take their parent to fullscreen.
+      // To fix that we'll remove the tech, and reload it after the resize has finished.
+      if (this.tech.support.fullscreenResize === false && this.options.flash.iFrameMode != true) {
+
+        this.pause();
+        this.unloadTech();
+
+        _V_.addEvent(document, requestFullScreen.eventName, this.proxy(function(){
+          _V_.removeEvent(document, requestFullScreen.eventName, arguments.callee);
+          this.loadTech(this.techName, { src: this.values.src });
+        }));
+
+        this.el[requestFullScreen.requestFn]();
+
+      } else {
+        this.el[requestFullScreen.requestFn]();
+      }
+
+    } else if (this.tech.supportsFullScreen()) {
+      this.triggerEvent("fullscreenchange");
+      this.techCall("enterFullScreen");
+
+    } else {
+      this.triggerEvent("fullscreenchange");
+      this.enterFullWindow();
+    }
+
+     return this;
+   },
+
+   cancelFullScreen: function(){
+    var requestFullScreen = _V_.support.requestFullScreen;
+
+    this.isFullScreen = false;
+
+    // Check for browser element fullscreen support
+    if (requestFullScreen) {
+
+     // Flash and other plugins get reloaded when you take their parent to fullscreen.
+     // To fix that we'll remove the tech, and reload it after the resize has finished.
+     if (this.tech.support.fullscreenResize === false && this.options.flash.iFrameMode != true) {
+
+       this.pause();
+       this.unloadTech();
+
+       _V_.addEvent(document, requestFullScreen.eventName, this.proxy(function(){
+         _V_.removeEvent(document, requestFullScreen.eventName, arguments.callee);
+         this.loadTech(this.techName, { src: this.values.src })
+       }));
+
+       document[requestFullScreen.cancelFn]();
+
+     } else {
+       document[requestFullScreen.cancelFn]();
+     }
+
+    } else if (this.tech.supportsFullScreen()) {
+     this.techCall("exitFullScreen");
+     this.triggerEvent("fullscreenchange");
+
+    } else {
+     this.exitFullWindow();
+     this.triggerEvent("fullscreenchange");
+    }
+
+    return this;
+  },
+
+  // When fullscreen isn't supported we can stretch the video container to as wide as the browser will let us.
+  enterFullWindow: function(){
+    this.isFullWindow = true;
+
+    // Storing original doc overflow value to return to when fullscreen is off
+    this.docOrigOverflow = document.documentElement.style.overflow;
+
+    // Add listener for esc key to exit fullscreen
+    _V_.addEvent(document, "keydown", _V_.proxy(this, this.fullWindowOnEscKey));
+
+    // Hide any scroll bars
+    document.documentElement.style.overflow = 'hidden';
+
+    // Apply fullscreen styles
+    _V_.addClass(document.body, "vjs-full-window");
+    _V_.addClass(this.el, "vjs-fullscreen");
+
+    this.triggerEvent("enterFullWindow");
+  },
+  fullWindowOnEscKey: function(event){
+    if (event.keyCode == 27) {
+      if (this.isFullScreen == true) {
+        this.cancelFullScreen();
+      } else {
+        this.exitFullWindow();
+      }
+    }
+  },
+
+  exitFullWindow: function(){
+    this.isFullWindow = false;
+    _V_.removeEvent(document, "keydown", this.fullWindowOnEscKey);
+
+    // Unhide scroll bars.
+    document.documentElement.style.overflow = this.docOrigOverflow;
+
+    // Remove fullscreen styles
+    _V_.removeClass(document.body, "vjs-full-window");
+    _V_.removeClass(this.el, "vjs-fullscreen");
+
+    // Resize the box, controller, and poster to original sizes
+    // this.positionAll();
+    this.triggerEvent("exitFullWindow");
+  },
+
+  selectSource: function(sources){
+
+    // Loop through each playback technology in the options order
+    for (var i=0,j=this.options.techOrder;i<j.length;i++) {
+      var techName = j[i],
+          tech = _V_[techName];
+          // tech = _V_.tech[techName];
+
+      // Check if the browser supports this technology
+      if (tech.isSupported()) {
+
+        // Loop through each source object
+        for (var a=0,b=sources;a<b.length;a++) {
+          var source = b[a];
+
+          // Check if source can be played with this technology
+          if (tech.canPlaySource.call(this, source)) {
+
+            return { source: source, tech: techName };
+
+          }
+        }
+      }
+    }
+
+    return false;
+  },
+
+  // src is a pretty powerful function
+  // If you pass it an array of source objects, it will find the best source to play and use that object.src
+  //   If the new source requires a new playback technology, it will switch to that.
+  // If you pass it an object, it will set the source to object.src
+  // If you pass it anything else (url string) it will set the video source to that
+  src: function(source){
+    // Case: Array of source objects to choose from and pick the best to play
+    if (source instanceof Array) {
+
+      var sourceTech = this.selectSource(source),
+          source,
+          techName;
+
+      if (sourceTech) {
+          source = sourceTech.source;
+          techName = sourceTech.tech;
+
+        // If this technology is already loaded, set source
+        if (techName == this.techName) {
+          this.src(source); // Passing the source object
+
+        // Otherwise load this technology with chosen source
+        } else {
+          this.loadTech(techName, source);
+        }
+      } else {
+        _V_.log("No compatible source and playback technology were found.")
+      }
+
+    // Case: Source object { src: "", type: "" ... }
+    } else if (source instanceof Object) {
+
+      if (_V_[this.techName].canPlaySource(source)) {
+        this.src(source.src);
+      } else {
+        // Send through tech loop to check for a compatible technology.
+        this.src([source]);
+      }
+
+    // Case: URL String (http://myvideo...)
+    } else {
+      // Cache for getting last set source
+      this.values.src = source;
+
+      if (!this.isReady) {
+        this.ready(function(){
+          this.src(source);
+        });
+      } else {
+        this.techCall("src", source);
+        if (this.options.preload == "auto") {
+          this.load();
+        }
+        if (this.options.autoplay) {
+          this.play();
+        }
+      }
+    }
+    return this;
+  },
+
+  // Begin loading the src data
+  // http://dev.w3.org/html5/spec/video.html#dom-media-load
+  load: function(){
+    this.techCall("load");
+    return this;
+  },
+
+  // http://dev.w3.org/html5/spec/video.html#dom-media-currentsrc
+  currentSrc: function(){
+    return this.techGet("currentSrc") || this.values.src || "";
+  },
+
+  // Attributes/Options
+  preload: function(value){
+    if (value !== undefined) {
+      this.techCall("setPreload", value);
+      this.options.preload = value;
+      return this;
+    }
+    return this.techGet("preload");
+  },
+  autoplay: function(value){
+    if (value !== undefined) {
+      this.techCall("setAutoplay", value);
+      this.options.autoplay = value;
+      return this;
+    }
+    return this.techGet("autoplay", value);
+  },
+  loop: function(value){
+    if (value !== undefined) {
+      this.techCall("setLoop", value);
+      this.options.loop = value;
+      return this;
+    }
+    return this.techGet("loop");
+  },
+
+  controls: function(){ return this.options.controls; },
+  poster: function(){ return this.techGet("poster"); },
+  error: function(){ return this.techGet("error"); },
+  ended: function(){ return this.techGet("ended"); }
+
+  // Methods to add support for
+  // networkState: function(){ return this.techCall("networkState"); },
+  // readyState: function(){ return this.techCall("readyState"); },
+  // seeking: function(){ return this.techCall("seeking"); },
+  // initialTime: function(){ return this.techCall("initialTime"); },
+  // startOffsetTime: function(){ return this.techCall("startOffsetTime"); },
+  // played: function(){ return this.techCall("played"); },
+  // seekable: function(){ return this.techCall("seekable"); },
+  // videoTracks: function(){ return this.techCall("videoTracks"); },
+  // audioTracks: function(){ return this.techCall("audioTracks"); },
+  // videoWidth: function(){ return this.techCall("videoWidth"); },
+  // videoHeight: function(){ return this.techCall("videoHeight"); },
+  // defaultPlaybackRate: function(){ return this.techCall("defaultPlaybackRate"); },
+  // playbackRate: function(){ return this.techCall("playbackRate"); },
+  // mediaGroup: function(){ return this.techCall("mediaGroup"); },
+  // controller: function(){ return this.techCall("controller"); },
+  // defaultMuted: function(){ return this.techCall("defaultMuted"); }
+});
+
+// RequestFullscreen API
+(function(){
+  var requestFn,
+      cancelFn,
+      eventName,
+      isFullScreen,
+      playerProto = _V_.Player.prototype;
+
+  // Current W3C Spec
+  // http://dvcs.w3.org/hg/fullscreen/raw-file/tip/Overview.html#api
+  // Mozilla Draft: https://wiki.mozilla.org/Gecko:FullScreenAPI#fullscreenchange_event
+  if (document.cancelFullscreen !== undefined) {
+    requestFn = "requestFullscreen";
+    cancelFn = "exitFullscreen";
+    eventName = "fullscreenchange";
+    isFullScreen = "fullScreen";
+
+  // Webkit (Chrome/Safari) and Mozilla (Firefox) have working implementaitons
+  // that use prefixes and vary slightly from the new W3C spec. Specifically, using 'exit' instead of 'cancel',
+  // and lowercasing the 'S' in Fullscreen.
+  // Other browsers don't have any hints of which version they might follow yet, so not going to try to predict by loopeing through all prefixes.
+  } else {
+
+    _V_.each(["moz", "webkit"], function(prefix){
+
+      // https://github.com/zencoder/video-js/pull/128
+      if ((prefix != "moz" || document.mozFullScreenEnabled) && document[prefix + "CancelFullScreen"] !== undefined) {
+        requestFn = prefix + "RequestFullScreen";
+        cancelFn = prefix + "CancelFullScreen";
+        eventName = prefix + "fullscreenchange";
+
+        if (prefix == "webkit") {
+          isFullScreen = prefix + "IsFullScreen";
+        } else {
+          isFullScreen = prefix + "FullScreen";
+        }
+      }
+
+    });
+
+  }
+
+  if (requestFn) {
+    _V_.support.requestFullScreen = {
+      requestFn: requestFn,
+      cancelFn: cancelFn,
+      eventName: eventName,
+      isFullScreen: isFullScreen
+    };
+  }
+
+})();

src/setup.js

@@ -0,0 +1,56 @@
+// Automatically set up any tags that have a data-setup attribute
+_V_.autoSetup = function(){
+  var options, vid, player,
+      vids = document.getElementsByTagName("video");
+
+  // Check if any media elements exist
+  if (vids && vids.length > 0) {
+
+    for (var i=0,j=vids.length; i<j; i++) {
+      vid = vids[i];
+
+      // Check if element exists, has getAttribute func.
+      // IE seems to consider typeof el.getAttribute == "object" instead of "function" like expected, at least when loading the player immediately.
+      if (vid && vid.getAttribute) {
+
+        // Make sure this player hasn't already been set up.
+        if (vid.player === undefined) {
+          options = vid.getAttribute("data-setup");
+
+          // Check if data-setup attr exists. 
+          // We only auto-setup if they've added the data-setup attr.
+          if (options !== null) {
+
+            // Parse options JSON
+            // If empty string, make it a parsable json object.
+            options = JSON.parse(options || "{}");
+
+            // Create new video.js instance.
+            player = _V_(vid, options);
+          }
+        }
+
+      // If getAttribute isn't defined, we need to wait for the DOM.
+      } else {
+        _V_.autoSetupTimeout(1);
+        break;
+      }
+    }
+
+  // No videos were found, so keep looping unless page is finisehd loading.
+  } else if (!_V_.windowLoaded) {
+    _V_.autoSetupTimeout(1);
+  }
+};
+
+// Pause to let the DOM keep processing
+_V_.autoSetupTimeout = function(wait){
+  setTimeout(_V_.autoSetup, wait);
+};
+
+_V_.addEvent(window, "load", function(){
+  _V_.windowLoaded = true;
+});
+
+// Run Auto-load players
+_V_.autoSetup();

src/tech.js

@@ -0,0 +1,694 @@
+/* Playback Technology - Base class for playback technologies
+================================================================================ */
+_V_.PlaybackTech = _V_.Component.extend({
+  init: function(player, options){
+    // this._super(player, options);
+
+    // Make playback element clickable
+    // _V_.addEvent(this.el, "click", _V_.proxy(this, _V_.PlayToggle.prototype.onClick));
+
+    // this.addEvent("click", this.proxy(this.onClick));
+
+    // player.triggerEvent("techready");
+  },
+  // destroy: function(){},
+  // createElement: function(){},
+  onClick: function(){
+    if (this.player.options.controls) {
+      _V_.PlayToggle.prototype.onClick.call(this);
+    }
+  }
+});
+
+// Create placeholder methods for each that warn when a method isn't supported by the current playback technology
+_V_.apiMethods = "play,pause,paused,currentTime,setCurrentTime,duration,buffered,volume,setVolume,muted,setMuted,width,height,supportsFullScreen,enterFullScreen,src,load,currentSrc,preload,setPreload,autoplay,setAutoplay,loop,setLoop,error,networkState,readyState,seeking,initialTime,startOffsetTime,played,seekable,ended,videoTracks,audioTracks,videoWidth,videoHeight,textTracks,defaultPlaybackRate,playbackRate,mediaGroup,controller,controls,defaultMuted".split(",");
+_V_.each(_V_.apiMethods, function(methodName){
+  _V_.PlaybackTech.prototype[methodName] = function(){
+    throw new Error("The '"+methodName+"' method is not available on the playback technology's API");
+  }
+});
+
+/* HTML5 Playback Technology - Wrapper for HTML5 Media API
+================================================================================ */
+_V_.html5 = _V_.PlaybackTech.extend({
+
+  init: function(player, options, ready){
+    this.player = player;
+    this.el = this.createElement();
+    this.ready(ready);
+
+    this.addEvent("click", this.proxy(this.onClick));
+
+    var source = options.source;
+
+    // If the element source is already set, we may have missed the loadstart event, and want to trigger it.
+    // We don't want to set the source again and interrupt playback.
+    if (source && this.el.currentSrc == source.src) {
+      player.triggerEvent("loadstart");
+
+    // Otherwise set the source if one was provided.
+    } else if (source) {
+      this.el.src = source.src;
+    }
+
+    // Chrome and Safari both have issues with autoplay.
+    // In Safari (5.1.1), when we move the video element into the container div, autoplay doesn't work.
+    // In Chrome (15), if you have autoplay + a poster + no controls, the video gets hidden (but audio plays)
+    // This fixes both issues. Need to wait for API, so it updates displays correctly
+    player.ready(function(){
+      if (this.options.autoplay && this.paused()) {
+        this.tag.poster = null; // Chrome Fix. Fixed in Chrome v16.
+        this.play();
+      }
+    });
+
+    this.setupTriggers();
+
+    this.triggerReady();
+  },
+
+  destroy: function(){
+    this.player.tag = false;
+    this.removeTriggers();
+    this.el.parentNode.removeChild(this.el);
+  },
+
+  createElement: function(){
+    var html5 = _V_.html5,
+        player = this.player,
+
+        // If possible, reuse original tag for HTML5 playback technology element
+        el = player.tag,
+        newEl;
+
+    // Check if this browser supports moving the element into the box.
+    // On the iPhone video will break if you move the element,
+    // So we have to create a brand new element.
+    if (!el || this.support.movingElementInDOM === false) {
+
+      // If the original tag is still there, remove it.
+      if (el) {
+        player.el.removeChild(el);
+      }
+
+      newEl = _V_.createElement("video", {
+        id: el.id || player.el.id + "_html5_api",
+        className: el.className || "vjs-tech"
+      });
+
+      el = newEl;
+      _V_.insertFirst(el, player.el);
+    }
+
+    // Update tag settings, in case they were overridden
+    _V_.each(["autoplay","preload","loop","muted"], function(attr){ // ,"poster"
+      if (player.options[attr] !== null) {
+        el[attr] = player.options[attr];
+      }
+    }, this);
+
+    return el;
+  },
+
+  // Make video events trigger player events
+  // May seem verbose here, but makes other APIs possible.
+  setupTriggers: function(){
+    _V_.each.call(this, _V_.html5.events, function(type){
+      _V_.addEvent(this.el, type, _V_.proxy(this.player, this.eventHandler));
+    });
+  },
+  removeTriggers: function(){
+    _V_.each.call(this, _V_.html5.events, function(type){
+      _V_.removeEvent(this.el, type, _V_.proxy(this.player, this.eventHandler));
+    });
+  },
+  eventHandler: function(e){
+    e.stopPropagation();
+    this.triggerEvent(e);
+  },
+
+  play: function(){ this.el.play(); },
+  pause: function(){ this.el.pause(); },
+  paused: function(){ return this.el.paused; },
+
+  currentTime: function(){ return this.el.currentTime; },
+  setCurrentTime: function(seconds){
+    try {
+      this.el.currentTime = seconds;
+      } catch(e) {
+        _V_.log(e, "Video isn't ready. (VideoJS)");
+      // this.warning(VideoJS.warnings.videoNotReady);
+    }
+  },
+
+  duration: function(){ return this.el.duration || 0; },
+  buffered: function(){ return this.el.buffered; },
+
+  volume: function(){ return this.el.volume; },
+  setVolume: function(percentAsDecimal){ this.el.volume = percentAsDecimal; },
+  muted: function(){ return this.el.muted; },
+  setMuted: function(muted){ this.el.muted = muted },
+
+  width: function(){ return this.el.offsetWidth; },
+  height: function(){ return this.el.offsetHeight; },
+
+  supportsFullScreen: function(){
+    if (typeof this.el.webkitEnterFullScreen == 'function') {
+
+      // Seems to be broken in Chromium/Chrome && Safari in Leopard
+      if (!navigator.userAgent.match("Chrome") && !navigator.userAgent.match("Mac OS X 10.5")) {
+        return true;
+      }
+    }
+    return false;
+  },
+
+  enterFullScreen: function(){
+      try {
+        this.el.webkitEnterFullScreen();
+      } catch (e) {
+        if (e.code == 11) {
+          // this.warning(VideoJS.warnings.videoNotReady);
+          _V_.log("VideoJS: Video not ready.")
+        }
+      }
+  },
+  src: function(src){ this.el.src = src; },
+  load: function(){ this.el.load(); },
+  currentSrc: function(){ return this.el.currentSrc; },
+
+  preload: function(){ return this.el.preload; },
+  setPreload: function(val){ this.el.preload = val; },
+  autoplay: function(){ return this.el.autoplay; },
+  setAutoplay: function(val){ this.el.autoplay = val; },
+  loop: function(){ return this.el.loop; },
+  setLoop: function(val){ this.el.loop = val; },
+
+  error: function(){ return this.el.error; },
+  // networkState: function(){ return this.el.networkState; },
+  // readyState: function(){ return this.el.readyState; },
+  seeking: function(){ return this.el.seeking; },
+  // initialTime: function(){ return this.el.initialTime; },
+  // startOffsetTime: function(){ return this.el.startOffsetTime; },
+  // played: function(){ return this.el.played; },
+  // seekable: function(){ return this.el.seekable; },
+  ended: function(){ return this.el.ended; },
+  // videoTracks: function(){ return this.el.videoTracks; },
+  // audioTracks: function(){ return this.el.audioTracks; },
+  // videoWidth: function(){ return this.el.videoWidth; },
+  // videoHeight: function(){ return this.el.videoHeight; },
+  // textTracks: function(){ return this.el.textTracks; },
+  // defaultPlaybackRate: function(){ return this.el.defaultPlaybackRate; },
+  // playbackRate: function(){ return this.el.playbackRate; },
+  // mediaGroup: function(){ return this.el.mediaGroup; },
+  // controller: function(){ return this.el.controller; },
+  controls: function(){ return this.player.options.controls; },
+  defaultMuted: function(){ return this.el.defaultMuted; }
+});
+
+/* HTML5 Support Testing -------------------------------------------------------- */
+
+_V_.html5.isSupported = function(){
+  return !!document.createElement("video").canPlayType;
+};
+
+_V_.html5.canPlaySource = function(srcObj){
+  return !!document.createElement("video").canPlayType(srcObj.type);
+  // TODO: Check Type
+  // If no Type, check ext
+  // Check Media Type
+};
+
+// List of all HTML5 events (various uses).
+_V_.html5.events = "loadstart,suspend,abort,error,emptied,stalled,loadedmetadata,loadeddata,canplay,canplaythrough,playing,waiting,seeking,seeked,ended,durationchange,timeupdate,progress,play,pause,ratechange,volumechange".split(",");
+
+/* HTML5 Device Fixes ---------------------------------------------------------- */
+
+_V_.html5.prototype.support = {
+
+  // Support for tech specific full screen. (webkitEnterFullScreen, not requestFullscreen)
+  // http://developer.apple.com/library/safari/#documentation/AudioVideo/Reference/HTMLVideoElementClassReference/HTMLVideoElement/HTMLVideoElement.html
+  // Seems to be broken in Chromium/Chrome && Safari in Leopard
+  fullscreen: (typeof _V_.testVid.webkitEnterFullScreen !== undefined) ? (!_V_.ua.match("Chrome") && !_V_.ua.match("Mac OS X 10.5") ? true : false) : false,
+
+  // In iOS, if you move a video element in the DOM, it breaks video playback.
+  movingElementInDOM: !_V_.isIOS()
+
+};
+
+// Android
+if (_V_.isAndroid()) {
+
+  // Override Android 2.2 and less canPlayType method which is broken
+  if (_V_.androidVersion() < 3) {
+    document.createElement("video").constructor.prototype.canPlayType = function(type){
+      return (type && type.toLowerCase().indexOf("video/mp4") != -1) ? "maybe" : "";
+    };
+  }
+}
+
+
+/* VideoJS-SWF - Custom Flash Player with HTML5-ish API - https://github.com/zencoder/video-js-swf
+================================================================================ */
+_V_.flash = _V_.PlaybackTech.extend({
+
+  init: function(player, options){
+    this.player = player;
+
+    var source = options.source,
+
+        // Which element to embed in
+        parentEl = options.parentEl,
+
+        // Create a temporary element to be replaced by swf object
+        placeHolder = this.el = _V_.createElement("div", { id: parentEl.id + "_temp_flash" }),
+
+        // Generate ID for swf object
+        objId = player.el.id+"_flash_api",
+
+        // Store player options in local var for optimization
+        playerOptions = player.options,
+
+        // Merge default flashvars with ones passed in to init
+        flashVars = _V_.merge({
+
+          // SWF Callback Functions
+          readyFunction: "_V_.flash.onReady",
+          eventProxyFunction: "_V_.flash.onEvent",
+          errorEventProxyFunction: "_V_.flash.onError",
+
+          // Player Settings
+          autoplay: playerOptions.autoplay,
+          preload: playerOptions.preload,
+          loop: playerOptions.loop,
+          muted: playerOptions.muted
+
+        }, options.flashVars),
+
+        // Merge default parames with ones passed in
+        params = _V_.merge({
+          wmode: "opaque", // Opaque is needed to overlay controls, but can affect playback performance
+          bgcolor: "#000000" // Using bgcolor prevents a white flash when the object is loading
+        }, options.params),
+
+        // Merge default attributes with ones passed in
+        attributes = _V_.merge({
+          id: objId,
+          name: objId, // Both ID and Name needed or swf to identifty itself
+          'class': 'vjs-tech'
+        }, options.attributes)
+    ;
+
+    // If source was supplied pass as a flash var.
+    if (source) {
+      flashVars.src = encodeURIComponent(_V_.getAbsoluteURL(source.src));
+    }
+
+    // Add placeholder to player div
+    _V_.insertFirst(placeHolder, parentEl);
+
+    // Having issues with Flash reloading on certain page actions (hide/resize/fullscreen) in certain browsers
+    // This allows resetting the playhead when we catch the reload
+    if (options.startTime) {
+      this.ready(function(){
+        this.load();
+        this.play();
+        this.currentTime(options.startTime);
+      });
+    }
+
+    // Flash iFrame Mode
+    // In web browsers there are multiple instances where changing the parent element or visibility of a plugin causes the plugin to reload.
+    // - Firefox just about always. https://bugzilla.mozilla.org/show_bug.cgi?id=90268 (might be fixed by version 13)
+    // - Webkit when hiding the plugin
+    // - Webkit and Firefox when using requestFullScreen on a parent element
+    // Loading the flash plugin into a dynamically generated iFrame gets around most of these issues.
+    // Issues that remain include hiding the element and requestFullScreen in Firefox specifically
+
+    // There's on particularly annoying issue with this method which is that Firefox throws a security error on an offsite Flash object loaded into a dynamically created iFrame.
+    // Even though the iframe was inserted into a page on the web, Firefox + Flash considers it a local app trying to access an internet file.
+    // I tried mulitple ways of setting the iframe src attribute but couldn't find a src that worked well. Tried a real/fake source, in/out of domain.
+    // Also tried a method from stackoverflow that caused a security error in all browsers. http://stackoverflow.com/questions/2486901/how-to-set-document-domain-for-a-dynamically-generated-iframe
+    // In the end the solution I found to work was setting the iframe window.location.href right before doing a document.write of the Flash object.
+    // The only downside of this it seems to trigger another http request to the original page (no matter what's put in the href). Not sure why that is.
+
+    // NOTE (2012-01-29): Cannot get Firefox to load the remote hosted SWF into a dynamically created iFrame
+    // Firefox 9 throws a security error, unleess you call location.href right before doc.write.
+    //    Not sure why that even works, but it causes the browser to look like it's continuously trying to load the page.
+    // Firefox 3.6 keeps calling the iframe onload function anytime I write to it, causing an endless loop.
+
+    if (options.iFrameMode == true && !_V_.isFF) {
+
+      // Create iFrame with vjs-tech class so it's 100% width/height
+      var iFrm = _V_.createElement("iframe", {
+        id: objId + "_iframe",
+        name: objId + "_iframe",
+        className: "vjs-tech",
+        scrolling: "no",
+        marginWidth: 0,
+        marginHeight: 0,
+        frameBorder: 0
+      });
+
+      // Update ready function names in flash vars for iframe window
+      flashVars.readyFunction = "ready";
+      flashVars.eventProxyFunction = "events";
+      flashVars.errorEventProxyFunction = "errors";
+
+      // Tried multiple methods to get this to work in all browsers
+
+      // Tried embedding the flash object in the page first, and then adding a place holder to the iframe, then replacing the placeholder with the page object.
+      // The goal here was to try to load the swf URL in the parent page first and hope that got around the firefox security error
+      // var newObj = _V_.flash.embed(options.swf, placeHolder, flashVars, params, attributes);
+      // (in onload)
+      //  var temp = _V_.createElement("a", { id:"asdf", innerHTML: "asdf" } );
+      //  iDoc.body.appendChild(temp);
+
+      // Tried embedding the flash object through javascript in the iframe source.
+      // This works in webkit but still triggers the firefox security error
+      // iFrm.src = "javascript: document.write('"+_V_.flash.getEmbedCode(options.swf, flashVars, params, attributes)+"');";
+
+      // Tried an actual local iframe just to make sure that works, but it kills the easiness of the CDN version if you require the user to host an iframe
+      // We should add an option to host the iframe locally though, because it could help a lot of issues.
+      // iFrm.src = "iframe.html";
+
+      // Wait until iFrame has loaded to write into it.
+      _V_.addEvent(iFrm, "load", _V_.proxy(this, function(){
+
+        var iDoc, objTag, swfLoc,
+            iWin = iFrm.contentWindow,
+            varString = "";
+
+
+        // The one working method I found was to use the iframe's document.write() to create the swf object
+        // This got around the security issue in all browsers except firefox.
+        // I did find a hack where if I call the iframe's window.location.href="", it would get around the security error
+        // However, the main page would look like it was loading indefinitely (URL bar loading spinner would never stop)
+        // Plus Firefox 3.6 didn't work no matter what I tried.
+        // if (_V_.ua.match("Firefox")) {
+        //   iWin.location.href = "";
+        // }
+
+        // Get the iFrame's document depending on what the browser supports
+        iDoc = iFrm.contentDocument ? iFrm.contentDocument : iFrm.contentWindow.document;
+
+        // Tried ensuring both document domains were the same, but they already were, so that wasn't the issue.
+        // Even tried adding /. that was mentioned in a browser security writeup
+        // document.domain = document.domain+"/.";
+        // iDoc.domain = document.domain+"/.";
+
+        // Tried adding the object to the iframe doc's innerHTML. Security error in all browsers.
+        // iDoc.body.innerHTML = swfObjectHTML;
+
+        // Tried appending the object to the iframe doc's body. Security error in all browsers.
+        // iDoc.body.appendChild(swfObject);
+
+        // Using document.write actually got around the security error that browsers were throwing.
+        // Again, it's a dynamically generated (same domain) iframe, loading an external Flash swf.
+        // Not sure why that's a security issue, but apparently it is.
+        iDoc.write(_V_.flash.getEmbedCode(options.swf, flashVars, params, attributes));
+
+        // Setting variables on the window needs to come after the doc write because otherwise they can get reset in some browsers
+        // So far no issues with swf ready event being called before it's set on the window.
+        iWin.player = this.player;
+
+        // Create swf ready function for iFrame window
+        iWin.ready = _V_.proxy(this.player, function(currSwf){
+          var el = iDoc.getElementById(currSwf),
+              player = this,
+              tech = player.tech;
+
+          // Update reference to playback technology element
+          tech.el = el;
+
+          // Now that the element is ready, make a click on the swf play the video
+          _V_.addEvent(el, "click", tech.proxy(tech.onClick));
+
+          // Make sure swf is actually ready. Sometimes the API isn't actually yet.
+          _V_.flash.checkReady(tech);
+        });
+
+        // Create event listener for all swf events
+        iWin.events = _V_.proxy(this.player, function(swfID, eventName, other){
+          var player = this;
+          if (player && player.techName == "flash") {
+            player.triggerEvent(eventName);
+          }
+        });
+
+        // Create error listener for all swf errors
+        iWin.errors = _V_.proxy(this.player, function(swfID, eventName){
+          _V_.log("Flash Error", eventName);
+        });
+
+      }));
+
+      // Replace placeholder with iFrame (it will load now)
+      placeHolder.parentNode.replaceChild(iFrm, placeHolder);
+
+    // If not using iFrame mode, embed as normal object
+    } else {
+      _V_.flash.embed(options.swf, placeHolder, flashVars, params, attributes);
+    }
+  },
+
+  destroy: function(){
+    this.el.parentNode.removeChild(this.el);
+  },
+
+  // setupTriggers: function(){}, // Using global onEvent func to distribute events
+
+  play: function(){ this.el.vjs_play(); },
+  pause: function(){ this.el.vjs_pause(); },
+  src: function(src){
+    // Make sure source URL is abosolute.
+    src = _V_.getAbsoluteURL(src);
+
+    this.el.vjs_src(src);
+
+    // Currently the SWF doesn't autoplay if you load a source later.
+    // e.g. Load player w/ no source, wait 2s, set src.
+    if (this.player.autoplay()) {
+      var tech = this;
+      setTimeout(function(){ tech.play(); }, 0);
+    }
+  },
+  load: function(){ this.el.vjs_load(); },
+  poster: function(){ this.el.vjs_getProperty("poster"); },
+
+  buffered: function(){
+    return _V_.createTimeRange(0, this.el.vjs_getProperty("buffered"));
+  },
+
+  supportsFullScreen: function(){
+    return false; // Flash does not allow fullscreen through javascript
+  },
+  enterFullScreen: function(){
+    return false;
+  }
+});
+
+// Create setters and getters for attributes
+(function(){
+
+  var api = _V_.flash.prototype,
+      readWrite = "preload,currentTime,defaultPlaybackRate,playbackRate,autoplay,loop,mediaGroup,controller,controls,volume,muted,defaultMuted".split(","),
+      readOnly = "error,currentSrc,networkState,readyState,seeking,initialTime,duration,startOffsetTime,paused,played,seekable,ended,videoTracks,audioTracks,videoWidth,videoHeight,textTracks".split(","),
+      callOnly = "load,play,pause".split(",");
+      // Overridden: buffered
+
+      createSetter = function(attr){
+        var attrUpper = attr.charAt(0).toUpperCase() + attr.slice(1);
+        api["set"+attrUpper] = function(val){ return this.el.vjs_setProperty(attr, val); };
+      },
+
+      createGetter = function(attr){
+        api[attr] = function(){ return this.el.vjs_getProperty(attr); };
+      }
+  ;
+
+  // Create getter and setters for all read/write attributes
+  _V_.each(readWrite, function(attr){
+    createGetter(attr);
+    createSetter(attr);
+  });
+
+  // Create getters for read-only attributes
+  _V_.each(readOnly, function(attr){
+    createGetter(attr);
+  });
+
+})();
+
+/* Flash Support Testing -------------------------------------------------------- */
+
+_V_.flash.isSupported = function(){
+  return _V_.flash.version()[0] >= 10;
+  // return swfobject.hasFlashPlayerVersion("10");
+};
+
+_V_.flash.canPlaySource = function(srcObj){
+  if (srcObj.type in _V_.flash.prototype.support.formats) { return "maybe"; }
+};
+
+_V_.flash.prototype.support = {
+  formats: {
+    "video/flv": "FLV",
+    "video/x-flv": "FLV",
+    "video/mp4": "MP4",
+    "video/m4v": "MP4"
+  },
+
+  // Optional events that we can manually mimic with timers
+  progressEvent: false,
+  timeupdateEvent: false,
+
+  // Resizing plugins using request fullscreen reloads the plugin
+  fullscreenResize: false,
+
+  // Resizing plugins in Firefox always reloads the plugin (e.g. full window mode)
+  parentResize: !(_V_.ua.match("Firefox"))
+};
+
+_V_.flash.onReady = function(currSwf){
+
+  var el = _V_.el(currSwf);
+
+  // Get player from box
+  // On firefox reloads, el might already have a player
+  var player = el.player || el.parentNode.player,
+      tech = player.tech;
+
+  // Reference player on tech element
+  el.player = player;
+
+  // Update reference to playback technology element
+  tech.el = el;
+
+  // Now that the element is ready, make a click on the swf play the video
+  tech.addEvent("click", tech.onClick);
+
+  _V_.flash.checkReady(tech);
+};
+
+// The SWF isn't alwasy ready when it says it is. Sometimes the API functions still need to be added to the object.
+// If it's not ready, we set a timeout to check again shortly.
+_V_.flash.checkReady = function(tech){
+
+  // Check if API property exists
+  if (tech.el.vjs_getProperty) {
+
+    // If so, tell tech it's ready
+    tech.triggerReady();
+
+  // Otherwise wait longer.
+  } else {
+
+    setTimeout(function(){
+      _V_.flash.checkReady(tech);
+    }, 50);
+
+  }
+};
+
+// Trigger events from the swf on the player
+_V_.flash.onEvent = function(swfID, eventName){
+  var player = _V_.el(swfID).player;
+  player.triggerEvent(eventName);
+};
+
+// Log errors from the swf
+_V_.flash.onError = function(swfID, err){
+  var player = _V_.el(swfID).player;
+  player.triggerEvent("error");
+  _V_.log("Flash Error", err, swfID);
+};
+
+// Flash Version Check
+_V_.flash.version = function(){
+  var version = '0,0,0'
+
+  // IE
+  try {
+    version = new ActiveXObject('ShockwaveFlash.ShockwaveFlash').GetVariable('$version').replace(/\D+/g, ',').match(/^,?(.+),?$/)[1];
+
+  // other browsers
+  } catch(e) {
+    try {
+      if (navigator.mimeTypes["application/x-shockwave-flash"].enabledPlugin){
+        version = (navigator.plugins["Shockwave Flash 2.0"] || navigator.plugins["Shockwave Flash"]).description.replace(/\D+/g, ",").match(/^,?(.+),?$/)[1];
+      }
+    } catch(e) {}
+  }
+  return version.split(",");
+}
+
+// Flash embedding method. Only used in non-iframe mode
+_V_.flash.embed = function(swf, placeHolder, flashVars, params, attributes){
+  var code = _V_.flash.getEmbedCode(swf, flashVars, params, attributes),
+
+      // Get element by embedding code and retrieving created element
+      obj = _V_.createElement("div", { innerHTML: code }).childNodes[0],
+
+      par = placeHolder.parentNode
+  ;
+
+  placeHolder.parentNode.replaceChild(obj, placeHolder);
+
+  // IE6 seems to have an issue where it won't initialize the swf object after injecting it.
+  // This is a dumb temporary fix
+  if (_V_.isIE()) {
+    var newObj = par.childNodes[0];
+    setTimeout(function(){
+      newObj.style.display = "block";
+    }, 1000);
+  }
+
+  return obj;
+
+};
+
+_V_.flash.getEmbedCode = function(swf, flashVars, params, attributes){
+
+  var objTag = '<object type="application/x-shockwave-flash"',
+      flashVarsString = '',
+      paramsString = ''
+      attrsString = '';
+
+  // Convert flash vars to string
+  if (flashVars) {
+    _V_.eachProp(flashVars, function(key, val){
+      flashVarsString += (key + "=" + val + "&amp;");
+    });
+  }
+
+  // Add swf, flashVars, and other default params
+  params = _V_.merge({
+    movie: swf,
+    flashvars: flashVarsString,
+    allowScriptAccess: "always", // Required to talk to swf
+    allowNetworking: "all" // All should be default, but having security issues.
+  }, params);
+
+  // Create param tags string
+  _V_.eachProp(params, function(key, val){
+    paramsString += '<param name="'+key+'" value="'+val+'" />';
+  });
+
+  attributes = _V_.merge({
+    // Add swf to attributes (need both for IE and Others to work)
+    data: swf,
+
+    // Default to 100% width/height
+    width: "100%",
+    height: "100%"
+
+  }, attributes);
+
+  // Create Attributes string
+  _V_.eachProp(attributes, function(key, val){
+    attrsString += (key + '="' + val + '" ');
+  });
+
+  return objTag + attrsString + '>' + paramsString + '</object>';
+}

src/tracks.js

@@ -0,0 +1,780 @@
+// TEXT TRACKS
+// Text tracks are tracks of timed text events.
+//    Captions - text displayed over the video for the hearing impared
+//    Subtitles - text displayed over the video for those who don't understand langauge in the video
+//    Chapters - text displayed in a menu allowing the user to jump to particular points (chapters) in the video
+//    Descriptions (not supported yet) - audio descriptions that are read back to the user by a screen reading device
+
+// Player Track Functions - Functions add to the player object for easier access to tracks
+_V_.merge(_V_.Player.prototype, {
+
+  // Add an array of text tracks. captions, subtitles, chapters, descriptions
+  // Track objects will be stored in the player.textTracks array
+  addTextTracks: function(trackObjects){
+    var tracks = this.textTracks = (this.textTracks) ? this.textTracks : [],
+        i = 0, j = trackObjects.length, track, Kind;
+
+    for (;i<j;i++) {
+      // HTML5 Spec says default to subtitles.
+      // Uppercase (uc) first letter to match class names
+      Kind = _V_.uc(trackObjects[i].kind || "subtitles");
+
+      // Create correct texttrack class. CaptionsTrack, etc.
+      track = new _V_[Kind + "Track"](this, trackObjects[i]);
+
+      tracks.push(track);
+
+      // If track.default is set, start showing immediately
+      // TODO: Add a process to deterime the best track to show for the specific kind
+      // Incase there are mulitple defaulted tracks of the same kind
+      // Or the user has a set preference of a specific language that should override the default
+      if (track['default']) {
+        this.ready(_V_.proxy(track, track.show));
+      }
+    }
+
+    // Return the track so it can be appended to the display component
+    return this;
+  },
+
+  // Show a text track
+  // disableSameKind: disable all other tracks of the same kind. Value should be a track kind (captions, etc.)
+  showTextTrack: function(id, disableSameKind){
+    var tracks = this.textTracks,
+        i = 0,
+        j = tracks.length,
+        track, showTrack, kind;
+
+    // Find Track with same ID
+    for (;i<j;i++) {
+      track = tracks[i];
+      if (track.id === id) {
+        track.show();
+        showTrack = track;
+
+      // Disable tracks of the same kind
+      } else if (disableSameKind && track.kind == disableSameKind && track.mode > 0) {
+        track.disable();
+      }
+    }
+
+    // Get track kind from shown track or disableSameKind
+    kind = (showTrack) ? showTrack.kind : ((disableSameKind) ? disableSameKind : false);
+
+    // Trigger trackchange event, captionstrackchange, subtitlestrackchange, etc.
+    if (kind) {
+      this.triggerEvent(kind+"trackchange");
+    }
+
+    return this;
+  }
+
+});
+
+// Track Class
+// Contains track methods for loading, showing, parsing cues of tracks
+_V_.Track = _V_.Component.extend({
+
+  init: function(player, options){
+    this._super(player, options);
+
+    // Apply track info to track object
+    // Options will often be a track element
+    _V_.merge(this, {
+      // Build ID if one doesn't exist
+      id: options.id || ("vjs_" + options.kind + "_" + options.language + "_" + _V_.guid++),
+
+      src: options.src,
+
+      // If default is used, subtitles/captions to start showing
+      "default": options["default"], // 'default' is reserved-ish
+      title: options.title,
+
+      // Language - two letter string to represent track language, e.g. "en" for English
+      // readonly attribute DOMString language;
+      language: options.srclang,
+
+      // Track label e.g. "English"
+      // readonly attribute DOMString label;
+      label: options.label,
+
+      // All cues of the track. Cues have a startTime, endTime, text, and other properties.
+      // readonly attribute TextTrackCueList cues;
+      cues: [],
+
+      // ActiveCues is all cues that are currently showing
+      // readonly attribute TextTrackCueList activeCues;
+      activeCues: [],
+
+      // ReadyState describes if the text file has been loaded
+      // const unsigned short NONE = 0;
+      // const unsigned short LOADING = 1;
+      // const unsigned short LOADED = 2;
+      // const unsigned short ERROR = 3;
+      // readonly attribute unsigned short readyState;
+      readyState: 0,
+
+      // Mode describes if the track is showing, hidden, or disabled
+      // const unsigned short OFF = 0;
+      // const unsigned short HIDDEN = 1; (still triggering cuechange events, but not visible)
+      // const unsigned short SHOWING = 2;
+      // attribute unsigned short mode;
+      mode: 0
+    });
+  },
+
+  // Create basic div to hold cue text
+  createElement: function(){
+    return this._super("div", {
+      className: "vjs-" + this.kind + " vjs-text-track"
+    });
+  },
+
+  // Show: Mode Showing (2)
+  // Indicates that the text track is active. If no attempt has yet been made to obtain the track's cues, the user agent will perform such an attempt momentarily.
+  // The user agent is maintaining a list of which cues are active, and events are being fired accordingly.
+  // In addition, for text tracks whose kind is subtitles or captions, the cues are being displayed over the video as appropriate;
+  // for text tracks whose kind is descriptions, the user agent is making the cues available to the user in a non-visual fashion;
+  // and for text tracks whose kind is chapters, the user agent is making available to the user a mechanism by which the user can navigate to any point in the media resource by selecting a cue.
+  // The showing by default state is used in conjunction with the default attribute on track elements to indicate that the text track was enabled due to that attribute.
+  // This allows the user agent to override the state if a later track is discovered that is more appropriate per the user's preferences.
+  show: function(){
+    this.activate();
+
+    this.mode = 2;
+
+    // Show element.
+    this._super();
+  },
+
+  // Hide: Mode Hidden (1)
+  // Indicates that the text track is active, but that the user agent is not actively displaying the cues.
+  // If no attempt has yet been made to obtain the track's cues, the user agent will perform such an attempt momentarily.
+  // The user agent is maintaining a list of which cues are active, and events are being fired accordingly.
+  hide: function(){
+    // When hidden, cues are still triggered. Disable to stop triggering.
+    this.activate();
+
+    this.mode = 1;
+
+    // Hide element.
+    this._super();
+  },
+
+  // Disable: Mode Off/Disable (0)
+  // Indicates that the text track is not active. Other than for the purposes of exposing the track in the DOM, the user agent is ignoring the text track.
+  // No cues are active, no events are fired, and the user agent will not attempt to obtain the track's cues.
+  disable: function(){
+    // If showing, hide.
+    if (this.mode == 2) { this.hide(); }
+
+    // Stop triggering cues
+    this.deactivate();
+
+    // Switch Mode to Off
+    this.mode = 0;
+  },
+
+  // Turn on cue tracking. Tracks that are showing OR hidden are active.
+  activate: function(){
+    // Load text file if it hasn't been yet.
+    if (this.readyState == 0) { this.load(); }
+
+    // Only activate if not already active.
+    if (this.mode == 0) {
+      // Update current cue on timeupdate
+      // Using unique ID for proxy function so other tracks don't remove listener
+      this.player.addEvent("timeupdate", this.proxy(this.update, this.id));
+
+      // Reset cue time on media end
+      this.player.addEvent("ended", this.proxy(this.reset, this.id));
+
+      // Add to display
+      if (this.kind == "captions" || this.kind == "subtitles") {
+        this.player.textTrackDisplay.addComponent(this);
+      }
+    }
+  },
+
+  // Turn off cue tracking.
+  deactivate: function(){
+    // Using unique ID for proxy function so other tracks don't remove listener
+    this.player.removeEvent("timeupdate", this.proxy(this.update, this.id));
+    this.player.removeEvent("ended", this.proxy(this.reset, this.id));
+    this.reset(); // Reset
+
+    // Remove from display
+    this.player.textTrackDisplay.removeComponent(this);
+  },
+
+  // A readiness state
+  // One of the following:
+  //
+  // Not loaded
+  // Indicates that the text track is known to exist (e.g. it has been declared with a track element), but its cues have not been obtained.
+  //
+  // Loading
+  // Indicates that the text track is loading and there have been no fatal errors encountered so far. Further cues might still be added to the track.
+  //
+  // Loaded
+  // Indicates that the text track has been loaded with no fatal errors. No new cues will be added to the track except if the text track corresponds to a MutableTextTrack object.
+  //
+  // Failed to load
+  // Indicates that the text track was enabled, but when the user agent attempted to obtain it, this failed in some way (e.g. URL could not be resolved, network error, unknown text track format). Some or all of the cues are likely missing and will not be obtained.
+  load: function(){
+
+    // Only load if not loaded yet.
+    if (this.readyState == 0) {
+      this.readyState = 1;
+      _V_.get(this.src, this.proxy(this.parseCues), this.proxy(this.onError));
+    }
+
+  },
+
+  onError: function(err){
+    this.error = err;
+    this.readyState = 3;
+    this.triggerEvent("error");
+  },
+
+  // Parse the WebVTT text format for cue times.
+  // TODO: Separate parser into own class so alternative timed text formats can be used. (TTML, DFXP)
+  parseCues: function(srcContent) {
+    var cue, time, text,
+        lines = srcContent.split("\n"),
+        line = "", id;
+
+    for (var i=1, j=lines.length; i<j; i++) {
+      // Line 0 should be 'WEBVTT', so skipping i=0
+
+      line = _V_.trim(lines[i]); // Trim whitespace and linebreaks
+
+      if (line) { // Loop until a line with content
+
+        // First line could be an optional cue ID
+        // Check if line has the time separator
+        if (line.indexOf("-->") == -1) {
+          id = line;
+          // Advance to next line for timing.
+          line = _V_.trim(lines[++i]);
+        } else {
+          id = this.cues.length;
+        }
+
+        // First line - Number
+        cue = {
+          id: id, // Cue Number
+          index: this.cues.length // Position in Array
+        };
+
+        // Timing line
+        time = line.split(" --> ");
+        cue.startTime = this.parseCueTime(time[0]);
+        cue.endTime = this.parseCueTime(time[1]);
+
+        // Additional lines - Cue Text
+        text = [];
+
+        // Loop until a blank line or end of lines
+        // Assumeing trim("") returns false for blank lines
+        while (lines[++i] && (line = _V_.trim(lines[i]))) {
+          text.push(line);
+        }
+
+        cue.text = text.join('<br/>');
+
+        // Add this cue
+        this.cues.push(cue);
+      }
+    }
+
+    this.readyState = 2;
+    this.triggerEvent("loaded");
+  },
+
+  parseCueTime: function(timeText) {
+    var parts = timeText.split(':'),
+        time = 0,
+        hours, minutes, other, seconds, ms, flags;
+
+    // Check if optional hours place is included
+    // 00:00:00.000 vs. 00:00.000
+    if (parts.length == 3) {
+      hours = parts[0];
+      minutes = parts[1];
+      other = parts[2];
+    } else {
+      hours = 0;
+      minutes = parts[0];
+      other = parts[1];
+    }
+
+    // Break other (seconds, milliseconds, and flags) by spaces
+    // TODO: Make additional cue layout settings work with flags
+    other = other.split(/\s+/)
+    // Remove seconds. Seconds is the first part before any spaces.
+    seconds = other.splice(0,1)[0];
+    // Could use either . or , for decimal
+    seconds = seconds.split(/\.|,/);
+    // Get milliseconds
+    ms = parseFloat(seconds[1]);
+    seconds = seconds[0];
+
+    // hours => seconds
+    time += parseFloat(hours) * 3600;
+    // minutes => seconds
+    time += parseFloat(minutes) * 60;
+    // Add seconds
+    time += parseFloat(seconds);
+    // Add milliseconds
+    if (ms) { time += ms/1000; }
+
+    return time;
+  },
+
+  // Update active cues whenever timeupdate events are triggered on the player.
+  update: function(){
+    if (this.cues.length > 0) {
+
+      // Get curent player time
+      var time = this.player.currentTime();
+
+      // Check if the new time is outside the time box created by the the last update.
+      if (this.prevChange === undefined || time < this.prevChange || this.nextChange <= time) {
+        var cues = this.cues,
+
+            // Create a new time box for this state.
+            newNextChange = this.player.duration(), // Start at beginning of the timeline
+            newPrevChange = 0, // Start at end
+
+            reverse = false, // Set the direction of the loop through the cues. Optimized the cue check.
+            newCues = [], // Store new active cues.
+
+            // Store where in the loop the current active cues are, to provide a smart starting point for the next loop.
+            firstActiveIndex, lastActiveIndex,
+
+            html = "", // Create cue text HTML to add to the display
+            cue, i, j; // Loop vars
+
+        // Check if time is going forwards or backwards (scrubbing/rewinding)
+        // If we know the direction we can optimize the starting position and direction of the loop through the cues array.
+        if (time >= this.nextChange || this.nextChange === undefined) { // NextChange should happen
+          // Forwards, so start at the index of the first active cue and loop forward
+          i = (this.firstActiveIndex !== undefined) ? this.firstActiveIndex : 0;
+        } else {
+          // Backwards, so start at the index of the last active cue and loop backward
+          reverse = true;
+          i = (this.lastActiveIndex !== undefined) ? this.lastActiveIndex : cues.length - 1;
+        }
+
+        while (true) { // Loop until broken
+          cue = cues[i];
+
+          // Cue ended at this point
+          if (cue.endTime <= time) {
+            newPrevChange = Math.max(newPrevChange, cue.endTime);
+
+            if (cue.active) {
+              cue.active = false;
+            }
+
+            // No earlier cues should have an active start time.
+            // Nevermind. Assume first cue could have a duration the same as the video.
+            // In that case we need to loop all the way back to the beginning.
+            // if (reverse && cue.startTime) { break; }
+
+          // Cue hasn't started
+          } else if (time < cue.startTime) {
+            newNextChange = Math.min(newNextChange, cue.startTime);
+
+            if (cue.active) {
+              cue.active = false;
+            }
+
+            // No later cues should have an active start time.
+            if (!reverse) { break; }
+
+          // Cue is current
+          } else {
+
+            if (reverse) {
+              // Add cue to front of array to keep in time order
+              newCues.splice(0,0,cue);
+
+              // If in reverse, the first current cue is our lastActiveCue
+              if (lastActiveIndex === undefined) { lastActiveIndex = i; }
+              firstActiveIndex = i;
+            } else {
+              // Add cue to end of array
+              newCues.push(cue);
+
+              // If forward, the first current cue is our firstActiveIndex
+              if (firstActiveIndex === undefined) { firstActiveIndex = i; }
+              lastActiveIndex = i;
+            }
+
+            newNextChange = Math.min(newNextChange, cue.endTime);
+            newPrevChange = Math.max(newPrevChange, cue.startTime);
+
+            cue.active = true;
+          }
+
+          if (reverse) {
+            // Reverse down the array of cues, break if at first
+            if (i === 0) { break; } else { i--; }
+          } else {
+            // Walk up the array fo cues, break if at last
+            if (i === cues.length - 1) { break; } else { i++; }
+          }
+
+        }
+
+        this.activeCues = newCues;
+        this.nextChange = newNextChange;
+        this.prevChange = newPrevChange;
+        this.firstActiveIndex = firstActiveIndex;
+        this.lastActiveIndex = lastActiveIndex;
+
+        this.updateDisplay();
+
+        this.triggerEvent("cuechange");
+      }
+    }
+  },
+
+  // Add cue HTML to display
+  updateDisplay: function(){
+    var cues = this.activeCues,
+        html = "",
+        i=0,j=cues.length;
+
+    for (;i<j;i++) {
+      html += "<span class='vjs-tt-cue'>"+cues[i].text+"</span>";
+    }
+
+    this.el.innerHTML = html;
+  },
+
+  // Set all loop helper values back
+  reset: function(){
+    this.nextChange = 0;
+    this.prevChange = this.player.duration();
+    this.firstActiveIndex = 0;
+    this.lastActiveIndex = 0;
+  }
+
+});
+
+// Create specific track types
+_V_.CaptionsTrack = _V_.Track.extend({
+  kind: "captions"
+});
+
+_V_.SubtitlesTrack = _V_.Track.extend({
+  kind: "subtitles"
+});
+
+_V_.ChaptersTrack = _V_.Track.extend({
+  kind: "chapters"
+});
+
+
+/* Text Track Display
+================================================================================ */
+// Global container for both subtitle and captions text. Simple div container.
+_V_.TextTrackDisplay = _V_.Component.extend({
+
+  createElement: function(){
+    return this._super("div", {
+      className: "vjs-text-track-display"
+    });
+  }
+
+});
+
+/* Text Track Menu Items
+================================================================================ */
+_V_.TextTrackMenuItem = _V_.MenuItem.extend({
+
+  init: function(player, options){
+    var track = this.track = options.track;
+
+    // Modify options for parent MenuItem class's init.
+    options.label = track.label;
+    options.selected = track["default"];
+    this._super(player, options);
+
+    this.player.addEvent(track.kind + "trackchange", _V_.proxy(this, this.update));
+  },
+
+  onClick: function(){
+    this._super();
+    this.player.showTextTrack(this.track.id, this.track.kind);
+  },
+
+  update: function(){
+    if (this.track.mode == 2) {
+      this.selected(true);
+    } else {
+      this.selected(false);
+    }
+  }
+
+});
+
+_V_.OffTextTrackMenuItem = _V_.TextTrackMenuItem.extend({
+
+  init: function(player, options){
+    // Create pseudo track info
+    // Requires options.kind
+    options.track = { kind: options.kind, player: player, label: "Off" }
+    this._super(player, options);
+  },
+
+  onClick: function(){
+    this._super();
+    this.player.showTextTrack(this.track.id, this.track.kind);
+  },
+
+  update: function(){
+    var tracks = this.player.textTracks,
+        i=0, j=tracks.length, track,
+        off = true;
+
+    for (;i<j;i++) {
+      track = tracks[i];
+      if (track.kind == this.track.kind && track.mode == 2) {
+        off = false;
+      }
+    }
+
+    if (off) {
+      this.selected(true);
+    } else {
+      this.selected(false);
+    }
+  }
+
+});
+
+/* Captions Button
+================================================================================ */
+_V_.TextTrackButton = _V_.Button.extend({
+
+  init: function(player, options){
+    this._super(player, options);
+
+    this.menu = this.createMenu();
+
+    if (this.items.length === 0) {
+      this.hide();
+    }
+  },
+
+  createMenu: function(){
+    var menu = new _V_.Menu(this.player);
+
+    // Add a title list item to the top
+    menu.el.appendChild(_V_.createElement("li", {
+      className: "vjs-menu-title",
+      innerHTML: _V_.uc(this.kind)
+    }));
+
+    // Add an OFF menu item to turn all tracks off
+    menu.addItem(new _V_.OffTextTrackMenuItem(this.player, { kind: this.kind }))
+
+    this.items = this.createItems();
+
+    // Add menu items to the menu
+    this.each(this.items, function(item){
+      menu.addItem(item);
+    });
+
+    // Add list to element
+    this.addComponent(menu);
+
+    return menu;
+  },
+
+  // Create a menu item for each text track
+  createItems: function(){
+    var items = [];
+    this.each(this.player.textTracks, function(track){
+      if (track.kind === this.kind) {
+        items.push(new _V_.TextTrackMenuItem(this.player, {
+          track: track
+        }));
+      }
+    });
+    return items;
+  },
+
+  buildCSSClass: function(){
+    return this.className + " vjs-menu-button " + this._super();
+  },
+
+  // Focus - Add keyboard functionality to element
+  onFocus: function(){
+    // Show the menu, and keep showing when the menu items are in focus
+    this.menu.lockShowing();
+    // this.menu.el.style.display = "block";
+
+    // When tabbing through, the menu should hide when focus goes from the last menu item to the next tabbed element.
+    _V_.one(this.menu.el.childNodes[this.menu.el.childNodes.length - 1], "blur", this.proxy(function(){
+      this.menu.unlockShowing();
+    }));
+  },
+  // Can't turn off list display that we turned on with focus, because list would go away.
+  onBlur: function(){},
+
+  onClick: function(){
+    // When you click the button it adds focus, which will show the menu indefinitely.
+    // So we'll remove focus when the mouse leaves the button.
+    // Focus is needed for tab navigation.
+    this.one("mouseout", this.proxy(function(){
+      this.menu.unlockShowing();
+      this.el.blur();
+    }));
+  }
+
+});
+
+_V_.CaptionsButton = _V_.TextTrackButton.extend({
+  kind: "captions",
+  buttonText: "Captions",
+  className: "vjs-captions-button"
+});
+
+_V_.SubtitlesButton = _V_.TextTrackButton.extend({
+  kind: "subtitles",
+  buttonText: "Subtitles",
+  className: "vjs-subtitles-button"
+});
+
+// Chapters act much differently than other text tracks
+// Cues are navigation vs. other tracks of alternative languages
+_V_.ChaptersButton = _V_.TextTrackButton.extend({
+  kind: "chapters",
+  buttonText: "Chapters",
+  className: "vjs-chapters-button",
+
+  // Create a menu item for each text track
+  createItems: function(chaptersTrack){
+    var items = [];
+
+    this.each(this.player.textTracks, function(track){
+      if (track.kind === this.kind) {
+        items.push(new _V_.TextTrackMenuItem(this.player, {
+          track: track
+        }));
+      }
+    });
+
+    return items;
+  },
+
+  createMenu: function(){
+    var tracks = this.player.textTracks,
+        i = 0,
+        j = tracks.length,
+        track, chaptersTrack,
+        items = this.items = [];
+
+    for (;i<j;i++) {
+      track = tracks[i];
+      if (track.kind == this.kind && track["default"]) {
+        if (track.readyState < 2) {
+          this.chaptersTrack = track;
+          track.addEvent("loaded", this.proxy(this.createMenu));
+          return;
+        } else {
+          chaptersTrack = track;
+          break;
+        }
+      }
+    }
+
+    var menu = this.menu = new _V_.Menu(this.player);
+
+    menu.el.appendChild(_V_.createElement("li", {
+      className: "vjs-menu-title",
+      innerHTML: _V_.uc(this.kind)
+    }));
+
+    if (chaptersTrack) {
+      var cues = chaptersTrack.cues,
+          i = 0, j = cues.length, cue, mi;
+
+      for (;i<j;i++) {
+        cue = cues[i];
+
+        mi = new _V_.ChaptersTrackMenuItem(this.player, {
+          track: chaptersTrack,
+          cue: cue
+        });
+
+        items.push(mi);
+
+        menu.addComponent(mi);
+      }
+    }
+
+    // Add list to element
+    this.addComponent(menu);
+
+    if (this.items.length > 0) {
+      this.show();
+    }
+
+    return menu;
+  }
+
+});
+
+_V_.ChaptersTrackMenuItem = _V_.MenuItem.extend({
+
+  init: function(player, options){
+    var track = this.track = options.track,
+        cue = this.cue = options.cue,
+        currentTime = player.currentTime();
+
+    // Modify options for parent MenuItem class's init.
+    options.label = cue.text;
+    options.selected = (cue.startTime <= currentTime && currentTime < cue.endTime);
+    this._super(player, options);
+
+    track.addEvent("cuechange", _V_.proxy(this, this.update));
+  },
+
+  onClick: function(){
+    this._super();
+    this.player.currentTime(this.cue.startTime);
+    this.update(this.cue.startTime);
+  },
+
+  update: function(time){
+    var cue = this.cue,
+        currentTime = this.player.currentTime();
+
+    // _V_.log(currentTime, cue.startTime);
+    if (cue.startTime <= currentTime && currentTime < cue.endTime) {
+      this.selected(true);
+    } else {
+      this.selected(false);
+    }
+  }
+
+});
+
+// Add Buttons to controlBar
+_V_.merge(_V_.ControlBar.prototype.options.components, {
+  "subtitlesButton": {},
+  "captionsButton": {},
+  "chaptersButton": {}
+});
+
+// _V_.Cue = _V_.Component.extend({
+//   init: function(player, options){
+//     this._super(player, options);
+//   }
+// });

stylesheets/base.css

@@ -1,51 +0,0 @@
-/* Reset - http://developer.yahoo.com/yui/3/cssreset/
----------------------------------------------------------*/
-html{ color:#000; background:#FFF; }
-body { line-height: 1; }
-body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,label,input,textarea,p,blockquote,th,td { margin:0; padding:0; }
-table { border-collapse:collapse; border-spacing:0; }
-fieldset,img { border:0; }
-address,caption,cite,code,dfn,em,strong,th,var { font-style:normal; font-weight:normal; }
-li { list-style:none; }
-caption,th { text-align:left; }
-h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; }
-q:before,q:after { content:''; }
-abbr,acronym { border:0; font-variant:normal; }
-sup { vertical-align:text-top; }
-sub { vertical-align:text-bottom; }
-input,textarea,select { font-family:inherit; font-size:inherit; font-weight:inherit; }
-input,textarea,select { *font-size:100%; }
-legend { color:#000; }
-
-/* Base - http://developer.yahoo.com/yui/3/cssbase/
----------------------------------------------------------*/
-h1 { font-size:138.5%; }
-h2 { font-size:123.1%; }
-h3 { font-size:108%; }
-h1,h2,h3 { margin:0 0 1em; }
-h1,h2,h3,h4,h5,h6,strong { font-weight:bold; }
-abbr,acronym { border-bottom:1px dotted #000; cursor:help; }
-em { font-style:italic; }
-blockquote,ul,ol,dl { margin-bottom:1em; }
-ol,ul,dl { margin-left:2em; }
-ol li { list-style:decimal outside; }
-ul li { list-style:disc outside; }
-dl dd { margin-left:1em; }
-th,td { border:1px solid #000; padding: 0; }
-th { font-weight:bold; text-align:center; }
-caption { margin-bottom:.5em; text-align:center; }
-p,fieldset,table,pre { margin-bottom:1em; }
-input[type=text],input[type=password],textarea { width:12.25em; *width:11.9em; background-color: #fff; }
-
-/* Fonts - http://developer.yahoo.com/yui/3/cssfonts/
----------------------------------------------------------*/
-html { font:13px/1.231 arial,helvetica,clean,sans-serif; *font-size:small; *font:x-small; }
-select,input,button,textarea { font:119% arial,helvetica,clean,sans-serif; }
-table { font-size:inherit; font:100%; }
-pre,code,kbd,samp,tt { font-family:monospace; *font-size:108%; line-height:100%; }
-
-/* Clear Fix - http://perishablepress.com/press/2009/12/06/new-clearfix-hack/
----------------------------------------------------------*/
-.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
-* html .clearfix { zoom: 1; } /* IE6 */
-*:first-child+html .clearfix { zoom: 1; } /* IE7 */

stylesheets/site.css

@@ -1,38 +0,0 @@
-html { background: #152B38 url('../images/background.png') top left repeat-x; }
-body { font-size: 10px; line-height: 1; color: #fff; text-align: center; }
-#wrap { background: url("../images/background-highlights.png") center 20px no-repeat; }
-#main { position: relative; width: 640px; margin: 0px auto; text-align: left; padding-bottom: 20px; }
-h1 { font-size: 360%; line-height: 1; margin-bottom: 10px; text-align: center; letter-spacing: 5px; }
-h2 { font-size: 200%; line-height: 1; margin-bottom: 10px; }
-h6 { font-size: 100%; text-transform: uppercase; margin-bottom: 10px; color: #999; }
-p.tagline { text-align: center; font-size: 120%; line-height: 1; }
-
-p { font-size: 1.4em; line-height: 1.5; margin-bottom: 20px; }
-a { color: #fff; }
-a img { border: 0; }
-
-ul#nav { list-style: none; margin: 0; padding: 0; height: 20px; text-align: right; margin-bottom: 20px; }
-ul#nav li { display: inline; list-style: none; margin: 0; padding: 0; padding-left: 20px; font-size: 120%; line-height: 20px; }
-ul#nav li a { color: #fff; text-decoration: none; }
-
-.video-js-box { margin-bottom: 0; background-color: #000; }
-p#video_note { margin-bottom: 20px; font-size: 100%; line-height: 20px; color: #999; text-align: center; }
-
-p#sponsor { font-size: 10px; margin-bottom: 30px; }
-p#sponsor a { text-decoration: none; }
-
-#features_and_support { }
-#features { width: 300px; float: left; }
-ul#feature_list { display: block; margin: 0; padding: 0; }
-ul#feature_list li { list-style: none; padding-left: 25px; font-size: 140%; line-height: 20px; margin-bottom: 25px; background: url("../images/icons/check.png") left top no-repeat; }
-
-#supported { float: right; width: 320px; }
-.supported-section { margin-bottom: 20px; }
-.supported-section a { padding-right: 10px; }
-.supported-section a:last-child { padding-right: 0; }
-
-#issues_link { clear: both; padding-top: 20px; text-align: center; }
-
-#disqus_thread { clear: both; padding-top: 30px; }
-
-#footer { clear: both; padding: 20px 0; }

tech/youtube.html

@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>VideoJS | HTML5 Video Player</title>
+
+  <link href="video-js.css" rel="stylesheet" type="text/css">
+
+  <!-- video.js must be in the <head> for older IEs to work. -->
+  <script src="video.js"></script>
+
+</head>
+<body>
+
+  <video id="example_video_1" class="video-js vjs-default-skin" controls width="640" height="264" data-setup='{"techOrder":["youtube","html5"]}'>
+    <source src="http://www.youtube.com/watch?v=YjaZNYSt7o0" type='video/youtube'>
+  </video>
+
+</body>
+</html>
+    

tech/youtube.js

@@ -0,0 +1,147 @@
+// Flowplayer API Connector
+VideoJS.tech.youtube = {
+  name: "YouTube",
+  
+  supported: function(){
+    // Flash Player 8 or higher
+    return true;
+  },
+  canPlaySource: function(sourceObj){
+    return sourceObj.type == "video/youtube";
+  },
+  supports: {
+    format: {},
+    event: {
+      progress: false,
+      timeupdate: false
+    }
+  },
+  init: function(sourceObj){
+    var player = this,
+        placeHolder = _V_.createElement("div", { id: player.box.id + "_temp_ytswf" }),
+        objId = player.box.id+"_youtube_api";
+
+        flashvars = {
+        },
+
+        params = {
+          allowScriptAccess: "always",
+          wmode: "opaque",
+          bgcolor: "#000000"
+        },
+
+        attributes = {
+          id: objId,
+          name: objId,
+          'class': 'vjs-tech'
+        };
+
+    this.addEvent("techready", function(){
+      var url = sourceObj.src;
+
+      if (url.indexOf("http://") == 0) {
+        // Get Youtube ID from URL
+        url = url.match(/v=([^&]+)/)[1];
+      }
+      this.tels.youtube.cueVideoById(url);
+    });
+
+    player.box.appendChild(placeHolder);
+
+    swfobject.embedSWF("http://www.youtube.com/apiplayer?" +
+                       "version=3&enablejsapi=1&playerapiid=" + objId,
+                       placeHolder.id, "480", "295", "9", null, null, params, attributes);
+  },
+  stateChange: function(id, state){
+    var player = _V_(id);
+
+    if (state == 0) {
+      player.triggerEvent("ended");
+    } else if (state == 1) {
+      player.triggerEvent("play");
+      player.triggerEvent("playing");
+    } else if (state == 2) {
+      player.triggerEvent("pause");
+    }
+  },
+  
+  error: function(id, errorCode){
+    _V_.log(id, errorCode);
+  },
+
+  api: {
+    setupTriggers: function(){
+      this.tels.youtube.addEventListener("onStateChange", 
+        "(function(state){ _V_.tech.youtube.stateChange('"+this.id+"',state); })");
+
+      this.tels.youtube.addEventListener("onError", 
+        "(function(errorCode){ _V_.tech.youtube.error('"+this.id+"',errorCode); })");
+
+    },
+
+    play: function(){ this.tels.youtube.playVideo(); },
+    pause: function(){ this.tels.youtube.pauseVideo(); },
+    paused: function(){
+      return this.tels.youtube.getPlayerState() !== 1; // More accurate than isPaused
+    },
+
+    currentTime: function(){ return this.tels.youtube.getCurrentTime(); },
+    setCurrentTime: function(seconds){
+      // False blocks seek-ahead.
+      this.tels.youtube.seekTo(seconds, true);
+    },
+
+    duration: function(){
+      return this.tels.youtube.getDuration();
+    },
+
+    buffered: function(){
+      var percent = this.tels.youtube.getVideoBytesLoaded() / this.tels.youtube.getVideoBytesTotal(),
+          seconds = this.duration() * percent;
+      return _V_.createTimeRange(0, seconds);
+    },
+
+    volume: function(){ return _V_.round(this.tels.youtube.getVolume() / 100, 2); },
+    setVolume: function(percentAsDecimal){
+      this.tels.youtube.setVolume(parseInt(percentAsDecimal * 100));
+
+      // Youtube Doesn't support VolumeChange Events
+      this.triggerEvent("volumechange");
+    },
+    muted: function(){ return this.tels.youtube.isMuted(); },
+    setMuted: function(bool){
+      if (bool) {
+        this.tels.youtube.mute()
+      } else {
+        this.tels.youtube.unMute()
+      }
+    },
+
+    supportsFullScreen: function(){
+      return false; // Flash does not allow fullscreen through javascript
+      // Maybe at click listener, and say "click screen".
+    },
+    enterFullScreen: function(){ this.tels.flowplayer.api.toggleFullscreen(); },
+
+    src: function(src){
+      this.tels.youtube.cueVideoById(src);
+    },
+    load: function(){
+      // Youtube will autoload?
+    }
+  }
+};
+
+// YouTube Defined Player Ready Callback
+window.onYouTubePlayerReady = function(playerId) {
+  var el = _V_.el(playerId),
+      player = el.parentNode.player; // Get player from box
+
+  el.player = player;
+
+  // Update reference to playback technology element
+  player.tels.youtube = el;
+
+  player.triggerEvent("techready");
+}
+

test/qunit/.gitignore

@@ -0,0 +1,7 @@
+.project
+*~
+*.diff
+*.patch
+.DS_Store
+.settings
+

test/qunit/README.md

@@ -0,0 +1,27 @@
+[QUnit](http://docs.jquery.com/QUnit) - A JavaScript Unit Testing framework.
+================================
+
+QUnit is a powerful, easy-to-use, JavaScript test suite. It's used by the jQuery
+project to test its code and plugins but is capable of testing any generic
+JavaScript code (and even capable of testing JavaScript code on the server-side).
+
+QUnit is especially useful for regression testing: Whenever a bug is reported,
+write a test that asserts the existence of that particular bug. Then fix it and
+commit both. Every time you work on the code again, run the tests. If the bug
+comes up again - a regression - you'll spot it immediately and know how to fix
+it, because you know what code you just changed.
+
+Having good unit test coverage makes safe refactoring easy and cheap. You can
+run the tests after each small refactoring step and always know what change
+broke something.
+
+QUnit is similar to other unit testing frameworks like JUnit, but makes use of
+the features JavaScript provides and helps with testing code in the browser, eg.
+with it's stop/start facilities for testing asynchronous code.
+
+If you are interested in helping developing QUnit, you are in the right place.
+For related discussions, visit the
+[QUnit and Testing forum](http://forum.jquery.com/qunit-and-testing).
+
+Planning for a qunitjs.com site and other testing tools related work now happens
+on the [jQuery Testing Team planning wiki](http://jquerytesting.pbworks.com/w/page/41556026/FrontPage).

test/qunit/addons/canvas/README.md

@@ -0,0 +1,16 @@
+Canvas - A QUnit Addon For Testing Canvas Rendering
+================================
+
+This addon for QUnit adds a pixelEqual method that allows you to assert
+individual pixel values in a given canvas.
+
+Usage:
+
+    pixelEqual(canvas, x, y, r, g, b, a, message)
+
+Where:
+
+  * canvas: Reference to a canvas element
+  * x, y: Coordinates of the pixel to test
+  * r, g, b, a: The color and opacity value of the pixel that you except
+  * message: Optional message, same as for other assertions

test/qunit/addons/canvas/canvas-test.js

@@ -0,0 +1,76 @@
+test("Canvas pixels", function () {
+	var canvas = document.getElementById('qunit-canvas'), context;
+	try {
+		context = canvas.getContext('2d');
+	} catch(e) {
+		// propably no canvas support, just exit
+		return;
+	}
+	context.fillStyle = 'rgba(0, 0, 0, 0)';
+	context.fillRect(0, 0, 5, 5);
+	QUnit.pixelEqual(canvas, 0, 0, 0, 0, 0, 0);
+	context.clearRect(0,0,5,5);
+	context.fillStyle = 'rgba(255, 0, 0, 0)';
+	context.fillRect(0, 0, 5, 5);
+	QUnit.pixelEqual(canvas, 0, 0, 0, 0, 0, 0);
+	context.clearRect(0,0,5,5);
+	context.fillStyle = 'rgba(0, 255, 0, 0)';
+	context.fillRect(0, 0, 5, 5);
+	QUnit.pixelEqual(canvas, 0, 0, 0, 0, 0, 0);
+	context.clearRect(0,0,5,5);
+	context.fillStyle = 'rgba(0, 0, 255, 0)';
+	context.fillRect(0, 0, 5, 5);
+	QUnit.pixelEqual(canvas, 0, 0, 0, 0, 0, 0);
+	context.clearRect(0,0,5,5);
+
+	context.fillStyle = 'rgba(0, 0, 0, 0.5)';
+	context.fillRect(0, 0, 5, 5);
+	QUnit.pixelEqual(canvas, 0, 0, 0, 0, 0, 127);
+	context.clearRect(0,0,5,5);
+	context.fillStyle = 'rgba(255, 0, 0, 0.5)';
+	context.fillRect(0, 0, 5, 5);
+	QUnit.pixelEqual(canvas, 0, 0, 255, 0, 0, 127);
+	context.clearRect(0,0,5,5);
+	context.fillStyle = 'rgba(0, 255, 0, 0.5)';
+	context.fillRect(0, 0, 5, 5);
+	QUnit.pixelEqual(canvas, 0, 0, 0, 255, 0, 127);
+	context.clearRect(0,0,5,5);
+	context.fillStyle = 'rgba(0, 0, 255, 0.5)';
+	context.fillRect(0, 0, 5, 5);
+	QUnit.pixelEqual(canvas, 0, 0, 0, 0, 255, 127);
+	context.clearRect(0,0,5,5);
+
+	context.fillStyle = 'rgba(0, 0, 0, 0.5)';
+	context.fillRect(0, 0, 5, 5);
+	QUnit.pixelEqual(canvas, 2, 2, 0, 0, 0, 127);
+	context.clearRect(0,0,5,5);
+	context.fillStyle = 'rgba(255, 0, 0, 0.5)';
+	context.fillRect(0, 0, 5, 5);
+	QUnit.pixelEqual(canvas, 2, 2, 255, 0, 0, 127);
+	context.clearRect(0,0,5,5);
+	context.fillStyle = 'rgba(0, 255, 0, 0.5)';
+	context.fillRect(0, 0, 5, 5);
+	QUnit.pixelEqual(canvas, 2, 2, 0, 255, 0, 127);
+	context.clearRect(0,0,5,5);
+	context.fillStyle = 'rgba(0, 0, 255, 0.5)';
+	context.fillRect(0, 0, 5, 5);
+	QUnit.pixelEqual(canvas, 2, 2, 0, 0, 255, 127);
+	context.clearRect(0,0,5,5);
+
+	context.fillStyle = 'rgba(0, 0, 0, 1)';
+	context.fillRect(0, 0, 5, 5);
+	QUnit.pixelEqual(canvas, 4, 4, 0, 0, 0, 255);
+	context.clearRect(0,0,5,5);
+	context.fillStyle = 'rgba(255, 0, 0, 1)';
+	context.fillRect(0, 0, 5, 5);
+	QUnit.pixelEqual(canvas, 4, 4, 255, 0, 0, 255);
+	context.clearRect(0,0,5,5);
+	context.fillStyle = 'rgba(0, 255, 0, 1)';
+	context.fillRect(0, 0, 5, 5);
+	QUnit.pixelEqual(canvas, 4, 4, 0, 255, 0, 255);
+	context.clearRect(0,0,5,5);
+	context.fillStyle = 'rgba(0, 0, 255, 1)';
+	context.fillRect(0, 0, 5, 5);
+	QUnit.pixelEqual(canvas, 4, 4, 0, 0, 255, 255);
+	context.clearRect(0,0,5,5);
+});

test/qunit/addons/canvas/canvas.html

@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<meta charset="UTF-8" />
+	<title>QUnit Test Suite - Canvas Addon</title>
+	<link rel="stylesheet" href="../../qunit/qunit.css" type="text/css" media="screen">
+	<script type="text/javascript" src="../../qunit/qunit.js"></script>
+	<script type="text/javascript" src="qunit-canvas.js"></script>
+	<script type="text/javascript" src="canvas-test.js"></script>
+</head>
+<body>
+	<h1 id="qunit-header">QUnit Test Suite - Canvas Addon</h1>
+	<h2 id="qunit-banner"></h2>
+	<div id="qunit-testrunner-toolbar"></div>
+	<h2 id="qunit-userAgent"></h2>
+	<ol id="qunit-tests"></ol>
+	<canvas id="qunit-canvas" width="5" height="5"></canvas>
+</body>
+</html>

test/qunit/addons/canvas/qunit-canvas.js

@@ -0,0 +1,6 @@
+QUnit.extend( QUnit, {
+	pixelEqual: function(canvas, x, y, r, g, b, a, message) {
+		var actual = Array.prototype.slice.apply(canvas.getContext('2d').getImageData(x, y, 1, 1).data), expected = [r, g, b, a];
+		QUnit.push(QUnit.equiv(actual, expected), actual, expected, message);
+	}
+});

test/qunit/addons/close-enough/README.md

@@ -0,0 +1,17 @@
+Close-Enough - A QUnit Addon For Number Approximations
+================================
+
+This addon for QUnit adds close and notClose assertion methods, to test that
+numbers are close enough (or different enough) from an expected number, with
+a specified accuracy.
+
+Usage:
+
+    close(actual, expected, maxDifference, message)
+    notClose(actual, expected, minDifference, message)
+
+Where:
+
+  * maxDifference: the maximum inclusive difference allowed between the actual and expected numbers
+  * minDifference: the minimum exclusive difference allowed between the actual and expected numbers
+  * actual, expected, message: The usual

test/qunit/addons/close-enough/close-enough-test.js

@@ -0,0 +1,37 @@
+test("Close Numbers", function () {
+
+	QUnit.close(7, 7, 0);
+	QUnit.close(7, 7.1, 0.1);
+	QUnit.close(7, 7.1, 0.2);
+	
+	QUnit.close(3.141, Math.PI, 0.001);
+	QUnit.close(3.1, Math.PI, 0.1);
+	
+	var halfPi = Math.PI / 2;
+	QUnit.close(halfPi, 1.57, 0.001);
+	
+	var sqrt2 = Math.sqrt(2);
+	QUnit.close(sqrt2, 1.4142, 0.0001);
+	
+	QUnit.close(Infinity, Infinity, 1);	
+	
+});
+
+test("Distant Numbers", function () {
+
+	QUnit.notClose(6, 7, 0);
+	QUnit.notClose(7, 7.2, 0.1);
+	QUnit.notClose(7, 7.2, 0.19999999999);
+	
+	QUnit.notClose(3.141, Math.PI, 0.0001);
+	QUnit.notClose(3.1, Math.PI, 0.001);
+	
+	var halfPi = Math.PI / 2;
+	QUnit.notClose(halfPi, 1.57, 0.0001);
+	
+	var sqrt2 = Math.sqrt(2);
+	QUnit.notClose(sqrt2, 1.4142, 0.00001);
+	
+	QUnit.notClose(Infinity, -Infinity, 5);
+
+});

test/qunit/addons/close-enough/close-enough.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<meta charset="UTF-8" />
+	<title>QUnit Test Suite - Close Enough Addon</title>
+	<link rel="stylesheet" href="../../qunit/qunit.css" type="text/css" media="screen">
+	<script type="text/javascript" src="../../qunit/qunit.js"></script>
+	<script type="text/javascript" src="qunit-close-enough.js"></script>
+	<script type="text/javascript" src="close-enough-test.js"></script>
+</head>
+<body>
+	<h1 id="qunit-header">QUnit Test Suite - Close Enough</h1>
+	<h2 id="qunit-banner"></h2>
+	<div id="qunit-testrunner-toolbar"></div>
+	<h2 id="qunit-userAgent"></h2>
+	<ol id="qunit-tests"></ol>
+</body>
+</html>

test/qunit/addons/close-enough/qunit-close-enough.js

@@ -0,0 +1,32 @@
+QUnit.extend( QUnit, {
+	/**
+	 * Checks that the first two arguments are equal, or are numbers close enough to be considered equal
+	 * based on a specified maximum allowable difference.
+	 *
+	 * @example close(3.141, Math.PI, 0.001);
+	 *
+	 * @param Number actual
+	 * @param Number expected
+	 * @param Number maxDifference (the maximum inclusive difference allowed between the actual and expected numbers)
+	 * @param String message (optional)
+	 */
+	close: function(actual, expected, maxDifference, message) {
+		var passes = (actual === expected) || Math.abs(actual - expected) <= maxDifference;
+		QUnit.push(passes, actual, expected, message);
+	},
+	
+	/**
+	 * Checks that the first two arguments are numbers with differences greater than the specified 
+	 * minimum difference.
+	 *
+	 * @example notClose(3.1, Math.PI, 0.001);
+	 *
+	 * @param Number actual
+	 * @param Number expected
+	 * @param Number minDifference (the minimum exclusive difference allowed between the actual and expected numbers)
+	 * @param String message (optional)
+	 */
+	notClose: function(actual, expected, minDifference, message) {
+		QUnit.push(Math.abs(actual - expected) > minDifference, actual, expected, message);
+	}
+});

test/qunit/addons/composite/README.md

@@ -0,0 +1,7 @@
+Composite - A QUnit Addon For Running Multiple Test Files
+================================
+
+Composite is a QUnit addon that, when handed an array of files, will
+open each of those files inside of an iframe, run the tests and
+display the results as a single suite of QUnit tests.
+

test/qunit/addons/composite/composite-demo-test.html

@@ -0,0 +1,33 @@
+<!doctype html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8" />
+	<title>QUnit SubsuiteRunner Test Suite</title>
+
+	<link rel="stylesheet" href="../../qunit/qunit.css" type="text/css" media="screen">
+	<link rel="stylesheet" href="qunit-composite.css">
+	<script src="../../qunit/qunit.js"></script>
+	<script src="qunit-composite.js"></script>
+
+	<script>
+	QUnit.testSuites([
+		"../../test/index.html",
+		"../canvas/canvas.html",
+		"../close-enough/close-enough.html",
+		"../step/step.html",
+		"composite-test.html"
+   	]);
+	</script>
+</head>
+<body>
+
+<h1 id="qunit-header">QUnit SubsuiteRunner Test Suite</h1>
+<h2 id="qunit-banner"></h2>
+<div id="qunit-testrunner-toolbar"></div>
+<h2 id="qunit-userAgent"></h2>
+<ol id="qunit-tests"></ol>
+<div id="qunit-fixture">
+
+</div>
+</body>
+</html>

test/qunit/addons/composite/composite-test.html

@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<meta charset="UTF-8" />
+	<title>QUnit Core Test Suite</title>
+	<link rel="stylesheet" href="../../qunit/qunit.css" type="text/css" media="screen">
+	<script src="../../qunit/qunit.js"></script>
+
+	<script src="qunit-composite.js"></script>
+	<script src="composite-test.js"></script>
+</head>
+<body>
+	<h1 id="qunit-header">QUnit Core Test Suite</h1>
+	<h2 id="qunit-banner"></h2>
+	<div id="qunit-testrunner-toolbar"></div>
+	<h2 id="qunit-userAgent"></h2>
+	<ol id="qunit-tests"></ol>
+	<div id="qunit-fixture">test markup</div>
+</body>
+</html>

test/qunit/addons/composite/composite-test.js

@@ -0,0 +1,159 @@
+module( "testSuites tests", (function(){
+	var asyncTest = QUnit.asyncTest,
+		runSuite = QUnit.runSuite;
+
+	return {
+		setup: function(){
+			//proxy asyncTest and runSuite
+			QUnit.asyncTest = window.asyncTest = function( name, callback ){
+				ok( true, "asyncTestCalled for each suite" );
+				callback(); //don't acutally create tests, just call callback
+			};
+			QUnit.runSuite = window.runSuite = function(){
+				ok( true, "runSuite called for each suite" );
+			};
+			//ensure that subsuite's done doesn't run
+			this.oldDone = QUnit.done;
+		},
+		teardown: function(){
+			//restore
+			QUnit.asyncTest = window.asyncTest = asyncTest;
+			QUnit.runSuite = window.runSuite = runSuite;
+			QUnit.done = this.oldDone;
+		}
+	};
+})());
+
+test( "proper number of asyncTest and runSuite calls", function(){
+	expect( 6 );
+	QUnit.testSuites( ["one.html", "two.html", "three.html"] );
+});
+
+test( "done callback changed", function(){
+	QUnit.testSuites( ["dummy.html"] );
+	notEqual( this.oldDone, QUnit.done, "done callback should be set" );
+});
+
+module( "testStart tests", (function(){
+	var id = QUnit.id;
+	return {
+		setup: function(){
+			//proxy id
+			var fakeElem = this.fakeElem = document.createElement( "div" );
+
+			QUnit.id = function(){
+				return fakeElem;
+			}
+		},
+		teardown: function(){
+			QUnit.id = id;
+		}
+	};
+})());
+
+test( "running message printed", function(){
+	var hello = "hello world",
+	expected = "Running " + hello + "...<br>&nbsp;";
+	QUnit.testStart( {name: hello} );
+	equal( this.fakeElem.innerHTML, expected, "innerHTML was set correctly by testStart" );
+});
+
+module( "testDone tests", (function(){
+	var id = QUnit.id;
+	return {
+		setup: function(){
+			//proxy id
+			var fakeElem = this.fakeElem = document.createElement( "div" );
+			fakeElem.appendChild( document.createElement( "ol" ) );
+			fakeElem.appendChild( document.createElement( "ol" ) );
+			QUnit.id = function(){
+				return fakeElem;
+			}
+		},
+		teardown: function(){
+			QUnit.id = id;
+		}
+	};
+})());
+
+test( "test expansions are hidden", function(){
+	QUnit.testDone();
+	equal( this.fakeElem.children[0].style.display, "none", "first ol display is none" );
+	equal( this.fakeElem.children[1].style.display, "none", "second ol display is none" );
+});
+
+test( "non-ol elements aren't hidden", function(){
+	this.fakeElem.appendChild( document.createElement( "span" ) );
+
+	QUnit.testDone();
+	notEqual( this.fakeElem.children[2].style.display, "none", "first ol display is none" );
+});
+
+module( "runSuite tests", (function(){
+	var getElementsByTagName = document.getElementsByTagName,
+		createElement = document.createElement,
+		runSuite = QUnit.runSuite;
+
+	return {
+		setup: function(){
+			//proxy getElementsByTagName and createElement
+			var setAttributeCall = this.setAttributeCall = {},
+				appendChildCall = this.appendChildCall = {called: 0},
+				iframeLoad = this.iframeLoad = {},
+				iframeQUnitObject = this.iframeQUnitObject = {},
+				fakeElement = {
+					appendChild: function(){appendChildCall.called++},
+					setAttribute: function(){setAttributeCall.args = arguments},
+					addEventListener: function( type, callback ){iframeLoad.callback = callback;},
+					contentWindow: {QUnit: iframeQUnitObject},
+					className: "",
+				};
+
+			document.getElementsByTagName = function(){
+				return [fakeElement];
+			};
+			document.createElement = function(){
+				return fakeElement;
+			}
+
+		},
+		teardown: function(){
+			document.getElementsByTagName = getElementsByTagName;
+			document.createElement = createElement;
+			//must restore even though we didn't proxy; the runner overwrites upon first call
+			QUnit.runSuite = runSuite;
+		}
+	};
+})());
+
+test( "runSuite different after first run", function(){
+	var before = QUnit.runSuite,
+		after;
+	QUnit.runSuite();
+	after = QUnit.runSuite;
+	notEqual( before, after, "runSuite changed after initial run" );
+});
+
+test( "iframe only created once", function(){
+	QUnit.runSuite();
+	equal( this.appendChildCall.called, 1, "append child called once" );
+	QUnit.runSuite();
+	equal( this.appendChildCall.called, 1, "append child only ever called once" );
+});
+
+test( "iframe's QUnit object is modified when iframe source loads", function(){
+	var before = this.iframeQUnitObject,
+		after;
+	QUnit.runSuite();
+	this.iframeLoad.callback();
+	notEqual( before, after, "iframe's qunit object is modified upon load");
+});
+
+test( "iframe src set to suite passed", function(){
+	var pages = ["testing.html", "subsuiteRunner.html"];
+	QUnit.runSuite( pages[0] );
+	equal( this.setAttributeCall.args[0], "src", "src attribute set" );
+	equal( this.setAttributeCall.args[1], pages[0], "src attribute set" );
+	QUnit.runSuite( pages[1] );
+	equal( this.setAttributeCall.args[1], pages[1], "src attribute set" );
+});

test/qunit/addons/composite/dummy-qunit-test.html

@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<meta charset="UTF-8" />
+	<title>QUnit Core Test Suite</title>
+	<link rel="stylesheet" href="../../qunit/qunit.css" type="text/css" media="screen">
+	<script src="../../qunit/qunit.js"></script>
+
+	<script src="../../test/test.js"></script>
+</head>
+<body>
+	<h1 id="qunit-header">QUnit Core Test Suite</h1>
+	<h2 id="qunit-banner"></h2>
+	<div id="qunit-testrunner-toolbar"></div>
+	<h2 id="qunit-userAgent"></h2>
+	<ol id="qunit-tests"></ol>
+	<div id="qunit-fixture">test markup</div>
+</body>
+</html>

test/qunit/addons/composite/dummy-same-test.html

@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<meta charset="UTF-8" />
+	<title>QUnit Same Test Suite</title>
+	<link rel="stylesheet" href="../../qunit/qunit.css" type="text/css" media="screen">
+	<script src="../../qunit/qunit.js"></script>
+
+	<script src="../../test/same.js"></script>
+</head>
+<body>
+	<h1 id="qunit-header">QUnit Same Test Suite</h1>
+	<h2 id="qunit-banner"></h2>
+	<div id="qunit-testrunner-toolbar"></div>
+	<h2 id="qunit-userAgent"></h2>
+	<ol id="qunit-tests"></ol>
+	<div id="qunit-fixture">test markup</div>
+</body>
+</html>

test/qunit/addons/composite/index.html

@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="UTF-8" />
+		<title>Composite</title>
+	</head>
+	<body>
+		<h1>Composite</h1>
+		<h3>A QUnit Addon For Running Multiple Test Files</h3>
+		<p>Composite is a QUnit addon that, when handed an array of
+		files, will open each of those files inside of an iframe, run
+		the tests and display the results as a single suite of QUnit
+		tests.</p>
+		<h4>Using Composite</h4>
+		<p>To use Composite, setup a standard QUnit html page as you
+		would with other QUnit tests. Remember to include composite.js
+		and composite.css. Then, inside of either an external js file,
+		or a script block call the only new method that Composite
+		exposes, QUnit.testSuites().</p><p>QUnit.testSuites() is
+		passed an array of test files to run as follows:</p>
+		<pre>
+QUnit.testSuites([
+    "test-file-1.html",
+    "test-file-2.html",
+    "test-file-3.html"
+]);
+		</pre>
+		<h4>Tests</h4>
+		<p>Composite has tests of it's own.</p>
+		<p>
+			<a href="composite-test.html">Composite Test</a>: A suite which tests the implementation of composite.<br>
+			<a href="composite-demo-test.html">Composite Demo</a>: A suite which demoes how Compisite is bootstrapped and run.
+		</p>
+	</body>
+</html>

test/qunit/addons/composite/qunit-composite.css

@@ -0,0 +1,13 @@
+iframe.qunit-subsuite{
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    
+    margin: 0;
+    padding: 0;
+    border-width: 1px 0 0;
+    height: 45%;
+    width: 100%;
+
+    background: #fff;
+}

test/qunit/addons/composite/qunit-composite.js

@@ -0,0 +1,82 @@
+(function( QUnit ) {
+
+var subsuiteFrame;
+
+QUnit.extend( QUnit, {
+	testSuites: function( suites ) {
+		for ( var i = 0; i < suites.length; i++ ) {
+			(function( suite ) {
+				asyncTest( suite, function() {
+					QUnit.runSuite( suite );
+				});
+			}( suites[i] ) );
+		}
+		QUnit.done = function() {
+			subsuiteFrame.style.display = "none";
+		};
+	},
+
+	testStart: function( data ) {
+		// update the test status to show which test suite is running
+		QUnit.id( "qunit-testresult" ).innerHTML = "Running " + data.name + "...<br>&nbsp;";
+	},
+
+	testDone: function() {
+		var current = QUnit.id( this.config.current.id ),
+			children = current.children;
+
+		// undo the auto-expansion of failed tests
+		for ( var i = 0; i < children.length; i++ ) {
+			if ( children[i].nodeName === "OL" ) {
+				children[i].style.display = "none";
+			}
+		}
+	},
+
+	runSuite: function( suite ) {
+		var body = document.getElementsByTagName( "body" )[0],
+			iframe = subsuiteFrame = document.createElement( "iframe" ),
+			iframeWin;
+
+		iframe.className = "qunit-subsuite";
+		body.appendChild( iframe );
+
+		function onIframeLoad() {
+			var module, test,
+				count = 0;
+
+			QUnit.extend( iframeWin.QUnit, {
+				moduleStart: function( data ) {
+					// capture module name for messages
+					module = data.name;
+				},
+
+				testStart: function( data ) {
+					// capture test name for messages
+					test = data.name;
+				},
+
+				log: function( data ) {
+					// pass all test details through to the main page
+					var message = module + ": " + test + ": " + data.message;
+					expect( ++count );
+					QUnit.push( data.result, data.actual, data.expected, message );
+				},
+
+				done: function() {
+					// start the wrapper test from the main page
+					start();
+				}
+			});
+		}
+		QUnit.addEvent( iframe, "load", onIframeLoad );
+
+		iframeWin = iframe.contentWindow;
+		iframe.setAttribute( "src", suite );
+
+		this.runSuite = function( suite ) {
+			iframe.setAttribute( "src", suite );
+		};
+	}
+});
+}( QUnit ) );

test/qunit/addons/step/README.md

@@ -0,0 +1,18 @@
+QUnit.step() - A QUnit Addon For Testing execution in order
+============================================================
+
+This addon for QUnit adds a step method that allows you to assert
+the proper sequence in which the code should execute.
+
+Example:
+
+    test("example test", function () {
+      function x() {
+        QUnit.step(2, "function y should be called first");
+      }
+      function y() {
+        QUnit.step(1);
+      }
+      y();
+      x();
+    });