mediaelement_rails 0.5.1 → 0.7.0

data/app/assets/javascripts/mediaelement_rails/mediaelementplayer.js

@@ -5,7 +5,7 @@
  * Creates a controller bar for HTML5 <video> add <audio> tags
  * using jQuery and MediaElement.js (HTML5 Flash/Silverlight wrapper)
  *
- * Copyright 2010-2012, John Dyer (http://j.hn/)
+ * Copyright 2010-2013, John Dyer (http://j.hn/)
  * License: MIT
  *
  */
@@ -20,6 +20,8 @@ if (typeof jQuery != 'undefined') {
 	mejs.MepDefaults = {
 		// url to poster (to fix iOS 3.x)
 		poster: '',
+		// When the video is ended, we can show the poster.
+		showPosterWhenEnded: false,
 		// default if the <video width> is not specified
 		defaultVideoWidth: 480,
 		// default if the <video height> is not specified
@@ -33,19 +35,19 @@ if (typeof jQuery != 'undefined') {
 		// default if the user doesn't specify
 		defaultAudioHeight: 30,
 
-		// default amount to move back when back key is pressed		
+		// default amount to move back when back key is pressed
 		defaultSeekBackwardInterval: function(media) {
 			return (media.duration * 0.05);
-		},		
-		// default amount to move forward when forward key is pressed				
+		},
+		// default amount to move forward when forward key is pressed
 		defaultSeekForwardInterval: function(media) {
 			return (media.duration * 0.05);
-		},		
-		
+		},
+
 		// width of audio player
 		audioWidth: -1,
 		// height of audio player
-		audioHeight: -1,		
+		audioHeight: -1,
 		// initial volume when the player starts (overrided by user cookie)
 		startVolume: 0.8,
 		// useful for <audio> player loops
@@ -61,7 +63,7 @@ if (typeof jQuery != 'undefined') {
 		showTimecodeFrameCount: false,
 		// used when showTimecodeFrameCount is set to true
 		framesPerSecond: 25,
-		
+
 		// automatically calculate the width of the progress bar based on the sizes of other elements
 		autosizeProgress : true,
 		// Hide controls when playing and mouse is not over the video
@@ -73,20 +75,20 @@ if (typeof jQuery != 'undefined') {
 		// force iPad's native controls
 		iPadUseNativeControls: false,
 		// force iPhone's native controls
-		iPhoneUseNativeControls: false,	
+		iPhoneUseNativeControls: false,
 		// force Android's native controls
-		AndroidUseNativeControls: false,			
+		AndroidUseNativeControls: false,
 		// features to show
 		features: ['playpause','current','progress','duration','tracks','volume','fullscreen'],
 		// only for dynamic
 		isVideo: true,
-		
+
 		// turns keyboard support on and off for this instance
 		enableKeyboard: true,
-		
+
 		// whenthis player starts, it will pause other players
 		pauseOtherPlayers: true,
-		
+
 		// array of keyboard actions such as play pause
 		keyActions: [
 				{
@@ -96,10 +98,10 @@ if (typeof jQuery != 'undefined') {
 							  ],
 						action: function(player, media) {
 								if (media.paused || media.ended) {
-										media.play();	
+										player.play();
 								} else {
-										media.pause();
-								}										
+										player.pause();
+								}
 						}
 				},
 				{
@@ -127,7 +129,7 @@ if (typeof jQuery != 'undefined') {
 												player.showControls();
 												player.startControlsTimer();
 										}
-										
+
 										// 5%
 										var newTime = Math.max(media.currentTime - player.options.defaultSeekBackwardInterval(media), 0);
 										media.setCurrentTime(newTime);
@@ -138,16 +140,16 @@ if (typeof jQuery != 'undefined') {
 						keys: [
 								39, // RIGHT
 								228 // Google TV forward
-						], 
+						],
 						action: function(player, media) {
 								if (!isNaN(media.duration) && media.duration > 0) {
 										if (player.isVideo) {
 												player.showControls();
 												player.startControlsTimer();
 										}
-										
+
 										// 5%
-										var newTime = Math.min(media.currentTime + player.options.defaultSeekForwardInterval(media), media.duration);										
+										var newTime = Math.min(media.currentTime + player.options.defaultSeekForwardInterval(media), media.duration);
 										media.setCurrentTime(newTime);
 								}
 						}
@@ -163,12 +165,12 @@ if (typeof jQuery != 'undefined') {
 										}
 								}
 						}
-				}					
-		]		
+				}
+		]
 	};
 
 	mejs.mepIndex = 0;
-	
+
 	mejs.players = {};
 
 	// wraps a MediaElement object in player controls
@@ -176,14 +178,14 @@ if (typeof jQuery != 'undefined') {
 		// enforce object, even without "new" (via John Resig)
 		if ( !(this instanceof mejs.MediaElementPlayer) ) {
 			return new mejs.MediaElementPlayer(node, o);
-		} 
+		}
 
 		var t = this;
-		
+
 		// these will be reset after the MediaElement.success fires
 		t.$media = t.$node = $(node);
