gyorgy@0: /*!
gyorgy@0:  * MediaElementPlayer
gyorgy@0:  * http://mediaelementjs.com/
gyorgy@0:  *
gyorgy@0:  * Creates a controller bar for HTML5 <video> add <audio> tags
gyorgy@0:  * using jQuery and MediaElement.js (HTML5 Flash/Silverlight wrapper)
gyorgy@0:  *
gyorgy@0:  * Copyright 2010-2011, John Dyer (http://j.hn/)
gyorgy@0:  * Dual licensed under the MIT or GPL Version 2 licenses.
gyorgy@0:  *
gyorgy@0:  */
gyorgy@0: if (typeof jQuery != 'undefined') {
gyorgy@0: 	mejs.$ = jQuery;
gyorgy@0: } else if (typeof ender != 'undefined') {
gyorgy@0: 	mejs.$ = ender;
gyorgy@0: }
gyorgy@0: (function ($) {
gyorgy@0: 
gyorgy@0: 	// default player values
gyorgy@0: 	mejs.MepDefaults = {
gyorgy@0: 		// url to poster (to fix iOS 3.x)
gyorgy@0: 		poster: '',
gyorgy@0: 		// default if the <video width> is not specified
gyorgy@0: 		defaultVideoWidth: 480,
gyorgy@0: 		// default if the <video height> is not specified
gyorgy@0: 		defaultVideoHeight: 270,
gyorgy@0: 		// if set, overrides <video width>
gyorgy@0: 		videoWidth: -1,
gyorgy@0: 		// if set, overrides <video height>
gyorgy@0: 		videoHeight: -1,
gyorgy@0: 		// width of audio player
gyorgy@0: 		audioWidth: 400,
gyorgy@0: 		// height of audio player
gyorgy@0: 		audioHeight: 30,
gyorgy@0: 		// initial volume when the player starts (overrided by user cookie)
gyorgy@0: 		startVolume: 0.8,
gyorgy@0: 		// useful for <audio> player loops
gyorgy@0: 		loop: false,
gyorgy@0: 		// resize to media dimensions
gyorgy@0: 		enableAutosize: true,
gyorgy@0: 		// forces the hour marker (##:00:00)
gyorgy@0: 		alwaysShowHours: false,
gyorgy@0: 		// Hide controls when playing and mouse is not over the video
gyorgy@0: 		alwaysShowControls: false,
gyorgy@0: 		// force iPad's native controls
gyorgy@0: 		iPadUseNativeControls: true,
gyorgy@0: 		// features to show
gyorgy@0: 		features: ['playpause','current','progress','duration','tracks','volume','fullscreen']		
gyorgy@0: 	};
gyorgy@0: 
gyorgy@0: 	mejs.mepIndex = 0;
gyorgy@0: 
gyorgy@0: 	// wraps a MediaElement object in player controls
gyorgy@0: 	mejs.MediaElementPlayer = function(node, o) {
gyorgy@0: 		// enforce object, even without "new" (via John Resig)
gyorgy@0: 		if ( !(this instanceof mejs.MediaElementPlayer) ) {
gyorgy@0: 			return new mejs.MediaElementPlayer(node, o);
gyorgy@0: 		} 
gyorgy@0: 
gyorgy@0: 		var
gyorgy@0: 			t = this,
gyorgy@0: 			mf = mejs.MediaFeatures;
gyorgy@0: 			
gyorgy@0: 		// create options
gyorgy@0: 		t.options = $.extend({},mejs.MepDefaults,o);		
gyorgy@0: 		
gyorgy@0: 		// these will be reset after the MediaElement.success fires
gyorgy@0: 		t.$media = t.$node = $(node);
gyorgy@0: 		t.node = t.media = t.$media[0];		
gyorgy@0: 		
gyorgy@0: 		// check for existing player
gyorgy@0: 		if (typeof t.node.player != 'undefined') {
gyorgy@0: 			return t.node.player;
gyorgy@0: 		} else {
gyorgy@0: 			// attach player to DOM node for reference
gyorgy@0: 			t.node.player = t;
gyorgy@0: 		}
gyorgy@0: 		
gyorgy@0: 		t.isVideo = (t.media.tagName.toLowerCase() === 'video');
gyorgy@0: 				
gyorgy@0: 		/* FUTURE WORK = create player without existing <video> or <audio> node
gyorgy@0: 		
gyorgy@0: 		// if not a video or audio tag, then we'll dynamically create it
gyorgy@0: 		if (tagName == 'video' || tagName == 'audio') {
gyorgy@0: 			t.$media = $($node);
gyorgy@0: 		} else if (o.tagName !== '' && o.src !== '') {
gyorgy@0: 			// create a new node
gyorgy@0: 			if (o.mode == 'auto' || o.mode == 'native') {
gyorgy@0: 				
gyorgy@0: 				$media = $(o.tagName);
gyorgy@0: 				if (typeof o.src == 'string') {
gyorgy@0: 					$media.attr('src',o.src);
gyorgy@0: 				} else if (typeof o.src == 'object') {
gyorgy@0: 					// create source nodes
gyorgy@0: 					for (var x in o.src) {
gyorgy@0: 						$media.append($('<source src="' + o.src[x].src + '" type="' + o.src[x].type + '" />'));
gyorgy@0: 					}
gyorgy@0: 				}
gyorgy@0: 				if (o.type != '') {
gyorgy@0: 					$media.attr('type',o.type);
gyorgy@0: 				}
gyorgy@0: 				if (o.poster != '') {
gyorgy@0: 					$media.attr('poster',o.poster);
gyorgy@0: 				}
gyorgy@0: 				if (o.videoWidth > 0) {
gyorgy@0: 					$media.attr('width',o.videoWidth);
gyorgy@0: 				}
gyorgy@0: 				if (o.videoHeight > 0) {
gyorgy@0: 					$media.attr('height',o.videoHeight);
gyorgy@0: 				}
gyorgy@0: 				
gyorgy@0: 				$node.clear();
gyorgy@0: 				$node.append($media);
gyorgy@0: 				t.$media = $media;
gyorgy@0: 			} else if (o.mode == 'shim') {
gyorgy@0: 				$media = $();
gyorgy@0: 				// doesn't want a media node
gyorgy@0: 				// let MediaElement object handle this
gyorgy@0: 			}
gyorgy@0: 		} else {
gyorgy@0: 			// fail?
gyorgy@0: 			return;
gyorgy@0: 		}	
gyorgy@0: 		*/
gyorgy@0: 		
gyorgy@0: 		t.init();
gyorgy@0: 
gyorgy@0: 		return t;
gyorgy@0: 	};
gyorgy@0: 
gyorgy@0: 	// actual player
gyorgy@0: 	mejs.MediaElementPlayer.prototype = {
gyorgy@0: 		init: function() {
gyorgy@0: 
gyorgy@0: 			var
gyorgy@0: 				t = this,
gyorgy@0: 				mf = mejs.MediaFeatures,
gyorgy@0: 				// options for MediaElement (shim)
gyorgy@0: 				meOptions = $.extend(true, {}, t.options, {
gyorgy@0: 					success: function(media, domNode) { t.meReady(media, domNode); },
gyorgy@0: 					error: function(e) { t.handleError(e);}
gyorgy@0: 				});
gyorgy@0: 		
gyorgy@0: 		
gyorgy@0: 			// use native controls in iPad, iPhone, and Android	
gyorgy@0: 			if ((mf.isiPad && t.options.iPadUseNativeControls) || mf.isiPhone) {
gyorgy@0: 				// add controls and stop
gyorgy@0: 				t.$media.attr('controls', 'controls');
gyorgy@0: 
gyorgy@0: 				// attempt to fix iOS 3 bug
gyorgy@0: 				t.$media.removeAttr('poster');
gyorgy@0: 
gyorgy@0: 				// override Apple's autoplay override for iPads
gyorgy@0: 				if (mf.isiPad && t.media.getAttribute('autoplay') !== null) {
gyorgy@0: 					t.media.load();
gyorgy@0: 					t.media.play();
gyorgy@0: 				}
gyorgy@0: 					
gyorgy@0: 			} else if (mf.isAndroid && t.isVideo) {
gyorgy@0: 				
gyorgy@0: 				// leave default player
gyorgy@0: 
gyorgy@0: 			} else {
gyorgy@0: 
gyorgy@0: 				// DESKTOP: use MediaElementPlayer controls
gyorgy@0: 				
gyorgy@0: 				// remove native controls 			
gyorgy@0: 				t.$media.removeAttr('controls');					
gyorgy@0: 				
gyorgy@0: 				// unique ID
gyorgy@0: 				t.id = 'mep_' + mejs.mepIndex++;
gyorgy@0: 
gyorgy@0: 				// build container
gyorgy@0: 				t.container =
gyorgy@0: 					$('<div id="' + t.id + '" class="mejs-container">'+
gyorgy@0: 						'<div class="mejs-inner">'+
gyorgy@0: 							'<div class="mejs-mediaelement"></div>'+
gyorgy@0: 							'<div class="mejs-layers"></div>'+
gyorgy@0: 							'<div class="mejs-controls"></div>'+
gyorgy@0: 							'<div class="mejs-clear"></div>'+
gyorgy@0: 						'</div>' +
gyorgy@0: 					'</div>')
gyorgy@0: 					.addClass(t.$media[0].className)
gyorgy@0: 					.insertBefore(t.$media);
gyorgy@0: 
gyorgy@0: 				// move the <video/video> tag into the right spot
gyorgy@0: 				t.container.find('.mejs-mediaelement').append(t.$media);
gyorgy@0: 
gyorgy@0: 				// find parts
gyorgy@0: 				t.controls = t.container.find('.mejs-controls');
gyorgy@0: 				t.layers = t.container.find('.mejs-layers');
gyorgy@0: 
gyorgy@0: 				// determine the size
gyorgy@0: 				if (t.isVideo) {
gyorgy@0: 					// priority = videoWidth (forced), width attribute, defaultVideoWidth
gyorgy@0: 					t.width = (t.options.videoWidth > 0) ? t.options.videoWidth : (t.$media[0].getAttribute('width') !== null) ? t.$media.attr('width') : t.options.defaultVideoWidth;
gyorgy@0: 					t.height = (t.options.videoHeight > 0) ? t.options.videoHeight : (t.$media[0].getAttribute('height') !== null) ? t.$media.attr('height') : t.options.defaultVideoHeight;
gyorgy@0: 				} else {
gyorgy@0: 					t.width = t.options.audioWidth;
gyorgy@0: 					t.height = t.options.audioHeight;
gyorgy@0: 				}
gyorgy@0: 
gyorgy@0: 				// set the size, while we wait for the plugins to load below
gyorgy@0: 				t.setPlayerSize(t.width, t.height);
gyorgy@0: 				
gyorgy@0: 				// create MediaElementShim
gyorgy@0: 				meOptions.pluginWidth = t.height;
gyorgy@0: 				meOptions.pluginHeight = t.width;				
gyorgy@0: 			}
gyorgy@0: 
gyorgy@0: 			// create MediaElement shim
gyorgy@0: 			mejs.MediaElement(t.$media[0], meOptions);
gyorgy@0: 		},
gyorgy@0: 
gyorgy@0: 		// Sets up all controls and events
gyorgy@0: 		meReady: function(media, domNode) {			
gyorgy@0: 		
gyorgy@0: 		
gyorgy@0: 			var t = this,
gyorgy@0: 				mf = mejs.MediaFeatures,
gyorgy@0: 				f,
gyorgy@0: 				feature;
gyorgy@0: 
gyorgy@0: 			// make sure it can't create itself again if a plugin reloads
gyorgy@0: 			if (t.created)
gyorgy@0: 				return;
gyorgy@0: 			else
gyorgy@0: 				t.created = true;			
gyorgy@0: 
gyorgy@0: 			t.media = media;
gyorgy@0: 			t.domNode = domNode;
gyorgy@0: 			
gyorgy@0: 			if (!mf.isiPhone && !mf.isAndroid && !(mf.isiPad && t.options.iPadUseNativeControls)) {				
gyorgy@0: 				
gyorgy@0: 				// two built in features
gyorgy@0: 				t.buildposter(t, t.controls, t.layers, t.media);
gyorgy@0: 				t.buildoverlays(t, t.controls, t.layers, t.media);
gyorgy@0: 
gyorgy@0: 				// grab for use by features
gyorgy@0: 				t.findTracks();
gyorgy@0: 
gyorgy@0: 				// add user-defined features/controls
gyorgy@0: 				for (f in t.options.features) {
gyorgy@0: 					feature = t.options.features[f];
gyorgy@0: 					if (t['build' + feature]) {
gyorgy@0: 						try {
gyorgy@0: 							t['build' + feature](t, t.controls, t.layers, t.media);
gyorgy@0: 						} catch (e) {
gyorgy@0: 							// TODO: report control error
gyorgy@0: 							//throw e;
gyorgy@0: 						}
gyorgy@0: 					}
gyorgy@0: 				}
gyorgy@0: 
gyorgy@0: 				t.container.trigger('controlsready');
gyorgy@0: 				
gyorgy@0: 				// reset all layers and controls
gyorgy@0: 				t.setPlayerSize(t.width, t.height);
gyorgy@0: 				t.setControlsSize();
gyorgy@0: 				
gyorgy@0: 
gyorgy@0: 				// controls fade
gyorgy@0: 				if (t.isVideo) {
gyorgy@0: 					// show/hide controls
gyorgy@0: 					t.container
gyorgy@0: 						.bind('mouseenter', function () {
gyorgy@0: 							if (!t.options.alwaysShowControls) {
gyorgy@0: 								t.controls.css('visibility','visible');
gyorgy@0: 								t.controls.stop(true, true).fadeIn(200);
gyorgy@0: 							}
gyorgy@0: 						})
gyorgy@0: 						.bind('mouseleave', function () {
gyorgy@0: 							if (!t.media.paused && !t.options.alwaysShowControls) {
gyorgy@0: 								t.controls.stop(true, true).fadeOut(200, function() {
gyorgy@0: 									$(this).css('visibility','hidden');
gyorgy@0: 									$(this).css('display','block');
gyorgy@0: 								});
gyorgy@0: 							}
gyorgy@0: 						});
gyorgy@0: 						
gyorgy@0: 					// check for autoplay
gyorgy@0: 					if (t.domNode.getAttribute('autoplay') !== null && !t.options.alwaysShowControls) {
gyorgy@0: 						t.controls.css('visibility','hidden');
gyorgy@0: 					}
gyorgy@0: 
gyorgy@0: 					// resizer
gyorgy@0: 					if (t.options.enableAutosize) {
gyorgy@0: 						t.media.addEventListener('loadedmetadata', function(e) {
gyorgy@0: 							// if the <video height> was not set and the options.videoHeight was not set
gyorgy@0: 							// then resize to the real dimensions
gyorgy@0: 							if (t.options.videoHeight <= 0 && t.domNode.getAttribute('height') === null && !isNaN(e.target.videoHeight)) {
gyorgy@0: 								t.setPlayerSize(e.target.videoWidth, e.target.videoHeight);
gyorgy@0: 								t.setControlsSize();
gyorgy@0: 								t.media.setVideoSize(e.target.videoWidth, e.target.videoHeight);
gyorgy@0: 							}
gyorgy@0: 						}, false);
gyorgy@0: 					}
gyorgy@0: 				}
gyorgy@0: 
gyorgy@0: 				// ended for all
gyorgy@0: 				t.media.addEventListener('ended', function (e) {
gyorgy@0: 					t.media.setCurrentTime(0);
gyorgy@0: 					t.media.pause();
gyorgy@0: 					
gyorgy@0: 					if (t.setProgressRail)
gyorgy@0: 						t.setProgressRail();
gyorgy@0: 					if (t.setCurrentRail)
gyorgy@0: 						t.setCurrentRail();						
gyorgy@0: 
gyorgy@0: 					if (t.options.loop) {
gyorgy@0: 						t.media.play();
gyorgy@0: 					} else if (!t.options.alwaysShowControls) {
gyorgy@0: 						t.controls.css('visibility','visible');
gyorgy@0: 					}
gyorgy@0: 				}, true);
gyorgy@0: 				
gyorgy@0: 				// resize on the first play
gyorgy@0: 				t.media.addEventListener('loadedmetadata', function(e) {
gyorgy@0: 					if (t.updateDuration) {
gyorgy@0: 						t.updateDuration();
gyorgy@0: 					}
gyorgy@0: 					if (t.updateCurrent) {
gyorgy@0: 						t.updateCurrent();
gyorgy@0: 					}
gyorgy@0: 					
gyorgy@0: 					t.setControlsSize();
gyorgy@0: 				}, true);
gyorgy@0: 
gyorgy@0: 
gyorgy@0: 				// webkit has trouble doing this without a delay
gyorgy@0: 				setTimeout(function () {
gyorgy@0: 					t.setControlsSize();
gyorgy@0: 					t.setPlayerSize(t.width, t.height);
gyorgy@0: 				}, 50);
gyorgy@0: 				
gyorgy@0: 			}
gyorgy@0: 
gyorgy@0: 
gyorgy@0: 			if (t.options.success) {
gyorgy@0: 				t.options.success(t.media, t.domNode);
gyorgy@0: 			}
gyorgy@0: 		},
gyorgy@0: 
gyorgy@0: 		handleError: function(e) {
gyorgy@0: 			// Tell user that the file cannot be played
gyorgy@0: 			if (this.options.error) {
gyorgy@0: 				this.options.error(e);
gyorgy@0: 			}
gyorgy@0: 		},
gyorgy@0: 
gyorgy@0: 		setPlayerSize: function(width,height) {
gyorgy@0: 			var t = this;
gyorgy@0: 
gyorgy@0: 			// ie9 appears to need this (jQuery bug?)
gyorgy@0: 			t.width = parseInt(width, 10);
gyorgy@0: 			t.height = parseInt(height, 10);
gyorgy@0: 
gyorgy@0: 			t.container
gyorgy@0: 				.width(t.width)
gyorgy@0: 				.height(t.height);
gyorgy@0: 
gyorgy@0: 			t.layers.children('.mejs-layer')
gyorgy@0: 				.width(t.width)
gyorgy@0: 				.height(t.height);
gyorgy@0: 		},
gyorgy@0: 
gyorgy@0: 		setControlsSize: function() {
gyorgy@0: 			var t = this,
gyorgy@0: 				usedWidth = 0,
gyorgy@0: 				railWidth = 0,
gyorgy@0: 				rail = t.controls.find('.mejs-time-rail'),
gyorgy@0: 				total = t.controls.find('.mejs-time-total'),
gyorgy@0: 				current = t.controls.find('.mejs-time-current'),
gyorgy@0: 				loaded = t.controls.find('.mejs-time-loaded');
gyorgy@0: 				others = rail.siblings();
gyorgy@0: 
gyorgy@0: 			// find the size of all the other controls besides the rail
gyorgy@0: 			others.each(function() {
gyorgy@0: 				if ($(this).css('position') != 'absolute') {
gyorgy@0: 					usedWidth += $(this).outerWidth(true);
gyorgy@0: 				}
gyorgy@0: 			});
gyorgy@0: 			// fit the rail into the remaining space
gyorgy@0: 			railWidth = t.controls.width() - usedWidth - (rail.outerWidth(true) - rail.outerWidth(false));
gyorgy@0: 
gyorgy@0: 			// outer area
gyorgy@0: 			rail.width(railWidth);
gyorgy@0: 			// dark space
gyorgy@0: 			total.width(railWidth - (total.outerWidth(true) - total.width()));
gyorgy@0: 			
gyorgy@0: 			if (t.setProgressRail)
gyorgy@0: 				t.setProgressRail();
gyorgy@0: 			if (t.setCurrentRail)
gyorgy@0: 				t.setCurrentRail();				
gyorgy@0: 		},
gyorgy@0: 
gyorgy@0: 
gyorgy@0: 		buildposter: function(player, controls, layers, media) {
gyorgy@0: 			var poster = 
gyorgy@0: 				$('<div class="mejs-poster mejs-layer">'+
gyorgy@0: 					'<img />'+
gyorgy@0: 				'</div>')
gyorgy@0: 					.appendTo(layers),
gyorgy@0: 				posterUrl = player.$media.attr('poster'),
gyorgy@0: 				posterImg = poster.find('img').width(player.width).height(player.height);
gyorgy@0: 
gyorgy@0: 			// prioriy goes to option (this is useful if you need to support iOS 3.x (iOS completely fails with poster)
gyorgy@0: 			if (player.options.poster != '') {
gyorgy@0: 				posterImg.attr('src',player.options.poster);
gyorgy@0: 			// second, try the real poster
gyorgy@0: 			} else if (posterUrl !== '' && posterUrl != null) {
gyorgy@0: 				posterImg.attr('src',posterUrl);
gyorgy@0: 			} else {
gyorgy@0: 				poster.remove();
gyorgy@0: 			}
gyorgy@0: 
gyorgy@0: 			media.addEventListener('play',function() {
gyorgy@0: 				poster.hide();
gyorgy@0: 			}, false);
gyorgy@0: 		},
gyorgy@0: 
gyorgy@0: 		buildoverlays: function(player, controls, layers, media) {
gyorgy@0: 			if (!player.isVideo)
gyorgy@0: 				return;
gyorgy@0: 
gyorgy@0: 			var 
gyorgy@0: 			loading = 
gyorgy@0: 				$('<div class="mejs-overlay mejs-layer">'+
gyorgy@0: 					'<div class="mejs-overlay-loading"><span></span></div>'+
gyorgy@0: 				'</div>')
gyorgy@0: 				.hide() // start out hidden
gyorgy@0: 				.appendTo(layers),
gyorgy@0: 			error = 
gyorgy@0: 				$('<div class="mejs-overlay mejs-layer">'+
gyorgy@0: 					'<div class="mejs-overlay-error"></div>'+
gyorgy@0: 				'</div>')
gyorgy@0: 				.hide() // start out hidden
gyorgy@0: 				.appendTo(layers),				
gyorgy@0: 				
gyorgy@0: 			// this needs to come last so it's on top
gyorgy@0: 			bigPlay = 
gyorgy@0: 				$('<div class="mejs-overlay mejs-layer mejs-overlay-play">'+
gyorgy@0: 					'<div class="mejs-overlay-button"></div>'+
gyorgy@0: 				'</div>')
gyorgy@0: 				.appendTo(layers)
gyorgy@0: 				.click(function() {
gyorgy@0: 					if (media.paused) {
gyorgy@0: 						media.play();
gyorgy@0: 					} else {
gyorgy@0: 						media.pause();
gyorgy@0: 					}
gyorgy@0: 				});
gyorgy@0: 	
gyorgy@0: 
gyorgy@0: 			// show/hide big play button
gyorgy@0: 			media.addEventListener('play',function() {
gyorgy@0: 				bigPlay.hide();
gyorgy@0: 				error.hide();
gyorgy@0: 			}, false);
gyorgy@0: 			media.addEventListener('pause',function() {
gyorgy@0: 				bigPlay.show();
gyorgy@0: 			}, false);
gyorgy@0: 			
gyorgy@0: 			// show/hide loading			
gyorgy@0: 			media.addEventListener('loadstart',function() {
gyorgy@0: 				// for some reason Chrome is firing this event
gyorgy@0: 				if (mejs.MediaFeatures.isChrome && media.getAttribute && media.getAttribute('preload') === 'none')
gyorgy@0: 					return;
gyorgy@0: 					
gyorgy@0: 				loading.show();
gyorgy@0: 			}, false);	
gyorgy@0: 			media.addEventListener('canplay',function() {
gyorgy@0: 				loading.hide();
gyorgy@0: 			}, false);	
gyorgy@0: 
gyorgy@0: 			// error handling
gyorgy@0: 			media.addEventListener('error',function() {
gyorgy@0: 				loading.hide();
gyorgy@0: 				error.show();
gyorgy@0: 				error.find('mejs-overlay-error').html("Error loading this resource");
gyorgy@0: 			}, false);				
gyorgy@0: 		},
gyorgy@0: 
gyorgy@0: 		findTracks: function() {
gyorgy@0: 			var t = this,
gyorgy@0: 				tracktags = t.$media.find('track');
gyorgy@0: 
gyorgy@0: 			// store for use by plugins
gyorgy@0: 			t.tracks = [];
gyorgy@0: 			tracktags.each(function() {
gyorgy@0: 				t.tracks.push({
gyorgy@0: 					srclang: $(this).attr('srclang').toLowerCase(),
gyorgy@0: 					src: $(this).attr('src'),
gyorgy@0: 					kind: $(this).attr('kind'),
gyorgy@0: 					entries: [],
gyorgy@0: 					isLoaded: false
gyorgy@0: 				});
gyorgy@0: 			});
gyorgy@0: 		},
gyorgy@0: 		changeSkin: function(className) {
gyorgy@0: 			this.container[0].className = 'mejs-container ' + className;
gyorgy@0: 			this.setPlayerSize();
gyorgy@0: 			this.setControlsSize();
gyorgy@0: 		},
gyorgy@0: 		play: function() {
gyorgy@0: 			this.media.play();
gyorgy@0: 		},
gyorgy@0: 		pause: function() {
gyorgy@0: 			this.media.pause();
gyorgy@0: 		},
gyorgy@0: 		load: function() {
gyorgy@0: 			this.media.load();
gyorgy@0: 		},
gyorgy@0: 		setMuted: function(muted) {
gyorgy@0: 			this.media.setMuted(muted);
gyorgy@0: 		},
gyorgy@0: 		setCurrentTime: function(time) {
gyorgy@0: 			this.media.setCurrentTime(time);
gyorgy@0: 		},
gyorgy@0: 		getCurrentTime: function() {
gyorgy@0: 			return this.media.currentTime;
gyorgy@0: 		},
gyorgy@0: 		setVolume: function(volume) {
gyorgy@0: 			this.media.setVolume(volume);
gyorgy@0: 		},
gyorgy@0: 		getVolume: function() {
gyorgy@0: 			return this.media.volume;
gyorgy@0: 		},
gyorgy@0: 		setSrc: function(src) {
gyorgy@0: 			this.media.setSrc(src);
gyorgy@0: 		}
gyorgy@0: 	};
gyorgy@0: 
gyorgy@0: 	// turn into jQuery plugin
gyorgy@0: 	if (typeof jQuery != 'undefined') {
gyorgy@0: 		jQuery.fn.mediaelementplayer = function (options) {
gyorgy@0: 			return this.each(function () {
gyorgy@0: 				new mejs.MediaElementPlayer(this, options);
gyorgy@0: 			});
gyorgy@0: 		};
gyorgy@0: 	}
gyorgy@0: 	
gyorgy@0: 	// push out to window
gyorgy@0: 	window.MediaElementPlayer = mejs.MediaElementPlayer;
gyorgy@0: 
gyorgy@0: })(mejs.$);
gyorgy@0: (function($) {
gyorgy@0: 	// PLAY/pause BUTTON
gyorgy@0: 	MediaElementPlayer.prototype.buildplaypause = function(player, controls, layers, media) {
gyorgy@0: 		var play = 
gyorgy@0: 			$('<div class="mejs-button mejs-playpause-button mejs-play" type="button">' +
gyorgy@0: 				'<button type="button"></button>' +
gyorgy@0: 			'</div>')
gyorgy@0: 			.appendTo(controls)
gyorgy@0: 			.click(function(e) {
gyorgy@0: 				e.preventDefault();
gyorgy@0: 			
gyorgy@0: 				if (media.paused) {
gyorgy@0: 					media.play();
gyorgy@0: 				} else {
gyorgy@0: 					media.pause();
gyorgy@0: 				}
gyorgy@0: 				
gyorgy@0: 				return false;
gyorgy@0: 			});
gyorgy@0: 
gyorgy@0: 		media.addEventListener('play',function() {
gyorgy@0: 			play.removeClass('mejs-play').addClass('mejs-pause');
gyorgy@0: 		}, false);
gyorgy@0: 		media.addEventListener('playing',function() {
gyorgy@0: 			play.removeClass('mejs-play').addClass('mejs-pause');
gyorgy@0: 		}, false);
gyorgy@0: 
gyorgy@0: 
gyorgy@0: 		media.addEventListener('pause',function() {
gyorgy@0: 			play.removeClass('mejs-pause').addClass('mejs-play');
gyorgy@0: 		}, false);
gyorgy@0: 		media.addEventListener('paused',function() {
gyorgy@0: 			play.removeClass('mejs-pause').addClass('mejs-play');
gyorgy@0: 		}, false);
gyorgy@0: 	}
gyorgy@0: 	
gyorgy@0: })(mejs.$);
gyorgy@0: (function($) {
gyorgy@0: 	// STOP BUTTON
gyorgy@0: 	MediaElementPlayer.prototype.buildstop = function(player, controls, layers, media) {
gyorgy@0: 		var stop = 
gyorgy@0: 			$('<div class="mejs-button mejs-stop-button mejs-stop">' +
gyorgy@0: 				'<button type="button"></button>' +
gyorgy@0: 			'</div>')
gyorgy@0: 			.appendTo(controls)
gyorgy@0: 			.click(function() {
gyorgy@0: 				if (!media.paused) {
gyorgy@0: 					media.pause();
gyorgy@0: 				}
gyorgy@0: 				if (media.currentTime > 0) {
gyorgy@0: 					media.setCurrentTime(0);	
gyorgy@0: 					controls.find('.mejs-time-current').width('0px');
gyorgy@0: 					controls.find('.mejs-time-handle').css('left', '0px');
gyorgy@0: 					controls.find('.mejs-time-float-current').html( mejs.Utility.secondsToTimeCode(0) );
gyorgy@0: 					controls.find('.mejs-currenttime').html( mejs.Utility.secondsToTimeCode(0) );					
gyorgy@0: 					layers.find('.mejs-poster').show();
gyorgy@0: 				}
gyorgy@0: 			});
gyorgy@0: 	}
gyorgy@0: 	
gyorgy@0: })(mejs.$);
gyorgy@0: (function($) {
gyorgy@0: 	// progress/loaded bar
gyorgy@0: 	MediaElementPlayer.prototype.buildprogress = function(player, controls, layers, media) {
gyorgy@0: 
gyorgy@0: 		$('<div class="mejs-time-rail">'+
gyorgy@0: 			'<span class="mejs-time-total">'+
gyorgy@0: 				'<span class="mejs-time-loaded"></span>'+
gyorgy@0: 				'<span class="mejs-time-current"></span>'+
gyorgy@0: 				'<span class="mejs-time-handle"></span>'+
gyorgy@0: 				'<span class="mejs-time-float">' + 
gyorgy@0: 					'<span class="mejs-time-float-current">00:00</span>' + 
gyorgy@0: 					'<span class="mejs-time-float-corner"></span>' + 
gyorgy@0: 				'</span>'+
gyorgy@0: 			'</span>'+
gyorgy@0: 		'</div>')
gyorgy@0: 			.appendTo(controls);
gyorgy@0: 
gyorgy@0: 		var 
gyorgy@0: 			t = this,
gyorgy@0: 			total = controls.find('.mejs-time-total'),
gyorgy@0: 			loaded  = controls.find('.mejs-time-loaded'),
gyorgy@0: 			current  = controls.find('.mejs-time-current'),
gyorgy@0: 			handle  = controls.find('.mejs-time-handle'),
gyorgy@0: 			timefloat  = controls.find('.mejs-time-float'),
gyorgy@0: 			timefloatcurrent  = controls.find('.mejs-time-float-current'),
gyorgy@0: 			handleMouseMove = function (e) {
gyorgy@0: 				// mouse position relative to the object
gyorgy@0: 				var x = e.pageX,
gyorgy@0: 					offset = total.offset(),
gyorgy@0: 					width = total.outerWidth(),
gyorgy@0: 					percentage = 0,
gyorgy@0: 					newTime = 0;
gyorgy@0: 
gyorgy@0: 
gyorgy@0: 				if (x > offset.left && x <= width + offset.left && media.duration) {
gyorgy@0: 					percentage = ((x - offset.left) / width);
gyorgy@0: 					newTime = (percentage <= 0.02) ? 0 : percentage * media.duration;
gyorgy@0: 
gyorgy@0: 					// seek to where the mouse is
gyorgy@0: 					if (mouseIsDown) {
gyorgy@0: 						media.setCurrentTime(newTime);
gyorgy@0: 					}
gyorgy@0: 
gyorgy@0: 					// position floating time box
gyorgy@0: 					var pos = x - offset.left;
gyorgy@0: 					timefloat.css('left', pos);
gyorgy@0: 					timefloatcurrent.html( mejs.Utility.secondsToTimeCode(newTime) );
gyorgy@0: 				}
gyorgy@0: 			},
gyorgy@0: 			mouseIsDown = false,
gyorgy@0: 			mouseIsOver = false;
gyorgy@0: 
gyorgy@0: 		// handle clicks
gyorgy@0: 		//controls.find('.mejs-time-rail').delegate('span', 'click', handleMouseMove);
gyorgy@0: 		total
gyorgy@0: 			.bind('mousedown', function (e) {
gyorgy@0: 				mouseIsDown = true;
gyorgy@0: 				handleMouseMove(e);
gyorgy@0: 				return false;
gyorgy@0: 			});
gyorgy@0: 
gyorgy@0: 		controls.find('.mejs-time-rail')
gyorgy@0: 			.bind('mouseenter', function(e) {
gyorgy@0: 				mouseIsOver = true;
gyorgy@0: 			})
gyorgy@0: 			.bind('mouseleave',function(e) {
gyorgy@0: 				mouseIsOver = false;
gyorgy@0: 			});
gyorgy@0: 
gyorgy@0: 		$(document)
gyorgy@0: 			.bind('mouseup', function (e) {
gyorgy@0: 				mouseIsDown = false;
gyorgy@0: 				//handleMouseMove(e);
gyorgy@0: 			})
gyorgy@0: 			.bind('mousemove', function (e) {
gyorgy@0: 				if (mouseIsDown || mouseIsOver) {
gyorgy@0: 					handleMouseMove(e);
gyorgy@0: 				}
gyorgy@0: 			});
gyorgy@0: 
gyorgy@0: 		// loading
gyorgy@0: 		media.addEventListener('progress', function (e) {
gyorgy@0: 			player.setProgressRail(e);
gyorgy@0: 			player.setCurrentRail(e);
gyorgy@0: 		}, false);
gyorgy@0: 
gyorgy@0: 		// current time
gyorgy@0: 		media.addEventListener('timeupdate', function(e) {
gyorgy@0: 			player.setProgressRail(e);
gyorgy@0: 			player.setCurrentRail(e);
gyorgy@0: 		}, false);
gyorgy@0: 		
gyorgy@0: 		
gyorgy@0: 		// store for later use
gyorgy@0: 		t.loaded = loaded;
gyorgy@0: 		t.total = total;
gyorgy@0: 		t.current = current;
gyorgy@0: 		t.handle = handle;
gyorgy@0: 	}
gyorgy@0: 	MediaElementPlayer.prototype.setProgressRail = function(e) {
gyorgy@0: 
gyorgy@0: 		var
gyorgy@0: 			t = this,
gyorgy@0: 			target = (e != undefined) ? e.target : t.media,
gyorgy@0: 			percent = null;			
gyorgy@0: 
gyorgy@0: 		// newest HTML5 spec has buffered array (FF4, Webkit)
gyorgy@0: 		if (target && target.buffered && target.buffered.length > 0 && target.buffered.end && target.duration) {
gyorgy@0: 			// TODO: account for a real array with multiple values (only Firefox 4 has this so far) 
gyorgy@0: 			percent = target.buffered.end(0) / target.duration;
gyorgy@0: 		} 
gyorgy@0: 		// Some browsers (e.g., FF3.6 and Safari 5) cannot calculate target.bufferered.end()
gyorgy@0: 		// to be anything other than 0. If the byte count is available we use this instead.
gyorgy@0: 		// Browsers that support the else if do not seem to have the bufferedBytes value and
gyorgy@0: 		// should skip to there. Tested in Safari 5, Webkit head, FF3.6, Chrome 6, IE 7/8.
gyorgy@0: 		else if (target && target.bytesTotal != undefined && target.bytesTotal > 0 && target.bufferedBytes != undefined) {
gyorgy@0: 			percent = target.bufferedBytes / target.bytesTotal;
gyorgy@0: 		}
gyorgy@0: 		// Firefox 3 with an Ogg file seems to go this way
gyorgy@0: 		else if (e && e.lengthComputable && e.total != 0) {
gyorgy@0: 			percent = e.loaded/e.total;
gyorgy@0: 		}
gyorgy@0: 
gyorgy@0: 		// finally update the progress bar
gyorgy@0: 		if (percent !== null) {
gyorgy@0: 			percent = Math.min(1, Math.max(0, percent));
gyorgy@0: 			// update loaded bar
gyorgy@0: 			if (t.loaded && t.total) {
gyorgy@0: 				t.loaded.width(t.total.width() * percent);
gyorgy@0: 			}
gyorgy@0: 		}
gyorgy@0: 	}
gyorgy@0: 	MediaElementPlayer.prototype.setCurrentRail = function() {
gyorgy@0: 
gyorgy@0: 		var t = this;
gyorgy@0: 	
gyorgy@0: 		if (t.media.currentTime != undefined && t.media.duration) {
gyorgy@0: 
gyorgy@0: 			// update bar and handle
gyorgy@0: 			if (t.total && t.handle) {
gyorgy@0: 				var 
gyorgy@0: 					newWidth = t.total.width() * t.media.currentTime / t.media.duration,
gyorgy@0: 					handlePos = newWidth - (t.handle.outerWidth(true) / 2);
gyorgy@0: 
gyorgy@0: 				t.current.width(newWidth);
gyorgy@0: 				t.handle.css('left', handlePos);
gyorgy@0: 			}
gyorgy@0: 		}
gyorgy@0: 
gyorgy@0: 	}	
gyorgy@0: 
gyorgy@0: })(mejs.$);
gyorgy@0: (function($) {
gyorgy@0: 	// current and duration 00:00 / 00:00
gyorgy@0: 	MediaElementPlayer.prototype.buildcurrent = function(player, controls, layers, media) {
gyorgy@0: 		var t = this;
gyorgy@0: 		
gyorgy@0: 		$('<div class="mejs-time">'+
gyorgy@0: 				'<span class="mejs-currenttime">' + (player.options.alwaysShowHours ? '00:' : '') + '00:00</span>'+
gyorgy@0: 			'</div>')
gyorgy@0: 			.appendTo(controls);
gyorgy@0: 		
gyorgy@0: 		t.currenttime = t.controls.find('.mejs-currenttime');
gyorgy@0: 
gyorgy@0: 		media.addEventListener('timeupdate',function() {
gyorgy@0: 			player.updateCurrent();
gyorgy@0: 		}, false);
gyorgy@0: 	};
gyorgy@0: 
gyorgy@0: 	MediaElementPlayer.prototype.buildduration = function(player, controls, layers, media) {
gyorgy@0: 		var t = this;
gyorgy@0: 		
gyorgy@0: 		if (controls.children().last().find('.mejs-currenttime').length > 0) {
gyorgy@0: 			$(' <span> | </span> '+
gyorgy@0: 			   '<span class="mejs-duration">' + (player.options.alwaysShowHours ? '00:' : '') + '00:00</span>')
gyorgy@0: 				.appendTo(controls.find('.mejs-time'));
gyorgy@0: 		} else {
gyorgy@0: 
gyorgy@0: 			// add class to current time
gyorgy@0: 			controls.find('.mejs-currenttime').parent().addClass('mejs-currenttime-container');
gyorgy@0: 			
gyorgy@0: 			$('<div class="mejs-time mejs-duration-container">'+
gyorgy@0: 				'<span class="mejs-duration">' + (player.options.alwaysShowHours ? '00:' : '') + '00:00</span>'+
gyorgy@0: 			'</div>')
gyorgy@0: 			.appendTo(controls);
gyorgy@0: 		}
gyorgy@0: 		
gyorgy@0: 		t.durationD = t.controls.find('.mejs-duration');
gyorgy@0: 
gyorgy@0: 		media.addEventListener('timeupdate',function() {
gyorgy@0: 			player.updateDuration();
gyorgy@0: 		}, false);
gyorgy@0: 	};
gyorgy@0: 	
gyorgy@0: 	MediaElementPlayer.prototype.updateCurrent = function() {
gyorgy@0: 		var t = this;
gyorgy@0: 
gyorgy@0: 		if (t.currenttime) {
gyorgy@0: 			t.currenttime.html(mejs.Utility.secondsToTimeCode(t.media.currentTime | 0, t.options.alwaysShowHours || t.media.duration > 3600 ));
gyorgy@0: 		}
gyorgy@0: 	}
gyorgy@0: 	MediaElementPlayer.prototype.updateDuration = function() {	
gyorgy@0: 		var t = this;
gyorgy@0: 		
gyorgy@0: 		if (t.media.duration && t.durationD) {
gyorgy@0: 			t.durationD.html(mejs.Utility.secondsToTimeCode(t.media.duration, t.options.alwaysShowHours));
gyorgy@0: 		}		
gyorgy@0: 	};	
gyorgy@0: 
gyorgy@0: })(mejs.$);
gyorgy@0: (function($) {
gyorgy@0: 	MediaElementPlayer.prototype.buildvolume = function(player, controls, layers, media) {
gyorgy@0: 		var mute = 
gyorgy@0: 			$('<div class="mejs-button mejs-volume-button mejs-mute">'+
gyorgy@0: 				'<button type="button"></button>'+
gyorgy@0: 				'<div class="mejs-volume-slider">'+ // outer background
gyorgy@0: 					'<div class="mejs-volume-total"></div>'+ // line background
gyorgy@0: 					'<div class="mejs-volume-current"></div>'+ // current volume
gyorgy@0: 					'<div class="mejs-volume-handle"></div>'+ // handle
gyorgy@0: 				'</div>'+
gyorgy@0: 			'</div>')
gyorgy@0: 			.appendTo(controls),
gyorgy@0: 		volumeSlider = mute.find('.mejs-volume-slider'),
gyorgy@0: 		volumeTotal = mute.find('.mejs-volume-total'),
gyorgy@0: 		volumeCurrent = mute.find('.mejs-volume-current'),
gyorgy@0: 		volumeHandle = mute.find('.mejs-volume-handle'),
gyorgy@0: 
gyorgy@0: 		positionVolumeHandle = function(volume) {
gyorgy@0: 
gyorgy@0: 			var 
gyorgy@0: 				top = volumeTotal.height() - (volumeTotal.height() * volume);
gyorgy@0: 
gyorgy@0: 			// handle
gyorgy@0: 			volumeHandle.css('top', top - (volumeHandle.height() / 2));
gyorgy@0: 
gyorgy@0: 			// show the current visibility
gyorgy@0: 			volumeCurrent.height(volumeTotal.height() - top + parseInt(volumeTotal.css('top').replace(/px/,''),10));
gyorgy@0: 			volumeCurrent.css('top',  top);
gyorgy@0: 		},
gyorgy@0: 		handleVolumeMove = function(e) {
gyorgy@0: 			var
gyorgy@0: 				railHeight = volumeTotal.height(),
gyorgy@0: 				totalOffset = volumeTotal.offset(),
gyorgy@0: 				totalTop = parseInt(volumeTotal.css('top').replace(/px/,''),10),
gyorgy@0: 				newY = e.pageY - totalOffset.top,
gyorgy@0: 				volume = (railHeight - newY) / railHeight
gyorgy@0: 
gyorgy@0: 			// TODO: handle vertical and horizontal CSS
gyorgy@0: 			// only allow it to move within the rail
gyorgy@0: 			if (newY < 0)
gyorgy@0: 				newY = 0;
gyorgy@0: 			else if (newY > railHeight)
gyorgy@0: 				newY = railHeight;
gyorgy@0: 
gyorgy@0: 			// move the handle to match the mouse
gyorgy@0: 			volumeHandle.css('top', newY - (volumeHandle.height() / 2) + totalTop );
gyorgy@0: 
gyorgy@0: 			// show the current visibility
gyorgy@0: 			volumeCurrent.height(railHeight-newY);
gyorgy@0: 			volumeCurrent.css('top',newY+totalTop);
gyorgy@0: 
gyorgy@0: 			// set mute status
gyorgy@0: 			if (volume == 0) {
gyorgy@0: 				media.setMuted(true);
gyorgy@0: 				mute.removeClass('mejs-mute').addClass('mejs-unmute');
gyorgy@0: 			} else {
gyorgy@0: 				media.setMuted(false);
gyorgy@0: 				mute.removeClass('mejs-unmute').addClass('mejs-mute');
gyorgy@0: 			}
gyorgy@0: 
gyorgy@0: 			volume = Math.max(0,volume);
gyorgy@0: 			volume = Math.min(volume,1);
gyorgy@0: 
gyorgy@0: 			// set the volume
gyorgy@0: 			media.setVolume(volume);
gyorgy@0: 		},
gyorgy@0: 		mouseIsDown = false;
gyorgy@0: 
gyorgy@0: 		// SLIDER
gyorgy@0: 		volumeSlider
gyorgy@0: 			.bind('mousedown', function (e) {
gyorgy@0: 				handleVolumeMove(e);
gyorgy@0: 				mouseIsDown = true;
gyorgy@0: 				return false;
gyorgy@0: 			});
gyorgy@0: 		$(document)
gyorgy@0: 			.bind('mouseup', function (e) {
gyorgy@0: 				mouseIsDown = false;
gyorgy@0: 			})
gyorgy@0: 			.bind('mousemove', function (e) {
gyorgy@0: 				if (mouseIsDown) {
gyorgy@0: 					handleVolumeMove(e);
gyorgy@0: 				}
gyorgy@0: 			});
gyorgy@0: 
gyorgy@0: 
gyorgy@0: 		// MUTE button
gyorgy@0: 		mute.find('button').click(function() {
gyorgy@0: 			if (media.muted) {
gyorgy@0: 				media.setMuted(false);
gyorgy@0: 				mute.removeClass('mejs-unmute').addClass('mejs-mute');
gyorgy@0: 				positionVolumeHandle(1);
gyorgy@0: 			} else {
gyorgy@0: 				media.setMuted(true);
gyorgy@0: 				mute.removeClass('mejs-mute').addClass('mejs-unmute');
gyorgy@0: 				positionVolumeHandle(0);
gyorgy@0: 			}
gyorgy@0: 		});
gyorgy@0: 
gyorgy@0: 		// listen for volume change events from other sources
gyorgy@0: 		media.addEventListener('volumechange', function(e) {
gyorgy@0: 			if (!mouseIsDown) {
gyorgy@0: 				positionVolumeHandle(e.target.volume);
gyorgy@0: 			}
gyorgy@0: 		}, true);
gyorgy@0: 
gyorgy@0: 		// set initial volume
gyorgy@0: 		positionVolumeHandle(player.options.startVolume);
gyorgy@0: 		
gyorgy@0: 		// shim gets the startvolume as a parameter, but we have to set it on the native <video> and <audio> elements
gyorgy@0: 		if (media.pluginType === 'native') {
gyorgy@0: 			media.setVolume(player.options.startVolume);
gyorgy@0: 		}
gyorgy@0: 	}
gyorgy@0: 
gyorgy@0: })(mejs.$);
gyorgy@0: 
gyorgy@0: (function($) {
gyorgy@0: 	mejs.MediaElementDefaults.forcePluginFullScreen = false;
gyorgy@0: 	
gyorgy@0: 	MediaElementPlayer.prototype.isFullScreen = false;
gyorgy@0: 	MediaElementPlayer.prototype.buildfullscreen = function(player, controls, layers, media) {
gyorgy@0: 
gyorgy@0: 		if (!player.isVideo)
gyorgy@0: 			return;
gyorgy@0: 			
gyorgy@0: 		// native events
gyorgy@0: 		if (mejs.MediaFeatures.hasNativeFullScreen) {
gyorgy@0: 			player.container.bind('webkitfullscreenchange', function(e) {
gyorgy@0: 			
gyorgy@0: 				if (document.webkitIsFullScreen) {
gyorgy@0: 					// reset the controls once we are fully in full screen
gyorgy@0: 					player.setControlsSize();
gyorgy@0: 				} else {				
gyorgy@0: 					// when a user presses ESC
gyorgy@0: 					// make sure to put the player back into place								
gyorgy@0: 					player.exitFullScreen();				
gyorgy@0: 				}
gyorgy@0: 			});
gyorgy@0: 		}
gyorgy@0: 
gyorgy@0: 		var 			
gyorgy@0: 			normalHeight = 0,
gyorgy@0: 			normalWidth = 0,
gyorgy@0: 			container = player.container,
gyorgy@0: 			docElement = document.documentElement,
gyorgy@0: 			docStyleOverflow,
gyorgy@0: 			parentWindow = window.parent,
gyorgy@0: 			parentiframes,			
gyorgy@0: 			iframe,
gyorgy@0: 			fullscreenBtn = 
gyorgy@0: 				$('<div class="mejs-button mejs-fullscreen-button"><button type="button"></button></div>')
gyorgy@0: 				.appendTo(controls)
gyorgy@0: 				.click(function() {
gyorgy@0: 					var isFullScreen = (mejs.MediaFeatures.hasNativeFullScreen) ?
gyorgy@0: 									document.webkitIsFullScreen :
gyorgy@0: 									player.isFullScreen;													
gyorgy@0: 					
gyorgy@0: 					if (isFullScreen) {
gyorgy@0: 						player.exitFullScreen();
gyorgy@0: 					} else {						
gyorgy@0: 						player.enterFullScreen();
gyorgy@0: 					}
gyorgy@0: 				});
gyorgy@0: 		
gyorgy@0: 		player.enterFullScreen = function() {
gyorgy@0: 			
gyorgy@0: 			// firefox can't adjust plugin sizes without resetting :(
gyorgy@0: 			if (player.pluginType !== 'native' && (mejs.MediaFeatures.isFirefox || player.options.forcePluginFullScreen)) {
gyorgy@0: 				media.setFullscreen(true);
gyorgy@0: 				//player.isFullScreen = true;
gyorgy@0: 				return;
gyorgy@0: 			}		
gyorgy@0: 			
gyorgy@0: 			// attempt to set fullscreen
gyorgy@0: 			if (mejs.MediaFeatures.hasNativeFullScreen) {
gyorgy@0: 				player.container[0].webkitRequestFullScreen();									
gyorgy@0: 			}
gyorgy@0: 								
gyorgy@0: 			// store overflow 
gyorgy@0: 			docStyleOverflow = docElement.style.overflow;
gyorgy@0: 			// set it to not show scroll bars so 100% will work
gyorgy@0: 			docElement.style.overflow = 'hidden';				
gyorgy@0: 		
gyorgy@0: 			// store
gyorgy@0: 			normalHeight = player.container.height();
gyorgy@0: 			normalWidth = player.container.width();
gyorgy@0: 
gyorgy@0: 			// make full size
gyorgy@0: 			container
gyorgy@0: 				.addClass('mejs-container-fullscreen')
gyorgy@0: 				.width('100%')
gyorgy@0: 				.height('100%')
gyorgy@0: 				.css('z-index', 1000);
gyorgy@0: 				//.css({position: 'fixed', left: 0, top: 0, right: 0, bottom: 0, overflow: 'hidden', width: '100%', height: '100%', 'z-index': 1000});				
gyorgy@0: 				
gyorgy@0: 			if (player.pluginType === 'native') {
gyorgy@0: 				player.$media
gyorgy@0: 					.width('100%')
gyorgy@0: 					.height('100%');
gyorgy@0: 			} else {
gyorgy@0: 				container.find('object embed')
gyorgy@0: 					.width('100%')
gyorgy@0: 					.height('100%');
gyorgy@0: 				player.media.setVideoSize($(window).width(),$(window).height());
gyorgy@0: 			}
gyorgy@0: 			
gyorgy@0: 			layers.children('div')
gyorgy@0: 				.width('100%')
gyorgy@0: 				.height('100%');
gyorgy@0: 
gyorgy@0: 			fullscreenBtn
gyorgy@0: 				.removeClass('mejs-fullscreen')
gyorgy@0: 				.addClass('mejs-unfullscreen');
gyorgy@0: 
gyorgy@0: 			player.setControlsSize();
gyorgy@0: 			player.isFullScreen = true;
gyorgy@0: 		};
gyorgy@0: 		player.exitFullScreen = function() {
gyorgy@0: 
gyorgy@0: 			// firefox can't adjust plugins
gyorgy@0: 			if (player.pluginType !== 'native' && mejs.MediaFeatures.isFirefox) {				
gyorgy@0: 				media.setFullscreen(false);
gyorgy@0: 				//player.isFullScreen = false;
gyorgy@0: 				return;
gyorgy@0: 			}		
gyorgy@0: 		
gyorgy@0: 			// come outo of native fullscreen
gyorgy@0: 			if (mejs.MediaFeatures.hasNativeFullScreen && document.webkitIsFullScreen) {							
gyorgy@0: 				document.webkitCancelFullScreen();									
gyorgy@0: 			}	
gyorgy@0: 
gyorgy@0: 			// restore scroll bars to document
gyorgy@0: 			docElement.style.overflow = docStyleOverflow;					
gyorgy@0: 				
gyorgy@0: 			container
gyorgy@0: 				.removeClass('mejs-container-fullscreen')
gyorgy@0: 				.width(normalWidth)
gyorgy@0: 				.height(normalHeight)
gyorgy@0: 				.css('z-index', 1);
gyorgy@0: 				//.css({position: '', left: '', top: '', right: '', bottom: '', overflow: 'inherit', width: normalWidth + 'px', height: normalHeight + 'px', 'z-index': 1});
gyorgy@0: 			
gyorgy@0: 			if (player.pluginType === 'native') {
gyorgy@0: 				player.$media
gyorgy@0: 					.width(normalWidth)
gyorgy@0: 					.height(normalHeight);
gyorgy@0: 			} else {
gyorgy@0: 				container.find('object embed')
gyorgy@0: 					.width(normalWidth)
gyorgy@0: 					.height(normalHeight);
gyorgy@0: 					
gyorgy@0: 				player.media.setVideoSize(normalWidth, normalHeight);
gyorgy@0: 			}				
gyorgy@0: 
gyorgy@0: 			layers.children('div')
gyorgy@0: 				.width(normalWidth)
gyorgy@0: 				.height(normalHeight);
gyorgy@0: 
gyorgy@0: 			fullscreenBtn
gyorgy@0: 				.removeClass('mejs-unfullscreen')
gyorgy@0: 				.addClass('mejs-fullscreen');
gyorgy@0: 
gyorgy@0: 			player.setControlsSize();
gyorgy@0: 			player.isFullScreen = false;
gyorgy@0: 		};
gyorgy@0: 		
gyorgy@0: 		$(window).bind('resize',function (e) {
gyorgy@0: 			player.setControlsSize();
gyorgy@0: 		});		
gyorgy@0: 
gyorgy@0: 		$(document).bind('keydown',function (e) {
gyorgy@0: 			if (player.isFullScreen && e.keyCode == 27) {
gyorgy@0: 				player.exitFullScreen();
gyorgy@0: 			}
gyorgy@0: 		});
gyorgy@0: 			
gyorgy@0: 	}
gyorgy@0: 
gyorgy@0: })(mejs.$);
gyorgy@0: (function($) {
gyorgy@0: 
gyorgy@0: 	// add extra default options 
gyorgy@0: 	$.extend(mejs.MepDefaults, {
gyorgy@0: 		// this will automatically turn on a <track>
gyorgy@0: 		startLanguage: '',
gyorgy@0: 		// a list of languages to auto-translate via Google
gyorgy@0: 		translations: [],
gyorgy@0: 		// a dropdownlist of automatic translations
gyorgy@0: 		translationSelector: false,
gyorgy@0: 		// key for tranlsations
gyorgy@0: 		googleApiKey: ''
gyorgy@0: 	});
gyorgy@0: 
gyorgy@0: 	$.extend(MediaElementPlayer.prototype, {
gyorgy@0: 
gyorgy@0: 		buildtracks: function(player, controls, layers, media) {
gyorgy@0: 			if (!player.isVideo)
gyorgy@0: 				return;
gyorgy@0: 
gyorgy@0: 			if (player.tracks.length == 0)
gyorgy@0: 				return;
gyorgy@0: 
gyorgy@0: 			var i, options = '';
gyorgy@0: 
gyorgy@0: 			player.chapters = 
gyorgy@0: 					$('<div class="mejs-chapters mejs-layer"></div>')
gyorgy@0: 						.prependTo(layers).hide();
gyorgy@0: 			player.captions = 
gyorgy@0: 					$('<div class="mejs-captions-layer mejs-layer"><div class="mejs-captions-position"><span class="mejs-captions-text"></span></div></div>')
gyorgy@0: 						.prependTo(layers).hide();
gyorgy@0: 			player.captionsText = player.captions.find('.mejs-captions-text');
gyorgy@0: 			player.captionsButton = 
gyorgy@0: 					$('<div class="mejs-button mejs-captions-button">'+
gyorgy@0: 						'<button type="button" ></button>'+
gyorgy@0: 						'<div class="mejs-captions-selector">'+
gyorgy@0: 							'<ul>'+
gyorgy@0: 								'<li>'+
gyorgy@0: 									'<input type="radio" name="' + player.id + '_captions" id="' + player.id + '_captions_none" value="none" checked="checked" />' +
gyorgy@0: 									'<label for="' + player.id + '_captions_none">None</label>'+
gyorgy@0: 								'</li>'	+
gyorgy@0: 							'</ul>'+
gyorgy@0: 						'</div>'+
gyorgy@0: 					'</button>')
gyorgy@0: 						.appendTo(controls)
gyorgy@0: 						// handle clicks to the language radio buttons
gyorgy@0: 						.delegate('input[type=radio]','click',function() {
gyorgy@0: 							lang = this.value;
gyorgy@0: 
gyorgy@0: 							if (lang == 'none') {
gyorgy@0: 								player.selectedTrack = null;
gyorgy@0: 							} else {
gyorgy@0: 								for (i=0; i<player.tracks.length; i++) {
gyorgy@0: 									if (player.tracks[i].srclang == lang) {
gyorgy@0: 										player.selectedTrack = player.tracks[i];
gyorgy@0: 										player.captions.attr('lang', player.selectedTrack.srclang);
gyorgy@0: 										player.displayCaptions();
gyorgy@0: 										break;
gyorgy@0: 									}
gyorgy@0: 								}
gyorgy@0: 							}
gyorgy@0: 						});
gyorgy@0: 						//.bind('mouseenter', function() {
gyorgy@0: 						//	player.captionsButton.find('.mejs-captions-selector').css('visibility','visible')
gyorgy@0: 						//});
gyorgy@0: 
gyorgy@0: 			if (!player.options.alwaysShowControls) {
gyorgy@0: 				// move with controls
gyorgy@0: 				player.container
gyorgy@0: 					.bind('mouseenter', function () {
gyorgy@0: 						// push captions above controls
gyorgy@0: 						player.container.find('.mejs-captions-position').addClass('mejs-captions-position-hover');
gyorgy@0: 
gyorgy@0: 					})
gyorgy@0: 					.bind('mouseleave', function () {
gyorgy@0: 						if (!media.paused) {
gyorgy@0: 							// move back to normal place
gyorgy@0: 							player.container.find('.mejs-captions-position').removeClass('mejs-captions-position-hover');
gyorgy@0: 						}
gyorgy@0: 					});
gyorgy@0: 			} else {
gyorgy@0: 				player.container.find('.mejs-captions-position').addClass('mejs-captions-position-hover');
gyorgy@0: 			}
gyorgy@0: 
gyorgy@0: 			player.trackToLoad = -1;
gyorgy@0: 			player.selectedTrack = null;
gyorgy@0: 			player.isLoadingTrack = false;
gyorgy@0: 
gyorgy@0: 			// add user-defined translations
gyorgy@0: 			if (player.tracks.length > 0 && player.options.translations.length > 0) {
gyorgy@0: 				for (i=0; i<player.options.translations.length; i++) {
gyorgy@0: 					player.tracks.push({
gyorgy@0: 						srclang: player.options.translations[i].toLowerCase(),
gyorgy@0: 						src: null,
gyorgy@0: 						kind: 'subtitles', 
gyorgy@0: 						entries: [],
gyorgy@0: 						isLoaded: false,
gyorgy@0: 						isTranslation: true
gyorgy@0: 					});
gyorgy@0: 				}
gyorgy@0: 			}
gyorgy@0: 
gyorgy@0: 			// add to list
gyorgy@0: 			for (i=0; i<player.tracks.length; i++) {
gyorgy@0: 				if (player.tracks[i].kind == 'subtitles') {
gyorgy@0: 					player.addTrackButton(player.tracks[i].srclang, player.tracks[i].isTranslation);
gyorgy@0: 				}
gyorgy@0: 			}
gyorgy@0: 
gyorgy@0: 			player.loadNextTrack();
gyorgy@0: 
gyorgy@0: 
gyorgy@0: 			media.addEventListener('timeupdate',function(e) {
gyorgy@0: 				player.displayCaptions();
gyorgy@0: 			}, false);
gyorgy@0: 
gyorgy@0: 			media.addEventListener('loadedmetadata', function(e) {
gyorgy@0: 				player.displayChapters();
gyorgy@0: 			}, false);
gyorgy@0: 
gyorgy@0: 			player.container.hover(
gyorgy@0: 				function () {
gyorgy@0: 					// chapters
gyorgy@0: 					player.chapters.css('visibility','visible');
gyorgy@0: 					player.chapters.fadeIn(200);
gyorgy@0: 				},
gyorgy@0: 				function () {
gyorgy@0: 					if (!media.paused) {
gyorgy@0: 						player.chapters.fadeOut(200, function() {
gyorgy@0: 							$(this).css('visibility','hidden');
gyorgy@0: 							$(this).css('display','block');
gyorgy@0: 						});
gyorgy@0: 					}
gyorgy@0: 				});
gyorgy@0: 				
gyorgy@0: 			// check for autoplay
gyorgy@0: 			if (player.node.getAttribute('autoplay') !== null) {
gyorgy@0: 				player.chapters.css('visibility','hidden');
gyorgy@0: 			}				
gyorgy@0: 
gyorgy@0: 			// auto selector
gyorgy@0: 			if (player.options.translationSelector) {
gyorgy@0: 				for (i in mejs.language.codes) {
gyorgy@0: 					options += '<option value="' + i + '">' + mejs.language.codes[i] + '</option>';
gyorgy@0: 				}
gyorgy@0: 				player.container.find('.mejs-captions-selector ul').before($(
gyorgy@0: 					'<select class="mejs-captions-translations">' +
gyorgy@0: 						'<option value="">--Add Translation--</option>' +
gyorgy@0: 						options +
gyorgy@0: 					'</select>'
gyorgy@0: 				));
gyorgy@0: 				// add clicks
gyorgy@0: 				player.container.find('.mejs-captions-translations').change(function() {
gyorgy@0: 					var
gyorgy@0: 						option = $(this);
gyorgy@0: 						lang = option.val();
gyorgy@0: 					// add this language to the tracks list
gyorgy@0: 					if (lang != '') {
gyorgy@0: 						player.tracks.push({
gyorgy@0: 							srclang: lang,
gyorgy@0: 							src: null,
gyorgy@0: 							entries: [],
gyorgy@0: 							isLoaded: false,
gyorgy@0: 							isTranslation: true
gyorgy@0: 						});
gyorgy@0: 
gyorgy@0: 						if (!player.isLoadingTrack) {
gyorgy@0: 							player.trackToLoad--;
gyorgy@0: 							player.addTrackButton(lang,true);
gyorgy@0: 							player.options.startLanguage = lang;
gyorgy@0: 							player.loadNextTrack();
gyorgy@0: 						}
gyorgy@0: 					}
gyorgy@0: 				});
gyorgy@0: 			}
gyorgy@0: 
gyorgy@0: 		},
gyorgy@0: 
gyorgy@0: 		loadNextTrack: function() {
gyorgy@0: 			var t = this;
gyorgy@0: 
gyorgy@0: 			t.trackToLoad++;
gyorgy@0: 			if (t.trackToLoad < t.tracks.length) {
gyorgy@0: 				t.isLoadingTrack = true;
gyorgy@0: 				t.loadTrack(t.trackToLoad);
gyorgy@0: 			} else {
gyorgy@0: 				// add done?
gyorgy@0: 				t.isLoadingTrack = false;
gyorgy@0: 			}
gyorgy@0: 		},
gyorgy@0: 
gyorgy@0: 		loadTrack: function(index){
gyorgy@0: 			var
gyorgy@0: 				t = this,
gyorgy@0: 				track = t.tracks[index],
gyorgy@0: 				after = function() {
gyorgy@0: 
gyorgy@0: 					track.isLoaded = true;
gyorgy@0: 
gyorgy@0: 					// create button
gyorgy@0: 					//t.addTrackButton(track.srclang);
gyorgy@0: 					t.enableTrackButton(track.srclang);
gyorgy@0: 
gyorgy@0: 					t.loadNextTrack();
gyorgy@0: 
gyorgy@0: 				};
gyorgy@0: 
gyorgy@0: 			if (track.isTranslation) {
gyorgy@0: 
gyorgy@0: 				// translate the first track
gyorgy@0: 				mejs.TrackFormatParser.translateTrackText(t.tracks[0].entries, t.tracks[0].srclang, track.srclang, t.options.googleApiKey, function(newOne) {
gyorgy@0: 
gyorgy@0: 					// store the new translation
gyorgy@0: 					track.entries = newOne;
gyorgy@0: 
gyorgy@0: 					after();
gyorgy@0: 				});
gyorgy@0: 
gyorgy@0: 			} else {
gyorgy@0: 				$.ajax({
gyorgy@0: 					url: track.src,
gyorgy@0: 					success: function(d) {
gyorgy@0: 
gyorgy@0: 						// parse the loaded file
gyorgy@0: 						track.entries = mejs.TrackFormatParser.parse(d);
gyorgy@0: 						after();
gyorgy@0: 
gyorgy@0: 						if (track.kind == 'chapters' && t.media.duration > 0) {
gyorgy@0: 							t.drawChapters(track);
gyorgy@0: 						}
gyorgy@0: 					},
gyorgy@0: 					error: function() {
gyorgy@0: 						t.loadNextTrack();
gyorgy@0: 					}
gyorgy@0: 				});
gyorgy@0: 			}
gyorgy@0: 		},
gyorgy@0: 
gyorgy@0: 		enableTrackButton: function(lang) {
gyorgy@0: 			var t = this;
gyorgy@0: 
gyorgy@0: 			t.captionsButton
gyorgy@0: 				.find('input[value=' + lang + ']')
gyorgy@0: 					.prop('disabled',false)
gyorgy@0: 				.siblings('label')
gyorgy@0: 					.html( mejs.language.codes[lang] || lang );
gyorgy@0: 
gyorgy@0: 			// auto select
gyorgy@0: 			if (t.options.startLanguage == lang) {
gyorgy@0: 				$('#' + t.id + '_captions_' + lang).click();
gyorgy@0: 			}
gyorgy@0: 
gyorgy@0: 			t.adjustLanguageBox();
gyorgy@0: 		},
gyorgy@0: 
gyorgy@0: 		addTrackButton: function(lang, isTranslation) {
gyorgy@0: 			var t = this,
gyorgy@0: 				l = mejs.language.codes[lang] || lang;
gyorgy@0: 
gyorgy@0: 			t.captionsButton.find('ul').append(
gyorgy@0: 				$('<li>'+
gyorgy@0: 					'<input type="radio" name="' + t.id + '_captions" id="' + t.id + '_captions_' + lang + '" value="' + lang + '" disabled="disabled" />' +
gyorgy@0: 					'<label for="' + t.id + '_captions_' + lang + '">' + l + ((isTranslation) ? ' (translating)' : ' (loading)') + '</label>'+
gyorgy@0: 				'</li>')
gyorgy@0: 			);
gyorgy@0: 
gyorgy@0: 			t.adjustLanguageBox();
gyorgy@0: 
gyorgy@0: 			// remove this from the dropdownlist (if it exists)
gyorgy@0: 			t.container.find('.mejs-captions-translations option[value=' + lang + ']').remove();
gyorgy@0: 		},
gyorgy@0: 
gyorgy@0: 		adjustLanguageBox:function() {
gyorgy@0: 			var t = this;
gyorgy@0: 			// adjust the size of the outer box
gyorgy@0: 			t.captionsButton.find('.mejs-captions-selector').height(
gyorgy@0: 				t.captionsButton.find('.mejs-captions-selector ul').outerHeight(true) +
gyorgy@0: 				t.captionsButton.find('.mejs-captions-translations').outerHeight(true)
gyorgy@0: 			);
gyorgy@0: 		},
gyorgy@0: 
gyorgy@0: 		displayCaptions: function() {
gyorgy@0: 
gyorgy@0: 			if (typeof this.tracks == 'undefined')
gyorgy@0: 				return;
gyorgy@0: 
gyorgy@0: 			var
gyorgy@0: 				t = this,
gyorgy@0: 				i,
gyorgy@0: 				track = t.selectedTrack;
gyorgy@0: 
gyorgy@0: 			if (track != null && track.isLoaded) {
gyorgy@0: 				for (i=0; i<track.entries.times.length; i++) {
gyorgy@0: 					if (t.media.currentTime >= track.entries.times[i].start && t.media.currentTime <= track.entries.times[i].stop){
gyorgy@0: 						t.captionsText.html(track.entries.text[i]);
gyorgy@0: 						t.captions.show();
gyorgy@0: 						return; // exit out if one is visible;
gyorgy@0: 					}
gyorgy@0: 				}
gyorgy@0: 				t.captions.hide();
gyorgy@0: 			} else {
gyorgy@0: 				t.captions.hide();
gyorgy@0: 			}
gyorgy@0: 		},
gyorgy@0: 
gyorgy@0: 		displayChapters: function() {
gyorgy@0: 			var 
gyorgy@0: 				t = this,
gyorgy@0: 				i;
gyorgy@0: 
gyorgy@0: 			for (i=0; i<t.tracks.length; i++) {
gyorgy@0: 				if (t.tracks[i].kind == 'chapters' && t.tracks[i].isLoaded) {
gyorgy@0: 					t.drawChapters(t.tracks[i]);
gyorgy@0: 					break;
gyorgy@0: 				}
gyorgy@0: 			}
gyorgy@0: 		},
gyorgy@0: 
gyorgy@0: 		drawChapters: function(chapters) {
gyorgy@0: 			var 
gyorgy@0: 				t = this,
gyorgy@0: 				i,
gyorgy@0: 				dur,
gyorgy@0: 				//width,
gyorgy@0: 				//left,
gyorgy@0: 				percent = 0,
gyorgy@0: 				usedPercent = 0;
gyorgy@0: 
gyorgy@0: 			t.chapters.empty();
gyorgy@0: 
gyorgy@0: 			for (i=0; i<chapters.entries.times.length; i++) {
gyorgy@0: 				dur = chapters.entries.times[i].stop - chapters.entries.times[i].start;
gyorgy@0: 				percent = Math.floor(dur / t.media.duration * 100);
gyorgy@0: 				if (percent + usedPercent > 100 || // too large
gyorgy@0: 					i == chapters.entries.times.length-1 && percent + usedPercent < 100) // not going to fill it in
gyorgy@0: 					{
gyorgy@0: 					percent = 100 - usedPercent;
gyorgy@0: 				}
gyorgy@0: 				//width = Math.floor(t.width * dur / t.media.duration);
gyorgy@0: 				//left = Math.floor(t.width * chapters.entries.times[i].start / t.media.duration);
gyorgy@0: 				//if (left + width > t.width) {
gyorgy@0: 				//	width = t.width - left;
gyorgy@0: 				//}
gyorgy@0: 
gyorgy@0: 				t.chapters.append( $(
gyorgy@0: 					'<div class="mejs-chapter" rel="' + chapters.entries.times[i].start + '" style="left: ' + usedPercent.toString() + '%;width: ' + percent.toString() + '%;">' + 
gyorgy@0: 						'<div class="mejs-chapter-block' + ((i==chapters.entries.times.length-1) ? ' mejs-chapter-block-last' : '') + '">' + 
gyorgy@0: 							'<span class="ch-title">' + chapters.entries.text[i] + '</span>' + 
gyorgy@0: 							'<span class="ch-time">' + mejs.Utility.secondsToTimeCode(chapters.entries.times[i].start) + '&ndash;' + mejs.Utility.secondsToTimeCode(chapters.entries.times[i].stop) + '</span>' + 
gyorgy@0: 						'</div>' +
gyorgy@0: 					'</div>'));
gyorgy@0: 				usedPercent += percent;
gyorgy@0: 			}
gyorgy@0: 
gyorgy@0: 			t.chapters.find('div.mejs-chapter').click(function() {
gyorgy@0: 				t.media.setCurrentTime( parseFloat( $(this).attr('rel') ) );
gyorgy@0: 				if (t.media.paused) {
gyorgy@0: 					t.media.play(); 
gyorgy@0: 				}
gyorgy@0: 			});
gyorgy@0: 
gyorgy@0: 			t.chapters.show();
gyorgy@0: 		}
gyorgy@0: 	});
gyorgy@0: 
gyorgy@0: 
gyorgy@0: 
gyorgy@0: 	mejs.language = {
gyorgy@0: 		codes:  {
gyorgy@0: 			af:'Afrikaans',
gyorgy@0: 			sq:'Albanian',
gyorgy@0: 			ar:'Arabic',
gyorgy@0: 			be:'Belarusian',
gyorgy@0: 			bg:'Bulgarian',
gyorgy@0: 			ca:'Catalan',
gyorgy@0: 			zh:'Chinese',
gyorgy@0: 			'zh-cn':'Chinese Simplified',
gyorgy@0: 			'zh-tw':'Chinese Traditional',
gyorgy@0: 			hr:'Croatian',
gyorgy@0: 			cs:'Czech',
gyorgy@0: 			da:'Danish',
gyorgy@0: 			nl:'Dutch',
gyorgy@0: 			en:'English',
gyorgy@0: 			et:'Estonian',
gyorgy@0: 			tl:'Filipino',
gyorgy@0: 			fi:'Finnish',
gyorgy@0: 			fr:'French',
gyorgy@0: 			gl:'Galician',
gyorgy@0: 			de:'German',
gyorgy@0: 			el:'Greek',
gyorgy@0: 			ht:'Haitian Creole',
gyorgy@0: 			iw:'Hebrew',
gyorgy@0: 			hi:'Hindi',
gyorgy@0: 			hu:'Hungarian',
gyorgy@0: 			is:'Icelandic',
gyorgy@0: 			id:'Indonesian',
gyorgy@0: 			ga:'Irish',
gyorgy@0: 			it:'Italian',
gyorgy@0: 			ja:'Japanese',
gyorgy@0: 			ko:'Korean',
gyorgy@0: 			lv:'Latvian',
gyorgy@0: 			lt:'Lithuanian',
gyorgy@0: 			mk:'Macedonian',
gyorgy@0: 			ms:'Malay',
gyorgy@0: 			mt:'Maltese',
gyorgy@0: 			no:'Norwegian',
gyorgy@0: 			fa:'Persian',
gyorgy@0: 			pl:'Polish',
gyorgy@0: 			pt:'Portuguese',
gyorgy@0: 			//'pt-pt':'Portuguese (Portugal)',
gyorgy@0: 			ro:'Romanian',
gyorgy@0: 			ru:'Russian',
gyorgy@0: 			sr:'Serbian',
gyorgy@0: 			sk:'Slovak',
gyorgy@0: 			sl:'Slovenian',
gyorgy@0: 			es:'Spanish',
gyorgy@0: 			sw:'Swahili',
gyorgy@0: 			sv:'Swedish',
gyorgy@0: 			tl:'Tagalog',
gyorgy@0: 			th:'Thai',
gyorgy@0: 			tr:'Turkish',
gyorgy@0: 			uk:'Ukrainian',
gyorgy@0: 			vi:'Vietnamese',
gyorgy@0: 			cy:'Welsh',
gyorgy@0: 			yi:'Yiddish'
gyorgy@0: 		}
gyorgy@0: 	};
gyorgy@0: 
gyorgy@0: 	/*
gyorgy@0: 	Parses WebVVT format which should be formatted as
gyorgy@0: 	================================
gyorgy@0: 	WEBVTT
gyorgy@0: 	
gyorgy@0: 	1
gyorgy@0: 	00:00:01,1 --> 00:00:05,000
gyorgy@0: 	A line of text
gyorgy@0: 
gyorgy@0: 	2
gyorgy@0: 	00:01:15,1 --> 00:02:05,000
gyorgy@0: 	A second line of text
gyorgy@0: 	
gyorgy@0: 	===============================
gyorgy@0: 
gyorgy@0: 	Adapted from: http://www.delphiki.com/html5/playr
gyorgy@0: 	*/
gyorgy@0: 	mejs.TrackFormatParser = {
gyorgy@0: 		pattern_identifier: /^[0-9]+$/,
gyorgy@0: 		pattern_timecode: /^([0-9]{2}:[0-9]{2}:[0-9]{2}(,[0-9]{1,3})?) --\> ([0-9]{2}:[0-9]{2}:[0-9]{2}(,[0-9]{3})?)(.*)$/,
gyorgy@0: 
gyorgy@0: 		split2: function (text, regex) {
gyorgy@0: 			// normal version for compliant browsers
gyorgy@0: 			// see below for IE fix
gyorgy@0: 			return text.split(regex);
gyorgy@0: 		},
gyorgy@0: 		parse: function(trackText) {
gyorgy@0: 			var 
gyorgy@0: 				i = 0,
gyorgy@0: 				lines = this.split2(trackText, /\r?\n/),
gyorgy@0: 				entries = {text:[], times:[]},
gyorgy@0: 				timecode,
gyorgy@0: 				text;
gyorgy@0: 
gyorgy@0: 			for(; i<lines.length; i++) {
gyorgy@0: 				// check for the line number
gyorgy@0: 				if (this.pattern_identifier.exec(lines[i])){
gyorgy@0: 					// skip to the next line where the start --> end time code should be
gyorgy@0: 					i++;
gyorgy@0: 					timecode = this.pattern_timecode.exec(lines[i]);
gyorgy@0: 					if (timecode && i<lines.length){
gyorgy@0: 						i++;
gyorgy@0: 						// grab all the (possibly multi-line) text that follows
gyorgy@0: 						text = lines[i];
gyorgy@0: 						i++;
gyorgy@0: 						while(lines[i] !== '' && i<lines.length){
gyorgy@0: 							text = text + '\n' + lines[i];
gyorgy@0: 							i++;
gyorgy@0: 						}
gyorgy@0: 
gyorgy@0: 						// Text is in a different array so I can use .join
gyorgy@0: 						entries.text.push(text);
gyorgy@0: 						entries.times.push(
gyorgy@0: 						{
gyorgy@0: 							start: mejs.Utility.timeCodeToSeconds(timecode[1]),
gyorgy@0: 							stop: mejs.Utility.timeCodeToSeconds(timecode[3]),
gyorgy@0: 							settings: timecode[5]
gyorgy@0: 						});
gyorgy@0: 					}
gyorgy@0: 				}
gyorgy@0: 			}
gyorgy@0: 
gyorgy@0: 			return entries;
gyorgy@0: 		},
gyorgy@0: 
gyorgy@0: 		translateTrackText: function(trackData, fromLang, toLang, googleApiKey, callback) {
gyorgy@0: 
gyorgy@0: 			var 
gyorgy@0: 				entries = {text:[], times:[]},
gyorgy@0: 				lines,
gyorgy@0: 				i
gyorgy@0: 
gyorgy@0: 			this.translateText( trackData.text.join(' <a></a>'), fromLang, toLang, googleApiKey, function(result) {
gyorgy@0: 				// split on separators
gyorgy@0: 				lines = result.split('<a></a>');
gyorgy@0: 
gyorgy@0: 				// create new entries
gyorgy@0: 				for (i=0;i<trackData.text.length; i++) {
gyorgy@0: 					// add translated line
gyorgy@0: 					entries.text[i] = lines[i];
gyorgy@0: 					// copy existing times
gyorgy@0: 					entries.times[i] = {
gyorgy@0: 						start: trackData.times[i].start,
gyorgy@0: 						stop: trackData.times[i].stop,
gyorgy@0: 						settings: trackData.times[i].settings
gyorgy@0: 					};
gyorgy@0: 				}
gyorgy@0: 
gyorgy@0: 				callback(entries);
gyorgy@0: 			});
gyorgy@0: 		},
gyorgy@0: 
gyorgy@0: 		translateText: function(text, fromLang, toLang, googleApiKey, callback) {
gyorgy@0: 
gyorgy@0: 			var
gyorgy@0: 				separatorIndex,
gyorgy@0: 				chunks = [],
gyorgy@0: 				chunk,
gyorgy@0: 				maxlength = 1000,
gyorgy@0: 				result = '',
gyorgy@0: 				nextChunk= function() {
gyorgy@0: 					if (chunks.length > 0) {
gyorgy@0: 						chunk = chunks.shift();
gyorgy@0: 						mejs.TrackFormatParser.translateChunk(chunk, fromLang, toLang, googleApiKey, function(r) {
gyorgy@0: 							if (r != 'undefined') {
gyorgy@0: 								result += r;
gyorgy@0: 							}
gyorgy@0: 							nextChunk();
gyorgy@0: 						});
gyorgy@0: 					} else {
gyorgy@0: 						callback(result);
gyorgy@0: 					}
gyorgy@0: 				};
gyorgy@0: 
gyorgy@0: 			// split into chunks
gyorgy@0: 			while (text.length > 0) {
gyorgy@0: 				if (text.length > maxlength) {
gyorgy@0: 					separatorIndex = text.lastIndexOf('.', maxlength);
gyorgy@0: 					chunks.push(text.substring(0, separatorIndex));
gyorgy@0: 					text = text.substring(separatorIndex+1);
gyorgy@0: 				} else {
gyorgy@0: 					chunks.push(text);
gyorgy@0: 					text = '';
gyorgy@0: 				}
gyorgy@0: 			}
gyorgy@0: 
gyorgy@0: 			// start handling the chunks
gyorgy@0: 			nextChunk();
gyorgy@0: 		},
gyorgy@0: 		translateChunk: function(text, fromLang, toLang, googleApiKey, callback) {
gyorgy@0: 
gyorgy@0: 			var data = {
gyorgy@0: 				q: text, 
gyorgy@0: 				langpair: fromLang + '|' + toLang,
gyorgy@0: 				v: '1.0'
gyorgy@0: 			};
gyorgy@0: 			if (googleApiKey !== '' && googleApiKey !== null) {
gyorgy@0: 				data.key = googleApiKey;
gyorgy@0: 			}
gyorgy@0: 
gyorgy@0: 			$.ajax({
gyorgy@0: 				url: 'https://ajax.googleapis.com/ajax/services/language/translate', // 'https://www.google.com/uds/Gtranslate', //'https://ajax.googleapis.com/ajax/services/language/translate', //
gyorgy@0: 				data: data,
gyorgy@0: 				type: 'GET',
gyorgy@0: 				dataType: 'jsonp',
gyorgy@0: 				success: function(d) {
gyorgy@0: 					callback(d.responseData.translatedText);
gyorgy@0: 				},
gyorgy@0: 				error: function(e) {
gyorgy@0: 					callback(null);
gyorgy@0: 				}
gyorgy@0: 			});
gyorgy@0: 		}
gyorgy@0: 	};
gyorgy@0: 	// test for browsers with bad String.split method.
gyorgy@0: 	if ('x\n\ny'.split(/\n/gi).length != 3) {
gyorgy@0: 		// add super slow IE8 and below version
gyorgy@0: 		mejs.TrackFormatParser.split2 = function(text, regex) {
gyorgy@0: 			var 
gyorgy@0: 				parts = [], 
gyorgy@0: 				chunk = '',
gyorgy@0: 				i;
gyorgy@0: 
gyorgy@0: 			for (i=0; i<text.length; i++) {
gyorgy@0: 				chunk += text.substring(i,i+1);
gyorgy@0: 				if (regex.test(chunk)) {
gyorgy@0: 					parts.push(chunk.replace(regex, ''));
gyorgy@0: 					chunk = '';
gyorgy@0: 				}
gyorgy@0: 			}
gyorgy@0: 			parts.push(chunk);
gyorgy@0: 			return parts;
gyorgy@0: 		}
gyorgy@0: 	}
gyorgy@0: 
gyorgy@0: })(mejs.$);
gyorgy@0: