chore: Fix examples and docs and some links (#4279)

* Fix the doc/example/elephantsdream/index.html file, add an index of doc/examples, and update CDN links to use video.js v5.19. * Add poster from CDN to Elephants Dream examples.
2017-05-11 14:16:12 -07:00
commit f773c473f9
@@ -22,11 +22,11 @@
 Thanks to the awesome folks over at [Fastly][fastly], there's a free, CDN hosted version of Video.js that anyone can use. Add these tags to your document's `<head>`:
 ```html
-<link href="//vjs.zencdn.net/5.11/video-js.min.css" rel="stylesheet">
+<link href="//vjs.zencdn.net/5.19/video-js.min.css" rel="stylesheet">
-<script src="//vjs.zencdn.net/5.11/video.min.js"></script>
+<script src="//vjs.zencdn.net/5.19/video.min.js"></script>
 ```
-> For the latest URLs, check out the [Getting Started][getting-started] page on our website.
+> For the latest version of video.js and URLs to use, check out the [Getting Started][getting-started] page on our website.
 Next, using Video.js is as simple as creating a `<video>` element, but with an additional `data-setup` attribute. At a minimum, this attribute must have a value of `'{}'`, but it can include any Video.js [options][options] - just make sure it contains valid JSON!
@@ -1,32 +1,26 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
  <meta charset="utf-8" />
  <title>Video.js Text Descriptions, Chapters &amp; Captions Example</title>
-  <link href="../../video-js.css" rel="stylesheet" type="text/css">
+  <link href="http://vjs.zencdn.net/5.19/video-js.css" rel="stylesheet">
-
+  <script src="http://vjs.zencdn.net/ie8/1.1/videojs-ie8.min.js"></script>
-  <script src="../../video.js"></script>
+  <script src="http://vjs.zencdn.net/5.19/video.js"></script>
  <!-- Set the location of the flash SWF -->
  <script>
    videojs.setGlobalOptions({
      flash: {
        swf: '../../video-js.swf'
      }
    });
  </script>
 </head>
 <body>
  <p style="background-color:#eee; border: 1px solid #777; padding: 10px; font-size: .8em; line-height: 1.5em; font-family: Verdana, sans-serif;">This page demonstrates a text descriptions track (intended primarily for blind and visually impaired consumers of visual media)</p>
  <!-- NOTE: we have to disable native Text Track support for the HTML5 tech,
             since even HTML5 video players with native Text Track support
             don't currently support 'description' text tracks in any
-             useful way! -->
+             useful way! Currently this means that iOS will not display
            ANY text tracks -->
  <video id="example_video_1" class="video-js vjs-default-skin" controls preload="none" width="640" height="360"
-      data-setup='{ "html5" : { "nativeTextTracks" : false } }'>
+      data-setup='{ "html5" : { "nativeTextTracks" : false } }'
      poster="http://d2zihajmogu5jn.cloudfront.net/elephantsdream/poster.png">
    <source src="//d2zihajmogu5jn.cloudfront.net/elephantsdream/ed_hd.mp4" type="video/mp4">
    <source src="//d2zihajmogu5jn.cloudfront.net/elephantsdream/ed_hd.ogg" type="video/ogg">
@@ -42,5 +36,7 @@
    <p class="vjs-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a></p>
  </video>
 </body>
 </html>
@@ -0,0 +1,18 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
  <meta charset="utf-8" />
  <title>Index of video.js examples</title>
 </head>
 <body>
  <h1>Index of video.js examples</h1>
  <ul>
    <li><a href="simple-embed">Video.js HTML5 video player simple example</a></li>
    <li><a href="elephantsdream">Elephants Dream video with text descriptions, chapters &amp; captions example</a></li>
  </ul>
 </body>
 </html>
@@ -1,15 +1,13 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
    <title>Video.js | HTML5 Video Player</title>
-    <link href="http://vjs.zencdn.net/5.0.2/video-js.css" rel="stylesheet">
+    <link href="http://vjs.zencdn.net/5.19/video-js.css" rel="stylesheet">
-    <script src="http://vjs.zencdn.net/ie8/1.1.0/videojs-ie8.min.js"></script>
+    <script src="http://vjs.zencdn.net/ie8/1.1/videojs-ie8.min.js"></script>
-    <script src="http://vjs.zencdn.net/5.0.2/video.js"></script>
+    <script src="http://vjs.zencdn.net/5.19/video.js"></script>
 </head>
 <body>
  <video id="example_video_1" class="video-js vjs-default-skin" controls preload="none" width="640" height="264" poster="http://vjs.zencdn.net/v/oceans.png" data-setup="{}">
@@ -22,6 +20,7 @@
    <!-- Tracks need an ending tag thanks to IE9 -->
    <p class="vjs-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a></p>
  </video>
 </body>
 </html>
@@ -18,12 +18,16 @@
 </head>
 <body>
  <!-- NOTE: we have to disable native Text Track support for the HTML5 tech,
             since even HTML5 video players with native Text Track support
             don't currently support 'description' text tracks in any
-             useful way! -->
+             useful way! Currently this means that iOS will not display
            ANY text tracks -->
  <video id="example_video_1" class="video-js vjs-default-skin" controls preload="none" width="640" height="360"
-      data-setup='{ "html5" : { "nativeTextTracks" : false } }'>
+      data-setup='{ "html5" : { "nativeTextTracks" : false } }'
      poster="http://d2zihajmogu5jn.cloudfront.net/elephantsdream/poster.png">
    <source src="//d2zihajmogu5jn.cloudfront.net/elephantsdream/ed_hd.mp4" type="video/mp4">
    <source src="//d2zihajmogu5jn.cloudfront.net/elephantsdream/ed_hd.ogg" type="video/ogg">
@@ -39,5 +43,6 @@
    <p class="vjs-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a></p>
  </video>
 </body>
 </html>