Changed addListener to addEventListener, to mimic HTML5 API exactly

The previous test mistakenly used Android-WebKit-specific code for other
browsers, like Opera and Firefox.

README.markdown

@@ -1,6 +1,6 @@
 VideoJS - [HTML5 Video Player](http://videojs.com)
 ==================================================
-Version 1.1.1
+Version 2.0.2
 
 View [VideoJS.com](http://videojs.com) for a demo and overview.
 
@@ -14,7 +14,7 @@ Originally based on [this tutorial](http://blog.steveheffernan.com/2010/04/how-t
 
 Contributors (Github Username)
 ------------------------------
-heff, dz0ny, sentientbit, tvdeyen, brandonarbini, gordonbrander, Shraymonks, albertogasparin, sandaru1, nicholasbs, majornista
+heff, dz0ny, sentientbit, tvdeyen, brandonarbini, gordonbrander, Shraymonks, albertogasparin, sandaru1, nicholasbs, majornista, Fredust85, @wonderboymusic, ellis-, emirpprime, eirikb, mbrubeck
 
 
 Getting Started
@@ -45,13 +45,14 @@ Change the video and image files to your own. You can even swap out the Flash Fa
     <div class="video-js-box">
       <!-- Using the Video for Everybody Embed Code http://camendesign.com/code/video_for_everybody -->
       <video id="example_video_1" class="video-js" width="640" height="264" poster="http://video-js.zencoder.com/oceans-clip.png" controls preload>
-        <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
-        <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm; codecs="vp8, vorbis"'>
-        <source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg; codecs="theora, vorbis"'>
+        <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
+        <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm; codecs="vp8, vorbis"' />
+        <source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg; codecs="theora, vorbis"' />
         <!-- Flash Fallback. Use any flash video player here. Make sure to keep the vjs-flash-fallback class. -->
-        <object class="vjs-flash-fallback" width="640" height="264" type="application/x-shockwave-flash"
+        <object id="flash_fallback_1" 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="wmode" value="opaque" />
           <param name="allowfullscreen" value="true" />
           <param name="flashvars" value='config={"playlist":["http://video-js.zencoder.com/oceans-clip.png", {"url": "http://video-js.zencoder.com/oceans-clip.mp4","autoPlay":false,"autoBuffering":true}]}' />
           <!-- Image Fallback. Typically the same as the poster image. -->
@@ -113,9 +114,7 @@ Set options when setting up the videos. The defaults are shown here.
       controlsBelow: false, // Display control bar below video instead of in front of
       controlsHiding: true, // Hide controls when mouse is not over the video
       defaultVolume: 0.85, // Will be overridden by user's last volume if available
-      flashVersion: 9, // Required flash version for fallback
-      linksHiding: true, // Hide download links when video is supported
-      flashIsDominant: false // Always use Flash when available
+      flashPlayerVersion: 9, // Required flash version for fallback
     });
 
 ### Or as the second option of VideoJS.setup
@@ -127,11 +126,90 @@ Set options when setting up the videos. The defaults are shown here.
     });
 
 
+Coming Next
+-----------
+- API to Flash fallback
+
 Changelog
 ---------
+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
+
+- First Formally Versioned Release
   
 1.0.0 (2010-05-18)
-  - First released
+
+- First released

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>

demo-subtitles.srt

@@ -9,5 +9,5 @@ Heay!!
 3
 00:00:25,712 --> 00:00:30,399
 [Bird noises]
-
-
+
+

demo.html

@@ -7,7 +7,7 @@
   <!-- Include the VideoJS Library -->
   <script src="video.js" type="text/javascript" charset="utf-8"></script>
 
-  <script type="text/javascript" charset="utf-8">
+  <script type="text/javascript">
     // Must come after the video.js library
 
     // Add VideoJS to all video tags on the page when the DOM is ready
@@ -64,21 +64,22 @@
   </script>
 
   <!-- Include the VideoJS Stylesheet -->
-  <link rel="stylesheet" href="video-js.css" type="text/css" media="screen" title="Video JS" charset="utf-8">
+  <link rel="stylesheet" href="video-js.css" type="text/css" media="screen" title="Video JS">
 </head>
 <body>
 
   <!-- Begin VideoJS -->
   <div class="video-js-box">
     <!-- Using the Video for Everybody Embed Code http://camendesign.com/code/video_for_everybody -->
-    <video id="example_video_1" class="video-js" width="640" height="264" poster="http://video-js.zencoder.com/oceans-clip.png" controls preload>
-      <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
-      <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm; codecs="vp8, vorbis"'>
-      <source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg; codecs="theora, vorbis"'>
+    <video id="example_video_1" class="video-js" width="640" height="264" controls="controls" preload="auto" poster="http://video-js.zencoder.com/oceans-clip.png">
+      <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
+      <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm; codecs="vp8, vorbis"' />
+      <source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg; codecs="theora, vorbis"' />
       <!-- Flash Fallback. Use any flash video player here. Make sure to keep the vjs-flash-fallback class. -->
-      <object class="vjs-flash-fallback" width="640" height="264" type="application/x-shockwave-flash"
+      <object id="flash_fallback_1" 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="wmode" value="opaque" />
         <param name="allowfullscreen" value="true" />
         <param name="flashvars" value='config={"playlist":["http://video-js.zencoder.com/oceans-clip.png", {"url": "http://video-js.zencoder.com/oceans-clip.mp4","autoPlay":false,"autoBuffering":true}]}' />
         <!-- Image Fallback. Typically the same as the poster image. -->
@@ -98,4 +99,4 @@
   <!-- End VideoJS -->
 
 </body>
-</html>
+</html>

dev/combine_sources.sh

@@ -0,0 +1,13 @@
+#! /bin/csh
+# Combines Source Files. In terminal, sh combine_sources.sh
+cat src/_begin.js > combined.js
+
+cat src/main.js >> combined.js
+cat src/api.js >> combined.js
+cat src/html5.js >> combined.js
+cat src/flash.js >> combined.js
+cat src/behaviors.js >> combined.js
+cat src/lib.js >> combined.js
+cat src/video-js.jquery.js >> combined.js
+
+cat src/_end.js >> combined.js

dev/flowplayer/test.html

@@ -0,0 +1,114 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <title>HTML5 Video Player: flowplayer</title>
+
+  <!-- Include the VideoJS Library -->
+  <script src="../src/main.js" type="text/javascript" charset="utf-8"></script>
+  <script src="../src/api.js" type="text/javascript" charset="utf-8"></script>
+  <script src="../src/html5.js" type="text/javascript" charset="utf-8"></script>
+  <script src="../src/flash.js" type="text/javascript" charset="utf-8"></script>
+  <script src="../src/behaviors.js" type="text/javascript" charset="utf-8"></script>
+  <script src="../src/lib.js" type="text/javascript" charset="utf-8"></script>
+  <script src="../src/video-js.jquery.js" type="text/javascript" charset="utf-8"></script>
+
+  <!-- <script type="text/javascript" src="flowplayer-3.2.4.min.js"></script> -->
+  <script type="text/javascript" src="video-js.flowplayer.js"></script>
+
+  <script type="text/javascript">
+    VideoJS.DOMReady(function(){
+      myPlayer = VideoJS.setup("example_video_1", { 
+        controlsHiding: true, 
+        controlsBelow: false, 
+        showControlsAtStart: true,
+        playerFallbackOrder: ["flash", "html5", "links"]
+      });
+      myPlayer.activateElement(document.getElementById("scrub"), "loadProgressBar");
+      // var vid = document.getElementById("example_video_1"),
+      //     attrTable = document.getElementById("attributes"),
+      //     attrNames = ["error", "networkState", "readyState", "preload", "buffered",
+      //       "seeking", "currentTime", "initialTime", "duration", "startOffsetTime",
+      //       "paused", "defaultPlaybackRate", "playbackRate", "played", "seekable",
+      //       "ended", "autoplay", "loop", "controls", "volume", "muted", "tracks"
+      //     ],
+      //     attrs = {};
+      // 
+      // for(var i=0,j=attrNames.length; i<j; i++) {
+      //   var row = _V_.createElement("tr");
+      //   var th = _V_.createElement("th"); 
+      //   th.innerHTML = attrNames[i];
+      //   attrs[attrNames[i]] = _V_.createElement("td", { id: attrNames[i] });
+      //   row.appendChild(th); row.appendChild(attrs[attrNames[i]]);
+      //   attrTable.appendChild(row);
+      // }
+      // 
+      // setInterval(function(){
+      //   for(var i=0,j=attrNames.length; i<j; i++) {
+      //     attrs[attrNames[i]].innerHTML = vid[attrNames[i]];
+      //   }
+      // }, 100);
+      // 
+      // var events = ["loadstart","progress","suspend","abort","error","emptied","stalled","play","pause",
+      //   "loadedmetadata", "loadeddata", "waiting", "playing", "canplay", "canplaythrough", "seeking", "seeked",
+      //   // "timeupdate",
+      //   "ended", "ratechange", "durationchange","volumechange"
+      // ],
+      // eventsList = document.getElementById("events");
+      // 
+      // for(var i=0,j=events.length; i<j; i++) {
+      //   vid.addEventListener(events[i], function(){
+      //     eventsList.innerHTML = this + "\n" + eventsList.innerHTML
+      //   }.context(events[i]), false);
+      // }
+      
+    });
+
+  </script>
+
+  <style type="text/css" media="screen">
+    #attributes { width: 300px; float: left; }
+    #events { width: 300px; height: 500px; float: left; }
+  </style>
+
+  <!-- Include the VideoJS Stylesheet -->
+  <link rel="stylesheet" href="../../video-js.css" type="text/css" media="screen" title="Video JS">
+  <link rel="stylesheet" href="../../skins/tube.css" type="text/css" media="screen" title="Video JS">
+  <link rel="stylesheet" href="../../skins/hu.css" type="text/css" media="screen" title="Video JS">
+  <link rel="stylesheet" href="../../skins/vim.css" type="text/css" media="screen" title="Video JS">
+</head>
+<body>
+
+  <!-- Begin VideoJS -->
+  <div id="scrub" style="background: #000; height: 10px;"></div>
+
+  <div class="video-js-box">
+    <!-- Using the Video for Everybody Embed Code http://camendesign.com/code/video_for_everybody -->
+    <video id="example_video_1" class="video-js" width="640" height="264" controls="controls" preload="auto" poster="http://video-js.zencoder.com/oceans-clip.png">
+      <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
+      <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm; codecs="vp8, vorbis"' />
+      <source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg; codecs="theora, vorbis"' />
+      <!-- <track kind="subtitles" src="../demo-subtitles.srt" srclang="en-US" label="English"></track> -->
+      <!-- Flash Fallback. Use any flash video player here. Make sure to keep the vjs-flash-fallback class. -->
+      <div class="vjs-flash-fallback" width="640" height="264" href="http://video-js.zencoder.com/oceans-clip.mp4"></div>
+    </video>
+    <!-- Download links provided for devices that can't play video in the browser. -->
+    <p class="vjs-no-video"><strong>Download Video:</strong>
+      <a href="http://video-js.zencoder.com/oceans-clip.mp4">MP4</a>,
+      <a href="http://video-js.zencoder.com/oceans-clip.webm">WebM</a>,
+      <a href="http://video-js.zencoder.com/oceans-clip.ogv">Ogg</a><br>
+      <!-- Support VideoJS by keeping this link. -->
+      <a href="http://videojs.com">HTML5 Video Player</a> by VideoJS
+    </p>
+  </div>
+  <!-- End VideoJS -->
+
+  <a onClick="(function(){document.getElementById('example_video_1').player.flowplayer.play(); return false;})()">Click</a>
+
+  <table id="attributes">
+  </table>
+  
+  <textarea id="events"></textarea>
+
+</body>
+</html>

dev/map/coords.srt

@@ -0,0 +1,13 @@
+1
+00:00:02,400 --> 00:00:05,200
+41.586688,-100.112915
+
+2
+00:00:15,712 --> 00:00:17,399
+46.920255,3.010254
+
+3
+00:00:25,712 --> 00:00:30,399
+-36.208823,-67.192383
+
+

dev/map/map.html

@@ -0,0 +1,92 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <title>HTML5 Video Player</title>
+
+  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
+
+  <!-- Include the VideoJS Library -->
+  <script src="../../video.js" type="text/javascript" charset="utf-8"></script>
+  <script type="text/javascript">
+    VideoJS.DOMReady(function(){
+      var myPlayer = VideoJS.setup("example_video_1", { controlsHiding: false });
+    });
+
+  </script>
+
+  <script type="text/javascript"
+      src="http://maps.google.com/maps/api/js?sensor=false">
+  </script>
+  <script type="text/javascript">
+    function initialize() {
+      var latlng = new google.maps.LatLng(-34.397, 150.644);
+      var myOptions = {
+        zoom: 8,
+        center: latlng,
+        disableDefaultUI: true,
+        mapTypeId: google.maps.MapTypeId.ROADMAP
+      };
+      var map = new google.maps.Map(document.getElementById("map_canvas"),
+          myOptions);
+      
+      setTimeout(function() { map.panTo(new google.maps.LatLng(37.4419, -122.1419), 13) }, 2000)
+    }
+
+  </script>
+
+  <style type="text/css">
+    html { height: 100% }
+    body { height: 100%; margin: 0px; padding: 0px }
+    #map_canvas { height: 100%; position: absolute; top: 0; left: 0; }
+    
+    .video-js-box { position: absolute; top: 50%; left: 50%; z-index: 1; margin: -132px 0 0 -320px; }
+  </style>
+
+  <style type="text/css" media="screen">
+    #attributes { width: 300px; float: left; }
+    #events { width: 300px; height: 500px; float: left; }
+  </style>
+
+  <!-- Include the VideoJS Stylesheet -->
+  <link rel="stylesheet" href="../../video-js.css" type="text/css" media="screen" title="Video JS">
+  <link rel="stylesheet" href="../skins/tube.css" type="text/css" media="screen" title="Video JS">
+  <link rel="stylesheet" href="../skins/hu.css" type="text/css" media="screen" title="Video JS">
+  <link rel="stylesheet" href="../skins/vim.css" type="text/css" media="screen" title="Video JS">
+</head>
+<body onload="initialize()">
+
+  <!-- Begin VideoJS -->
+  <div class="video-js-box">
+    <!-- Using the Video for Everybody Embed Code http://camendesign.com/code/video_for_everybody -->
+    <video data-subtitles="../demo-subtitles.srt" id="example_video_1" class="video-js" width="640" height="264" controls="controls" preload="auto" poster="http://video-js.zencoder.com/oceans-clip.png">
+      <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
+      <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm; codecs="vp8, vorbis"' />
+      <source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg; codecs="theora, vorbis"' />
+      <!-- Flash Fallback. Use any flash video player here. Make sure to keep the vjs-flash-fallback class. -->
+      <object id="flash_fallback_1" 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="wmode" value="opaque" />
+        <param name="allowfullscreen" value="true" />
+        <param name="flashvars" value='config={"playlist":["http://video-js.zencoder.com/oceans-clip.png", {"url": "http://video-js.zencoder.com/oceans-clip.mp4","autoPlay":false,"autoBuffering":true}]}' />
+        <!-- Image Fallback. Typically the same as the poster image. -->
+        <img src="http://video-js.zencoder.com/oceans-clip.png" width="640" height="264" alt="Poster Image"
+          title="No video playback capabilities." />
+      </object>
+    </video>
+    <!-- Download links provided for devices that can't play video in the browser. -->
+    <p class="vjs-no-video"><strong>Download Video:</strong>
+      <a href="http://video-js.zencoder.com/oceans-clip.mp4">MP4</a>,
+      <a href="http://video-js.zencoder.com/oceans-clip.webm">WebM</a>,
+      <a href="http://video-js.zencoder.com/oceans-clip.ogv">Ogg</a><br>
+      <!-- Support VideoJS by keeping this link. -->
+      <a href="http://videojs.com">HTML5 Video Player</a> by VideoJS
+    </p>
+  </div>
+  <!-- End VideoJS -->
+
+  <div id="map_canvas" style="width:100%; height:100%"></div>
+
+</body>
+</html>

dev/src/_begin.js