-		t.node = t.media = t.$media[0];		
-		
+		t.node = t.media = t.$media[0];
+
 		// check for existing player
 		if (typeof t.node.player != 'undefined') {
 			return t.node.player;
@@ -191,22 +193,22 @@ if (typeof jQuery != 'undefined') {
 			// attach player to DOM node for reference
 			t.node.player = t;
 		}
-				
-				
+
+
 		// try to get options from data-mejsoptions
 		if (typeof o == 'undefined') {
-			o = t.$node.data('mejsoptions');	
+			o = t.$node.data('mejsoptions');
 		}
-			
+
 		// extend default options
 		t.options = $.extend({},mejs.MepDefaults,o);
-		
+
 		// unique ID
 		t.id = 'mep_' + mejs.mepIndex++;
 
 		// add to player array (for focus events)
 		mejs.players[t.id] = t;
-		
+
 		// start up
 		t.init();
 
@@ -215,11 +217,11 @@ if (typeof jQuery != 'undefined') {
 
 	// actual player
 	mejs.MediaElementPlayer.prototype = {
-		
+
 		hasFocus: false,
-		
+
 		controlsAreVisible: true,
-		
+
 		init: function() {
 
 			var
@@ -231,19 +233,19 @@ if (typeof jQuery != 'undefined') {
 					error: function(e) { t.handleError(e);}
 				}),
 				tagName = t.media.tagName.toLowerCase();
-		
+
 			t.isDynamic = (tagName !== 'audio' && tagName !== 'video');
-			
-			if (t.isDynamic) {	
-				// get video from src or href?				
-				t.isVideo = t.options.isVideo;						
+
+			if (t.isDynamic) {
+				// get video from src or href?
+				t.isVideo = t.options.isVideo;
 			} else {
 				t.isVideo = (tagName !== 'audio' && t.options.isVideo);
 			}
-		
-			// use native controls in iPad, iPhone, and Android	
+
+			// use native controls in iPad, iPhone, and Android
 			if ((mf.isiPad && t.options.iPadUseNativeControls) || (mf.isiPhone && t.options.iPhoneUseNativeControls)) {
-				
+
 				// add controls and stop
 				t.$media.attr('controls', 'controls');
 
@@ -253,21 +255,20 @@ if (typeof jQuery != 'undefined') {
 
 				// override Apple's autoplay override for iPads
 				if (mf.isiPad && t.media.getAttribute('autoplay') !== null) {
-					t.media.load();
-					t.media.play();
+					t.play();
 				}
-					
+
 			} else if (mf.isAndroid && t.options.AndroidUseNativeControls) {
-				
+
 				// leave default player
 
 			} else {
 
 				// DESKTOP: use MediaElementPlayer controls
-				
-				// remove native controls 			
-				t.$media.removeAttr('controls');					
-				
+
+				// remove native controls
+				t.$media.removeAttr('controls');
+
 				// build container
 				t.container =
 					$('<div id="' + t.id + '" class="mejs-container ' + (mejs.MediaFeatures.svg ? 'svg' : 'no-svg') + '">'+
@@ -279,8 +280,8 @@ if (typeof jQuery != 'undefined') {
 						'</div>' +
 					'</div>')
 					.addClass(t.$media[0].className)
-					.insertBefore(t.$media);	
-					
+					.insertBefore(t.$media);
+
 				// add classes for user and content
 				t.container.addClass(
 					(mf.isAndroid ? 'mejs-android ' : '') +
@@ -288,89 +289,89 @@ if (typeof jQuery != 'undefined') {
 					(mf.isiPad ? 'mejs-ipad ' : '') +
 					(mf.isiPhone ? 'mejs-iphone ' : '') +
 					(t.isVideo ? 'mejs-video ' : 'mejs-audio ')
-				);	
-					
+				);
+
 
 				// move the <video/video> tag into the right spot
 				if (mf.isiOS) {
-				
+
 					// sadly, you can't move nodes in iOS, so we have to destroy and recreate it!
 					var $newMedia = t.$media.clone();
-					
+
 					t.container.find('.mejs-mediaelement').append($newMedia);
-					
+
 					t.$media.remove();
 					t.$node = t.$media = $newMedia;
 					t.node = t.media = $newMedia[0]
-					
+
 				} else {
-					
+
 					// normal way of moving it into place (doesn't work on iOS)
 					t.container.find('.mejs-mediaelement').append(t.$media);
 				}
-				
+
 				// find parts
 				t.controls = t.container.find('.mejs-controls');
 				t.layers = t.container.find('.mejs-layers');
 
 				// determine the size
-				
+
 				/* size priority:
-					(1) videoWidth (forced), 
+					(1) videoWidth (forced),
 					(2) style="width;height;"
 					(3) width attribute,
 					(4) defaultVideoWidth (for unspecified cases)
 				*/
-				
+
 				var tagType = (t.isVideo ? 'video' : 'audio'),
 					capsTagName = tagType.substring(0,1).toUpperCase() + tagType.substring(1);
-					
-				
+
+
 				if (t.options[tagType + 'Width'] > 0 || t.options[tagType + 'Width'].toString().indexOf('%') > -1) {
 					t.width = t.options[tagType + 'Width'];
 				} else if (t.media.style.width !== '' && t.media.style.width !== null) {
-					t.width = t.media.style.width;						
+					t.width = t.media.style.width;
 				} else if (t.media.getAttribute('width') !== null) {
 					t.width = t.$media.attr('width');
 				} else {
 					t.width = t.options['default' + capsTagName + 'Width'];
 				}
-				
+
 				if (t.options[tagType + 'Height'] > 0 || t.options[tagType + 'Height'].toString().indexOf('%') > -1) {
 					t.height = t.options[tagType + 'Height'];
 				} else if (t.media.style.height !== '' && t.media.style.height !== null) {
 					t.height = t.media.style.height;
 				} else if (t.$media[0].getAttribute('height') !== null) {
-					t.height = t.$media.attr('height');	
+					t.height = t.$media.attr('height');
 				} else {
 					t.height = t.options['default' + capsTagName + 'Height'];
 				}
 
 				// set the size, while we wait for the plugins to load below
 				t.setPlayerSize(t.width, t.height);
-				
+
 				// create MediaElementShim
-				meOptions.pluginWidth = t.height;
-				meOptions.pluginHeight = t.width;				
+				meOptions.pluginWidth = t.width;
+				meOptions.pluginHeight = t.height;
 			}
-			
-			
 
 			// create MediaElement shim
 			mejs.MediaElement(t.$media[0], meOptions);
 
-			// controls are shown when loaded
-			t.container.trigger('controlsshown');
+			if (typeof(t.container) != 'undefined' && t.controlsAreVisible){
+			    // controls are shown when loaded
+			    t.container.trigger('controlsshown');
+			}
 		},
-		
+
 		showControls: function(doAnimation) {
 			var t = this;
-			
+
 			doAnimation = typeof doAnimation == 'undefined' || doAnimation;
-			
+
 			if (t.controlsAreVisible)
 				return;
-			
+
 			if (doAnimation) {
 				t.controls
 					.css('visibility','visible')
@@ -378,84 +379,84 @@ if (typeof jQuery != 'undefined') {
 					      t.controlsAreVisible = true;
 					      t.container.trigger('controlsshown');
 					});
-	
+
 				// any additional controls people might add and want to hide
 				t.container.find('.mejs-control')
 					.css('visibility','visible')
-					.stop(true, true).fadeIn(200, function() {t.controlsAreVisible = true;});	
-					
+					.stop(true, true).fadeIn(200, function() {t.controlsAreVisible = true;});
+
 			} else {
 				t.controls
 					.css('visibility','visible')
 					.css('display','block');
-	
+
 				// any additional controls people might add and want to hide
 				t.container.find('.mejs-control')
 					.css('visibility','visible')
 					.css('display','block');
-					
+
 				t.controlsAreVisible = true;
 				t.container.trigger('controlsshown');
 			}
-			
+
 			t.setControlsSize();
-			
+
 		},
 
 		hideControls: function(doAnimation) {
 			var t = this;
-			
+
 			doAnimation = typeof doAnimation == 'undefined' || doAnimation;
-			
-			if (!t.controlsAreVisible)
+
+			if (!t.controlsAreVisible || t.options.alwaysShowControls)
 				return;
-			
+
 			if (doAnimation) {
 				// fade out main controls
 				t.controls.stop(true, true).fadeOut(200, function() {
 					$(this)
 						.css('visibility','hidden')
 						.css('display','block');
-						
+
 					t.controlsAreVisible = false;
 					t.container.trigger('controlshidden');
-				});	
-	
+				});
+
 				// any additional controls people might add and want to hide
 				t.container.find('.mejs-control').stop(true, true).fadeOut(200, function() {
 					$(this)
 						.css('visibility','hidden')
 						.css('display','block');
-				});	
+				});
 			} else {
-				
+
 				// hide main controls
 				t.controls
 					.css('visibility','hidden')
-					.css('display','block');		
-				
+					.css('display','block');
+
 				// hide others
 				t.container.find('.mejs-control')
 					.css('visibility','hidden')
 					.css('display','block');
-					
+
 				t.controlsAreVisible = false;
 				t.container.trigger('controlshidden');
 			}
-		},		
+		},
 
 		controlsTimer: null,
 
 		startControlsTimer: function(timeout) {
 
 			var t = this;
-			
+
 			timeout = typeof timeout != 'undefined' ? timeout : 1500;
 
 			t.killControlsTimer('start');
 
 			t.controlsTimer = setTimeout(function() {
-				//console.log('timer fired');
+				//
 				t.hideControls();
 				t.killControlsTimer('hide');
 			}, timeout);
@@ -470,31 +471,31 @@ if (typeof jQuery != 'undefined') {
 				delete t.controlsTimer;
 				t.controlsTimer = null;
 			}
-		},		
-		
+		},
+
 		controlsEnabled: true,
