// Méthode ajoutée à Jquery pour trouver la position d'un élément:
jQuery.fn.extend({
   videoFindPos : function() {
       obj = jQuery(this).get(0);
       var curleft = obj.offsetLeft || 0;
       var curtop = obj.offsetTop || 0;
       while (obj = obj.offsetParent) {
                curleft += obj.offsetLeft
                curtop += obj.offsetTop
       }
       return {x:curleft,y:curtop};
   }
});

/**
 * Plugin vidéo
 */
(function($) {
	/**
	 * Définition du plugin
	 *
	 * @param	<array>	Liste des paramètres.
	 */
    $.fn.video = function(pOptions) {
		// Paramètres par défaut:
		var defaults = {
			// Largeur de la vidéo :
			width: 640,

			// Hauteur de la vidéo :
			height: 480,

			// Indique la lecture automatique:
			autoplay: true,

			// Le poster (pour quand l'autoplay est désactivé)
			poster: false,

			// Si on doit cacher la barre de menu:
			hideMenuBar: true,

			// Le fichier à jouer (sans l'extension)
			filename: 'videos/sample',

			// Pour la version flash : chemin d'accès vers le fichier XML de configuration
			pathConfig: '/video/flash/_config/',

			// Pour la version flash : chemin d'accès vers le dossier des images de contrôles de la visionneuse
			pathImages: '/video/images/',

			// Pour la version flash : chemin d'accès vers le répertoire des vidéos
			pathVideoDir: '/video/',

			// CSS : chargement dynamtique d'un fichier CSS
			css: '',

			// styleFlash: pour charger un XML de style différent à la visionneuse flash
			styleFlash: '',
			
			// Loop: à true, la vidéo boucle une fois terminée
			loop: false,
			
			// Paramètre d'affichage du menu:
			displayTaskbar: true
        };

		// Paramètres à utiliser:
        var opts = $.extend(defaults, pOptions);

		var _basicParams = new Array();

		// Durée de la vidéo
		var _duree = 0;

		// Permet de gérer l'avancement dans la barre de son:
		var _followMouse = false;

		// Permet de gérer le volume au passage de la souris:
		var _followSound = false;

		// Longueur de la jauge de temps:
		var _longueurJauge = 0;

		// Indique si on a déjà enclenché les évènements pouvant cacher la barre de menu.
		var _setupHideMenuBar = false;

		// La vidéo:
		var _this = $(this);

		// Compteur de temps qui cache de menu:
		var _timer = 0;

		/**
		 * Permet de vérifier si le navigateur supporte la balise video
		 *
		 * @return bool
		 */
		function canPlayVideo()
		{
			if(document.createElement('video').canPlayType)
			{
				return true;
			}

			return false;
		}

		/**
		 * Convertit un temps en secondes au format mm:ss
		 */
		function secondsToTime(pTime)
		{
			// Arrondi de la durée:
			pTime = Math.round(pTime);

			// Calcul du nombre de minutes:
			var minutes = Math.floor(pTime / 60);

			if(minutes < 10)
			{
				minutes = '0'+minutes;
			}

			// Calcul du nombre de secondes:
			var secondes = pTime % 60;

			if(secondes < 10)
			{
				secondes = '0'+secondes;
			}

			return minutes+':'+secondes;
		}

		/**
		 * Affiche la temps de vidéo déjà passé, et la durée au besoin:
		 */
		function displayActualTime()
		{
			if(opts['displayTaskbar'] == true)
			{
				// On regarde si le fichier se joue:
				if(_this.find('.play_pause').hasClass('pause'))
				{
					var vid = getVideoElement();

					if(vid.readyState == 0)
					{
						displayFlashVideo();
					}
				}

				// Si la durée est vide, on tente de la renseigner:
				if(_this.find('.duree').text() == '00:00')
				{
					var duration = _this.find('video').attr('duration');

					_duree = duration;

					if(!isNaN(duration))
					{
						duration = secondsToTime(duration);
						
						_this.find('.duree').text(duration);
					}
				}

				// Gestion du temps écoulé:
				var now = _this.find('video').attr('currentTime');

				// Calcul de l'emplacement du palet en fonction du temps écoulé:
				var decalage = (_longueurJauge / _duree) * now;

				_this.find('.palet').css('width', decalage+'px');

				now = secondsToTime(now);

				_this.find('.current_time').text(now);
			}
			
			// On regarde si on est à la fin de la vidéo:
			var myVideo = getVideoElement();

			if(myVideo.ended == true)
			{
				_this.find('.palet').css('width', '100%');
				_this.find('.play_pause').removeClass('pause').addClass('play');
				
				if(opts['loop'] == true)
				{
					if(opts['displayTaskbar'] == true)
					{
						_this.find('.play_pause').trigger('click');
					}
					else
					{
						myVideo.play();
					}
				}
			}

			// Prochain appel à la fonction:
			setTimeout(displayActualTime, 250);
		}

		/**
		 * Modification du volume (nombre réel de 0 à 1)
		 *
		 * @param <float> volume désiré
		 */
		function setVolume(pVolume)
		{
			if(isNaN(pVolume))
			{
				pVolume = pVolume.attr('id').replace(_this.attr('id')+'_batonnet_', '');

				pVolume = pVolume / 10;
			}

			var i = 0.1;

			_this.find('.sound .batonnet').each(function(){
				if(i <= pVolume)
				{
					$(this).addClass('active');
				}
				else
				{
					$(this).removeClass('active');
				}

				i += 0.1;
			});

			var myVideo = getVideoElement();
			myVideo.volume = pVolume;
		}

		function setPositionByCursor(pEvent)
		{
			// On prend l'emplacement de la jauge:
			var coords = _this.find('.fond_jauge').videoFindPos();

			// Calcul du nouveau décalage du curseur:
			var decalage = pEvent.pageX - coords.x;

			// On regarde si on est pas "hors champ":
			if(decalage > _this.find('.fond_jauge').width())
			{
				decalage = _this.find('.fond_jauge').width();
			}

			// On déplace le palet:
			_this.find('.palet').css('width', decalage+'px');

			// Maintenant, synchronisation avec le passage dans la vidéo:
			var myVideo = getVideoElement();
			var video_duree = myVideo.duration;

			// MAJ pour la balise video:
			var currentTime = (video_duree / _this.find('.fond_jauge').width()) * decalage;

			myVideo.currentTime = currentTime;
		}

		/**
		 * Renvoie l'élément vidéo.
		 */
		function getVideoElement()
		{
			var div = document.getElementById(_this.attr('id'));
			return div.getElementsByTagName('video')[0];
		}

		/**
		 * Sortie du plein écran
		 */
		function exitFullscreen()
		{
			_this.find('.screen.fullscreen').show();
			_this.find('.screen.normalscreen').hide();

			_this.find('.video-container').css({
				'position'			: _basicParams['position-container'],
				'width'				: opts['width']+'px',
				'height'			: opts['height']+'px',
				'z-index'			: 'auto'
			});

			if(_this.find('video').css('display') == 'block')
			{
				_this.find('.video-container').css({
					'background'	: 'none'
				});
			}

			_this.find('video').css({
				'position'	: _basicParams['position-video'],
				'width'		: opts['width']+'px',
				'height'	: opts['height']+'px',
				'z-index'	: 'auto'
			}).removeClass('fullscreen');

			var tmpH = opts['height'] - _this.find('.video-controls').height();
			
			_this.find('.video-controls').css({
				'position'		: _basicParams['position-controls'],
				'top'			: tmpH+'px',
				'left'			: '0px',
				'margin'		: '0 0 0 0',
				'padding'		: '0 0 0 0',
				'z-index'		: 'auto'
			}).removeClass('mode_fullscreen');
		}

		/**
		 * Cache automatiquement la barre de menu.
		 */
		function hideMenuBar()
		{
			_this.find('.video-controls').fadeOut('slow');
		}

		function setupHidingMenuBar()
		{
			_this.find('video').mousemove(function(){
				_this.find('.video-controls').fadeIn('fast');
				clearTimeout(_timer);
				_timer = setTimeout(hideMenuBar, 3000);
			});

			_this.find('.video-controls').hover(function(){
				clearTimeout(_timer);
			}, function(){
				_timer = setTimeout(hideMenuBar, 3000);
			});
		}

		/**
		 * Affiche la visionneuse flash.
		 */
		function displayFlashVideo()
		{
			return false;
			/*
			var vid = new SWFObject('/themes/defaut/_module_pelicule/flash/video.swf', 'my_video_'+_this.attr('id'), opts.width, opts.height, '9.0', '#FFFFFF');
			vid.addParam('allowFullScreen', 'true');
			vid.addParam('wmode', 'window');
			vid.addVariable('configPath', opts.pathConfig);
			vid.addVariable('imagesPath', opts.pathImages);
			
			var filename = opts.filename;
			filename = filename.replace('./themes', '/themes');
			
			vid.addVariable('filename', filename+'.mp4');
			vid.addVariable('width', opts.width);
			vid.addVariable('height', opts.height);
			vid.addVariable('styleFlash', opts.styleFlash);

			if((opts.autoplay == true) || canPlayVideo())
			{
				vid.addVariable('autoplay', 'true');
			}

			if(opts.poster != false)
			{
				vid.addVariable('poster', opts.poster);
			}

			if(opts.hideMenuBar == true)
			{
				vid.addVariable('hideMenuBar', 'true');
			}

			vid.write(_this.attr('id'));
			*/
			var filename = opts.filename;
			filename = filename.replace('./themes', '/themes');
			filename += '.mp4';
			
			$('#'+_this.attr('id')).html('<a href="'+filename+'" style="display:block; width:'+opts.width+'px; height:'+opts.height+'px" id="player"></a>');
			
			$f('player', '/themes/defaut/flowplayer/flowplayer-3.2.3.swf', {
				clip: {
					url: filename,
					autoPlay: true
				}
			});
		}
		
		// Création du code HTML pour afficher la vidéo:
		// Version HTML5:
		if(canPlayVideo())
		{
			// Chargement d'une CSS dynamique au besoin:
			if(opts.css != '')
			{
				// Création de l'id CSS:
				var classCSS = opts.css;
				classCSS = classCSS.split('/');
				classCSS = classCSS.pop();
				classCSS = classCSS.toLowerCase();
				classCSS = classCSS.replace('.css', '');
				
				if($('#jquery-video-css-'+classCSS).length > 0)
				{
					$('#jquery-video-css-'+classCSS).attr('href', opts.css);
				}
				else
				{
					$('head').append('<link rel="stylesheet" id="jquery-video-css-'+classCSS+'" type="text/css" href="'+opts.css+'" />');
				}
			}

			// Génération du code HTML de la vidéo
			var str = '<div class="video-container">';
				str += '<video width="'+opts.width+'" height="'+opts.height+'" autobuffer';
				if(opts.autoplay == true)
				{
					str += ' autoplay';
				}

				if(opts.css != '')
				{
					str += ' class="'+classCSS+'"';
				}

				str += '>';
					str += '<source src="'+opts.filename+'.ogv" type=\'video/ogg; codecs="theora, vorbis"\' />';
					str += '<source src="'+opts.filename+'.ogg" type=\'video/ogg; codecs="theora, vorbis"\' />';
					str += '<source src="'+opts.filename+'.mp4" type=\'video/mp4; codecs="avc1.42E01E, mp4a.40.2"\' />';
				str += '</video>';
			str += '</div>';
			
			// Génération du code HTML de la barre de contrôles:
			if(opts['displayTaskbar'] == true)
			{
				str += '<div class="video-controls clearfix">';
					str += '<p class="play_pause ';
					if(opts.autoplay == true)
					{
						str += 'pause';
					}
					else
					{
						str += 'play';
					}
					str += '">Lire / Pause</p>';
					str += '<div class="current_time">00:00</div>';
					str += '<div class="jauge_temps">';
						str += '<div class="palet"></div>';
						str += '<div class="fond_jauge"></div>';
					str += '</div>';
					
					str += '<div class="duree">00:00</div>';
					str += '<div class="mute mute_off"></div>';
					str += '<div class="mute mute_on"></div>';
					str += '<div class="sound">';
						var i = 1;
						
						while(i <= 10)
						{
							str += '<div class="batonnet" id="'+_this.attr('id')+'_batonnet_'+i+'"></div>';

							i++;
						}
					str += '</div>';
					str += '<div class="screen fullscreen"></div>';
					str += '<div class="screen normalscreen"></div>';
				str += '</div>';
			}
			
			$(this).html(str);
			
			if(opts['displayTaskbar'] == true)
			{
				if((opts.hideMenuBar == true) && (opts.autoplay == true))
				{
					setupHidingMenuBar();
				}

				// Si pas d'autoplay et un poster, on l'affiche:
				if((opts.autoplay == false) && (opts.poster != false))
				{
					_this.find('video').hide();
					
					_this.find('.video-container').css({
						'height'				: opts.height,
						'width'					: opts.width,
						'background'			: 'none',
						'background-image'		: 'url('+opts.poster+')',
						'background-repeat'		: 'no-repeat',
						'background-position'	: 'center center'
					});
				}

				_this.find('.video-controls').css({
					'width'		: opts.width,
					'z-index'	: 'auto'
				});

				_this.find('.fond_jauge').css({
					'width' : (opts.width - 260)
				});

				_this.find('.video-controls .screen').css({
					'margin-left' : (opts.width - 30)
				});

				_this.find('.video-controls .sound').css({
					'margin-left' : (opts.width - 70)
				});

				_this.find('.video-controls .mute').css({
					'margin-left' : (opts.width - 102)
				});

				_this.find('.video-controls .duree').css({
					'margin-left' : (opts.width - 142)
				});

				// Récupération de la longueur de la jauge de temps:
				_longueurJauge = _this.find('.jauge_temps').css('width').replace('px', '');
				
				setTimeout(displayActualTime, 1000);

				// Gestion de l'entrée/sortie du fullscreen:
				_this.find('.screen').click(function(){
					$(this).hide();
					
					if($(this).hasClass('fullscreen'))
					{
						_this.find('.screen.normalscreen').show();

						_basicParams['position-container'] = _this.find('.video-container').css('position');
						_basicParams['position-controls'] = _this.find('.video-controls').css('position');
						_basicParams['position-video'] = _this.find('video').css('position');

						// Récupération de l'ancienne position de la barre de contrôles:
						var posControls = _this.find('.video-controls').videoFindPos();
						_basicParams['xControls'] = posControls.x;
						_basicParams['yControls'] = posControls.y;

						var decalage = _this.find('.video-controls').width() / 2;

						_this.find('.video-controls').css({
								'position'		: 'fixed',
								'top'			: '100%',
								'left'			: '50%',
								'margin-top'	: '-27px',
								'margin-left'	: '-'+decalage+'px',
								'z-index'		: '5100'
							}).addClass('mode_fullscreen');
						
						_this.find('.video-container').css({
								'position'			: 'fixed',
								'top'				: '0',
								'left'				: '0',
								'width'				: '100%',
								'height'			: '100%',
								'z-index'			: '4999',
								'background-color'	: '#000000'
						});

						_this.find('video').css({
								'position'	: 'fixed',
								'top'		: '0',
								'left'		: '0',
								'width'		: '100%',
								'height'	: '100%',
								'z-index'	: '5000'
							}).addClass('fullscreen');
					}
					else
					{
						exitFullscreen();
					}
				});

				/*
				  On surveille en mode fullscreen :
				  - l'appui sur la touche "Echap" pour la sortie du mode fullscreen.
				  - l'appui sur la touche "Espace" pour gérer le play/pause.
				 */
				$(document).keydown(function(e){
					if(_this.find('video').hasClass('fullscreen'))
					{
						if(e.keyCode == 27)
						{
							exitFullscreen();
						}
						else if(e.keyCode == 32)
						{
							_this.find('.play_pause').trigger('click');
						}
					}
				});

				// Clic pour activer le déplacement du palet:
				_this.find('.fond_jauge,.palet').mousedown(function(event){
					_followMouse = true;

					setPositionByCursor(event);
				});

				// Fin du clic, fin du déplacement:
				$(document).mouseup(function(event){
					_followMouse = false;
				});

				$(document).mousemove(function(event){
					if(_followMouse == true)
					{
						setPositionByCursor(event);
					}
				});

				// Clic sur la barre de son:
				_this.find('.sound').mousedown(function(){
					_followSound = true;
				});

				// Fin du clic sur la barre de son:
				_this.find('.sound').mouseup(function(){
					_followSound = false;
				});

				// Clic sur un batonnet de son:
				_this.find('.batonnet').click(function(){
					setVolume($(this));
				});

				// Déplacement sur la barre de son:
				_this.find('.batonnet').hover(function(){
					if(_followSound == true)
					{
						setVolume($(this));
					}
				});

				// Clic sur le bouton de pause/lecture:
				_this.find('.play_pause').click(function(){
					// Récupération de la vidéo:
					var myVideo = getVideoElement();

					// On on est en train de lire la vidéo:
					if($(this).hasClass('pause'))
					{
						$(this).removeClass('pause').addClass('play');
						
						myVideo.pause();
					}
					else
					{
						$(this).removeClass('play').addClass('pause');

						if((opts.poster != false) && !_this.find('video').hasClass('fullscreen'))
						{
							_this.find('.video-container').css({
								'background' : 'none'
							});

							_this.find('video').show();
						}

						if((opts.autoplay == false) && (opts.hideMenuBar == true) && (_setupHideMenuBar == false))
						{
							setupHidingMenuBar();
						}
						
						myVideo.play();
					}
				});

				_this.find('.mute').click(function(){
					$(this).hide();

					if($(this).hasClass('mute_off'))
					{
						$('.mute_on').show();

						setVolume(0);
					}
					else
					{
						$('.mute_off').show();

						setVolume(0.5);
					}
				});
			}
			else
			{
				setTimeout(displayActualTime, 1000);
			}
			
			setVolume(0.5);
		} // Sinon, utilisation de flash:
		else
		{
			displayFlashVideo();
		}

        return $(this);
    };
})(jQuery);

function seeRes(data)
{
	alert(data);
}