@@ -0,0 +1,24 @@
+/*
+VideoJS - HTML5 Video Player
+v2.0.2
+
+This file is part of VideoJS. Copyright 2010 Zencoder, Inc.
+
+VideoJS 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.
+
+VideoJS 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 VideoJS.  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;
+

dev/src/_end.js

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

dev/src/api.js

@@ -0,0 +1,161 @@
+/* Player API
+================================================================================ */
+VideoJS.fn.extend({
+
+  /* Listener types: play, pause, timeupdate, bufferedupdate, ended, volumechange, error */
+  addEventListener: function(type, fn){
+    if (!this.listeners[type]) { this.listeners[type] = []; }
+    this.listeners[type].push(fn);
+  },
+  // Alias for backwards compatibility
+  addListener: function(){ return this.addEventListener.apply(this, arguments); },
+
+  triggerListeners: function(type, e){
+    this.each(this.listeners[type], function(listener){
+      listener.call(this, e);
+    });
+  },
+
+  removeListener: function(type, fn){
+    var listeners = this.listeners[type];
+    if (!listeners) { return; }
+    for (var i=0; i<listeners.length; i++) {
+      if (listeners[i] == fn) {
+        listeners.splice(i--, 1);
+      }
+    }
+  },
+
+  play: function(){ this.api.play.apply(this); return this; },
+  pause: function(){ this.api.pause.apply(this); return this; },
+  paused: function(){ return this.api.paused.apply(this); },
+
+  currentTime: function(seconds){
+    if (seconds !== undefined) {
+      this.values.currentTime = seconds; // Cache the last set value for smoother scrubbing.
+      this.api.setCurrentTime.call(this, seconds);
+      return this;
+    }
+    return this.api.currentTime.apply(this);
+  },
+
+  duration: function(){ return this.api.duration.apply(this); },
+
+  buffered: function(){
+    var buffered = this.api.buffered.apply(this),
+        start = 0, end = this.values.bufferEnd = this.values.bufferEnd || 0,
+        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 this.createTimeRange(start, end);
+  },
+  // Mimic HTML5 TimeRange Spec.
+  createTimeRange: function(start, end){
+    return {
+      length: 1,
+      start: function() { return start; },
+      end: function() { return end; }
+    };
+  },
+  // Calculates amount of buffer is full
+  bufferedPercent: function(){ return (this.duration()) ? this.buffered().end(0) / this.duration() : 0; },
+
+  volume: function(percentAsDecimal){
+    if (percentAsDecimal !== undefined) {
+      var vol = Math.max(0, Math.min(1, parseFloat(percentAsDecimal))); // Force value to between 0 and 1
+      this.values.volume = vol;
+      this.api.setVolume.call(this, vol);
+      this.setLocalStorage("volume", vol);
+      return this;
+    }
+    // if (this.values.volume) { return this.values.volume; }
+    return this.api.volume.call(this);
+  },
+
+  width: function(width, skipListeners){
+    if (width !== undefined) {
+      this.element.width = width; // Not using style so it can be overridden on fullscreen.
+      this.box.style.width = width+"px";
+      if (!skipListeners) { this.triggerListeners("resize"); }
+      return this;
+    }
+    return parseInt(this.element.getAttribute("width"));
+    // return this.element.offsetWidth;
+  },
+  height: function(height){
+    if (height !== undefined) {
+      this.element.height = height;
+      this.box.style.height = height+"px";
+      this.triggerListeners("resize");
+      return this;
+    }
+    return parseInt(this.element.getAttribute("height"));
+    // return this.element.offsetHeight;
+  },
+  size: function(width, height){
+    // Skip resize listeners on width for optimization
+    return this.width(width, true).height(height);
+  },
+
+  supportsFullScreen: function(){ return this.api.supportsFullScreen.call(this); },
+
+  // Turn on fullscreen (or window) mode
+  enterFullScreen: function(){
+    if (this.supportsFullScreen()) {
+      this.api.enterFullScreen.call(this);
+    } else {
+      this.enterFullWindow();
+    }
+    this.triggerListeners("enterFullScreen");
+    return this;
+  },
+
+  exitFullScreen: function(){
+    if (!this.supportsFullScreen()) {
+      this.exitFullWindow();
+    }
+    this.triggerListeners("exitFullScreen");
+    // Otherwise Shouldn't be called since native fullscreen uses own controls.
+    return this;
+  },
+
+  enterFullWindow: function(){
+    this.videoIsFullScreen = 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_.addListener(document, "keydown", this.fullscreenOnEscKey.rEvtContext(this));
+    // Add listener for a window resize
+    _V_.addListener(window, "resize", this.fullscreenOnWindowResize.rEvtContext(this));
+    // Hide any scroll bars
+    document.documentElement.style.overflow = 'hidden';
+    // Apply fullscreen styles
+    _V_.addClass(this.box, "vjs-fullscreen");
+    // Resize the box, controller, and poster
+    this.positionAll();
+    this.triggerListeners("enterFullWindow");
+  },
+
+  exitFullWindow: function(){
+    this.videoIsFullScreen = false;
+    document.removeEventListener("keydown", this.fullscreenOnEscKey, false);
+    window.removeEventListener("resize", this.fullscreenOnWindowResize, false);
+    // Unhide scroll bars.
+    document.documentElement.style.overflow = this.docOrigOverflow;
+    // Remove fullscreen styles
+    _V_.removeClass(this.box, "vjs-fullscreen");
+    // Resize the box, controller, and poster to original sizes
+    this.positionAll();
+    this.triggerListeners("exitFullWindow");
+  },
+
+  src: function(src){
+    this.api.src.call(this, src);
+    return this;
+  }
+});

dev/src/behaviors.js

@@ -0,0 +1,579 @@
+////////////////////////////////////////////////////////////////////////////////
+// Element Behaviors
+// Tell elements how to act or react
+////////////////////////////////////////////////////////////////////////////////
+
+/* Player Behaviors - How VideoJS reacts to what the video is doing.
+================================================================================ */
+VideoJS.fn.newBehavior("player", function(player){
+    this.addListener("error", this.playerOnVideoError);
+    this.addListener("play", this.playerOnVideoPlay);
+    this.addListener("play", this.trackCurrentTime);
+    this.addListener("pause", this.stopTrackingCurrentTime);
+    this.addListener("ended", this.playerOnVideoEnded);
+    this.trackBuffered();
+    this.addListener("bufferedupdate", this.bufferFull);
+  },{
+    playerOnVideoError: function(event){
+      this.log(event);
+      this.log(this.video.error);
+    },
+    playerOnVideoPlay: function(event){ this.hasPlayed = true; },
+    playerOnVideoEnded: function(event){
+      if (this.options.loop) {
+        this.currentTime(0);
+        this.play();
+      } else if (this.options.returnToStart) {
+        this.currentTime(0);
+        this.pause();
+      }
+    },
+
+    /* Load Tracking -------------------------------------------------------------- */
+    // Buffer watching method for load progress.
+    // Used for browsers that don't support the progress event
+    trackBuffered: function(){
+      this.bufferedInterval = setInterval(function(){
+        // Don't trigger unless
+        if (this.values.bufferEnd < this.buffered().end(0)) {
+          this.triggerListeners("bufferedupdate");
+        }
+      }.context(this), 500);
+    },
+    stopTrackingBuffered: function(){ clearInterval(this.bufferedInterval); },
+    bufferFull: function(){
+      if (this.bufferedPercent() == 1) {
+        this.stopTrackingBuffered();
+      }
+    },
+
+    /* Time Tracking -------------------------------------------------------------- */
+    trackCurrentTime: function(){
+      if (this.currentTimeInterval) { clearInterval(this.currentTimeInterval); }
+
+      this.currentTimeInterval = setInterval(function(){
+        this.triggerListeners("timeupdate");
+      }.context(this), 100); // 42 = 24 fps
+
+      this.trackingCurrentTime = true;
+    },
+    // Turn off play progress tracking (when paused or dragging)
+    stopTrackingCurrentTime: function(){
+      clearInterval(this.currentTimeInterval);
+      this.trackingCurrentTime = false;
+    }
+  }
+);
+/* Mouse Over Video Reporter Behaviors - i.e. Controls hiding based on mouse location
+================================================================================ */
+VideoJS.fn.newBehavior("mouseOverVideoReporter", function(element){
+    // Listen for the mouse move the video. Used to reveal the controller.
+    _V_.addListener(element, "mousemove", this.mouseOverVideoReporterOnMouseMove.context(this));
+    // Listen for the mouse moving out of the video. Used to hide the controller.
+    _V_.addListener(element, "mouseout", this.mouseOverVideoReporterOnMouseOut.context(this));
+  },{
+    mouseOverVideoReporterOnMouseMove: function(){
+      this.showControlBars();
+      clearInterval(this.mouseMoveTimeout);
+      this.mouseMoveTimeout = setTimeout(this.hideControlBars.context(this), 4000);
+    },
+    mouseOverVideoReporterOnMouseOut: function(event){
+      // Prevent flicker by making sure mouse hasn't left the video
+      var parent = event.relatedTarget;
+      while (parent && parent !== this.box) {
+        parent = parent.parentNode;
+      }
+      if (parent !== this.box) {
+        this.hideControlBars();
+      }
+    }
+  }
+);
+/* Mouse Over Video Reporter Behaviors - i.e. Controls hiding based on mouse location
+================================================================================ */
+VideoJS.fn.newBehavior("box", function(element){
+    this.positionBox();
+    _V_.addClass(element, "vjs-paused");
+    this.activateElement(element, "mouseOverVideoReporter");
+    this.addListener("play", this.boxOnVideoPlay);
+    this.addListener("pause", this.boxOnVideoPause);
+  },{
+    boxOnVideoPlay: function(){
+      _V_.removeClass(this.box, "vjs-paused");
+      _V_.addClass(this.box, "vjs-playing");
+    },
+    boxOnVideoPause: function(){
+      _V_.removeClass(this.box, "vjs-playing");
+      _V_.addClass(this.box, "vjs-paused");
+    }
+  }
+);
+/* Poster Image Overlay
+================================================================================ */
+VideoJS.fn.newBehavior("poster", function(element){
+    this.activateElement(element, "mouseOverVideoReporter");
+    this.activateElement(element, "playButton");
+    this.addListener("play", this.hidePoster);
+    this.addListener("ended", this.showPoster);
+    this.addListener("resize", this.positionPoster);
+  },{
+    showPoster: function(){
+      if (!this.poster) { return; }
+      this.poster.style.display = "block";
+      this.positionPoster();
+    },
+    positionPoster: function(){
+      // Only if the poster is visible
+      if (!this.poster || this.poster.style.display == 'none') { return; }
+      this.poster.style.height = this.height() + "px"; // Need incase controlsBelow
+      this.poster.style.width = this.width() + "px"; // Could probably do 100% of box
+    },
+    hidePoster: function(){
+      if (!this.poster) { return; }
+      this.poster.style.display = "none";
+    },
+    // Update poster source from attribute or fallback image
+    // iPad breaks if you include a poster attribute, so this fixes that
+    updatePosterSource: function(){
+      if (!this.video.poster) {
+        var images = this.video.getElementsByTagName("img");
+        if (images.length > 0) { this.video.poster = images[0].src; }
+      }
+    }
+  }
+);
+/* Control Bar Behaviors
+================================================================================ */
+VideoJS.fn.newBehavior("controlBar", function(element){
+    if (!this.controlBars) {
+      this.controlBars = [];
+      this.addListener("resize", this.positionControlBars);
+    }
+    this.controlBars.push(element);
+    _V_.addListener(element, "mousemove", this.onControlBarsMouseMove.context(this));
+    _V_.addListener(element, "mouseout", this.onControlBarsMouseOut.context(this));
+  },{
+    showControlBars: function(){
+      if (!this.options.controlsEnabled) { return; }
+      if (!this.options.controlsAtStart && !this.hasPlayed) { return; }
+      this.each(this.controlBars, function(bar){
+        // bar.style.opacity = 1;
+        bar.style.display = "block";
+      });
+    },
+    // Place controller relative to the video's position (now just resizing bars)
+    positionControlBars: function(){
+      this.updatePlayProgressBars();
+      this.updateLoadProgressBars();
+    },
+    hideControlBars: function(){
+      if (this.options.controlsHiding && !this.mouseIsOverControls) {
+        this.each(this.controlBars, function(bar){
+          // bar.style.opacity = 0;
+          bar.style.display = "none";
+        });
+      }
+    },
+    // Block controls from hiding when mouse is over them.
+    onControlBarsMouseMove: function(){ this.mouseIsOverControls = true; },
+    onControlBarsMouseOut: function(event){
+      this.mouseIsOverControls = false;
+    }
+  }
+);
+/* PlayToggle, PlayButton, PauseButton Behaviors
+================================================================================ */
+// Play Toggle
+VideoJS.fn.newBehavior("playToggle", function(element){
+    if (!this.elements.playToggles) {
+      this.elements.playToggles = [];
+      this.addListener("play", this.playTogglesOnPlay);
+      this.addListener("pause", this.playTogglesOnPause);
+    }
+    this.elements.playToggles.push(element);
+    _V_.addListener(element, "click", this.onPlayToggleClick.context(this));
+  },{
+    onPlayToggleClick: function(event){
+      if (this.paused()) {
+        this.play();
+      } else {
+        this.pause();
+      }
+    },
+    playTogglesOnPlay: function(event){
+      this.each(this.elements.playToggles, function(toggle){
+        _V_.removeClass(toggle, "vjs-paused");
+        _V_.addClass(toggle, "vjs-playing");
+      });
+    },
+    playTogglesOnPause: function(event){
+      this.each(this.elements.playToggles, function(toggle){
+        _V_.removeClass(toggle, "vjs-playing");
+        _V_.addClass(toggle, "vjs-paused");
+      });
+    }
+  }
+);
+// Play
+VideoJS.fn.newBehavior("playButton", function(element){
+    _V_.addListener(element, "click", this.onPlayButtonClick.context(this));
+  },{
+    onPlayButtonClick: function(event){ this.play(); }
+  }
+);
+// Pause
+VideoJS.fn.newBehavior("pauseButton", function(element){
+    _V_.addListener(element, "click", this.onPauseButtonClick.context(this));
+  },{
+    onPauseButtonClick: function(event){ this.pause(); }
+  }
+);
+/* Play Progress Bar Behaviors
+================================================================================ */
+VideoJS.fn.newBehavior("playProgressBar", function(element){
+    if (!this.elements.playProgressBars) {
+      this.elements.playProgressBars = [];
+      this.addListener("timeupdate", this.updatePlayProgressBars);
+    }
+    this.elements.playProgressBars.push(element);
+  },{
+    // Ajust the play progress bar's width based on the current play time
+    updatePlayProgressBars: function(newTime){
+      var progress = (this.scrubbing) ? this.values.currentTime / this.duration() : this.currentTime() / this.duration();
+      if (isNaN(progress)) { progress = 0; }
+      this.each(this.elements.playProgressBars, function(bar){
+        if (bar.style) { bar.style.width = _V_.round(progress * 100, 2) + "%"; }
+      });
+    }
+  }
+);
+/* Load Progress Bar Behaviors
+================================================================================ */
+VideoJS.fn.newBehavior("loadProgressBar", function(element){
+    if (!this.elements.loadProgressBars) { this.elements.loadProgressBars = []; }
+    this.elements.loadProgressBars.push(element);
+    this.addListener("bufferedupdate", this.updateLoadProgressBars);
+  },{
+    updateLoadProgressBars: function(){
+      this.each(this.elements.loadProgressBars, function(bar){
+        if (bar.style) { bar.style.width = _V_.round(this.bufferedPercent() * 100, 2) + "%"; }
+      });
+    }
+  }
+);
+
+/* Current Time Display Behaviors
+================================================================================ */
+VideoJS.fn.newBehavior("currentTimeDisplay", function(element){
+    if (!this.elements.currentTimeDisplays) {
+      this.elements.currentTimeDisplays = [];
+      this.addListener("timeupdate", this.updateCurrentTimeDisplays);
+    }
+    this.elements.currentTimeDisplays.push(element);
+  },{
+    // Update the displayed time (00:00)
+    updateCurrentTimeDisplays: function(newTime){
+      // Allows for smooth scrubbing, when player can't keep up.
+      var time = (this.scrubbing) ? this.values.currentTime : this.currentTime();
+      this.each(this.elements.currentTimeDisplays, function(dis){
+        dis.innerHTML = _V_.formatTime(time);
+      });
+    }
+  }
+);
+
+/* Duration Display Behaviors
+================================================================================ */
+VideoJS.fn.newBehavior("durationDisplay", function(element){
+    if (!this.elements.durationDisplays) {
+      this.elements.durationDisplays = [];
+      this.addListener("timeupdate", this.updateDurationDisplays);
+    }
+    this.elements.durationDisplays.push(element);
+  },{
+    updateDurationDisplays: function(){
+      this.each(this.elements.durationDisplays, function(dis){
+        if (this.duration()) { dis.innerHTML = _V_.formatTime(this.duration()); }
+      });
+    }
+  }
+);
+
+/* Current Time Scrubber Behaviors
+================================================================================ */
+VideoJS.fn.newBehavior("currentTimeScrubber", function(element){
+    _V_.addListener(element, "mousedown", this.onCurrentTimeScrubberMouseDown.rEvtContext(this));
+  },{
+    // Adjust the play position when the user drags on the progress bar
+    onCurrentTimeScrubberMouseDown: function(event, scrubber){
+      event.preventDefault();
+      this.currentScrubber = scrubber;
+
+      this.stopTrackingCurrentTime(); // Allows for smooth scrubbing
+      this.scrubbing = true;
+
+      this.videoWasPlaying = !this.paused();
+      this.pause();
+
+      _V_.blockTextSelection();
+      this.setCurrentTimeWithScrubber(event);
+      _V_.addListener(document, "mousemove", this.onCurrentTimeScrubberMouseMove.rEvtContext(this));
+      _V_.addListener(document, "mouseup", this.onCurrentTimeScrubberMouseUp.rEvtContext(this));
+    },
+    onCurrentTimeScrubberMouseMove: function(event){ // Removeable
+      this.setCurrentTimeWithScrubber(event);
+    },
+    onCurrentTimeScrubberMouseUp: function(event){ // Removeable
+      _V_.unblockTextSelection();
+      document.removeEventListener("mousemove", this.onCurrentTimeScrubberMouseMove, false);
+      document.removeEventListener("mouseup", this.onCurrentTimeScrubberMouseUp, false);
+      this.scrubbing = false;
+      if (this.videoWasPlaying) {
+        this.play();
+        this.trackCurrentTime();
+      }
+    },
+    setCurrentTimeWithScrubber: function(event){
+      var newProgress = _V_.getRelativePosition(event.pageX, this.currentScrubber);
+      var newTime = newProgress * this.duration();
+      // Don't let video end while scrubbing.
+      if (newTime == this.duration()) { newTime = newTime - 0.1; }
+      this.currentTime(newTime);
+      this.triggerListeners("timeupdate");
+    }
+  }
+);
+/* Volume Display Behaviors
+================================================================================ */
+VideoJS.fn.newBehavior("volumeDisplay", function(element){
+    if (!this.elements.volumeDisplays) {
+      this.elements.volumeDisplays = [];
+      this.addListener("volumechange", this.updateVolumeDisplays);
+    }
+    this.elements.volumeDisplays.push(element);
+    this.updateVolumeDisplay(element); // Set the display to the initial volume
+  },{
+    // Update the volume control display
+    // Unique to these default controls. Uses borders to create the look of bars.
+    updateVolumeDisplays: function(){
+      if (!this.elements.volumeDisplays) { return; }
+      this.each(this.elements.volumeDisplays, function(dis){
+        this.updateVolumeDisplay(dis);
+      });
+    },
+    updateVolumeDisplay: function(display){
+      var volNum = Math.ceil(this.volume() * 6);
+      this.each(display.children, function(child, num){
+        if (num < volNum) {
+          _V_.addClass(child, "vjs-volume-level-on");
+        } else {
+          _V_.removeClass(child, "vjs-volume-level-on");
+        }
+      });
+    }
+  }
+);
+/* Volume Scrubber Behaviors
+================================================================================ */
+VideoJS.fn.newBehavior("volumeScrubber", function(element){
+    _V_.addListener(element, "mousedown", this.onVolumeScrubberMouseDown.rEvtContext(this));
+  },{
+    // Adjust the volume when the user drags on the volume control
+    onVolumeScrubberMouseDown: function(event, scrubber){
+      // event.preventDefault();
+      _V_.blockTextSelection();
+      this.currentScrubber = scrubber;
+      this.setVolumeWithScrubber(event);
+      _V_.addListener(document, "mousemove", this.onVolumeScrubberMouseMove.rEvtContext(this));
+      _V_.addListener(document, "mouseup", this.onVolumeScrubberMouseUp.rEvtContext(this));
+    },
+    onVolumeScrubberMouseMove: function(event){
+      this.setVolumeWithScrubber(event);
+    },
+    onVolumeScrubberMouseUp: function(event){
+      this.setVolumeWithScrubber(event);
+      _V_.unblockTextSelection();
+      document.removeEventListener("mousemove", this.onVolumeScrubberMouseMove, false);
+      document.removeEventListener("mouseup", this.onVolumeScrubberMouseUp, false);
+    },
+    setVolumeWithScrubber: function(event){
+      var newVol = _V_.getRelativePosition(event.pageX, this.currentScrubber);
+      this.volume(newVol);
+    }
+  }
+);
+/* Fullscreen Toggle Behaviors
+================================================================================ */
+VideoJS.fn.newBehavior("fullscreenToggle", function(element){
+    _V_.addListener(element, "click", this.onFullscreenToggleClick.context(this));
+  },{
+    // When the user clicks on the fullscreen button, update fullscreen setting
+    onFullscreenToggleClick: function(event){
+      if (!this.videoIsFullScreen) {
+        this.enterFullScreen();
+      } else {
+        this.exitFullScreen();
+      }
+    },
+
+    fullscreenOnWindowResize: function(event){ // Removeable
+      this.positionControlBars();
+    },
+    // Create listener for esc key while in full screen mode
+    fullscreenOnEscKey: function(event){ // Removeable
+      if (event.keyCode == 27) {
+        this.exitFullScreen();
+      }
+    }
+  }
+);
+/* Big Play Button Behaviors
+================================================================================ */
+VideoJS.fn.newBehavior("bigPlayButton", function(element){
+    if (!this.elements.bigPlayButtons) {
+      this.elements.bigPlayButtons = [];
+      this.addListener("play", this.hideBigPlayButtons);
+      this.addListener("ended", this.showBigPlayButtons);
+    }
+    this.elements.bigPlayButtons.push(element);
+    this.activateElement(element, "playButton");
+  },{
+    showBigPlayButtons: function(){
+      if (!this.options.controlsEnabled) { return; }
+      this.each(this.elements.bigPlayButtons, function(element){
+        element.style.display = "block";
+      });
+    },
+    hideBigPlayButtons: function(){
+      this.each(this.elements.bigPlayButtons, function(element){
+        element.style.display = "none";
+      });
+    }
+  }
+);
+/* Spinner
+================================================================================ */
+VideoJS.fn.newBehavior("spinner", function(element){
+    if (!this.spinners) {
+      this.spinners = [];
+      this.spinnersRotated = 0;
+      _V_.addListener(this.video, "loadeddata", this.spinnersOnVideoLoadedData.context(this));
+      _V_.addListener(this.video, "loadstart", this.spinnersOnVideoLoadStart.context(this));
+      _V_.addListener(this.video, "seeking", this.spinnersOnVideoSeeking.context(this));
+      _V_.addListener(this.video, "seeked", this.spinnersOnVideoSeeked.context(this));
+      _V_.addListener(this.video, "canplay", this.spinnersOnVideoCanPlay.context(this));
+      _V_.addListener(this.video, "canplaythrough", this.spinnersOnVideoCanPlayThrough.context(this));
+      _V_.addListener(this.video, "waiting", this.spinnersOnVideoWaiting.context(this));
+      _V_.addListener(this.video, "stalled", this.spinnersOnVideoStalled.context(this));
+      _V_.addListener(this.video, "suspend", this.spinnersOnVideoSuspend.context(this));
+      _V_.addListener(this.video, "playing", this.spinnersOnVideoPlaying.context(this));
+      _V_.addListener(this.video, "timeupdate", this.spinnersOnVideoTimeUpdate.context(this));
+    }
+    this.spinners.push(element);
+  },{
+    showSpinners: function(){
+      this.each(this.spinners, function(spinner){
+        spinner.style.display = "block";
+      });
+      clearInterval(this.spinnerInterval);
+      this.spinnerInterval = setInterval(this.rotateSpinners.context(this), 100);
+    },
+    hideSpinners: function(){
+      this.each(this.spinners, function(spinner){
+        spinner.style.display = "none";
+      });
+      clearInterval(this.spinnerInterval);
+    },
+    rotateSpinners: function(){
+      this.each(this.spinners, function(spinner){
+        // spinner.style.transform =       'scale(0.5) rotate('+this.spinnersRotated+'deg)';
+        spinner.style.WebkitTransform = 'scale(0.5) rotate('+this.spinnersRotated+'deg)';
+        spinner.style.MozTransform =    'scale(0.5) rotate('+this.spinnersRotated+'deg)';
+      });
+      if (this.spinnersRotated == 360) { this.spinnersRotated = 0; }
+      this.spinnersRotated += 45;
+    },
+    spinnersOnVideoLoadedData: function(event){ this.hideSpinners(); },
+    spinnersOnVideoLoadStart: function(event){ this.showSpinners(); },
+    spinnersOnVideoSeeking: function(event){ /* this.showSpinners(); */ },
+    spinnersOnVideoSeeked: function(event){ /* this.hideSpinners(); */ },
+    spinnersOnVideoCanPlay: function(event){ /* this.hideSpinners(); */ },
+    spinnersOnVideoCanPlayThrough: function(event){ this.hideSpinners(); },
+    spinnersOnVideoWaiting: function(event){
+      // Safari sometimes triggers waiting inappropriately
+      // Like after video has played, and you play again.
+      this.showSpinners();
+    },
+    spinnersOnVideoStalled: function(event){},
+    spinnersOnVideoSuspend: function(event){},
+    spinnersOnVideoPlaying: function(event){ this.hideSpinners(); },
+    spinnersOnVideoTimeUpdate: function(event){
+      // Safari sometimes calls waiting and doesn't recover
+      if(this.spinner.style.display == "block") { this.hideSpinners(); }
+    }
+  }
+);
+/* Subtitles
+================================================================================ */
+VideoJS.fn.newBehavior("subtitlesDisplay", function(element){
+    if (!this.elements.subtitleDisplays) {
+      this.elements.subtitleDisplays = [];
+      this.addListener("timeupdate", this.subtitleDisplaysOnVideoTimeUpdate);
+      this.addListener("ended", function() { this.lastSubtitleIndex = 0; }.context(this));
+    }
+    this.elements.subtitleDisplays.push(element);
+  },{
+    subtitleDisplaysOnVideoTimeUpdate: function(){
+      // Assuming all subtitles are in order by time, and do not overlap
+      if (this.subtitles) {
+        var time = this.currentTime();
+        // If current subtitle should stay showing, don't do anything. Otherwise, find new subtitle.
+        if (!this.currentSubtitle || this.currentSubtitle.start >= time || this.currentSubtitle.end < time) {
+          var newSubIndex = false,
+              // Loop in reverse if lastSubtitle is after current time (optimization)
+              // Meaning the user is scrubbing in reverse or rewinding
+              reverse = (this.subtitles[this.lastSubtitleIndex].start > time),
+              // If reverse, step back 1 becase we know it's not the lastSubtitle
+              i = this.lastSubtitleIndex - (reverse) ? 1 : 0;
+          while (true) { // Loop until broken
+            if (reverse) { // Looping in reverse
+              // Stop if no more, or this subtitle ends before the current time (no earlier subtitles should apply)
+              if (i < 0 || this.subtitles[i].end < time) { break; }
+              // End is greater than time, so if start is less, show this subtitle
+              if (this.subtitles[i].start < time) {
+                newSubIndex = i;
+                break;
+              }
+              i--;
+            } else { // Looping forward
+              // Stop if no more, or this subtitle starts after time (no later subtitles should apply)
+              if (i >= this.subtitles.length || this.subtitles[i].start > time) { break; }
+              // Start is less than time, so if end is later, show this subtitle
+              if (this.subtitles[i].end > time) {
+                newSubIndex = i;
+                break;
+              }
+              i++;
+            }
+          }
+
+          // Set or clear current subtitle
+          if (newSubIndex !== false) {
+            this.currentSubtitle = this.subtitles[newSubIndex];
+            this.lastSubtitleIndex = newSubIndex;
+            this.updateSubtitleDisplays(this.currentSubtitle.text);
+          } else if (this.currentSubtitle) {
+            this.currentSubtitle = false;
+            this.updateSubtitleDisplays("");
+          }
+        }
+      }
+    },
+    updateSubtitleDisplays: function(val){
+      this.each(this.elements.subtitleDisplays, function(disp){
+        disp.innerHTML = val;
+      });
+    }
+  }
+);
+