-		
+
 		disableControls: function() {
 			var t= this;
-			
+
 			t.killControlsTimer();
 			t.hideControls(false);
 			this.controlsEnabled = false;
 		},
-		
+
 		enableControls: function() {
 			var t= this;
-			
+
 			t.showControls(false);
-			
+
 			t.controlsEnabled = true;
-		},		
-		
+		},
+
 
 		// Sets up all controls and events
-		meReady: function(media, domNode) {			
-		
-		
+		meReady: function(media, domNode) {
+
+
 			var t = this,
 				mf = mejs.MediaFeatures,
 				autoplayAttr = domNode.getAttribute('autoplay'),
@@ -503,16 +504,17 @@ if (typeof jQuery != 'undefined') {
 				feature;
 
 			// make sure it can't create itself again if a plugin reloads
-			if (t.created)
+			if (t.created) {
 				return;
-			else
-				t.created = true;			
+			} else {
+				t.created = true;
+			}
 
 			t.media = media;
 			t.domNode = domNode;
-			
-			if (!(mf.isAndroid && t.options.AndroidUseNativeControls) && !(mf.isiPad && t.options.iPadUseNativeControls) && !(mf.isiPhone && t.options.iPhoneUseNativeControls)) {				
-				
+
+			if (!(mf.isAndroid && t.options.AndroidUseNativeControls) && !(mf.isiPad && t.options.iPadUseNativeControls) && !(mf.isiPhone && t.options.iPhoneUseNativeControls)) {
+
 				// two built in features
 				t.buildposter(t, t.controls, t.layers, t.media);
 				t.buildkeyboard(t, t.controls, t.layers, t.media);
@@ -530,30 +532,30 @@ if (typeof jQuery != 'undefined') {
 						} catch (e) {
 							// TODO: report control error
 							//throw e;
-							//console.log('error building ' + feature);
-							//console.log(e);
+							//
+							//
 						}
 					}
 				}
 
 				t.container.trigger('controlsready');
-				
+
 				// reset all layers and controls
 				t.setPlayerSize(t.width, t.height);
 				t.setControlsSize();
-				
+
 
 				// controls fade
 				if (t.isVideo) {
-				
+
 					if (mejs.MediaFeatures.hasTouch) {
-						
+
 						// for touch devices (iOS, Android)
 						// show/hide without animation on touch
-						
+
 						t.$media.bind('touchstart', function() {
-							
-							
+
+
 							// toggle controls
 							if (t.controlsAreVisible) {
 								t.hideControls(false);
@@ -562,28 +564,35 @@ if (typeof jQuery != 'undefined') {
 									t.showControls(false);
 								}
 							}
-						});					
-					
+						});
+
 					} else {
-            // click to play/pause
-            t.media.addEventListener('click', function() {
-              if (t.options.clickToPlayPause) {
-                  if (t.media.paused) {
-                    t.media.play();
-                  } else {
-                    t.media.pause();
-                  }
-              }
-            });
-					
+
+						// create callback here since it needs access to current
+						// MediaElement object
+						mejs.MediaElementPlayer.prototype.clickToPlayPauseCallback = function() {
+							//
+
+							if (t.options.clickToPlayPause) {
+								if (t.media.paused) {
+									t.play();
+								} else {
+									t.pause();
+								}
+							}
+						};
+
+			            // click to play/pause
+			            t.media.addEventListener('click', t.clickToPlayPauseCallback, false);
+
 						// show/hide controls
 						t.container
 							.bind('mouseenter mouseover', function () {
 								if (t.controlsEnabled) {
-									if (!t.options.alwaysShowControls) {								
+									if (!t.options.alwaysShowControls) {
 										t.killControlsTimer('enter');
 										t.showControls();
-										t.startControlsTimer(2500);		
+										t.startControlsTimer(2500);
 									}
 								}
 							})
@@ -601,7 +610,7 @@ if (typeof jQuery != 'undefined') {
 							.bind('mouseleave', function () {
 								if (t.controlsEnabled) {
 									if (!t.media.paused && !t.options.alwaysShowControls) {
-										t.startControlsTimer(1000);								
+										t.startControlsTimer(1000);
 									}
 								}
 							});
@@ -629,25 +638,25 @@ if (typeof jQuery != 'undefined') {
 						}, false);
 					}
 				}
-				
+
 				// EVENTS
 
 				// FOCUS: when a video starts playing, it takes focus from other players (possibily pausing them)
 				media.addEventListener('play', function() {
-						var playerIndex;
-						
-						// go through all other players
-						for (playerIndex in mejs.players) {
-							var p = mejs.players[playerIndex];
-							if (p.id != t.id && t.options.pauseOtherPlayers && !p.paused && !p.ended) {
-								p.pause();
-							}
-							p.hasFocus = false;
+					var playerIndex;
+
+					// go through all other players
+					for (playerIndex in mejs.players) {
+						var p = mejs.players[playerIndex];
+						if (p.id != t.id && t.options.pauseOtherPlayers && !p.paused && !p.ended) {
+							p.pause();
 						}
-						
-						t.hasFocus = true;
+						p.hasFocus = false;
+					}
+
+					t.hasFocus = true;
 				},false);
-								
+
 
 				// ended for all
 				t.media.addEventListener('ended', function (e) {
@@ -655,23 +664,25 @@ if (typeof jQuery != 'undefined') {
 						try{
 							t.media.setCurrentTime(0);
 						} catch (exp) {
-							
+
 						}
 					}
 					t.media.pause();
-					
-					if (t.setProgressRail)
+
+					if (t.setProgressRail) {
 						t.setProgressRail();
-					if (t.setCurrentRail)
-						t.setCurrentRail();						
+					}
+					if (t.setCurrentRail) {
+						t.setCurrentRail();
+					}
 
 					if (t.options.loop) {
-						t.media.play();
+						t.play();
 					} else if (!t.options.alwaysShowControls && t.controlsEnabled) {
 						t.showControls();
 					}
 				}, false);
-				
+
 				// resize on the first play
 				t.media.addEventListener('loadedmetadata', function(e) {
 					if (t.updateDuration) {
@@ -680,7 +691,7 @@ if (typeof jQuery != 'undefined') {
 					if (t.updateCurrent) {
 						t.updateCurrent();
 					}
-					
+
 					if (!t.isFullScreen) {
 						t.setPlayerSize(t.width, t.height);
 						t.setControlsSize();
@@ -693,47 +704,46 @@ if (typeof jQuery != 'undefined') {
 					t.setPlayerSize(t.width, t.height);
 					t.setControlsSize();
 				}, 50);
-				
+
 				// adjust controls whenever window sizes (used to be in fullscreen only)
 				t.globalBind('resize', function() {
-					
-					// don't resize for fullscreen mode				
+
+					// don't resize for fullscreen mode
 					if ( !(t.isFullScreen || (mejs.MediaFeatures.hasTrueNativeFullScreen && document.webkitIsFullScreen)) ) {
 						t.setPlayerSize(t.width, t.height);
 					}
-					
+
 					// always adjust controls
 					t.setControlsSize();
-				});				
+				});
 
 				// TEMP: needs to be moved somewhere else
 				if (t.media.pluginType == 'youtube') {
-					t.container.find('.mejs-overlay-play').hide();	
+					t.container.find('.mejs-overlay-play').hide();
 				}
 			}
-			
+
 			// force autoplay for HTML5
 			if (autoplay && media.pluginType == 'native') {
-				media.load();
-				media.play();
+				t.play();
 			}
 
 
 			if (t.options.success) {
-				
+
 				if (typeof t.options.success == 'string') {
-						window[t.options.success](t.media, t.domNode, t);
+					window[t.options.success](t.media, t.domNode, t);
 				} else {
-						t.options.success(t.media, t.domNode, t);
+					t.options.success(t.media, t.domNode, t);
 				}
 			}
 		},
 
 		handleError: function(e) {
 			var t = this;
-			
+
 			t.controls.hide();
-		
+
 			// Tell user that the file cannot be played
 			if (t.options.error) {
 				t.options.error(e);
@@ -743,27 +753,29 @@ if (typeof jQuery != 'undefined') {
 		setPlayerSize: function(width,height) {
 			var t = this;
 
-			if (typeof width != 'undefined')
+			if (typeof width != 'undefined') {
 				t.width = width;
-				
-			if (typeof height != 'undefined')
+			}
+
+			if (typeof height != 'undefined') {
 				t.height = height;
+			}
+
+			// detect 100% mode - use currentStyle for IE since css() doesn't return percentages
+      		if (t.height.toString().indexOf('%') > 0 || t.$node.css('max-width') === '100%' || parseInt(t.$node.css('max-width').replace(/px/,''), 10) / t.$node.offsetParent().width() === 1 || (t.$node[0].currentStyle && t.$node[0].currentStyle.maxWidth === '100%')) {
 
-      // detect 100% mode - use currentStyle for IE since css() doesn't return percentages
-      if (t.height.toString().indexOf('%') > 0 || t.$node.css('max-width') === '100%' || (t.$node[0].currentStyle && t.$node[0].currentStyle.maxWidth === '100%')) {
-			
 				// do we have the native dimensions yet?
-				var 
+				var
 					nativeWidth = t.isVideo ? ((t.media.videoWidth && t.media.videoWidth > 0) ? t.media.videoWidth : t.options.defaultVideoWidth) : t.options.defaultAudioWidth,
 					nativeHeight = t.isVideo ? ((t.media.videoHeight && t.media.videoHeight > 0) ? t.media.videoHeight : t.options.defaultVideoHeight) : t.options.defaultAudioHeight,
 					parentWidth = t.container.parent().closest(':visible').width(),
 					newHeight = t.isVideo || !t.options.autosizeProgress ? parseInt(parentWidth * nativeHeight/nativeWidth, 10) : nativeHeight;
-					
+
 				if (t.container.parent()[0].tagName.toLowerCase() === 'body') { // && t.container.siblings().count == 0) {
 					parentWidth = $(window).width();
 					newHeight = $(window).height();
 				}
-				
+
 				if ( newHeight != 0 && parentWidth != 0 ) {
 					// set outer container size
 					t.container
@@ -775,31 +787,39 @@ if (typeof jQuery != 'undefined') {
 						.width('100%')
 						.height('100%');
 
-					// if shim is ready, send the size to the embeded plugin	
+					// if shim is ready, send the size to the embeded plugin
 					if (t.isVideo) {
 						if (t.media.setVideoSize) {
 							t.media.setVideoSize(parentWidth, newHeight);
 						}
 					}
-					
+
 					// set the layers
 					t.layers.children('.mejs-layer')
 						.width('100%')
 						.height('100%');
 				}
-			
-			
+
+
 			} else {
 
 				t.container
 					.width(t.width)
 					.height(t.height);
-	
+
 				t.layers.children('.mejs-layer')
 					.width(t.width)
 					.height(t.height);
-					
+
 			}
+
+			// special case for big play button so it doesn't go over the controls area
+			var playLayer = t.layers.find('.mejs-overlay-play'),
+				playButton = playLayer.find('.mejs-overlay-button');
+
+			playLayer.height(t.container.height() - t.controls.height());
+			playButton.css('margin-top', '-' + (playButton.height()/2 - t.controls.height()/2).toString() + 'px'  );
+
 		},
 
 		setControlsSize: function() {
@@ -811,18 +831,18 @@ if (typeof jQuery != 'undefined') {
 				current = t.controls.find('.mejs-time-current'),
 				loaded = t.controls.find('.mejs-time-loaded'),
 				others = rail.siblings();
-			
+
 
 			// allow the size to come from custom CSS
 			if (t.options && !t.options.autosizeProgress) {
-				// Also, frontends devs can be more flexible 
+				// Also, frontends devs can be more flexible
 				// due the opportunity of absolute positioning.
 				railWidth = parseInt(rail.css('width'));
 			}
-			
+
 			// attempt to autosize
 			if (railWidth === 0 || !railWidth) {
-				
+
 				// find the size of all the other controls besides the rail
 				others.each(function() {
 					var $this = $(this);
@@ -830,7 +850,7 @@ if (typeof jQuery != 'undefined') {
 						usedWidth += $(this).outerWidth(true);
 					}
 				});
-				
+
 				// fit the rail into the remaining space
 				railWidth = t.controls.width() - usedWidth - (rail.outerWidth(true) - rail.width());
 			}
@@ -839,17 +859,17 @@ if (typeof jQuery != 'undefined') {
 			rail.width(railWidth);
 			// dark space
 			total.width(railWidth - (total.outerWidth(true) - total.width()));
-			
+
 			if (t.setProgressRail)
 				t.setProgressRail();
 			if (t.setCurrentRail)
-				t.setCurrentRail();				
+				t.setCurrentRail();
 		},
 
 
 		buildposter: function(player, controls, layers, media) {
 			var t = this,
-				poster = 
+				poster =
 				$('<div class="mejs-poster mejs-layer">' +
 				'</div>')
 					.appendTo(layers),
@@ -858,8 +878,8 @@ if (typeof jQuery != 'undefined') {
 			// prioriy goes to option (this is useful if you need to support iOS 3.x (iOS completely fails with poster)
 			if (player.options.poster !== '') {
 				posterUrl = player.options.poster;
-			}	
-				
+			}
+
 			// second, try the real poster
 			if (posterUrl !== '' && posterUrl != null) {
 				t.setPoster(posterUrl);
@@ -870,18 +890,25 @@ if (typeof jQuery != 'undefined') {
 			media.addEventListener('play',function() {
 				poster.hide();
 			}, false);
+
+			if(player.options.showPosterWhenEnded && player.options.autoRewind){
+				media.addEventListener('ended',function() {
+					poster.show();
+				}, false);
+			}
 		},
-		
+
 		setPoster: function(url) {
 			var t = this,
 				posterDiv = t.container.find('.mejs-poster'),
 				posterImg = posterDiv.find('img');
-				
+
 			if (posterImg.length == 0) {
 				posterImg = $('<img width="100%" height="100%" />').appendTo(posterDiv);
-			}	
-			
+			}
+
 			posterImg.attr('src', url);
+			posterDiv.css({'background-image' : 'url(' + url + ')'});
 		},
 
 		buildoverlays: function(player, controls, layers, media) {
@@ -889,42 +916,40 @@ if (typeof jQuery != 'undefined') {
 			if (!player.isVideo)
 				return;
 
-			var 
-			loading = 
+			var
+			loading =
 				$('<div class="mejs-overlay mejs-layer">'+
 					'<div class="mejs-overlay-loading"><span></span></div>'+
 				'</div>')
 				.hide() // start out hidden
 				.appendTo(layers),
-			error = 
+			error =
 				$('<div class="mejs-overlay mejs-layer">'+
 					'<div class="mejs-overlay-error"></div>'+
 				'</div>')
 				.hide() // start out hidden
 				.appendTo(layers),
 			// this needs to come last so it's on top
-			bigPlay = 
+			bigPlay =
 				$('<div class="mejs-overlay mejs-layer mejs-overlay-play">'+
 					'<div class="mejs-overlay-button"></div>'+
 				'</div>')
 				.appendTo(layers)
-				.click(function() {
-                    if (t.options.clickToPlayPause) {
-                        if (media.paused) {
-                            media.play();
-                        } else {
-                            media.pause();
-                        }
-                    }
+				.bind('click touchstart', function() {
+					if (t.options.clickToPlayPause) {
+						if (media.paused) {
+							t.play();
+						}
+					}
 				});
-			
+
 			/*
 			if (mejs.MediaFeatures.isiOS || mejs.MediaFeatures.isAndroid) {
 				bigPlay.remove();
 				loading.remove();
 			}
 			*/
-	
+
 
 			// show/hide big play button
 			media.addEventListener('play',function() {
@@ -932,13 +957,13 @@ if (typeof jQuery != 'undefined') {
 				loading.hide();
 				controls.find('.mejs-time-buffering').hide();
 				error.hide();
-			}, false);	
-			
+			}, false);
+
 			media.addEventListener('playing', function() {
 				bigPlay.hide();
 				loading.hide();
 				controls.find('.mejs-time-buffering').hide();
-				error.hide();			
+				error.hide();
 			}, false);
 
 			media.addEventListener('seeking', function() {
@@ -950,32 +975,32 @@ if (typeof jQuery != 'undefined') {
 				loading.hide();
 				controls.find('.mejs-time-buffering').hide();
 			}, false);
-	
+
 			media.addEventListener('pause',function() {
 				if (!mejs.MediaFeatures.isiPhone) {
 					bigPlay.show();
 				}
 			}, false);
-			
+
 			media.addEventListener('waiting', function() {
-				loading.show();	
+				loading.show();
 				controls.find('.mejs-time-buffering').show();
-			}, false);			
-			
-			
-			// show/hide loading			
+			}, false);
+
+
+			// show/hide loading
 			media.addEventListener('loadeddata',function() {
 				// for some reason Chrome is firing this event
 				//if (mejs.MediaFeatures.isChrome && media.getAttribute && media.getAttribute('preload') === 'none')
 				//	return;
-					
+
 				loading.show();
 				controls.find('.mejs-time-buffering').show();
-			}, false);	
+			}, false);
 			media.addEventListener('canplay',function() {
 				loading.hide();
 				controls.find('.mejs-time-buffering').hide();
-			}, false);	
+			}, false);
 
 			// error handling
 			media.addEventListener('error',function() {
@@ -983,42 +1008,42 @@ if (typeof jQuery != 'undefined') {
 				controls.find('.mejs-time-buffering').hide();
 				error.show();
 				error.find('mejs-overlay-error').html("Error loading this resource");
-			}, false);				
+			}, false);
 		},
-		
+
 		buildkeyboard: function(player, controls, layers, media) {
 
 				var t = this;
-				
+
 				// listen for key presses
 				t.globalBind('keydown', function(e) {
-						
+
 						if (player.hasFocus && player.options.enableKeyboard) {
-										
+
 								// find a matching key
 								for (var i=0, il=player.options.keyActions.length; i<il; i++) {
 										var keyAction = player.options.keyActions[i];
-										
+
 										for (var j=0, jl=keyAction.keys.length; j<jl; j++) {
 												if (e.keyCode == keyAction.keys[j]) {
 														e.preventDefault();
 														keyAction.action(player, media, e.keyCode);
 														return false;
-												}												
+												}
 										}
 								}
 						}
-						
+
 						return true;
 				});
-				
+
 				// check if someone clicked outside a player region, then kill its focus
 				t.globalBind('click', function(event) {
 						if ($(event.target).closest('.mejs-container').length == 0) {
 								player.hasFocus = false;
 						}
 				});
-			
+
 		},
 
 		findTracks: function() {
@@ -1028,9 +1053,9 @@ if (typeof jQuery != 'undefined') {
 			// store for use by plugins
 			t.tracks = [];
 			tracktags.each(function(index, track) {
-				
+
 				track = $(track);
-				
+
 				t.tracks.push({
 					srclang: (track.attr('srclang')) ? track.attr('srclang').toLowerCase() : '',
 					src: track.attr('src'),
@@ -1047,13 +1072,20 @@ if (typeof jQuery != 'undefined') {
 			this.setControlsSize();
 		},
 		play: function() {
+			this.load();
 			this.media.play();
 		},
 		pause: function() {
-			this.media.pause();
+			try {
+				this.media.pause();
+			} catch (e) {}
 		},
 		load: function() {
-			this.media.load();
+			if (!this.isLoaded) {
+				this.media.load();
+			}
+
+			this.isLoaded = true;
 		},
 		setMuted: function(muted) {
 			this.media.setMuted(muted);
@@ -1075,7 +1107,7 @@ if (typeof jQuery != 'undefined') {
 		},
 		remove: function() {
 			var t = this, featureIndex, feature;
-			
+
 			// invoke features cleanup
 			for (featureIndex in t.options.features) {
 				feature = t.options.features[featureIndex];
@@ -1085,37 +1117,34 @@ if (typeof jQuery != 'undefined') {
 					} catch (e) {
 						// TODO: report control error
 						//throw e;
-						//console.log('error building ' + feature);
-						//console.log(e);
+						//
+						//
 					}
 				}
 			}
 
-			if (t.media.pluginType === 'native') {
+			// grab video and put it back in place
+			if (!t.isDynamic) {
 				t.$media.prop('controls', true);
+				// detach events from the video
+				// TODO: detach event listeners better than this;
+				//       also detach ONLY the events attached by this plugin!
+				t.$node.clone().show().insertBefore(t.container);
+				t.$node.remove();
 			} else {
-				t.media.remove();
+				t.$node.insertBefore(t.container);
 			}
-			
-			// grab video and put it back in place
-			if (!t.isDynamic) {
-				if (t.media.pluginType === 'native') {
-					// detach events from the video
-					// TODO: detach event listeners better than this;
-					//       also detach ONLY the events attached by this plugin!
-					//t.$node.clone().insertBefore(t.container);
-					//t.$node.remove();
-				}
-				/*else*/ t.$node.insertBefore(t.container)
+
+			if (t.media.pluginType !== 'native') {
+				t.media.remove();
 			}
 
-			// Remove the player from the mejs.players array so that pauseOtherPlayers doesn't blow up when trying to pause a non existance flash api.
-			mejs.players.splice( $.inArray( t, mejs.players ), 1);
-			
+			// Remove the player from the mejs.players object so that pauseOtherPlayers doesn't blow up when trying to pause a non existance flash api.
+			delete mejs.players[t.id];
+
 			t.container.remove();
 			t.globalUnbind();
 			delete t.node.player;
-			delete mejs.players[t.id];
 		}
 	};
 
@@ -1126,7 +1155,14 @@ if (typeof jQuery != 'undefined') {
 			// add player ID as an event namespace so it's easier to unbind them all later
 			var ret = {d: [], w: []};
 			$.each((events || '').split(' '), function(k, v){
-				ret[rwindow.test(v) ? 'w' : 'd'].push(v + '.' + id);
+				var eventname = v + '.' + id;
+				if (eventname.indexOf('.') === 0) {
+					ret.d.push(eventname);
+					ret.w.push(eventname);
+				}
+				else {
+					ret[rwindow.test(v) ? 'w' : 'd'].push(eventname);
+				}
 			});
 			ret.d = ret.d.join(' ');
 			ret.w = ret.w.join(' ');
@@ -1168,12 +1204,12 @@ if (typeof jQuery != 'undefined') {
 			return this;
 		};
 	}
-	
+
 	$(document).ready(function() {
 		// auto enable using JSON attribute
 		$('.mejs-player').mediaelementplayer();
 	});
-	
+
 	// push out to window
 	window.MediaElementPlayer = mejs.MediaElementPlayer;
 
@@ -1182,7 +1218,7 @@ if (typeof jQuery != 'undefined') {
 (function($) {
 
 	$.extend(mejs.MepDefaults, {
-		playpauseText: 'Play/Pause'
+		playpauseText: mejs.i18n.t('Play/Pause')
 	});
 
 	// PLAY/pause BUTTON
@@ -1192,7 +1228,7 @@ if (typeof jQuery != 'undefined') {
 				t = this,
 				play = 
 				$('<div class="mejs-button mejs-playpause-button mejs-play" >' +
-					'<button type="button" aria-controls="' + t.id + '" title="' + t.options.playpauseText + '"></button>' +
+					'<button type="button" aria-controls="' + t.id + '" title="' + t.options.playpauseText + '" aria-label="' + t.options.playpauseText + '"></button>' +
 				'</div>')
 				.appendTo(controls)
 				.click(function(e) {
@@ -1225,6 +1261,7 @@ if (typeof jQuery != 'undefined') {
 	});
 	
 })(mejs.$);
+
 (function($) {
 
 	$.extend(mejs.MepDefaults, {
@@ -1237,7 +1274,7 @@ if (typeof jQuery != 'undefined') {
 			var t = this,
 				stop = 
 				$('<div class="mejs-button mejs-stop-button mejs-stop">' +
-					'<button type="button" aria-controls="' + t.id + '" title="' + t.options.stopText + '"></button>' +
+					'<button type="button" aria-controls="' + t.id + '" title="' + t.options.stopText + '" aria-label="' + t.options.stopText + '"></button>' +
 				'</div>')
 				.appendTo(controls)
 				.click(function() {
@@ -1258,6 +1295,7 @@ if (typeof jQuery != 'undefined') {
 	});
 	
 })(mejs.$);
+
 (function($) {
 	// progress/loaded bar
 	$.extend(MediaElementPlayer.prototype, {
@@ -1437,7 +1475,7 @@ if (typeof jQuery != 'undefined') {
 	// options
 	$.extend(mejs.MepDefaults, {
 		duration: -1,
-		timeAndDurationSeparator: ' <span> | </span> '
+		timeAndDurationSeparator: '<span> | </span>'
 	});
 
 
@@ -1516,10 +1554,11 @@ if (typeof jQuery != 'undefined') {
 	});
 
 })(mejs.$);
+
 (function($) {
 
 	$.extend(mejs.MepDefaults, {
-		muteText: 'Mute Toggle',
+		muteText: mejs.i18n.t('Mute Toggle'),
 		hideVolumeOnTouchDevices: true,
 		
 		audioVolume: 'horizontal',
@@ -1539,7 +1578,7 @@ if (typeof jQuery != 'undefined') {
 				
 				// horizontal version
 				$('<div class="mejs-button mejs-volume-button mejs-mute">'+
-					'<button type="button" aria-controls="' + t.id + '" title="' + t.options.muteText + '"></button>'+
+					'<button type="button" aria-controls="' + t.id + '" title="' + t.options.muteText + '" aria-label="' + t.options.muteText + '"></button>'+
 				'</div>' +
 				'<div class="mejs-horizontal-volume-slider">'+ // outer background
 					'<div class="mejs-horizontal-volume-total"></div>'+ // line background
@@ -1551,7 +1590,7 @@ if (typeof jQuery != 'undefined') {
 				
 				// vertical version
 				$('<div class="mejs-button mejs-volume-button mejs-mute">'+
-					'<button type="button" aria-controls="' + t.id + '" title="' + t.options.muteText + '"></button>'+
+					'<button type="button" aria-controls="' + t.id + '" title="' + t.options.muteText + '" aria-label="' + t.options.muteText + '"></button>'+
 					'<div class="mejs-volume-slider">'+ // outer background
 						'<div class="mejs-volume-total"></div>'+ // line background
 						'<div class="mejs-volume-current"></div>'+ // current volume
@@ -1756,8 +1795,6 @@ if (typeof jQuery != 'undefined') {
 
 		isNativeFullScreen: false,
 
-		docStyleOverflow: null,
-
 		isInIframe: false,
 
 		buildfullscreen: function(player, controls, layers, media) {
@@ -1772,16 +1809,17 @@ if (typeof jQuery != 'undefined') {
 
 				// chrome doesn't alays fire this in an iframe
 				var func = function(e) {
-
-					if (mejs.MediaFeatures.isFullScreen()) {
-						player.isNativeFullScreen = true;
-						// reset the controls once we are fully in full screen
-						player.setControlsSize();
-					} else {
-						player.isNativeFullScreen = false;
-						// when a user presses ESC
-						// make sure to put the player back into place
-						player.exitFullScreen();
+					if (player.isFullScreen) {
+						if (mejs.MediaFeatures.isFullScreen()) {
+							player.isNativeFullScreen = true;
+							// reset the controls once we are fully in full screen
+							player.setControlsSize();
+						} else {
+							player.isNativeFullScreen = false;
+							// when a user presses ESC
+							// make sure to put the player back into place
+							player.exitFullScreen();
+						}
 					}
 				};
 
@@ -1798,7 +1836,7 @@ if (typeof jQuery != 'undefined') {
 				container = player.container,
 				fullscreenBtn =
 					$('<div class="mejs-button mejs-fullscreen-button">' +
-						'<button type="button" aria-controls="' + t.id + '" title="' + t.options.fullscreenText + '"></button>' +
+						'<button type="button" aria-controls="' + t.id + '" title="' + t.options.fullscreenText + '" aria-label="' + t.options.fullscreenText + '"></button>' +
 					'</div>')
 					.appendTo(controls);
 
@@ -1835,7 +1873,7 @@ if (typeof jQuery != 'undefined') {
 							return !!supports;
 						})();
 
-					//console.log('supportsPointerEvents', supportsPointerEvents);
+					//
 
 					if (supportsPointerEvents && !mejs.MediaFeatures.isOpera) { // opera doesn't allow this :(
 
@@ -1852,89 +1890,116 @@ if (typeof jQuery != 'undefined') {
 							restoreControls = function() {
 								if (fullscreenIsDisabled) {
 									// hide the hovers
-									videoHoverDiv.hide();
-									controlsLeftHoverDiv.hide();
-									controlsRightHoverDiv.hide();
+									for (var i in hoverDivs) {
+										hoverDivs[i].hide();
+									}
 
 									// restore the control bar
 									fullscreenBtn.css('pointer-events', '');
 									t.controls.css('pointer-events', '');
 
+									// prevent clicks from pausing video
+									t.media.removeEventListener('click', t.clickToPlayPauseCallback);
+
 									// store for later
 									fullscreenIsDisabled = false;
 								}
 							},
-							videoHoverDiv = $('<div class="mejs-fullscreen-hover" />').appendTo(t.container).mouseover(restoreControls),
-							controlsLeftHoverDiv = $('<div class="mejs-fullscreen-hover"  />').appendTo(t.container).mouseover(restoreControls),
-							controlsRightHoverDiv = $('<div class="mejs-fullscreen-hover"  />').appendTo(t.container).mouseover(restoreControls),
+							hoverDivs = {},
+							hoverDivNames = ['top', 'left', 'right', 'bottom'],
+							i, len,
 							positionHoverDivs = function() {
-								var style = {position: 'absolute', top: 0, left: 0}; //, backgroundColor: '#f00'};
-								videoHoverDiv.css(style);
-								controlsLeftHoverDiv.css(style);
-								controlsRightHoverDiv.css(style);
+								var fullScreenBtnOffsetLeft = fullscreenBtn.offset().left - t.container.offset().left,
+									fullScreenBtnOffsetTop = fullscreenBtn.offset().top - t.container.offset().top,
+									fullScreenBtnWidth = fullscreenBtn.outerWidth(true),
+									fullScreenBtnHeight = fullscreenBtn.outerHeight(true),
+									containerWidth = t.container.width(),
+									containerHeight = t.container.height();
+
+								for (i in hoverDivs) {
+									hoverDivs[i].css({position: 'absolute', top: 0, left: 0}); //, backgroundColor: '#f00'});
+								}
 
 								// over video, but not controls
-								videoHoverDiv
-									.width( t.container.width() )
-									.height( t.container.height() - t.controls.height() );
+								hoverDivs['top']
+									.width( containerWidth )
+									.height( fullScreenBtnOffsetTop );
 
 								// over controls, but not the fullscreen button
-								var fullScreenBtnOffset = fullscreenBtn.offset().left - t.container.offset().left;
-									fullScreenBtnWidth = fullscreenBtn.outerWidth(true);
-
-								controlsLeftHoverDiv
-									.width( fullScreenBtnOffset )
-									.height( t.controls.height() )
-									.css({top: t.container.height() - t.controls.height()});
+								hoverDivs['left']
+									.width( fullScreenBtnOffsetLeft )
+									.height( fullScreenBtnHeight )
+									.css({top: fullScreenBtnOffsetTop});
 
 								// after the fullscreen button
-								controlsRightHoverDiv
-									.width( t.container.width() - fullScreenBtnOffset - fullScreenBtnWidth )
-									.height( t.controls.height() )
-									.css({top: t.container.height() - t.controls.height(),
-										 left: fullScreenBtnOffset + fullScreenBtnWidth});
+								hoverDivs['right']
+									.width( containerWidth - fullScreenBtnOffsetLeft - fullScreenBtnWidth )
+									.height( fullScreenBtnHeight )
+									.css({top: fullScreenBtnOffsetTop,
+										 left: fullScreenBtnOffsetLeft + fullScreenBtnWidth});
+
+								// under the fullscreen button
+								hoverDivs['bottom']
+									.width( containerWidth )
+									.height( containerHeight - fullScreenBtnHeight - fullScreenBtnOffsetTop )
+									.css({top: fullScreenBtnOffsetTop + fullScreenBtnHeight});
 							};
 
 						t.globalBind('resize', function() {
 							positionHoverDivs();
 						});
 
+						for (i = 0, len = hoverDivNames.length; i < len; i++) {
+							hoverDivs[hoverDivNames[i]] = $('<div class="mejs-fullscreen-hover" />').appendTo(t.container).mouseover(restoreControls).hide();
+						}
+
 						// on hover, kill the fullscreen button's HTML handling, allowing clicks down to Flash
-						fullscreenBtn
-							.mouseover(function() {
+						fullscreenBtn.on('mouseover',function() {
 
-								if (!t.isFullScreen) {
+							if (!t.isFullScreen) {
 
-									var buttonPos = fullscreenBtn.offset(),
-										containerPos = player.container.offset();
+								var buttonPos = fullscreenBtn.offset(),
+									containerPos = player.container.offset();
 
-									// move the button in Flash into place
-									media.positionFullscreenButton(buttonPos.left - containerPos.left, buttonPos.top - containerPos.top, false);
+								// move the button in Flash into place
+								media.positionFullscreenButton(buttonPos.left - containerPos.left, buttonPos.top - containerPos.top, false);
 
-									// allows click through
-									fullscreenBtn.css('pointer-events', 'none');
-									t.controls.css('pointer-events', 'none');
+								// allows click through
+								fullscreenBtn.css('pointer-events', 'none');
+								t.controls.css('pointer-events', 'none');
 
-									// show the divs that will restore things
-									videoHoverDiv.show();
-									controlsRightHoverDiv.show();
-									controlsLeftHoverDiv.show();
-									positionHoverDivs();
+								// restore click-to-play
+								t.media.addEventListener('click', t.clickToPlayPauseCallback);
 
-									fullscreenIsDisabled = true;
+								// show the divs that will restore things
+								for (i in hoverDivs) {
+									hoverDivs[i].show();
 								}
 
-							});
+								positionHoverDivs();
+
+								fullscreenIsDisabled = true;
+							}
+
+						});
 
 						// restore controls anytime the user enters or leaves fullscreen
 						media.addEventListener('fullscreenchange', function(e) {
+							t.isFullScreen = !t.isFullScreen;
+							// don't allow plugin click to pause video - messes with
+							// plugin's controls
+							if (t.isFullScreen) {
+								t.media.removeEventListener('click', t.clickToPlayPauseCallback);
+							} else {
+								t.media.addEventListener('click', t.clickToPlayPauseCallback);
+							}
 							restoreControls();
 						});
 
 
 						// the mouseout event doesn't work on the fullscren button, because we already killed the pointer-events
 						// so we use the document.mousemove event to restore controls when the mouse moves outside the fullscreen button
-						/*
+
 						t.globalBind('mousemove', function(e) {
 
 							// if the mouse is anywhere but the fullsceen button, then restore it all
@@ -1954,7 +2019,7 @@ if (typeof jQuery != 'undefined') {
 								}
 							}
 						});
-						*/
+
 
 
 					} else {
@@ -1962,7 +2027,7 @@ if (typeof jQuery != 'undefined') {
 						// the hover state will show the fullscreen button in Flash to hover up and click
 
 						fullscreenBtn
-							.mouseover(function() {
+							.on('mouseover', function() {
 
 								if (hideTimeout !== null) {
 									clearTimeout(hideTimeout);
@@ -1975,7 +2040,7 @@ if (typeof jQuery != 'undefined') {
 								media.positionFullscreenButton(buttonPos.left - containerPos.left, buttonPos.top - containerPos.top, true);
 
 							})
-							.mouseout(function() {
+							.on('mouseout', function() {
 
 								if (hideTimeout !== null) {
 									clearTimeout(hideTimeout);
@@ -2005,6 +2070,8 @@ if (typeof jQuery != 'undefined') {
 			player.exitFullScreen();
 		},
 
+        containerSizeTimeout: null,
+
 		enterFullScreen: function() {
 
 			var t = this;
@@ -2016,10 +2083,8 @@ if (typeof jQuery != 'undefined') {
 				return;
 			}
 
-			// store overflow
-			docStyleOverflow = document.documentElement.style.overflow;
 			// set it to not show scroll bars so 100% will work
-			document.documentElement.style.overflow = 'hidden';
+            $(document.documentElement).addClass('mejs-fullscreen');
 
 			// store sizing
 			normalHeight = t.container.height();
@@ -2097,13 +2162,13 @@ if (typeof jQuery != 'undefined') {
 			// Only needed for safari 5.1 native full screen, can cause display issues elsewhere
 			// Actually, it seems to be needed for IE8, too
 			//if (mejs.MediaFeatures.hasTrueNativeFullScreen) {
-				setTimeout(function() {
+				t.containerSizeTimeout = setTimeout(function() {
 					t.container.css({width: '100%', height: '100%'});
 					t.setControlsSize();
 				}, 500);
 			//}
 
-			if (t.pluginType === 'native') {
+			if (t.media.pluginType === 'native') {
 				t.$media
 					.width('100%')
 					.height('100%');
@@ -2135,6 +2200,9 @@ if (typeof jQuery != 'undefined') {
 
 			var t = this;
 
+            // Prevent container from attempting to stretch a second time
+            clearTimeout(t.containerSizeTimeout);
+
 			// firefox can't adjust plugins
 			if (t.media.pluginType !== 'native' && mejs.MediaFeatures.isFirefox) {
 				t.media.setFullscreen(false);
@@ -2148,7 +2216,7 @@ if (typeof jQuery != 'undefined') {
 			}
 
 			// restore scroll bars to document
-			document.documentElement.style.overflow = docStyleOverflow;
+            $(document.documentElement).removeClass('mejs-fullscreen');
 
 			t.container
 				.removeClass('mejs-container-fullscreen')
@@ -2156,12 +2224,12 @@ if (typeof jQuery != 'undefined') {
 				.height(normalHeight);
 				//.css({position: '', left: '', top: '', right: '', bottom: '', overflow: 'inherit', width: normalWidth + 'px', height: normalHeight + 'px', 'z-index': 1});
 
-			if (t.pluginType === 'native') {
+			if (t.media.pluginType === 'native') {
 				t.$media
 					.width(normalWidth)
 					.height(normalHeight);
 			} else {
-				t.container.find('object embed')
+				t.container.find('.mejs-shim')
 					.width(normalWidth)
 					.height(normalHeight);
 
@@ -2190,7 +2258,7 @@ if (typeof jQuery != 'undefined') {
 		// this will automatically turn on a <track>
 		startLanguage: '',
 
-		tracksText: 'Captions/Subtitles',
+		tracksText: mejs.i18n.t('Captions/Subtitles'),
 		
 		// option to remove the [cc] button when no <track kind="subtitles"> are present
 		hideCaptionsButtonWhenEmpty: true,
@@ -2207,9 +2275,6 @@ if (typeof jQuery != 'undefined') {
 		hasChapters: false,
 
 		buildtracks: function(player, controls, layers, media) {
-			if (!player.isVideo)
-				return;
-
 			if (player.tracks.length == 0)
 				return;
 
@@ -2217,6 +2282,11 @@ if (typeof jQuery != 'undefined') {
 				i, 
 				options = '';
 
+			if (t.domNode.textTracks) { // if browser will do native captions, prefer mejs captions, loop through tracks and hide
+				for (var i = t.domNode.textTracks.length - 1; i >= 0; i--) {
+					t.domNode.textTracks[i].mode = "hidden";
+				}
+			}
 			player.chapters = 
 					$('<div class="mejs-chapters mejs-layer"></div>')
 						.prependTo(layers).hide();
@@ -2226,12 +2296,12 @@ if (typeof jQuery != 'undefined') {
 			player.captionsText = player.captions.find('.mejs-captions-text');
 			player.captionsButton = 
 					$('<div class="mejs-button mejs-captions-button">'+
-						'<button type="button" aria-controls="' + t.id + '" title="' + t.options.tracksText + '"></button>'+
+						'<button type="button" aria-controls="' + t.id + '" title="' + t.options.tracksText + '" aria-label="' + t.options.tracksText + '"></button>'+
 						'<div class="mejs-captions-selector">'+
 							'<ul>'+
 								'<li>'+
 									'<input type="radio" name="' + player.id + '_captions" id="' + player.id + '_captions_none" value="none" checked="checked" />' +
-									'<label for="' + player.id + '_captions_none">None</label>'+
+									'<label for="' + player.id + '_captions_none">' + mejs.i18n.t('None') +'</label>'+
 								'</li>'	+
 							'</ul>'+
 						'</div>'+
@@ -2562,7 +2632,7 @@ if (typeof jQuery != 'undefined') {
 			
 				if (!img.is(':visible') && !img.is(':animated')) {
 				
-					console.log('showing existing slide');			
+					//			
 					
 					img.fadeIn()
 						.siblings(':visible')
@@ -2879,9 +2949,9 @@ $.extend(mejs.MepDefaults,
 					return null;
 			
 				if (player.isFullScreen) {
-					return "Turn off Fullscreen";
+					return mejs.i18n.t('Turn off Fullscreen');
 				} else {
-					return "Go Fullscreen";
+					return mejs.i18n.t('Go Fullscreen');
 				}
 			},
 			click: function(player) {
@@ -2897,9 +2967,9 @@ $.extend(mejs.MepDefaults,
 		{ 
 			render: function(player) {
 				if (player.media.muted) {
-					return "Unmute";
+					return mejs.i18n.t('Unmute');
 				} else {
-					return "Mute";
+					return mejs.i18n.t('Mute');
 				}
 			},
 			click: function(player) {
@@ -2918,7 +2988,7 @@ $.extend(mejs.MepDefaults,
 		// demo of simple download video
 		{ 
 			render: function(player) {
-				return "Download Video";
+				return mejs.i18n.t('Download Video');
 			},
 			click: function(player) {
 				window.location.href = player.media.currentSrc;
@@ -2949,7 +3019,7 @@ $.extend(mejs.MepDefaults,
 			});	
 			player.contextMenu.bind('mouseleave', function() {
 
-				//console.log('context hover out');
+				//
 				player.startContextMenuTimer();
 				
 			});		
@@ -2969,7 +3039,7 @@ $.extend(mejs.MepDefaults,
 		
 		contextMenuTimeout: null,
 		startContextMenuTimer: function() {
-			//console.log('startContextMenuTimer');
+			//
 			
 			var t = this;
 			
@@ -2983,7 +3053,7 @@ $.extend(mejs.MepDefaults,
 		killContextMenuTimer: function() {
 			var timer = this.contextMenuTimer;
 			
-			//console.log('killContextMenuTimer', timer);
+			//
 			
 			if (timer != null) {				
 				clearTimeout(timer);