add ogg video for firefox option

johnpolacek · johnpolacek · commit 83903b007ae8 · 2012-09-17T15:44:24.000-05:00
diff --git a/example-ogg.html b/example-ogg.html
@@ -0,0 +1,34 @@
+<!doctype html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+    <title>BigVideo.js - The jQuery Plugin for Big Background Video</title>
+    <meta name="description" content="BigVideo.js - The jQuery Plugin for Big Background Video" />
+    <meta name="author" content="John Polacek" />
+    <meta name="viewport" content="width=device-width">
+    <link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:900&text=ABCDEFGHIJKLMNOPQRSTUVWXYZ' rel='stylesheet' type='text/css'>
+    <link rel="stylesheet" href="css/style.css">
+    <link rel="stylesheet" href="css/bigvideo.css">
+</head>
+<body>
+    <!-- BigVideo Dependencies -->
+	<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
+  	<script>window.jQuery || document.write('<script src="js/jquery-1.7.2.min.js"><\/script>')</script>
+    <script src="js/jquery-ui-1.8.22.custom.min.js"></script>
+    <script src="js/jquery.imagesloaded.min.js"></script>
+    <script src="http://vjs.zencdn.net/c/video.js"></script>
+
+    <!-- BigVideo -->
+    <script src="js/bigvideo.js"></script>
+
+    <!-- Demo -->
+    <script>
+	    $(function() {
+            var BV = new $.BigVideo({useFlashForFirefox:false});
+			BV.init();
+			BV.show('vids/river.mp4', {ogg:'vids/river.ogv'});
+	    });
+    </script>
+</body>
+</html>
diff --git a/index.html b/index.html
@@ -58,6 +58,13 @@ <h2>Setup</h2>
     var BV = new $.BigVideo();
     BV.init();
     BV.show('http://video-js.zencoder.com/oceans-clip.mp4');
+});</pre></blockquote></p>
+            <p>For best results in Firefox, create an Ogg version of your video and configure BigVideo.js like this:</p>
+<p><blockquote><pre>
+$(function() {
+    var BV = new $.BigVideo({useFlashForFirefox:false});
+    BV.init();
+    BV.show('vids/river.mp4', {ogg:'vids/river.ogv'});
 });</pre></blockquote></p>
         </div>
 
diff --git a/js/bigvideo.js b/js/bigvideo.js
@@ -287,6 +287,9 @@
 				if (ext === 'jpg' || ext === 'gif' || ext === 'png') {
 					showPoster(source);
 				} else {
+					if (options !== undefined && options.ogg && navigator.userAgent.toLowerCase().indexOf('firefox') > -1) {
+						source = options.ogg;
+					}
 					playVideo(source);
 					isQueued = false;
 				}
diff --git a/vids/river.ogv b/vids/river.ogv