dev/src/flash.js

@@ -0,0 +1,77 @@
+/* Flash Player Type
+================================================================================ */
+VideoJS.fn.extend({
+
+  flashSupported: function(){
+    return !!this.flashPlayerVersionSupported();
+  },
+
+  flashInit: function(){
+    this.flashElement = this.getFlashElement();
+    this.replaceWithFlash();
+    this.element = this.flashElement;
+    this.video.src = ""; // Stop video from downloading if HTML5 is still supported
+    var flashPlayer = VideoJS.flashPlayers[this.options.flashPlayer];
+    this.api = flashPlayer.api;
+    flashPlayer.init.call(this);
+    this.api.setupTriggers.call(this);
+  },
+
+  // Get Flash Fallback object element from Embed Code
+  getFlashElement: function(){
+    var children = this.video.children;
+    for (var i=0,j=children.length; i<j; i++) {
+      if (children[i].className == "vjs-flash-fallback") {
+        return children[i];
+      }
+    }
+  },
+
+  buildFlashElement: function(){
+    this.flashElement = _V_.createElement("object", { 
+      id: "flash_fallback_2", 
+      className: "vjs-flash-fallback",
+      type: "application/x-shockwave-flash",
+      data: "http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf"
+    });
+    // <object width="640" height="264" >
+
+    var params = {
+      movie: 'http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf',
+      wmode: 'opaque',
+      allowfullscreen: 'true',
+      flashvars: 'config={"playlist":["http://video-js.zencoder.com/oceans-clip.png", {"url": "http://video-js.zencoder.com/oceans-clip.mp4","autoPlay":false,"autoBuffering":true}]}'
+    };
+    
+    for (var name in params){
+      var p = _V_.createElement("param");
+      p.name = name;
+      p.value = params[name];
+      this.flashElement.appendChild(p);
+    }
+  },
+
+  // Used to force a browser to fall back when it's an HTML5 browser but there's no supported sources
+  replaceWithFlash: function(){
+    // this.flashElement = this.video.removeChild(this.flashElement);
+    if (this.flashElement) {
+      this.box.insertBefore(this.flashElement, this.video);
+      this.video.style.display = "none"; // Removing it was breaking later players
+    }
+  },
+
+  // Check if browser can use this flash player
+  flashPlayerVersionSupported: function(){
+    var playerVersion = (this.options.flashPlayerVersion) ? this.options.flashPlayerVersion : VideoJS.flashPlayers[this.options.flashPlayer].flashPlayerVersion;
+    return VideoJS.getFlashVersion() >= playerVersion;
+  }
+});
+
+/* Flash Object Fallback (Flash Player)
+================================================================================ */
+VideoJS.flashPlayers = {};
+VideoJS.flashPlayers.htmlObject = {
+  flashPlayerVersion: 9,
+  init: function() { return true; },
+  api: {} // No video API available with HTML Object embed method
+};

dev/src/html5.js

@@ -0,0 +1,474 @@
+/* HTML5 Player Type
+================================================================================ */
+VideoJS.fn.extend({
+
+  html5Supported: function(){
+    if (VideoJS.browserSupportsVideo() && this.canPlaySource()) {
+      return true;
+    } else {
+      return false;
+    }
+  },
+
+  html5Init: function(){
+    this.element = this.video;
+    this.api = this.html5API;
+    this.api.setupTriggers.call(this);
+
+    this.fixPreloading(); // Support old browsers that used autobuffer
+    this.supportProgressEvents(); // Support browsers that don't use 'buffered'
+
+    // Set to stored volume OR 85%
+    this.volume((localStorage && localStorage.volume) || this.options.defaultVolume);
+
+    // Update interface for device needs
+    if (VideoJS.isIOS()) {
+      this.options.useBuiltInControls = true;
+      this.iOSInterface();
+    } else if (VideoJS.isAndroid()) {
+      this.options.useBuiltInControls = true;
+      this.androidInterface();
+    }
+
+    // Add VideoJS Controls
+    if (!this.options.useBuiltInControls) {
+      this.video.controls = false;
+
+      if (this.options.controlsBelow) { _V_.addClass(this.box, "vjs-controls-below"); }
+
+      // Make a click on th video act as a play button
+      this.activateElement(this.video, "playToggle");
+
+      // Build Interface
+      this.buildStylesCheckDiv(); // Used to check if style are loaded
+      this.buildAndActivatePoster();
+      this.buildBigPlayButton();
+      this.buildAndActivateSpinner();
+      this.buildAndActivateControlBar();
+      this.loadInterface(); // Show everything once styles are loaded
+      this.getSubtitles();
+    }
+  },
+  /* Source Managemet
+  ================================================================================ */
+  canPlaySource: function(){
+    // Cache Result
+    if (this.canPlaySourceResult) { return this.canPlaySourceResult; }
+    // Loop through sources and check if any can play
+    var children = this.video.children;
+    for (var i=0,j=children.length; i<j; i++) {
+      if (children[i].tagName.toUpperCase() == "SOURCE") {
+        var canPlay = this.video.canPlayType(children[i].type) || this.canPlayExt(children[i].src);
+        if (canPlay == "probably" || canPlay == "maybe") {
+          this.firstPlayableSource = children[i];
+          this.canPlaySourceResult = true;
+          return true;
+        }
+      }
+    }
+    this.canPlaySourceResult = false;
+    return false;
+  },
+  // Check if the extention is compatible, for when type won't work
+  canPlayExt: function(src){
+    if (!src) { return ""; }
+    var match = src.match(/\.([^\.]+)$/);
+    if (match && match[1]) {
+      var ext = match[1].toLowerCase();
+      // Android canPlayType doesn't work
+      if (VideoJS.isAndroid()) {
+        if (ext == "mp4" || ext == "m4v") { return "maybe"; }
+      // Allow Apple HTTP Streaming for iOS
+      } else if (VideoJS.isIOS()) {
+        if (ext == "m3u8") { return "maybe"; }
+      }
+    }
+    return "";
+  },
+  // Force the video source - Helps fix loading bugs in a handful of devices, like the iPad/iPhone poster bug
+  // And iPad/iPhone javascript include location bug. And Android type attribute bug
+  forceTheSource: function(){
+    this.video.src = this.firstPlayableSource.src; // From canPlaySource()
+    this.video.load();
+  },
+  /* Device Fixes
+  ================================================================================ */
+  // Support older browsers that used "autobuffer"
+  fixPreloading: function(){
+    if (typeof this.video.hasAttribute == "function" && this.video.hasAttribute("preload") && this.video.preload != "none") {
+      this.video.autobuffer = true; // Was a boolean
+    } else {
+      this.video.autobuffer = false;
+      this.video.preload = "none";
+    }
+  },
+
+  // Listen for Video Load Progress (currently does not if html file is local)
+  // Buffered does't work in all browsers, so watching progress as well
+  supportProgressEvents: function(e){
+    _V_.addListener(this.video, 'progress', this.setBufferedFromProgress.context(this));
+  },
+  // playerOnVideoProgress: function(event){
+  //   this.setBufferedFromProgress(event);
+  // },
+  setBufferedFromProgress: function(event){ // HTML5 Only
+    if(event.total > 0 && this.duration()) {
+      var newBufferEnd = (event.loaded / event.total) * this.duration();
+      if (newBufferEnd > this.values.bufferEnd) {
+        this.values.bufferEnd = newBufferEnd;
+        this.triggerListeners("bufferedupdate");
+      }
+    }
+  },
+
+  iOSInterface: function(){
+    if(VideoJS.iOSVersion() < 4) { this.forceTheSource(); } // Fix loading issues
+    if(VideoJS.isIPad()) { // iPad could work with controlsBelow
+      this.buildAndActivateSpinner(); // Spinner still works well on iPad, since iPad doesn't have one
+    }
+  },
+
+  // Fix android specific quirks
+  // Use built-in controls, but add the big play button, since android doesn't have one.
+  androidInterface: function(){
+    this.forceTheSource(); // Fix loading issues
+    _V_.addListener(this.video, "click", function(){ this.play(); }); // Required to play
+    this.buildBigPlayButton(); // But don't activate the normal way. Pause doesn't work right on android.
+    _V_.addListener(this.bigPlayButton, "click", function(){ this.play(); }.context(this));
+    this.positionBox();
+    this.showBigPlayButtons();
+  },
+  /* Wait for styles (TODO: move to _V_)
+  ================================================================================ */
+  loadInterface: function(){
+    if(!this.stylesHaveLoaded()) {
+      // Don't want to create an endless loop either.
+      if (!this.positionRetries) { this.positionRetries = 1; }
+      if (this.positionRetries++ < 100) {
+        setTimeout(this.loadInterface.context(this),10);
+        return;
+      }
+    }
+    this.hideStylesCheckDiv();
+    this.showPoster();
+    if (this.video.paused !== false) { this.showBigPlayButtons(); }
+    if (this.options.controlsAtStart) { this.showControlBars(); }
+    this.positionAll();
+  },
+  /* Control Bar
+  ================================================================================ */
+  buildAndActivateControlBar: function(){
+    /* Creating this HTML
+      <div class="vjs-controls">
+        <div class="vjs-play-control">
+          <span></span>
+        </div>
+        <div class="vjs-progress-control">
+          <div class="vjs-progress-holder">
+            <div class="vjs-load-progress"></div>
+            <div class="vjs-play-progress"></div>
+          </div>
+        </div>
+        <div class="vjs-time-control">
+          <span class="vjs-current-time-display">00:00</span><span> / </span><span class="vjs-duration-display">00:00</span>
+        </div>
+        <div class="vjs-volume-control">
+          <div>
+            <span></span><span></span><span></span><span></span><span></span><span></span>
+          </div>
+        </div>
+        <div class="vjs-fullscreen-control">
+          <div>
+            <span></span><span></span><span></span><span></span>
+          </div>
+        </div>
+      </div>
+    */
+
+    // Create a div to hold the different controls
+    this.controls = _V_.createElement("div", { className: "vjs-controls" });
+    // Add the controls to the video's container
+    this.box.appendChild(this.controls);
+    this.activateElement(this.controls, "controlBar");
+    this.activateElement(this.controls, "mouseOverVideoReporter");
+
+    // Build the play control
+    this.playControl = _V_.createElement("div", { className: "vjs-play-control", innerHTML: "<span></span>" });
+    this.controls.appendChild(this.playControl);
+    this.activateElement(this.playControl, "playToggle");
+
+    // Build the progress control
+    this.progressControl = _V_.createElement("div", { className: "vjs-progress-control" });
+    this.controls.appendChild(this.progressControl);
+
+    // Create a holder for the progress bars
+    this.progressHolder = _V_.createElement("div", { className: "vjs-progress-holder" });
+    this.progressControl.appendChild(this.progressHolder);
+    this.activateElement(this.progressHolder, "currentTimeScrubber");
+
+    // Create the loading progress display
+    this.loadProgressBar = _V_.createElement("div", { className: "vjs-load-progress" });
+    this.progressHolder.appendChild(this.loadProgressBar);
+    this.activateElement(this.loadProgressBar, "loadProgressBar");
+
+    // Create the playing progress display
+    this.playProgressBar = _V_.createElement("div", { className: "vjs-play-progress" });
+    this.progressHolder.appendChild(this.playProgressBar);
+    this.activateElement(this.playProgressBar, "playProgressBar");
+
+    // Create the progress time display (00:00 / 00:00)
+    this.timeControl = _V_.createElement("div", { className: "vjs-time-control" });
+    this.controls.appendChild(this.timeControl);
+
+    // Create the current play time display
+    this.currentTimeDisplay = _V_.createElement("span", { className: "vjs-current-time-display", innerHTML: "00:00" });
+    this.timeControl.appendChild(this.currentTimeDisplay);
+    this.activateElement(this.currentTimeDisplay, "currentTimeDisplay");
+
+    // Add time separator
+    this.timeSeparator = _V_.createElement("span", { innerHTML: " / " });
+    this.timeControl.appendChild(this.timeSeparator);
+
+    // Create the total duration display
+    this.durationDisplay = _V_.createElement("span", { className: "vjs-duration-display", innerHTML: "00:00" });
+    this.timeControl.appendChild(this.durationDisplay);
+    this.activateElement(this.durationDisplay, "durationDisplay");
+
+    // Create the volumne control
+    this.volumeControl = _V_.createElement("div", {
+      className: "vjs-volume-control",
+      innerHTML: "<div><span></span><span></span><span></span><span></span><span></span><span></span></div>"
+    });
+    this.controls.appendChild(this.volumeControl);
+    this.activateElement(this.volumeControl, "volumeScrubber");
+
+    this.volumeDisplay = this.volumeControl.children[0];
+    this.activateElement(this.volumeDisplay, "volumeDisplay");
+
+    // Crete the fullscreen control
+    this.fullscreenControl = _V_.createElement("div", {
+      className: "vjs-fullscreen-control",
+      innerHTML: "<div><span></span><span></span><span></span><span></span></div>"
+    });
+    this.controls.appendChild(this.fullscreenControl);
+    this.activateElement(this.fullscreenControl, "fullscreenToggle");
+  },
+  /* Poster Image
+  ================================================================================ */
+  buildAndActivatePoster: function(){
+    this.updatePosterSource();
+    if (this.video.poster) {
+      this.poster = document.createElement("img");
+      // Add poster to video box
+      this.box.appendChild(this.poster);
+
+      // Add poster image data
+      this.poster.src = this.video.poster;
+      // Add poster styles
+      this.poster.className = "vjs-poster";
+      this.activateElement(this.poster, "poster");
+    } else {
+      this.poster = false;
+    }
+  },
+  /* Big Play Button
+  ================================================================================ */
+  buildBigPlayButton: function(){
+    /* Creating this HTML
+      <div class="vjs-big-play-button"><span></span></div>
+    */
+    this.bigPlayButton = _V_.createElement("div", {
+      className: "vjs-big-play-button",
+      innerHTML: "<span></span>"
+    });
+    this.box.appendChild(this.bigPlayButton);
+    this.activateElement(this.bigPlayButton, "bigPlayButton");
+  },
+  /* Spinner (Loading)
+  ================================================================================ */
+  buildAndActivateSpinner: function(){
+    this.spinner = _V_.createElement("div", {
+      className: "vjs-spinner",
+      innerHTML: "<div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div>"
+    });
+    this.box.appendChild(this.spinner);
+    this.activateElement(this.spinner, "spinner");
+  },
+  /* Styles Check - Check if styles are loaded (move ot _V_)
+  ================================================================================ */
+  // Sometimes the CSS styles haven't been applied to the controls yet
+  // when we're trying to calculate the height and position them correctly.
+  // This causes a flicker where the controls are out of place.
+  buildStylesCheckDiv: function(){
+    this.stylesCheckDiv = _V_.createElement("div", { className: "vjs-styles-check" });
+    this.stylesCheckDiv.style.position = "absolute";
+    this.box.appendChild(this.stylesCheckDiv);
+  },
+  hideStylesCheckDiv: function(){ this.stylesCheckDiv.style.display = "none"; },
+  stylesHaveLoaded: function(){
+    if (this.stylesCheckDiv.offsetHeight != 5) {
+       return false;
+    } else {
+      return true;
+    }
+  },
+  /* VideoJS Box - Holds all elements
+  ================================================================================ */
+  positionAll: function(){
+    this.positionBox();
+    this.positionControlBars();
+    this.positionPoster();
+  },
+  positionBox: function(){
+    // Set width based on fullscreen or not.
+    if (this.videoIsFullScreen) {
+      this.box.style.width = "";
+      this.element.style.height="";
+      if (this.options.controlsBelow) {
+        this.box.style.height = "";
+        this.element.style.height = (this.box.offsetHeight - this.controls.offsetHeight) + "px";
+      }
+    } else {
+      this.box.style.width = this.width() + "px";
+      this.element.style.height=this.height()+"px";
+      if (this.options.controlsBelow) {
+        this.element.style.height = "";
+        // this.box.style.height = this.video.offsetHeight + this.controls.offsetHeight + "px";
+      }
+    }
+  },
+  /* Subtitles
+  ================================================================================ */
+  getSubtitles: function(){
+    var tracks = this.video.getElementsByTagName("TRACK");
+    for (var i=0,j=tracks.length; i<j; i++) {
+      if (tracks[i].getAttribute("kind") == "subtitles" && tracks[i].getAttribute("src")) {
+        this.subtitlesSource = tracks[i].getAttribute("src");
+        this.loadSubtitles();
+        this.buildSubtitles();
+      }
+    }
+  },
+  loadSubtitles: function() { _V_.get(this.subtitlesSource, this.parseSubtitles.context(this)); },
+  parseSubtitles: function(subText) {
+    var lines = subText.split("\n"),
+        line = "",
+        subtitle, time, text;
+    this.subtitles = [];
+    this.currentSubtitle = false;
+    this.lastSubtitleIndex = 0;
+
+    for (var i=0; i<lines.length; i++) {
+      line = _V_.trim(lines[i]); // Trim whitespace and linebreaks
+      if (line) { // Loop until a line with content
+
+        // First line - Number
+        subtitle = {
+          id: line, // Subtitle Number
+          index: this.subtitles.length // Position in Array
+        };
+
+        // Second line - Time
+        line = _V_.trim(lines[++i]);
+        time = line.split(" --> ");
+        subtitle.start = this.parseSubtitleTime(time[0]);
+        subtitle.end = this.parseSubtitleTime(time[1]);
+
+        // Additional lines - Subtitle Text
+        text = [];
+        for (var j=i; j<lines.length; j++) { // Loop until a blank line or end of lines
+          line = _V_.trim(lines[++i]);
+          if (!line) { break; }
+          text.push(line);
+        }
+        subtitle.text = text.join('<br/>');
+
+        // Add this subtitle
+        this.subtitles.push(subtitle);
+      }
+    }
+  },
+
+  parseSubtitleTime: function(timeText) {
+    var parts = timeText.split(':'),
+        time = 0;
+    // hours => seconds
+    time += parseFloat(parts[0])*60*60;
+    // minutes => seconds
+    time += parseFloat(parts[1])*60;
+    // get seconds
+    var seconds = parts[2].split(/\.|,/); // Either . or ,
+    time += parseFloat(seconds[0]);
+    // add miliseconds
+    ms = parseFloat(seconds[1]);
+    if (ms) { time += ms/1000; }
+    return time;
+  },
+
+  buildSubtitles: function(){
+    /* Creating this HTML
+      <div class="vjs-subtitles"></div>
+    */
+    this.subtitlesDisplay = _V_.createElement("div", { className: 'vjs-subtitles' });
+    this.box.appendChild(this.subtitlesDisplay);
+    this.activateElement(this.subtitlesDisplay, "subtitlesDisplay");
+  },
+
+  /* Player API - Translate functionality from player to video
+  ================================================================================ */
+  html5API: {
+    setupTriggers: function(){
+      // Make video events trigger player events
+      // May seem verbose here, but makes other APIs possible.
+      var types = ["play", "pause", "ended", "volumechange", "error"],
+          player = this, i, type;
+      for (i = 0; i<types.length; i++) {
+        type = types[i];
+        _V_.addListener(this.video, type, function(e){
+          player.triggerListeners(this, e);
+        }.context(type));
+      }
+    },
+
+    play: function(){ this.video.play(); },
+    pause: function(){ this.video.pause(); },
+    paused: function(){ return this.video.paused; },
+
+    currentTime: function(){ return this.video.currentTime; },
+    setCurrentTime: function(seconds){
+      try { this.video.currentTime = seconds; }
+      catch(e) { this.warning(VideoJS.warnings.videoNotReady); }
+    },
+
+    duration: function(){ return this.video.duration; },
+    buffered: function(){ return this.video.buffered; },
+
+    volume: function(){ return this.video.volume; },
+    setVolume: function(percentAsDecimal){ this.video.volume = percentAsDecimal; },
+
+    width: function(){ return this.video.offsetWidth; },
+    height: function(){ return this.video.offsetHeight; },
+
+    supportsFullScreen: function(){
+      if(typeof this.video.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.video.webkitEnterFullScreen();
+      } catch (e) {
+        if (e.code == 11) { this.warning(VideoJS.warnings.videoNotReady); }
+      }
+    },
+    src: function(src){
+      this.video.src = src;
+      this.video.load();
+    }
+  }
+});
+

dev/src/lib.js

@@ -0,0 +1,196 @@
+////////////////////////////////////////////////////////////////////////////////
+// Convenience Functions (mini library)
+// Functions not specific to video or VideoJS and could probably be replaced with a library like jQuery
+////////////////////////////////////////////////////////////////////////////////
+
+VideoJS.extend({
+
+  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(/\s+/);
+    classNames.splice(classNames.lastIndexOf(classToRemove),1);
+    element.className = classNames.join(" ");
+  },
+  createElement: function(tagName, attributes){
+    return this.merge(document.createElement(tagName), attributes);
+  },
+
+  // 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 MM:SS
+  formatTime: function(secs) {
+    var seconds = Math.round(secs);
+    var minutes = Math.floor(seconds / 60);
+    minutes = (minutes >= 10) ? minutes : "0" + minutes;
+    seconds = Math.floor(seconds % 60);
+    seconds = (seconds >= 10) ? seconds : "0" + seconds;
+    return minutes + ":" + seconds;
+  },
+
+  // 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 - this.findPosX(relativeElement)) / relativeElement.offsetWidth));
+  },
+  // Get an objects position on the page
+  findPosX: function(obj) {
+    var curleft = obj.offsetLeft;
+    while(obj = obj.offsetParent) {
+      curleft += obj.offsetLeft;
+    }
+    return curleft;
+  },
+  getComputedStyleValue: function(element, style){
+    return window.getComputedStyle(element, null).getPropertyValue(style);
+  },
+
+  round: function(num, dec) {
+    if (!dec) { dec = 0; }
+    return Math.round(num*Math.pow(10,dec))/Math.pow(10,dec);
+  },
+
+  addListener: function(element, type, handler){
+    if (element.addEventListener) {
+      element.addEventListener(type, handler, false);
+    } else if (element.attachEvent) {
+      element.attachEvent("on"+type, handler);
+    }
+  },
+  removeListener: function(element, type, handler){
+    if (element.removeEventListener) {
+      element.removeEventListener(type, handler, false);
+    } else if (element.attachEvent) {
+      element.detachEvent("on"+type, handler);
+    }
+  },
+
+  get: function(url, onSuccess){
+    // if (netscape.security.PrivilegeManager.enablePrivilege) {
+    //   netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");
+    // }
+    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) {}
+        //Microsoft.XMLHTTP points to Msxml2.XMLHTTP.3.0 and is redundant
+        throw new Error("This browser does not support XMLHttpRequest.");
+      };
+    }
+    var request = new XMLHttpRequest();
+    request.open("GET",url);
+    request.onreadystatechange = function() {
+      if (request.readyState == 4 && request.status == 200) {
+        onSuccess(request.responseText);
+      }
+    }.context(this);
+    try {
+      request.send();
+    } catch(e) {
+      // Can't access file.
+    }
+  },
+
+  trim: function(string){ return string.toString().replace(/^\s+/, "").replace(/\s+$/, ""); },
+
+  // DOM Ready functionality adapted from jQuery. http://jquery.com/
+  bindDOMReady: function(){
+    if (document.readyState === "complete") {
+      return VideoJS.onDOMReady();
+    }
+    if (document.addEventListener) {
+      document.addEventListener("DOMContentLoaded", VideoJS.DOMContentLoaded, false);
+      window.addEventListener("load", VideoJS.onDOMReady, false);
+    } else if (document.attachEvent) {
+      document.attachEvent("onreadystatechange", VideoJS.DOMContentLoaded);
+      window.attachEvent("onload", VideoJS.onDOMReady);
+    }
+  },
+
+  DOMContentLoaded: function(){
+    if (document.addEventListener) {
+      document.removeEventListener( "DOMContentLoaded", VideoJS.DOMContentLoaded, false);
+      VideoJS.onDOMReady();
+    } else if ( document.attachEvent ) {
+      if ( document.readyState === "complete" ) {
+        document.detachEvent("onreadystatechange", VideoJS.DOMContentLoaded);
+        VideoJS.onDOMReady();
+      }
+    }
+  },
+
+  // Functions to be run once the DOM is loaded
+  DOMReadyList: [],
+  addToDOMReady: function(fn){
+    if (VideoJS.DOMIsReady) {
+      fn.call(document);
+    } else {
+      VideoJS.DOMReadyList.push(fn);
+    }
+  },
+
+  DOMIsReady: false,
+  onDOMReady: function(){
+    if (VideoJS.DOMIsReady) { return; }
+    if (!document.body) { return setTimeout(VideoJS.onDOMReady, 13); }
+    VideoJS.DOMIsReady = true;
+    if (VideoJS.DOMReadyList) {
+      for (var i=0; i<VideoJS.DOMReadyList.length; i++) {
+        VideoJS.DOMReadyList[i].call(document);
+      }
+      VideoJS.DOMReadyList = null;
+    }
+  }
+});
+VideoJS.bindDOMReady();
+
+// Allows for binding context to functions
+// when using in event listeners and timeouts
+Function.prototype.context = function(obj){
+  var method = this,
+  temp = function(){
+    return method.apply(obj, arguments);
+  };
+  return temp;
+};
+
+// Like context, in that it creates a closure
+// But insteaad keep "this" intact, and passes the var as the second argument of the function
+// Need for event listeners where you need to know what called the event
+// Only use with event callbacks
+Function.prototype.evtContext = function(obj){
+  var method = this,
+  temp = function(){
+    var origContext = this;
+    return method.call(obj, arguments[0], origContext);
+  };
+  return temp;
+};
+
+// Removeable Event listener with Context
+// Replaces the original function with a version that has context
+// So it can be removed using the original function name.
+// In order to work, a version of the function must already exist in the player/prototype
+Function.prototype.rEvtContext = function(obj, funcParent){
+  if (this.hasContext === true) { return this; }
+  if (!funcParent) { funcParent = obj; }
+  for (var attrname in funcParent) {
+    if (funcParent[attrname] == this) {
+      funcParent[attrname] = this.evtContext(obj);
+      funcParent[attrname].hasContext = true;
+      return funcParent[attrname];
+    }
+  }
+  return this.evtContext(obj);
+};
+

dev/src/main.js

@@ -0,0 +1,306 @@
+// Using jresig's Class implementation http://ejohn.org/blog/simple-javascript-inheritance/
+(function(){var initializing=false, fnTest=/xyz/.test(function(){xyz;}) ? /\b_super\b/ : /.*/; this.JRClass = function(){}; JRClass.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 JRClass() { if ( !initializing && this.init ) this.init.apply(this, arguments); } JRClass.prototype = prototype; JRClass.constructor = JRClass; JRClass.extend = arguments.callee; return JRClass;};})();
+
+// Video JS Player Class
+var VideoJS = JRClass.extend({
+
+  // Initialize the player for the supplied video tag element
+  // element: video tag
+  init: function(element, setOptions){
+
+    // Allow an ID string or an element
+    if (typeof element == 'string') {
+      this.video = document.getElementById(element);
+    } else {
+      this.video = element;
+    }
+
+    this.video.player = this; // Store reference to player on the video element.
+    this.box = this.video.parentNode; // Container element for controls positioning
+    this.values = {}; // Cache for video property values.
+    this.elements = {}; // Store refs to controls elements.
+    this.listeners = {}; // Store video event listeners.
+    this.api = {}; // Current API to video functions (changes with player type)
+
+    // Hide Links. Will be shown again if "links" player is used
+    this.linksFallback = this.getLinksFallback();
+    this.hideLinksFallback();
+
+    // Default Options
+    this.options = {
+      autoplay: false,
+      preload: true,
+      loop: false,
+      returnToStart: true, // Go back to the beginning when the video is done
+      controlsEnabled: true,
+      useBuiltInControls: false, // Use the browser's controls (iPhone)
+      controlsBelow: false, // Display control bar below video vs. in front of
+      controlsAtStart: false, // Make controls visible when page loads
+      controlsHiding: true, // Hide controls when not over the video
+      defaultVolume: 0.85, // Will be overridden by localStorage volume if available
+      playerFallbackOrder: ["html5", "flash", "links"], // Players and order to use them
+      flashPlayer: "htmlObject", // htmlObject, or custom options available
+      flashPlayerVersion: false // Required flash version for fallback
+    };
+    // Override default options with global options
+    if (typeof VideoJS.options == "object") { _V_.merge(this.options, VideoJS.options); }
+    // Override default & global options with options specific to this player
+    if (typeof setOptions == "object") { _V_.merge(this.options, setOptions); }
+    // Override preload & autoplay with video attributes (test x = y || z on IE)
+    if (this.getPreloadAttribute() !== undefined) { this.options.preload = this.getPreloadAttribute(); }
+    if (this.getAutoplayAttribute() !== undefined) { this.options.autoplay = this.getAutoplayAttribute(); }
+
+    // Loop through the player names list in options, "html5" etc.
+    // For each player name, initialize the player with that name under VideoJS.players
+    // If the player successfully initializes, we're done
+    // If not, try the next player in the list
+    this.each(this.options.playerFallbackOrder, function(playerType){
+      if (this[playerType+"Supported"]()) { // Check if player type is supported
+        this[playerType+"Init"](); // Initialize player type
+        return true; // Stop looping through players
+      }
+    });
+
+    // Start Global Listeners - API doesn't exist before now
+    this.activateElement(this, "player");
+    this.activateElement(this.box, "box");
+  },
+  /* Behaviors - Make elements act like specific controls or displays
+  ================================================================================ */
+  behaviors: {},
+  newBehavior: function(name, activate, functions){
+    this.behaviors[name] = activate;
+    this.extend(functions);
+  },
+  // Change to addBehavior or attachBehavior?
+  activateElement: function(element, behavior){
+    // Allow passing and ID string
+    if (typeof element == "string") { element = document.getElementById(element); }
+    this.behaviors[behavior].call(this, element);
+  },
+  /* Errors/Warnings
+  ================================================================================ */
+  errors: [], // Array to track errors
+  warnings: [],
+  warning: function(warning){
+    this.warnings.push(warning);
+    this.log(warning);
+  },
+  /* History of errors/events (not quite there yet)
+  ================================================================================ */
+  history: [],
+  log: function(event){
+    if (!event) { return; }
+    if (typeof event == "string") { event = { type: event }; }
+    if (event.type) { this.history.push(event.type); }
+    if (this.history.length >= 50) { this.history.shift(); }
+    try { console.log(event.type); } catch(e) { try { opera.postError(event.type); } catch(e){} }
+  },
+  /* Local Storage
+  ================================================================================ */
+  setLocalStorage: function(key, value){
+    if (!localStorage) { return; }
+    try {
+      localStorage[key] = value;
+    } catch(e) {
+      if (e.code == 22 || e.code == 1014) { // Webkit == 22 / Firefox == 1014
+        this.warning(VideoJS.warnings.localStorageFull);
+      }
+    }
+  },
+  /* Helpers
+  ================================================================================ */
+  getPreloadAttribute: function(){
+    if (typeof this.video.hasAttribute == "function" && this.video.hasAttribute("preload")) {
+      var preload = this.video.getAttribute("preload");
+      // Only included the attribute, thinking it was boolean
+      if (preload === "" || preload === "true") { return "auto"; }
+      if (preload === "false") { return "none"; }
+      return preload;
+    }
+  },
+  getAutoplayAttribute: function(){
+    if (typeof this.video.hasAttribute == "function" && this.video.hasAttribute("autoplay")) {
+      var autoplay = this.video.getAttribute("autoplay");
+      if (autoplay === "false") { return false; }
+      return true;
+    }
+  },
+  // Each that maintains player as context
+  // Break if true is returned
+  each: function(arr, fn){
+    if (!arr || arr.length === 0) { return; }
+    for (var i=0,j=arr.length; i<j; i++) {
+      if (fn.call(this, arr[i], i)) { break; }
+    }
+  },
+  // Add functions to the player
+  extend: function(obj){
+    for (var attrname in obj) {
+      if (obj.hasOwnProperty(attrname)) { this[attrname]=obj[attrname]; }
+    }
+  }
+});
+VideoJS.fn = VideoJS.prototype;
+VideoJS.options = {}; // Globally set options
+
+/* Download Links Fallback (Player Type)
+================================================================================ */
+VideoJS.fn.extend({
+  linksSupported: function(){ return true; },
+  linksInit: function(){
+    this.showLinksFallback();
+    this.element = this.video;
+  },
+  // Get the download links block element
+  getLinksFallback: function(){ return this.box.getElementsByTagName("P")[0]; },
+  // Hide no-video download paragraph
+  hideLinksFallback: function(){
+    if (this.linksFallback) { this.linksFallback.style.display = "none"; }
+  },
+  // Hide no-video download paragraph
+  showLinksFallback: function(){
+    if (this.linksFallback) { this.linksFallback.style.display = "block"; }
+  }
+});
+
+////////////////////////////////////////////////////////////////////////////////
+// Class Methods
+// Functions that don't apply to individual videos.
+////////////////////////////////////////////////////////////////////////////////
+
+// Combine Objects - Use "safe" to protect from overwriting existing items
+VideoJS.merge = function(obj1, obj2, safe){
+  for (var attrname in obj2){
+    if (obj2.hasOwnProperty(attrname) && (!safe || !obj1.hasOwnProperty(attrname))) { obj1[attrname]=obj2[attrname]; }
+  }
+  return obj1;
+};
+VideoJS.extend = function(obj){ this.merge(this, obj, true); };
+
+VideoJS.extend({
+  // Add VideoJS to all video tags with the video-js class when the DOM is ready
+  setupAll: function(options, fn){
+    // Options is stored globally, and added ot any new player on init
+    VideoJS.options = options;
+    VideoJS.DOMReady(VideoJS.setup);
+    if (fn) { VideoJS.DOMReady(fn); }
+  },
+  
+  // Backward compatability. Changed to just SetupAll
+  setupAllWhenReady: function(options){ VideoJS.setupAll(options); },
+
+  // Run the supplied function when the DOM is ready
+  DOMReady: function(fn){
+    VideoJS.addToDOMReady(fn);
+  },
+
+  // Set up a specific video or array of video elements
+  // "video" can be:
+  //    false, undefined, or "All": set up all videos with the video-js class
+  //    A video tag ID or video tag element: set up one video and return one player
+  //    An array of video tag elements/IDs: set up each and return an array of players
+  setup: function(videos, options){
+    var returnSingular = false,
+    playerList = [],
+    videoElement;
+
+    // If videos is undefined or "All", set up all videos with the video-js class
+    if (!videos || videos == "All") {
+      videos = VideoJS.getVideoJSTags();
+    // If videos is not an array, add to an array
+    } else if (typeof videos != 'object' || videos.nodeType == 1) {
+      videos = [videos];
+      returnSingular = true;
+    }
+
+    // Loop through videos and create players for them
+    for (var i=0; i<videos.length; i++) {
+      if (typeof videos[i] == 'string') {
+        videoElement = document.getElementById(videos[i]);
+      } else { // assume DOM object
+        videoElement = videos[i];
+      }
+      playerList.push(new VideoJS(videoElement, options));
+    }
+
+    // Return one or all depending on what was passed in
+    return (returnSingular) ? playerList[0] : playerList;
+  },
+
+  // Get the player object for the supplied video tag ID
+  player: function(id){ return document.getElementById(id).player; },
+
+  // Find video tags with the video-js class
+  getVideoJSTags: function() {
+    var videoTags = document.getElementsByTagName("video"),
+    videoJSTags = [], videoTag;
+
+    for (var i=0,j=videoTags.length; i<j; i++) {
+      videoTag = videoTags[i];
+      if (videoTag.className.indexOf("video-js") != -1) {
+        videoJSTags.push(videoTag);
+      }
+    }
+    return videoJSTags;
+  },
+
+  // Check if the browser supports video.
+  browserSupportsVideo: function() {
+    if (typeof VideoJS.videoSupport != "undefined") { return VideoJS.videoSupport; }
+    VideoJS.videoSupport = !!document.createElement('video').canPlayType;
+    return VideoJS.videoSupport;
+  },
+
+  getFlashVersion: function(){
+    // Cache Version
+    if (typeof VideoJS.flashVersion != "undefined") { return VideoJS.flashVersion; }
+    var version = 0, desc;
+    if (typeof navigator.plugins != "undefined" && typeof navigator.plugins["Shockwave Flash"] == "object") {
+      desc = navigator.plugins["Shockwave Flash"].description;
+      if (desc && !(typeof navigator.mimeTypes != "undefined" && navigator.mimeTypes["application/x-shockwave-flash"] && !navigator.mimeTypes["application/x-shockwave-flash"].enabledPlugin)) {
+        version = parseInt(desc.match(/^.*\s+([^\s]+)\.[^\s]+\s+[^\s]+$/)[1], 10);
+      }
+    } else if (typeof window.ActiveXObject != "undefined") {
+      try {
+        var testObject = new ActiveXObject("ShockwaveFlash.ShockwaveFlash");
+        if (testObject) {
+          version = parseInt(testObject.GetVariable("$version").match(/^[^\s]+\s(\d+)/)[1], 10);
+        }
+      }
+      catch(e) {}
+    }
+    VideoJS.flashVersion = version;
+    return VideoJS.flashVersion;
+  },
+
+  // Browser & Device Checks
+  isIE: function(){ return !+"\v1"; },
+  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]; }
+  },
+  //isAndroidBrowser
+
+  warnings: {
+    // Safari errors if you call functions on a video that hasn't loaded yet
+    videoNotReady: "Video is not ready yet (try playing the video first).",
+    // Getting a QUOTA_EXCEEDED_ERR when setting local storage occasionally
+    localStorageFull: "Local Storage is Full"
+  }
+});
+
+// Shim to make Video tag valid in IE
+if(VideoJS.isIE()) { document.createElement("video"); }
+
+// Expose to global
+window.VideoJS = window._V_ = VideoJS;
+

dev/src/video-js.jquery.js

@@ -0,0 +1,24 @@
+/* jQuery Plugin
+================================================================================ */
+if (window.jQuery) {
+  (function($) {
+
+    $.fn.setupPlayer = function(options) {
+      return VideoJS.setup(this[0], options);
+    };
+
+    // Deprecated
+    $.fn.VideoJS = function(options) {
+      this.each(function() {
+        VideoJS.setup(this, options);
+      });
+      return this;
+    };
+
+    $.fn.player = function() {
+      return this[0].player;
+    };
+
+  })(jQuery);
+}
+

dev/test.html

@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <title>HTML5 Video Player</title>
+
+  <!-- Include the VideoJS Library -->
+  <script src="src/main.js" type="text/javascript" charset="utf-8"></script>
+  <script src="src/api.js" type="text/javascript" charset="utf-8"></script>
+  <script src="src/html5.js" type="text/javascript" charset="utf-8"></script>
+  <script src="src/flash.js" type="text/javascript" charset="utf-8"></script>
+  <script src="src/behaviors.js" type="text/javascript" charset="utf-8"></script>
+  <script src="src/lib.js" type="text/javascript" charset="utf-8"></script>
+  <script src="src/video-js.jquery.js" type="text/javascript" charset="utf-8"></script>
+  <!-- <script src="flowplayer/video-js.flowplayer.js" type="text/javascript" charset="utf-8"></script> -->
+
+  <script type="text/javascript">
+    VideoJS.setupAllWhenReady({ playerFallbackOrder: ["flash", "links"] });
+    VideoJS.DOMReady(function(){
+      // myPlayer = VideoJS.setup("example_video_1", { 
+      //         // controlsHiding: true, 
+      //         // controlsBelow: false, 
+      //         // showControlsAtStart: true
+      //       });
+      //       myPlayer.activateElement(document.getElementById("scrub"), "playProgressBar");
+      //       var vid = document.getElementById("example_video_1"),
+      //           attrTable = document.getElementById("attributes"),
+      //           attrNames = ["error", "networkState", "readyState", "preload", "buffered",
+      //             "seeking", "currentTime", "initialTime", "duration", "startOffsetTime",
+      //             "paused", "defaultPlaybackRate", "playbackRate", "played", "seekable",
+      //             "ended", "autoplay", "loop", "controls", "volume", "muted", "tracks"
+      //           ],
+      //           attrs = {};
+      // 
+      //       for(var i=0,j=attrNames.length; i<j; i++) {
+      //         var row = _V_.createElement("tr");
+      //         var th = _V_.createElement("th"); 
+      //         th.innerHTML = attrNames[i];
+      //         attrs[attrNames[i]] = _V_.createElement("td", { id: attrNames[i] });
+      //         row.appendChild(th); row.appendChild(attrs[attrNames[i]]);
+      //         attrTable.appendChild(row);
+      //       }
+      //       
+      //       setInterval(function(){
+      //         for(var i=0,j=attrNames.length; i<j; i++) {
+      //           attrs[attrNames[i]].innerHTML = vid[attrNames[i]];
+      //         }
+      //       }, 100);
+      //       
+      //       var events = ["loadstart","progress","suspend","abort","error","emptied","stalled","play","pause",
+      //         "loadedmetadata", "loadeddata", "waiting", "playing", "canplay", "canplaythrough", "seeking", "seeked",
+      //         // "timeupdate",
+      //         "ended", "ratechange", "durationchange","volumechange"
+      //       ],
+      //       eventsList = document.getElementById("events");
+      //       
+      //       for(var i=0,j=events.length; i<j; i++) {
+      //         _V_.addListener(vid, events[i], function(){
+      //           eventsList.innerHTML = this + "\n" + eventsList.innerHTML
+      //         }.context(events[i]));
+      //       }
+      
+    });
+
+  </script>
+
+  <style type="text/css" media="screen">
+    #attributes { width: 300px; float: left; }
+    #events { width: 300px; height: 500px; float: left; }
+  </style>
+
+  <!-- Include the VideoJS Stylesheet -->
+  <link rel="stylesheet" href="../video-js.css" type="text/css" media="screen" title="Video JS">
+  <link rel="stylesheet" href="../skins/tube.css" type="text/css" media="screen" title="Video JS">
+  <link rel="stylesheet" href="../skins/hu.css" type="text/css" media="screen" title="Video JS">
+  <link rel="stylesheet" href="../skins/vim.css" type="text/css" media="screen" title="Video JS">
+</head>
+<body>
+
+  <!-- Begin VideoJS -->
+  <div id="scrub" style="background: #000; height: 10px;"></div>
+  
+  <div class="video-js-box">
+    <!-- Using the Video for Everybody Embed Code http://camendesign.com/code/video_for_everybody -->
+    <video id="example_video_1" class="video-js" width="640" height="264" controls="controls" preload="auto" poster="http://video-js.zencoder.com/oceans-clip.png">
+      <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
+      <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm; codecs="vp8, vorbis"' />
+      <source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg; codecs="theora, vorbis"' />
+      <track kind="subtitles" src="../demo-subtitles.srt" srclang="en-US" label="English"></track>
+      <!-- Flash Fallback. Use any flash video player here. Make sure to keep the vjs-flash-fallback class. -->
+      <object id="flash_fallback_1" 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="wmode" value="opaque" />
+        <param name="allowfullscreen" value="true" />
+        <param name="flashvars" value='config={"playlist":["http://video-js.zencoder.com/oceans-clip.png", {"url": "http://video-js.zencoder.com/oceans-clip.mp4","autoPlay":false,"autoBuffering":true}]}' />
+        <!-- Image Fallback. Typically the same as the poster image. -->
+        <img src="http://video-js.zencoder.com/oceans-clip.png" width="640" height="264" alt="Poster Image"
+          title="No video playback capabilities." />
+      </object>
+    </video>
+    <!-- Download links provided for devices that can't play video in the browser. -->
+    <p class="vjs-no-video"><strong>Download Video:</strong>
+      <a href="http://video-js.zencoder.com/oceans-clip.mp4">MP4</a>,
+      <a href="http://video-js.zencoder.com/oceans-clip.webm">WebM</a>,
+      <a href="http://video-js.zencoder.com/oceans-clip.ogv">Ogg</a><br>
+      <!-- Support VideoJS by keeping this link. -->
+      <a href="http://videojs.com">HTML5 Video Player</a> by VideoJS
+    </p>
+  </div>
+  <!-- End VideoJS -->
+
+  <div class="video-js-box">
+    <!-- Using the Video for Everybody Embed Code http://camendesign.com/code/video_for_everybody -->
+    <!-- <video id="example_video_2" class="video-jsnot" width="640" height="264" controls="controls" preload="none" poster="http://video-js.zencoder.com/oceans-clip.png"> -->
+      <source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
+      <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm; codecs="vp8, vorbis"' />
+      <source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg; codecs="theora, vorbis"' />
+      <!-- Flash Fallback. Use any flash video player here. Make sure to keep the vjs-flash-fallback class. -->
+      <object id="flash_fallback_1" 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="wmode" value="opaque" />
+        <param name="allowfullscreen" value="true" />
+        <param name="flashvars" value='config={"playlist":["http://video-js.zencoder.com/oceans-clip.png", {"url": "http://video-js.zencoder.com/oceans-clip.mp4","autoPlay":false,"autoBuffering":true}]}' />
+        <!-- Image Fallback. Typically the same as the poster image. -->
+        <img src="http://video-js.zencoder.com/oceans-clip.png" width="640" height="264" alt="Poster Image"
+          title="No video playback capabilities." />
+      </object>
+    <!-- </video> -->
+    <!-- Download links provided for devices that can't play video in the browser. -->
+    <p class="vjs-no-video"><strong>Download Video:</strong>
+      <a href="http://video-js.zencoder.com/oceans-clip.mp4">MP4</a>,
+      <a href="http://video-js.zencoder.com/oceans-clip.webm">WebM</a>,
+      <a href="http://video-js.zencoder.com/oceans-clip.ogv">Ogg</a><br>
+      <!-- Support VideoJS by keeping this link. -->
+      <a href="http://videojs.com">HTML5 Video Player</a> by VideoJS
+    </p>
+  </div>
+  <!-- End VideoJS -->
+
+  <a href="#" onclick="document.getElementById('example_video_1').currentTime = 10; return false;">Click</a>
+
+  <table id="attributes">
+  </table>
+  
+  <textarea id="events"></textarea>
+
+</body>
+</html>

docs/API.markdown

@@ -0,0 +1,214 @@
+API
+===
+The VideoJS API allows you to interact with the video through Javascript, whether the browser is playing the video through HTML5 video or through the Flash fallback (with supported Flash players).
+
+To use the API functions, you need access to the video player object. Luckily this is easy to get. You just need to make sure your video tag has an ID. The default 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.
+
+NOTE: Before you can access the player, the DOM must be ready and the VideoJS setup methods must have run. Follow the examples and you'll be fine.
+
+Using the VideoJS setup with built-in DOM ready function.
+
+    VideoJS.setupAll(options, function(){
+
+      var myPlayer = VideoJS.player("example_video_id");
+
+    });
+
+Using a javascript library's DOM ready function (jQuery example)
+
+    $(function(){ // DOM Ready
+
+      var myPlayer = VideoJS.setup("example_video_1", options);
+
+    });
+
+After the player has been setup, you can also always access the player through the video element's "player" attribute.
+
+    // Javascript Example
+    myPlayer = document.getElementById("example_video_1").player;
+  
+    // jQuery Example
+    myPlayer = $("#example_video_1")[0].player
+  
+    // VideoJS jQuery Plugin Example
+    myPlayer = $("#example_video_1").player();
+
+
+Now that you have access to the player through the myPlayer variable, you can control the video or react to video events using the following methods.
+
+
+### play()
+  Start video playback.
+  Returns the player object.
+  Example:
+
+    myPlayer.play();
+
+### onPlay(callback) // Type: Function
+  Trigger the supplied callback function every time the video starts playing.
+  Returns the player object.
+  Example:
+
+    myPlayer.onPlay(function(){
+      alert("OMG Video is playing!");
+    });
+
+### pause()
+  Pause the video playback.
+  Returns: the player object
+  Example:
+
+    myPlayer.pause();
+
+### onPause(callback) // Type: Function
+  Trigger the supplied callback function every time the video is paused.
+  Returns the player object.
+  Example:
+
+    myPlayer.onPause(function(){
+      alert("OMG Video is paused now!");
+    });
+
+### currentTime()
+  Returns the current time of the video in seconds.
+  Example:
+
+    var whereYouAt = myPlayer.currentTime();
+
+### currentTime(seconds) // Type: Integer or Float
+  Seek to the supplied time (seconds).
+  Returns the player object.
+  Example:
+
+    myPlayer.currentTime(120); // 2 minutes into the video
+
+### onTimeUpdate(callback) // Type: Function
+  Trigger the supplied callback function every time the currentTime changes. This is triggered about 10 times per second.
+  Returns the player object.
+  Example:
+
+    myPlayer.onTimeUpdate(function(){
+      alert("The video is now " + myPlayer.currentTime() + " seconds in.");
+    });
+
+### onEnded(callback) // Type: Function
+  Trigger the supplied callback function when the video finishes playing.
+  Returns the player object.
+  Example:
+
+    myPlayer.onEnded(function(){
+      alert("Fin!");
+    });
+
+### duration()
+  Returns the length in time of the video in seconds. Note: The video must have started loading before the duration can be known.
+  Example:
+
+    var howLongIsThis = myPlayer.duration();
+
+### onDurationUpdate(callback) // Type: Function
+  Trigger the supplied callback function when the video's duration is updated.
+  Returns the player object.
+  Example:
+
+    myPlayer.onDurationUpdate(function(){
+      alert("The video's duration is now " + myPlayer.duration());
+    });
+
+### buffered()
+  Returns the amount of video that has loaded (downloaded) into the buffer.
+  Example:
+
+    // Needs to be expanded
+    var howMuchIsLoaded = myPlayer.duration();
+
+### onBufferedUpdate(callback) // Type: Function
+  Trigger the supplied callback function when the video's buffered amount is updated.
+  Returns the player object.
+  Example:
+
+    // Needs to be updated
+    myPlayer.onBufferedUpdate(function(){
+      alert("The video's duration is now " + myPlayer.duration());
+    });
+
+### 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.
+  Example:
+
+    var howLoudIsIt = myPlayer.volume();
+
+### volume(percentAsDecimal)
+  Set the volume to the supplied percent (as a decimal between 0 and 1).
+  Example:
+
+    myPlayer.volume(0.5); // Set volume to half
+
+### onVolumeChange(callback)
+  Trigger the supplied callback function when the video's volume changes.
+  Returns the player object.
+  Example:
+
+    myPlayer.onVolumeChange(function(){
+      alert("The video's volume is now " + myPlayer.volume());
+    });
+
+### width()
+  Returns the current width of the video in pixels.
+  Example:
+  
+    var howWideIsIt = myPlayer.width();
+
+### width(pixels)
+  Change the width of the video to the supplied width in pixels.
+  Returns the player object
+  Example:
+
+    myPlayer.width(640);
+
+### height()
+  Returns the current height of the video in pixels.
+  Example:
+
+    var howTallIsIt = myPlayer.height();
+
+### height(pixels)
+  Change the height of the video to the supplied height in pixels.
+  Returns the player object
+
+    myPlayer.height(480);
+
+### 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.
+  Returns the player object.
+  
+    myPlayer.size(640,480);
+
+### onResize(callback)
+  Trigger the supplied callback function when the video's size (width, height, or both) changes.
+  Returns the player object.
+
+    myPlayer.onResize(function(){
+      alert("The video is now " + myPlayer.width() + " by " + myPlayer.height());
+    });
+
+### enterFullScreen()
+  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 fills the browser window. In browsers that support native full screen, typically the browser's default controls will be shown, and not the VideoJS custom skin. In full window mode, the VideoJS controls and skin will always be used.
+  Returns the player object.
+
+    myPlayer.enterFullScreen();
+
+### exitFullScreen()
+  Return the video to its normal size after having been in full screen mode.
+  Returns the player object.
+
+    myPlayer.exitFullScreen();
+
+### onError(callback)
+  Trigger the supplied callback function when the video when there is an error with the video.
+  Returns the player object.
+
+    // Need to make work
+    myPlayer.onError(function(errorText, errorID){
+      alert("There's something wrong. " + errorText);
+    });

docs/behaviors.markdown

@@ -0,0 +1,53 @@
+Behaviors
+=========
+Behaviors allow you to make an element on your page act as a video control or a display of video information. The easiest example of this is creating a play button. The following code will make a click on your element play the video.
+
+    myPlayer.activateElement(myElement, "playButton");
+
+mouseOverVideoReporter
+  The mouseOverVideoReporter behavior is mostly used internally to trigger showing the controls when a user's mouse is over the video. It's used on elements that are shown in front of the video, that might block a mouseover on the video itself from registering.
+
+controlBar
+  The controlBar behavior is what's added to the main control bar to make it show/hide depending on the user's mouse and the set preferences. It can also be added to other elements if the same effect is desired.
+
+playButton
+  The playButton behavior can be added to an element to make it play the video when clicked. (See also playToggle)
+
+pauseButton
+  The pauseButton behavior can be added to an element to make it pause the video when clicked.
+
+playToggle
+  The playToggle behavior can be added to an element to make it toggle between play and pause. When the video is playing it will pause the video, and vice versa. The play button in the default control bar works this way.
+  The icon in the play button changes to pause (two vertical bars) or play (triangle) depending on the state of the video. This is done through CSS classes. When the video is playing, a class of "vjs-playing" will be added to the playToggle element. When the video is paused, a class of "vjs-paused" will be added to the element. If you are using an image for the icon, set it as a background image of the element (or a sub element) and change the background image accordingly.
+
+    #my_play_toggle.vjs-playing { background-image: url("my-pause-icon.png") }
+    #my_play_toggle.vjs-paused { background-image: url("my-play-icon.png") }
+
+playProgressBar
+  With the playProgressBar behavior, you can make an element grow like a progress bar as the video plays. The width of the element is set as a percent, and uses the video's current time divided by the video's total duration. For this reason, you may also need a container element to get the desired effect. In this example the width of the playProgressBar will be based on the width of myPlayProgressHolder.
+    <div id="myPlayProgressHolder">
+      <div id="myPlayProgressBar"></div>
+    </div>
+
+loadProgressBar
+  The loadProgressBar behavior works similarly to the playProgressBar behavior, except that it's based on the amount of video data that's been downloaded to the users machine.
+
+currentTimeDisplay
+  The currentTimeDisplay behavior will make an element display the video's current playback time in the format of 00:00. It does so by changing the innerHTML of the element to the time.
+
+durationDisplay
+  The durationDisplay behavior will make an element display the video's duration in the format of 00:00. It does so by changing the innerHTML of the element to the duration.
+
+currentTimeScrubber
+  The currentTimeScrubber behavior allows you to make an element that controls the current time of the video by clicking and dragging on the element. The current time will be set based on where the user clicks or drags to, in relation to the width of the element.
+
+volumeDisplay
+...
+
+volumeScrubber
+  The volumeScrubber behavior allows you to make an element that controls the volume of the video by clicking and dragging on the element. The volume will be set based on where the user clicks or drags to, in relation to the width of the element.
+
+fullscreenToggle
+...
+
+(Note to self: Have a video that is fixed position beside the behavior docs, that all examples are tied to)

docs/glossary.markdown

@@ -0,0 +1,9 @@
+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.

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,38 +1,43 @@
-.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 */
+/*
+VideoJS HuCSS Skin (http://videojs.com)
+Version 2.0.0
+*/
+
+.hu-css .vjs-controls {
+  height: 47px; opacity: 0.95; color: #fff;
   background: #3A3835;
 }
+.hu-css.video-js-box.vjs-controls-below .vjs-controls { background: #3A3835; }
 
-.hu-css .vjs-controls > li {
+.hu-css .vjs-controls > div {
+  top: 0;
   background: none;
-  border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0;
-  box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none;
+  -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;
+  -webkit-box-shadow: none; -moz-box-shadow: none; 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 {
+.hu-css .vjs-controls > div.vjs-play-control,
+.hu-css .vjs-controls > div.vjs-volume-control,
+.hu-css .vjs-controls > div.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 {
+.hu-css .vjs-controls > div.vjs-progress-control, .hu-css .vjs-controls > div.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; }
+.hu-css .vjs-controls > div.vjs-play-control       { width: 33px; left: 0px; }
+.hu-css .vjs-controls > div.vjs-progress-control   { width: left: 84px; right: 0; }
+.hu-css .vjs-controls > div.vjs-time-control       { width: 84px; left: 0px; }
+.hu-css .vjs-controls > div.vjs-volume-control     { width: 43px; right: 44px; }
+.hu-css .vjs-controls > div.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-paused .vjs-play-control span { margin: 9px 0 0 12px; }
+.hu-css.vjs-playing .vjs-play-control span { margin: 9px 0 0 12px; }
 .hu-css .vjs-play-control:hover { background-color: #000; }
 
 /* Progress
@@ -41,9 +46,9 @@
   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;
+  -webkit-border-radius: 0; -moz-border-radius: 0; 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-progress-holder div { height: 13px; margin-top: 3px; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; }
 .hu-css .vjs-play-progress {
   /* Default */ background: #777;
   /* Webkit  */ background: -webkit-gradient(linear, left top, left bottom, from(#999), to(#777));
@@ -59,41 +64,53 @@
 /* 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 */
+.hu-css .vjs-volume-control div { margin: 0 5px 0 5px; padding: 9px 0 0 0; }
+.hu-css .vjs-volume-control div span { /* 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 */ }
+.hu-css .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). */
-.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; }
+.hu-css .vjs-volume-control div span:nth-child(1) { border-bottom-width: 2px; height: 10px; }
+.hu-css .vjs-volume-control div span:nth-child(2) { border-bottom-width: 4px; height: 8px; }
+.hu-css .vjs-volume-control div span:nth-child(3) { border-bottom-width: 6px; height: 6px; }
+.hu-css .vjs-volume-control div span:nth-child(4) { border-bottom-width: 8px; height: 4px; }
+.hu-css .vjs-volume-control div span: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); }
+.hu-css .vjs-fullscreen-control div { margin: 8px 0 0 0px; padding-left: 13px; height: 13px; border-left: 1px solid #555; }
+.hu-css .vjs-fullscreen-control div span: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 div span:nth-child(2) { border-top: 4px solid #fff; border-left: 4px solid rgba(0,0,0,0); }
+.hu-css .vjs-fullscreen-control div span: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 div span: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); }
-
-
-
-
-
-
-
-
+.hu-css.vjs-fullscreen .vjs-fullscreen-control div span: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 div span: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 div span: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 div span:nth-child(4) { border: none; border-top: 4px solid #fff; border-right: 4px solid rgba(0,0,0,0); }
 
+/* Big Play Button (at start)
+---------------------------------------------------------*/
+.hu-css div.vjs-big-play-button {
+  width: 76px; height: 70px; margin: -35px 0 0 -38px;
+  border: 1px solid #ccc; opacity: 0.8;
+  -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px;
 
+  background: rgba(50,50,50,0.8);
 
+  /* CSS Shadows */
+  -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;
+}
+.hu-css 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;
+}
+.hu-css div.vjs-big-play-button span {
+  margin: 16px 0 0 21px;
+  /* 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);
+}

skins/tube.css

@@ -1,40 +1,43 @@
+/*
+VideoJS TubeCSS Skin (http://videojs.com)
+Version 2.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 */
-
+  height: 24px;
+  bottom: 0;
   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;
+.tube-css .vjs-controls > div {
+  height: 23px; margin: 0; background: none; top: 0;
   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;
+  -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;
+  -webkit-box-shadow: none; -moz-box-shadow: none; 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; }
+.tube-css .vjs-controls > div.vjs-play-control       { width: 25px; left: 0; }
+.tube-css .vjs-controls > div.vjs-progress-control   { left: 102px; right: 83px; }
+.tube-css .vjs-controls > div.vjs-time-control       { width: 75px; left: 27px; }
+.tube-css .vjs-controls > div.vjs-volume-control     { width: 50px; right: 30px; }
+.tube-css .vjs-controls > div.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; }
+.tube-css .vjs-controls > div.vjs-progress-control { border-left: none; }
+.tube-css .vjs-controls > div.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; }
+.tube-css .vjs-play-control { margin-left: 0; border-left-color: #b1b1b1; }
+.tube-css.vjs-paused  .vjs-play-control 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-playing .vjs-play-control span { height: 14px; margin: 5px auto 0; border-left: 4px solid #333; border-right: 4px solid #333; }
+.tube-css.vjs-paused  .vjs-play-control:hover span { border-left-color: #CF1A1A; }
+.tube-css.vjs-playing .vjs-play-control:hover span { border-left-color: #CF1A1A; border-right-color: #CF1A1A; }
 
 /* Time Display
 -------------------------------------------------------------------------------- */
@@ -49,34 +52,60 @@
   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;
+  -webkit-border-radius: 0; -moz-border-radius: 0; 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-load-progress { background: #C89191; -webkit-border-radius: 0; -moz-border-radius: 0; 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; }
+.tube-css .vjs-volume-control div { padding: 3px 0 0 0; }
+.tube-css .vjs-volume-control div span { border-bottom-color: #ccc; }
 /* Volume icon color */
-.tube-css .vjs-volume-control ul li.vjs-volume-level-on { border-color: #333; }
+.tube-css .vjs-volume-control div span.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; }
+.tube-css .vjs-volume-control:hover div span.vjs-volume-level-on { border-color: #CF1A1A; }
 
 /* Fullscreen
 -------------------------------------------------------------------------------- */
-.tube-css .vjs-fullscreen-control ul { margin: 4px 0 0 8px; }
+.tube-css .vjs-fullscreen-control div { 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) {
+.tube-css .vjs-fullscreen-control div span:nth-child(3), .tube-css .vjs-fullscreen-control div span:nth-child(4), .tube-css.vjs-fullscreen .vjs-fullscreen-control div span:nth-child(1), .tube-css.vjs-fullscreen .vjs-fullscreen-control div span: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) {
+.tube-css .vjs-fullscreen-control div span:nth-child(1), .tube-css .vjs-fullscreen-control div span:nth-child(2), .tube-css.vjs-fullscreen .vjs-fullscreen-control div span:nth-child(3), .tube-css.vjs-fullscreen .vjs-fullscreen-control div span: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) {
+.tube-css .vjs-fullscreen-control:hover div span:nth-child(3), .tube-css .vjs-fullscreen-control:hover div span:nth-child(4), .tube-css.vjs-fullscreen .vjs-fullscreen-control:hover div span:nth-child(1), .tube-css.vjs-fullscreen .vjs-fullscreen-control:hover div span: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) {
+.tube-css .vjs-fullscreen-control:hover div span:nth-child(1), .tube-css .vjs-fullscreen-control:hover div span:nth-child(2), .tube-css.vjs-fullscreen .vjs-fullscreen-control:hover div span:nth-child(3), .tube-css.vjs-fullscreen .vjs-fullscreen-control:hover div span:nth-child(4) {
   border-top-color: #CF1A1A;
-}
+}
+
+/* Big Play Button (at start)
+---------------------------------------------------------*/
+.tube-css div.vjs-big-play-button { 
+  width: 84px; height: 58px; margin: -29px 0 0 -42px;
+  border: 2px solid #ccc; opacity: 0.9;
+  -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;
+
+  /* CSS Background Gradients */
+  /* Default */ background-color: #333;
+  /* Webkit  */ background: #000 -webkit-gradient(linear, left top, left bottom, from(#000), to(#333)) left 29px;
+  /* Firefox */ background: #000 -moz-linear-gradient(top,  #000,  #333) left 29px;
+
+  /* CSS Shadows */
+  -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;
+}
+.tube-css div.vjs-big-play-button:hover {
+  opacity: 1;
+}
+.tube-css div.vjs-big-play-button span {
+  margin: 11px 0 0 26px;
+  /* Drawing the play triangle with borders - http://www.infimum.dk/HTML/slantinfo.html */
+  border-left: 36px solid #fff; /* Width & Color of play icon */
+  /* Height of play icon is total top & bottom border widths. Color is transparent. */
+  border-top: 18px solid rgba(0,0,0,0); border-bottom: 18px solid rgba(0,0,0,0);
+}

skins/vim.css

@@ -1,33 +1,36 @@
-.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 */
+/*
+VideoJS VimCSS Skin (http://videojs.com)
+Version 2.0.0
+*/
+
+.vim-css .vjs-controls {
+  height: 60px; opacity: 0.9; color: #fff;
 }
-.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;
+.vim-css .vjs-controls > div {
+  height: 32px; top: 18px; padding: 0; text-align: center; background: rgba(23, 35, 34, 0.746094);
+  -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;
+  -webkit-box-shadow: none; -moz-box-shadow: none; 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; }
+.vim-css .vjs-controls > div.vjs-play-control       { width: 65px; left: 10px; }
+.vim-css .vjs-controls > div.vjs-progress-control   { left: 85px; right: 160px; }
+.vim-css .vjs-controls > div.vjs-time-control       { width: 75px; right: 85px; }
+.vim-css .vjs-controls > div.vjs-volume-control     { width: 50px; right: 35px; }
+.vim-css .vjs-controls > div.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-controls .vjs-play-control { top: 10px; margin: 0; height: 40px;  -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
 .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; }
+.vim-css.vjs-paused .vjs-play-control 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-playing .vjs-play-control 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; }
+.vim-css .vjs-controls .vjs-progress-control { -webkit-border-radius: 5px 0 0 5px; -moz-border-radius: 5px 0 0 5px; 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; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; }
+.vim-css .vjs-progress-control .vjs-play-progress { height: 8px; background: #00ADEF; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; }
+.vim-css .vjs-progress-control .vjs-load-progress { height: 8px; background: #898F8F; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; }
 
 /* Time Display
 -------------------------------------------------------------------------------- */
@@ -36,27 +39,51 @@
 
 /* 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; 
+.vim-css .vjs-volume-control div { padding: 7px 0 0 5px; width: 30px; }
+.vim-css .vjs-volume-control div span {
+  float: left; margin: 0 2px 0 0; padding: 0; 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; }
+.vim-css .vjs-volume-control div span.vjs-volume-level-on { border-color: #00ADEF; }
+.vim-css .vjs-volume-control div span: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; }
+.vim-css .vjs-fullscreen-control div { margin: 10px 0 0 0; }
+.vim-css .vjs-controls .vjs-fullscreen-control { -webkit-border-radius: 0 5px 5px 0; -moz-border-radius: 0 5px 5px 0; 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); }
+.vim-css .vjs-fullscreen-control div span: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 div span:nth-child(2) { border: none; border-top: 4px solid #fff; border-left: 4px solid rgba(0,0,0,0); }
+.vim-css .vjs-fullscreen-control div span: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 div span: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 div span: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 div span: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 div span: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 div span: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; }
+.vim-css .vjs-fullscreen-control:hover div span:nth-child(3), .vim-css .vjs-fullscreen-control:hover div span:nth-child(4), .vim-css.vjs-fullscreen .vjs-fullscreen-control:hover div span:nth-child(1), .vim-css.vjs-fullscreen .vjs-fullscreen-control:hover div span:nth-child(2) { border-bottom-color: #00ADEF; }
+.vim-css .vjs-fullscreen-control:hover div span:nth-child(1), .vim-css .vjs-fullscreen-control:hover div span:nth-child(2), .vim-css.vjs-fullscreen .vjs-fullscreen-control:hover div span:nth-child(3), .vim-css.vjs-fullscreen .vjs-fullscreen-control:hover div span:nth-child(4) { border-top-color: #00ADEF; }
+
+/* Big Play Button (at start)
+---------------------------------------------------------*/
+.vim-css div.vjs-big-play-button {
+  width: 130px; height: 80px; margin: -40px 0 0 -65px;
+  border: none; opacity: 0.9;
+  -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;
+
+  background: rgba(23, 35, 34, 0.746094);
+
+  /* CSS Shadows */
+  -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;
+}
+.vim-css div.vjs-big-play-button:hover {
+  background: #00ADEF;
+  opacity: 1;
+}
+.vim-css div.vjs-big-play-button span {
+  margin: 22px 0 0 48px;
+  /* Drawing the play triangle with borders - http://www.infimum.dk/HTML/slantinfo.html */
+  border-left: 36px solid #fff; /* Width & Color of play icon */
+  /* Height of play icon is total top & bottom border widths. Color is transparent. */
+  border-top: 18px solid rgba(0,0,0,0); border-bottom: 18px solid rgba(0,0,0,0);
+}

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; }

video-js.css

@@ -0,0 +1,259 @@
+/* 
+VideoJS Default Styles (http://videojs.com)
+Version 2.0.2
+
+REQUIRED STYLES (be careful overriding)
+================================================================================ */
+/* Box containing video, controls, and download links.
+   Will be set to the width of the video element through JS
+   If you want to add some kind of frame or special positioning, use another containing element, not video-js-box. */
+.video-js-box { text-align: left; position: relative; line-height: 0 !important; margin: 0; padding: 0 !important; border: none !important;  }
+
+/* Video Element */
+video.video-js { background-color: #000; position: relative; padding: 0; }
+
+.vjs-flash-fallback { display: block; }
+
+/* Poster Overlay Style */
+.video-js-box img.vjs-poster { display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; margin: 0; padding: 0; cursor: pointer; }
+/* Subtiles Style */
+.video-js-box .vjs-subtitles { color: #fff; font-size: 20px; text-align: center; position: absolute; bottom: 40px; left: 0; right: 0; }
+
+/* Fullscreen styles for main elements */
+.video-js-box.vjs-fullscreen { position: fixed; left: 0; top: 0; right: 0; bottom: 0; overflow: hidden; z-index: 1000; }
+.video-js-box.vjs-fullscreen video.video-js,
+.video-js-box.vjs-fullscreen .vjs-flash-fallback { position: relative; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; }
+.video-js-box.vjs-fullscreen img.vjs-poster { z-index: 1001; }
+.video-js-box.vjs-fullscreen .vjs-spinner { z-index: 1001; }
+.video-js-box.vjs-fullscreen .vjs-controls { z-index: 1003; }
+.video-js-box.vjs-fullscreen .vjs-big-play-button { z-index: 1004; }
+.video-js-box.vjs-fullscreen .vjs-subtitles { z-index: 1004; }
+
+/* Styles Loaded Check */
+.vjs-styles-check { height: 5px; position: absolute; }
+/* Controls Below Video */
+.video-js-box.vjs-controls-below .vjs-controls { position: relative; opacity: 1; background-color: #000; }
+.video-js-box.vjs-controls-below .vjs-subtitles { bottom: 75px; } /* Account for height of controls below video */
+
+/* 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. */
+
+/* Controls Layout 
+  Using absolute positioning to position controls */
+.video-js-box .vjs-controls {
+  position: absolute; margin: 0; opacity: 0.85; color: #fff;
+  display: none; /* 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-hide {
+  opacity: 0 !important;
+  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE8 */
+  filter: alpha(opacity=0); /* IE5-7 */
+}
+
+.vjs-show {
+  opacity: 1 !important;
+  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /* IE8 */
+  filter: alpha(opacity=100); /* IE5-7 */
+}
+
+.video-js-box .vjs-controls > div { /* Direct div children of control bar */
+  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 */
+.vjs-controls > div.vjs-play-control       { left: 5px;   width: 25px;  }
+.vjs-controls > div.vjs-progress-control   { left: 35px;  right: 165px; } /* Using left & right so it expands with the width of the video */
+.vjs-controls > div.vjs-time-control       { width: 75px; right: 90px;  } /* Time control and progress bar are combined to look like one */
+.vjs-controls > div.vjs-volume-control     { width: 50px; right: 35px;  }
+.vjs-controls > div.vjs-fullscreen-control { width: 25px; right: 5px;   }
+
+/* Removing curved corners on progress control and time control to join them. */
+.vjs-controls > 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-controls > 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-play-control { cursor: pointer !important; }
+/* Play Icon */
+.vjs-play-control span { display: block; font-size: 0; line-height: 0; }
+.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-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-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-progress-holder div { /* Progress Bars */
+  position: absolute; display: block; width: 0; height: 9px; margin: 0; padding: 0;
+  -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
+}
+.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-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-controls .vjs-time-control { font-size: 10px; line-height: 1; font-weight: normal; font-family: Helvetica, Arial, sans-serif; }
+.vjs-controls .vjs-time-control span { line-height: 25px; /* Centering vertically */ }
+
+/* Volume
+-------------------------------------------------------------------------------- */
+.vjs-volume-control { cursor: pointer !important; }
+.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-volume-control div span { /* Individual volume bars */
+  float: left; padding: 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-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-volume-control div span:nth-child(1) { border-bottom-width: 2px; height: 16px; }
+.vjs-volume-control div span:nth-child(2) { border-bottom-width: 4px; height: 14px; }
+.vjs-volume-control div span:nth-child(3) { border-bottom-width: 7px; height: 11px; }
+.vjs-volume-control div span:nth-child(4) { border-bottom-width: 10px; height: 8px; }
+.vjs-volume-control div span:nth-child(5) { border-bottom-width: 14px; height: 4px; }
+.vjs-volume-control div span:nth-child(6) { margin-right: 0; }
+
+/* Fullscreen
+-------------------------------------------------------------------------------- */
+.vjs-fullscreen-control { cursor: pointer !important; }
+.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-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-fullscreen-control div span:nth-child(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-fullscreen-control div span:nth-child(2) { border-top: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
+.vjs-fullscreen-control div span:nth-child(3) { clear: both; margin: 0 3px 0 0; border-bottom: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); }
+.vjs-fullscreen-control div span:nth-child(4) { border-bottom: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
+/* Icon when video is in fullscreen mode */
+.vjs-fullscreen .vjs-fullscreen-control div span:nth-child(1) { border: none; border-bottom: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
+.vjs-fullscreen .vjs-fullscreen-control div span:nth-child(2) { border: none; border-bottom: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); }
+.vjs-fullscreen .vjs-fullscreen-control div span:nth-child(3) { border: none; border-top: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
+.vjs-fullscreen .vjs-fullscreen-control div span:nth-child(4) { border: none; border-top: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); }
+
+/* Download Links - Used for browsers that don't support any video.
+---------------------------------------------------------*/
+.vjs-no-video { font-size: small; line-height: 1.5; }
+
+/* Big Play Button (at start)
+---------------------------------------------------------*/
+div.vjs-big-play-button {
+  display: none; /* 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;
+}
+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;
+}
+
+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);
+}
+
+/* Spinner Styles
+---------------------------------------------------------*/
+/* CSS Spinners by Kilian Valkhof - http://kilianvalkhof.com/2010/css-xhtml/css3-loading-spinners-without-images/ */
+.vjs-spinner { display: none; position: absolute; top: 50%; left: 50%; width: 100px; height: 100px; z-index: 1; margin: -50px 0 0 -50px;
+  /* Scaling makes the circles look smoother. */
+  -webkit-transform:scale(0.5); -moz-transform:scale(0.5); transform: scale(0.5);
+}
+/* Spinner circles */
+.vjs-spinner div { position:absolute; left: 40px; top: 40px; width: 20px; height: 20px; background: #fff;
+  -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;
+  border: 1px solid #ccc; /* Added border so can be visible on white backgrounds */
+}
+/* Each circle */
+.vjs-spinner div:nth-child(1) { opacity: 0.12; -webkit-transform: rotate(000deg) translate(0, -40px) scale(0.1); -moz-transform: rotate(000deg) translate(0, -40px) scale(0.1); transform: rotate(000deg) translate(0, -40px) scale(0.1); }
+.vjs-spinner div:nth-child(2) { opacity: 0.25; -webkit-transform: rotate(045deg) translate(0, -40px) scale(0.2); -moz-transform: rotate(045deg) translate(0, -40px) scale(0.2); transform: rotate(045deg) translate(0, -40px) scale(0.2); }
+.vjs-spinner div:nth-child(3) { opacity: 0.37; -webkit-transform: rotate(090deg) translate(0, -40px) scale(0.4); -moz-transform: rotate(090deg) translate(0, -40px) scale(0.4); transform: rotate(090deg) translate(0, -40px) scale(0.4); }
+.vjs-spinner div:nth-child(4) { opacity: 0.50; -webkit-transform: rotate(135deg) translate(0, -40px) scale(0.6); -moz-transform: rotate(135deg) translate(0, -40px) scale(0.6); transform: rotate(135deg) translate(0, -40px) scale(0.6); }
+.vjs-spinner div:nth-child(5) { opacity: 0.62; -webkit-transform: rotate(180deg) translate(0, -40px) scale(0.8); -moz-transform: rotate(180deg) translate(0, -40px) scale(0.8); transform: rotate(180deg) translate(0, -40px) scale(0.8); }
+.vjs-spinner div:nth-child(6) { opacity: 0.75; -webkit-transform: rotate(225deg) translate(0, -40px) scale(1.0); -moz-transform: rotate(225deg) translate(0, -40px) scale(1.0); transform: rotate(225deg) translate(0, -40px) scale(1.0); }
+.vjs-spinner div:nth-child(7) { opacity: 0.87; -webkit-transform: rotate(270deg) translate(0, -40px) scale(1.1); -moz-transform: rotate(270deg) translate(0, -40px) scale(1.1); transform: rotate(270deg) translate(0, -40px) scale(1.1); }
+.vjs-spinner div:nth-child(8) { opacity: 1.00; -webkit-transform: rotate(315deg) translate(0, -40px) scale(1.3); -moz-transform: rotate(315deg) translate(0, -40px) scale(1.3); transform: rotate(315deg) translate(0, -40px) scale(1.3); }

video-js/skins/hu.css

@@ -1,99 +0,0 @@
-.hu-css ul.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 ul.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 ul.vjs-controls > li.vjs-play-control, 
-.hu-css ul.vjs-controls > li.vjs-volume-control, 
-.hu-css ul.vjs-controls > li.vjs-fullscreen-control {
-  bottom: 20px; height: 27px;
-}
-/* Bottom Level Items */
-.hu-css ul.vjs-controls > li.vjs-progress-control, .hu-css ul.vjs-controls > li.vjs-time-control {
-  margin-top: 28px; height: 19px;
-}
-
-/* Placement of Control Items */
-.hu-css ul.vjs-controls > li.vjs-play-control       { width: 33px; left: 0px; }
-.hu-css ul.vjs-controls > li.vjs-progress-control   { width: 100%; position: relative; }
-.hu-css ul.vjs-controls > li.vjs-time-control       { width: 84px; left: 0px; }
-.hu-css ul.vjs-controls > li.vjs-volume-control     { width: 43px; right: 44px; }
-.hu-css ul.vjs-controls > li.vjs-fullscreen-control { width: 43px; right: 0px; }
-
-/* Play/Pause
--------------------------------------------------------------------------------- */
-.hu-css li.vjs-play-control.vjs-play span { margin: 9px 0 0 12px; }
-.hu-css li.vjs-play-control.vjs-pause span { margin: 9px 0 0 12px; }
-.hu-css li.vjs-play-control:hover { background-color: #000; }
-
-/* Progress
--------------------------------------------------------------------------------- */
-.hu-css ul.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 ul.vjs-progress-holder li { height: 13px; margin-top: 3px; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; }
-.hu-css li.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 li.vjs-load-progress { background: #555; }
-
-/* Time Display
--------------------------------------------------------------------------------- */
-.hu-css ul.vjs-controls li.vjs-time-control { font-size: 11px; background: #000; }
-.hu-css ul.vjs-controls li.vjs-time-control span { line-height: 19px; /* Centering vertically */ }
-
-/* Volume
--------------------------------------------------------------------------------- */
-/*.hu-css li.vjs-volume-control:hover { background-color: #000; }*/
-.hu-css li.vjs-volume-control ul { margin: 0 5px 0 5px; padding: 9px 0 0 0; }
-.hu-css li.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 li.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 li.vjs-volume-control ul li:nth-child(1) { border-bottom-width: 2px; height: 10px; }
-.hu-css li.vjs-volume-control ul li:nth-child(2) { border-bottom-width: 4px; height: 8px; }
-.hu-css li.vjs-volume-control ul li:nth-child(3) { border-bottom-width: 6px; height: 6px; }
-.hu-css li.vjs-volume-control ul li:nth-child(4) { border-bottom-width: 8px; height: 4px; }
-.hu-css li.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); }
-
-
-
-
-
-
-
-
-
-
-

video-js/skins/tube.css

@@ -1,82 +0,0 @@
-.tube-css ul.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 ul.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 ul.vjs-controls > li.vjs-play-control       { width: 25px; left: 0; }
-.tube-css ul.vjs-controls > li.vjs-progress-control   { width: 100%; position: relative; }
-.tube-css ul.vjs-controls > li.vjs-time-control       { width: 75px; left: 27px; }
-.tube-css ul.vjs-controls > li.vjs-volume-control     { width: 50px; right: 30px; }
-.tube-css ul.vjs-controls > li.vjs-fullscreen-control { width: 30px; right: 0; }
-
-/* Removing borders on time & progress to join them */
-.tube-css ul.vjs-controls > li.vjs-progress-control { border-left: none; }
-.tube-css ul.vjs-controls > li.vjs-time-control { border-right: none; }
-
-
-/* Play/Pause
--------------------------------------------------------------------------------- */
-.tube-css ul.vjs-controls > li:first-child { margin-left: 0; border-left-color: #b1b1b1; }
-.tube-css li.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 li.vjs-play-control.vjs-pause span { height: 14px; margin: 5px auto 0; border-left: 4px solid #333; border-right: 4px solid #333; }
-.tube-css li.vjs-play-control.vjs-play:hover span { border-left-color: #CF1A1A; }
-.tube-css li.vjs-play-control.vjs-pause:hover span { border-left-color: #CF1A1A; border-right-color: #CF1A1A; }
-
-/* Time Display
--------------------------------------------------------------------------------- */
-.tube-css ul.vjs-controls li.vjs-time-control { font-size: 11px; }
-.tube-css ul.vjs-controls li.vjs-time-control span { line-height: 25px; /* Centering vertically */ }
-
-/* Progress
--------------------------------------------------------------------------------- */
-.tube-css ul.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 li.vjs-progress-control li.vjs-load-progress { background: #C89191; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; }
-.tube-css li.vjs-progress-control li.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 li.vjs-volume-control ul { padding: 3px 0 0 0; }
-.tube-css li.vjs-volume-control ul li { border-bottom-color: #ccc; }
-/* Volume icon color */
-.tube-css li.vjs-volume-control ul li.vjs-volume-level-on { border-color: #333; }
-/* Volume icon hovering color */
-.tube-css li.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;
-}

video-js/skins/vim.css

@@ -1,62 +0,0 @@
-.vim-css ul.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 ul.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 ul.vjs-controls > li.vjs-play-control       { width: 65px; left: 10px; }
-.vim-css ul.vjs-controls > li.vjs-progress-control   { width: 100%; position: relative; }
-.vim-css ul.vjs-controls > li.vjs-time-control       { width: 75px; right: 85px; }
-.vim-css ul.vjs-controls > li.vjs-volume-control     { width: 50px; right: 35px; }
-.vim-css ul.vjs-controls > li.vjs-fullscreen-control { width: 25px; right: 10px; }
-
-/* Play/Pause
--------------------------------------------------------------------------------- */
-.vim-css ul.vjs-controls li.vjs-play-control { margin: 0; height: 40px;  border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; }
-.vim-css li.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 li.vjs-play-control:hover { background: #00ADEF; }
-.vim-css li.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 ul.vjs-controls li.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 li.vjs-progress-control ul.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 li.vjs-progress-control li.vjs-play-progress { height: 8px; background: #00ADEF; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; }
-.vim-css li.vjs-progress-control li.vjs-load-progress { height: 8px; background: #898F8F; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; }
-
-/* Time Display
--------------------------------------------------------------------------------- */
-.vim-css ul.vjs-controls li.vjs-time-control { font-size: 11px; }
-.vim-css ul.vjs-controls li.vjs-time-control span { line-height: 32px; /* Centering vertically */ }
-
-/* Volume
--------------------------------------------------------------------------------- */
-.vim-css li.vjs-volume-control ul { padding: 7px 0 0 5px; width: 30px; }
-.vim-css li.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 li.vjs-volume-control ul li.vjs-volume-level-on { border-color: #00ADEF; }
-.vim-css li.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 ul.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; }

video-js/video-js.css

@@ -1,169 +0,0 @@
-/* REQUIRED STYLES (be careful overriding)
-================================================================================ */
-
-/* Box containing video, controls, and download links.
-   If you want to add some kind of frame or special positioning, use another containing element, not video-js-box. */
-.video-js-box { text-align: left; position: relative; vertical-align: bottom; } /* Will be set to the width of the video element */
-
-/* Video Element */
-video.video-js { background-color: #000; position: relative; }
-
-/* Fullscreen styles for main elements */
-.video-js-box.vjs-fullscreen { position: fixed; left: 0; top: 0; right: 0; bottom: 0; overflow: hidden; z-index: 1000; }
-.video-js-box.vjs-fullscreen video.video-js { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1001; }
-.video-js-box.vjs-fullscreen ul.vjs-controls { z-index: 1002; }
-
-/* Poster Style */
-.video-js-box img.vjs-poster { display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; margin: 0; }
-/* Subtiles Style */
-.video-js-box .vjs-subtitles { color:#fff; font-size: 20px; text-align: center; bottom: 20px; left: 0; right: 0; position: absolute; z-index: 1002; }
-
-
-/* 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. */
-
-/* Controls Layout
-   Using a Holy Grail type method to allow the progress bar holder to expand into all available space,
-   but using abosolute positioning for individual controls. http://www.alistapart.com/articles/holygrail */
-.video-js-box ul.vjs-controls {
-  list-style: none; position: absolute; margin: 0; border: none; opacity: 0.85; color: #fff;
-  display: none; /* Start hidden */
-  left: 0; right: 0; /* 100% width of video-js-box */
-  height: 35px; /* Including any margin you want above or below control items */
-  padding-left: 35px; /* Width of play button + margin */
-  padding-right: 165px; /* Width of all the controls to the right of the progress control + margins */
-  padding-top: 0; padding-bottom: 0;
-}
-/* Controls styles when below the video */
-.video-js-box.vjs-controls-below ul.vjs-controls { background-color: #000; }
-
-.video-js-box ul.vjs-controls > li { /* Direct li children of control bar */
-  position: absolute; list-style: none; float: left; padding: 0; text-align: center;
-  height: 25px; /* Default height of individual controls */
-  margin: 5px 0 0 0; /* Top margin to put space between video and controls when controls are below */
-
-  /* CSS Background Gradients */
-  /* 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 */
-  border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;
-
-  /* CSS Shadows */
-  box-shadow: 1px 1px 2px #000; -webkit-box-shadow: 1px 1px 2px #000; -moz-box-shadow: 1px 1px 2px #000;
-}
-/* Placement of Control Items */
-ul.vjs-controls > li.vjs-play-control       { width: 25px; left: 5px; }
-ul.vjs-controls > li.vjs-progress-control   { width: 100%; position: relative; }
-ul.vjs-controls > li.vjs-time-control       { width: 75px; right: 90px; }
-ul.vjs-controls > li.vjs-volume-control     { width: 50px; right: 35px; }
-ul.vjs-controls > li.vjs-fullscreen-control { width: 25px; right: 5px; }
-
-/* Removing curves on progress control and time control to join them. */
-ul.vjs-controls > li.vjs-progress-control {
-  border-top-right-radius: 0; -webkit-border-top-right-radius: 0; -moz-border-radius-topright: 0;
-  border-bottom-right-radius: 0; -webkit-border-bottom-right-radius: 0; -moz-border-radius-bottomright: 0;
-}
-ul.vjs-controls > li.vjs-time-control { 
-  border-top-left-radius: 0; -webkit-border-top-left-radius: 0; -moz-border-radius-topleft: 0;
-  border-bottom-left-radius: 0; -webkit-border-bottom-left-radius: 0; -moz-border-radius-bottomleft: 0;
-}
-
-/* Play/Pause
--------------------------------------------------------------------------------- */
-li.vjs-play-control { cursor: pointer !important; }
-li.vjs-play-control span { display: block; font-size: 0; line-height: 0; }
-li.vjs-play-control.vjs-play 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);
-}
-li.vjs-play-control.vjs-pause 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
--------------------------------------------------------------------------------- */
-ul.vjs-progress-holder { /* Box containing play and load progresses */
-  position: relative; list-style: none; padding: 0; overflow:hidden; cursor: pointer !important;
-  height: 9px; border: 1px solid #777;
-  margin: 7px 1px 0 5px; /* Placement within the progress control item */
-  border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;
-}
-ul.vjs-progress-holder li { /* Progress Bars */
-  position: absolute; display: block; width: 0; height: 9px; margin: 0; padding: 0; list-style: none;
-  border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;
-}
-li.vjs-play-progress {
-  /* Default */ background: #fff;
-  /* Webkit  */ background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#777));
-  /* Firefox */ background: -moz-linear-gradient(top,  #fff,  #777);
-}
-li.vjs-load-progress {
-  opacity: 0.8;
-  /* 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
--------------------------------------------------------------------------------- */
-ul.vjs-controls li.vjs-time-control { font-size: 10px; line-height: 1; font-weight: normal; font-family: Helvetica, Arial, sans-serif; }
-ul.vjs-controls li.vjs-time-control span { line-height: 25px; /* Centering vertically */ }
-
-/* Volume
--------------------------------------------------------------------------------- */
-li.vjs-volume-control { cursor: pointer !important; }
-li.vjs-volume-control ul { list-style: none; display: block; margin: 0 5px 0 5px; padding: 4px 0 0 0; }
-/* Drawing the volume icon using 6 li elements */
-li.vjs-volume-control ul li { /* Individual volume bars */
-  list-style: none; float: left; padding: 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 */
-}
-li.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). */
-li.vjs-volume-control ul li:nth-child(1) { border-bottom-width: 2px; height: 16px; }
-li.vjs-volume-control ul li:nth-child(2) { border-bottom-width: 4px; height: 14px; }
-li.vjs-volume-control ul li:nth-child(3) { border-bottom-width: 7px; height: 11px; }
-li.vjs-volume-control ul li:nth-child(4) { border-bottom-width: 10px; height: 8px; }
-li.vjs-volume-control ul li:nth-child(5) { border-bottom-width: 14px; height: 4px; }
-li.vjs-volume-control ul li:nth-child(6) { margin-right: 0; }
-
-/* Fullscreen
--------------------------------------------------------------------------------- */
-li.vjs-fullscreen-control { cursor: pointer !important; }
-li.vjs-fullscreen-control ul {
-  list-style: none; 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 li elements */
-li.vjs-fullscreen-control ul li { list-style: none; float: left; margin: 0; padding: 0; font-size: 0; line-height: 0; width: 0; text-align: left; vertical-align: top; }
-li.vjs-fullscreen-control ul li:nth-child(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 */
-}
-li.vjs-fullscreen-control ul li:nth-child(2) { border-top: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
-li.vjs-fullscreen-control ul li:nth-child(3) { clear: both; margin: 0 3px 0 0; border-bottom: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); }
-li.vjs-fullscreen-control ul li:nth-child(4) { border-bottom: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
-/* Icon when video is in fullscreen mode */
-.vjs-fullscreen li.vjs-fullscreen-control ul li:nth-child(1) { border: none; border-bottom: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
-.vjs-fullscreen li.vjs-fullscreen-control ul li:nth-child(2) { border: none; border-bottom: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); }
-.vjs-fullscreen li.vjs-fullscreen-control ul li:nth-child(3) { border: none; border-top: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
-.vjs-fullscreen li.vjs-fullscreen-control ul li:nth-child(4) { border: none; border-top: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); }
-
-/* Download Links - Used for browsers that don't support any video.
--------------------------------------------------------------------------------- */
-.vjs-no-video { font-size: small; }